Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Question] Does page.click automatically page.waitForNavigation? #2078

Closed
aesyondu opened this issue May 1, 2020 · 2 comments
Closed

[Question] Does page.click automatically page.waitForNavigation? #2078

aesyondu opened this issue May 1, 2020 · 2 comments

Comments

@aesyondu
Copy link
Contributor

aesyondu commented May 1, 2020

In the release notes of 0.14.0, under Breaking API Changes, there is a phrase that says:

Actions that automatically wait for the navigation like page.click(selector[, options]) ...etc.

I need help understanding what that means. In the current documentation for page.waitForNavigation, the page.waitForNavigation and page.click promise combo is shown as an example for properly handling indirect navigation:

const [response] = await Promise.all([
  page.waitForNavigation(), // The promise resolves after navigation has finished
  page.click('a.my-link'), // Clicking the link will indirectly cause a navigation
]);
  1. What is a direct navigation? What is an indirect navigation?
    From the example above, I can infer that clicking an <a href="/"> link is an indirect navigation.
  2. Is submitting an html form direct or indirect navigation?
    Navigation via javascript/xhr/ajax is most likely an indirect navigation
  3. Is it safe to assume that page.click only waits for direct navigation?
  4. What types of navigation does page.click wait for automatically, as mentioned in the release notes?

EDIT: Also from the page.click documentation:

noWaitAfter - Actions that initiate navigations are waiting for these navigations to happen and for pages to start loading. You can opt out of waiting via setting this flag. You would only need this option in the exceptional cases such as navigating to inaccessible pages. Defaults to false.

  1. If clicking an <a href> link is an indirect navigation, meaning the noWaitAfter doesn't apply, meaning page.waitForNavigation is needed, which navigations does the docs pertain to?

The reason I ask is, in the previous playwright version, 0.13.0, my tests which included the following lines, worked fine:

// log in by submitting an html form
await page.click('input[value="Log in"]');
await saveScreenshot(page, fileName);

However, in the current version (0.16.0), it is now raising an error:

Cannot take a screenshot while page is navigating
@dgozman
Copy link
Contributor

dgozman commented May 2, 2020

  • page.click() on a regular link waits for the navigation to be confirmed. This is a navigation synchronously triggered by the click.
  • page.click() on a button that navigates in a setTimeout or after making an xhr/fetch does not wait for the navigation. This is a navigation asynchronously triggered by the click.
  • The breaking change in 0.14 was that page.click() will not additionally wait for the domcontentloaded or load state, only for the navigation to be confirmed. This means the new page might not be fully loaded yet.

For the snippet that clicks and then takes a screenshot, it is usually a good idea to wait at least for the load before taking a screenshot, because you want all images, styles, etc. to load.

await page.click('input[value="Log in"]');
await page.waitForLoadState('load');
await saveScreenshot(page, fileName);

@aesyondu
Copy link
Contributor Author

aesyondu commented May 2, 2020

I see, I was conflating the framenavigated event with the load/documentloaded event. Thanks so much for the clarification!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants