[Feature] Custom methods on `Page`

Hey team. Got a feature suggestion here. I know Playwright is a general-purpose browser automation tool and not specifically an end-to-end testing tool, but I wonder if any thought has been given to a way to add custom methods to the Page class. This can be very useful in providing creating methods like this one (pseudocode).

async function waitForVisible(selector) {
  return this.waitForSelector(selector, { waitFor: 'visible' });
}

await page.waitForVisible('.e2e-button');

This can be accomplished in the current version of Playwright, but the usage isn’t as seamless since you need to pass page as an argument, unlike with built-in methods.

await waitForVisible(page, '.e2e-button');

Similar to https://github.com/microsoft/playwright/issues/1654, I’ve been able to get this to work by monkey-patching my page instance, but I wonder if there could be a cleaner way to do this.

Thanks for taking a look!

[JoelEinbinder]

Closing this request becuase we aren’t planning to do anything to make page extensible. Any generic testing methods that you feel compelled to add to the page, please file them as feature requests. We probably want to add them for everyone!

For app specific methods, like page.getMySpecialTree, you are better off building a Page Object Model. Something like new MySpecialTree(page). playwright-test is interested in solving any ergonomic problems with creating and passing around POMs.

Feel free to continue the discussion here even though this is closed. Or file a new issue in playwright-test.

[celeryclub]

No worries! I’m fine with that. I can always open another issue later if I need to. 😃

I really like the idea of a method that lazily returns an ElementHandle. Seems very intuitive.

Here are the helpers I have currently in my codebase: clickAndGetPopup(selector) (uses waitForEvent('popup') to return new Page instance) clickAndUploadFile(selector, file) getAttribute(selector, attribute) getTextContent(selector) gotoRoute(route) (combines a base url specified elsewhere with a route that’s passed in) waitForVisible(selector) waitForHidden(selector) scrollAndWaitForMoreOf(selector, scrollX, scrollY) (used to test infinite scrolling behavior - checks that the element count increases)

I may think of more later, but that’s all I’ve got so far.

I’d also be interested in seeing qawolf’s scroll helper make it into core, as I’ve found it quite useful. It makes scrolling a lot more intuitive too since it waits for the element/page to be scrollable before continuing or failing. https://github.com/qawolf/qawolf/blob/master/src/utils/page/scroll.ts