Autify Playwright snippets

Prev Next

Sometimes, when automating tests in Autify Nexus, you may encounter issues that cannot be easily solved through standard no-code steps.

Examples include:

  • A canvas-based UI that requires a click at a specific set of coordinates

  • Unstable elements that require retries

  • Navigation that doesn’t automatically trigger a wait

  • Ads or pop-ups blocking important elements

  • The need to customize the viewport size for layout-dependent applications

  • Needing to ensure the page is fully ready before proceeding

Using Playwright code snippets can provide reliable solutions to these problems.

How to use these snippets

Add a Playwright code step to your test, and then copy/paste the snippet code into the step.

Don’t forget to replace any locators in the snippets with the actual locator or selector of the target element on your page. You can use JavaScript selectors, CSS selectors, or even Playwright locators if you are comfortable modifying the code on this page.

Browser back / forward navigation

Add a Playwright code step at the point in the scenario where the navigation should happen.

To go back:

await page.goBack()

To go forward:

await page.goForward()

Change viewport size

Adjusts the page size to a specific width and height to match expected rendering.

await page.setViewportSize({ width: 999, height: 999 });

Force-click an element

Force a click on an element even if it's not in an "ideal" clickable state (e.g., hidden behind another element).

await page.click('#my-button', { force: true });

Remove blocking elements (e.g., ads)

Remove ads or floating banners that could interfere with test actions.

await page.evaluate(() => {
	const ad = document.querySelector('.ads-banner');
	if (ad) ad.remove();
});

Retry click with try-catch for unstable buttons

Some buttons might not be stable on the first try. This retries the action once if it fails.

try {
	await page.click('#unstable-button');
} catch (e) {
	console.warn('Retrying button click...');
	await page.click('#unstable-button');
}

Test and reload until the page or element is ready

If the page sometimes loads in an unstable state, reload and check for readiness.

for (let i = 0; i < 5; i++) {
	await page.reload();
	if (await page.isVisible('#ready')) break;
    console.log("Element/page is not ready!");
}

Wait for navigation after clicking a link

If clicking a link causes navigation, explicitly wait to ensure the page finishes loading before continuing.

await Promise.all([
	page.waitForNavigation(),
	page.click('a.next-page'),
]);