Skip to content

Commit

Permalink
fix: ensure the right order of waitForSelector and scrollIntoView (#303)
Browse files Browse the repository at this point in the history
  • Loading branch information
@OrKoN
OrKoN committed Sep 19, 2022
1 parent e239650 commit dd35372
Show file tree
Hide file tree
Showing 7 changed files with 124 additions and 37 deletions.
6 changes: 3 additions & 3 deletions __snapshots__/LighthouseStringifyExtension.test.ts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
await lhFlow.startTimespan();
{
const targetPage = page;
await scrollIntoViewIfNeeded([["#button"]], targetPage, timeout);
const element = await waitForSelectors([["#button"]], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 61,
Expand Down Expand Up @@ -74,8 +74,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
await lhFlow.startTimespan();
{
const targetPage = page;
await scrollIntoViewIfNeeded([["#button"]], targetPage, timeout);
const element = await waitForSelectors([["#button"]], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 61,
Expand Down Expand Up @@ -133,8 +133,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
const targetPage = page;
const promises = [];
promises.push(targetPage.waitForNavigation());
await scrollIntoViewIfNeeded([["#link"]], targetPage, timeout);
const element = await waitForSelectors([["#link"]], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 61,
Expand Down
10 changes: 5 additions & 5 deletions __snapshots__/PuppeteerStringifyExtension.test.ts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ exports[
] = `
{
const targetPage = page;
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -22,8 +22,8 @@ exports[
const targetPage = page;
const promises = [];
promises.push(targetPage.waitForNavigation());
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -40,8 +40,8 @@ exports[
] = `
{
const targetPage = page;
await scrollIntoViewIfNeeded([["aria/Test","aria/Test2"]], targetPage, timeout);
const element = await waitForSelectors([["aria/Test","aria/Test2"]], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -57,8 +57,8 @@ exports[
] = `
{
const targetPage = page;
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
const type = await element.evaluate(el => el.type);
if (["select-one"].includes(type)) {
await element.select("Hello World");
Expand All @@ -81,8 +81,8 @@ exports[
] = `
{
const targetPage = page;
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
const type = await element.evaluate(el => el.type);
if (["select-one"].includes(type)) {
await element.select("#333333");
Expand Down
18 changes: 12 additions & 6 deletions __snapshots__/lighthouse-e2e.test.ts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
await lhFlow.startTimespan();
{
const targetPage = page;
await scrollIntoViewIfNeeded(["#test"], targetPage, timeout);
const element = await waitForSelectors(["#test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
button: 'left',
offset: {
Expand All @@ -39,8 +39,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
}
{
const targetPage = page;
await scrollIntoViewIfNeeded(["#test"], targetPage, timeout);
const element = await waitForSelectors(["#test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
button: 'middle',
offset: {
Expand All @@ -55,8 +55,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
const targetPage = page;
const promises = [];
promises.push(targetPage.waitForNavigation());
await scrollIntoViewIfNeeded(["a[href=\\"main2.html\\"]"], targetPage, timeout);
const element = await waitForSelectors(["a[href=\\"main2.html\\"]"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -69,8 +69,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
await lhFlow.startTimespan();
{
const targetPage = page;
await scrollIntoViewIfNeeded(["#test"], targetPage, timeout);
const element = await waitForSelectors(["#test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
button: 'left',
offset: {
Expand All @@ -81,8 +81,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
}
{
const targetPage = page;
await scrollIntoViewIfNeeded(["#test"], targetPage, timeout);
const element = await waitForSelectors(["#test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
button: 'left',
offset: {
Expand All @@ -108,7 +108,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down
88 changes: 74 additions & 14 deletions __snapshots__/stringify.test.ts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -198,7 +204,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -352,8 +364,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
const target = await browser.waitForTarget(t => t.url() === "https://localhost/test", { timeout });
const targetPage = await target.page();
targetPage.setDefaultTimeout(timeout);
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -375,7 +387,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -528,8 +546,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
const target = await browser.waitForTarget(t => t.url() === "https://localhost/test", { timeout });
const targetPage = await target.page();
targetPage.setDefaultTimeout(timeout);
await scrollIntoViewIfNeeded(["aria/Test"], targetPage, timeout);
const element = await waitForSelectors(["aria/Test"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -551,7 +569,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -706,8 +730,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
let frame = targetPage.mainFrame();
frame = frame.childFrames()[1];
frame = frame.childFrames()[1];
await scrollIntoViewIfNeeded(["aria/Test"], frame, timeout);
const element = await waitForSelectors(["aria/Test"], frame, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.click({
offset: {
x: 1,
Expand All @@ -729,7 +753,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -895,7 +925,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -1061,7 +1097,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -1211,8 +1253,8 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
{
const targetPage = page;
await scrollIntoViewIfNeeded(["body > div:nth-child(1)"], targetPage, timeout);
const element = await waitForSelectors(["body > div:nth-child(1)"], targetPage, { timeout, visible: true });
await scrollIntoViewIfNeeded(element, timeout);
await element.evaluate((el, x, y) => { el.scrollTop = y; el.scrollLeft = x; }, 0, 40);
}
{
Expand All @@ -1233,7 +1275,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -1401,7 +1449,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down Expand Up @@ -1569,7 +1623,13 @@ const puppeteer = require('puppeteer'); // v13.0.0 or later
throw new Error('Could not find element for selectors: ' + JSON.stringify(selectors));
}
async function scrollIntoViewIfNeeded(element, timeout) {
async function scrollIntoViewIfNeeded(selectors, frame, timeout) {
const element = await waitForSelectors(selectors, frame, { visible: false, timeout });
if (!element) {
throw new Error(
'The element could not be found.'
);
}
await waitForConnected(element, timeout);
const isInViewport = await element.isIntersectingViewport({threshold: 0});
if (isInViewport) {
Expand Down

0 comments on commit dd35372

Please sign in to comment.