Skip to content

Commit

Permalink
Use page.evaluateHandle when we want to await on document promises in…
Browse files Browse the repository at this point in the history 
… integration tests

For reference: mozilla#17378 (comment)
  • Loading branch information
@calixteman
calixteman committed Dec 7, 2023
1 parent f54cfe0 commit c63af10
Show file tree
Hide file tree
Showing 4 changed files with 122 additions and 103 deletions.
32 changes: 14 additions & 18 deletions test/integration/freetext_editor_spec.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,9 @@
*/

import {
awaitPromise,
closePages,
createPromise,
dragAndDropAnnotation,
getEditors,
getEditorSelector,
Expand Down Expand Up @@ -3017,27 +3019,21 @@ describe("FreeText Editor", () => {
`${getEditorSelector(0)} .overlay.enabled`
);

let promise = page.evaluate(
() =>
new Promise(resolve => {
document.addEventListener("selectionchange", resolve, {
once: true,
});
})
);
let handle = await createPromise(page, resolve => {
document.addEventListener("selectionchange", resolve, {
once: true,
});
});
await page.click("#pageNumber");
await promise;
await awaitPromise(handle);

promise = page.evaluate(
() =>
new Promise(resolve => {
document
.getElementById("pageNumber")
.addEventListener("keyup", resolve, { once: true });
})
);
handle = await createPromise(page, resolve => {
document
.getElementById("pageNumber")
.addEventListener("keyup", resolve, { once: true });
});
await page.keyboard.press("Backspace");
await promise;
await awaitPromise(handle);

let content = await page.$eval("#pageNumber", el =>
el.innerText.trimEnd()
Expand Down
31 changes: 15 additions & 16 deletions test/integration/ink_editor_spec.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,9 @@
*/

import {
awaitPromise,
closePages,
createPromise,
getEditorSelector,
getSelectedEditors,
kbRedo,
Expand All @@ -26,12 +28,9 @@ import {
} from "./test_utils.mjs";

const waitForPointerUp = page =>
page.evaluate(
() =>
new Promise(resolve => {
window.addEventListener("pointerup", resolve, { once: true });
})
);
createPromise(page, resolve => {
window.addEventListener("pointerup", resolve, { once: true });
});

const selectAll = async page => {
await kbSelectAll(page);
Expand Down Expand Up @@ -78,12 +77,12 @@ describe("Ink Editor", () => {
for (let i = 0; i < 3; i++) {
const x = rect.x + 100 + i * 100;
const y = rect.y + 100 + i * 100;
const promise = waitForPointerUp(page);
const clickHandle = await waitForPointerUp(page);
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y + 50);
await page.mouse.up();
await promise;
await awaitPromise(clickHandle);

await commit(page);
}
Expand Down Expand Up @@ -114,12 +113,12 @@ describe("Ink Editor", () => {

const xStart = rect.x + 300;
const yStart = rect.y + 300;
const clickPromise = waitForPointerUp(page);
const clickHandle = await waitForPointerUp(page);
await page.mouse.move(xStart, yStart);
await page.mouse.down();
await page.mouse.move(xStart + 50, yStart + 50);
await page.mouse.up();
await clickPromise;
await awaitPromise(clickHandle);

await commit(page);

Expand Down Expand Up @@ -177,12 +176,12 @@ describe("Ink Editor", () => {

const x = rect.x + 20;
const y = rect.y + 20;
const clickPromise = waitForPointerUp(page);
const clickHandle = await waitForPointerUp(page);
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y + 50);
await page.mouse.up();
await clickPromise;
await awaitPromise(clickHandle);

await commit(page);

Expand Down Expand Up @@ -222,12 +221,12 @@ describe("Ink Editor", () => {

const x = rect.x + 20;
const y = rect.y + 20;
const clickPromise = waitForPointerUp(page);
const clickHandle = await waitForPointerUp(page);
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y + 50);
await page.mouse.up();
await clickPromise;
await awaitPromise(clickHandle);

await commit(page);

Expand Down Expand Up @@ -284,12 +283,12 @@ describe("Ink Editor", () => {

const x = rect.x + 20;
const y = rect.y + 20;
const clickPromise = waitForPointerUp(page);
const clickHandle = await waitForPointerUp(page);
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y + 50);
await page.mouse.up();
await clickPromise;
await awaitPromise(clickHandle);

page.mouse.click(rect.x - 10, rect.y + 10);
await page.waitForSelector(`${getEditorSelector(0)}.disabled`);
Expand Down
65 changes: 34 additions & 31 deletions test/integration/stamp_editor_spec.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
*/

import {
awaitPromise,
closePages,
getEditorDimensions,
getEditorSelector,
Expand Down Expand Up @@ -81,28 +82,27 @@ const copyImage = async (page, imagePath, number) => {
let hasPasteEvent = false;
while (!hasPasteEvent) {
// We retry to paste if nothing has been pasted before 500ms.
const promise = Promise.race([
page.evaluate(
() =>
const handle = await page.evaluateHandle(() => {
let callback = null;
return [
Promise.race([
new Promise(resolve => {
document.addEventListener(
"paste",
e => resolve(e.clipboardData.items.length !== 0),
{
once: true,
}
);
})
),
page.evaluate(
() =>
callback = e => resolve(e.clipboardData.items.length !== 0);
document.addEventListener("paste", callback, {
once: true,
});
}),
new Promise(resolve => {
setTimeout(() => resolve(false), 500);
})
),
]);
setTimeout(() => {
document.removeEventListener("paste", callback);
resolve(false);
}, 500);
}),
]),
];
});
await kbPaste(page);
hasPasteEvent = await promise;
hasPasteEvent = await awaitPromise(handle);
}

await waitForImage(page, getEditorSelector(number));
Expand Down Expand Up @@ -227,11 +227,11 @@ describe("Stamp Editor", () => {
`${getEditorSelector(i)} .resizers.hidden`
);

const promise = waitForAnnotationEditorLayer(page);
const handle = await waitForAnnotationEditorLayer(page);
await page.evaluate(() => {
window.PDFViewerApplication.rotatePages(90);
});
await promise;
await awaitPromise(handle);

await page.focus(".stampEditor");
await waitForSelectedEditor(page, getEditorSelector(i));
Expand All @@ -257,11 +257,11 @@ describe("Stamp Editor", () => {
.toEqual("nwse-resize");
}

const promise = waitForAnnotationEditorLayer(page);
const handle = await waitForAnnotationEditorLayer(page);
await page.evaluate(() => {
window.PDFViewerApplication.rotatePages(90);
});
await promise;
await awaitPromise(handle);
}
})
);
Expand Down Expand Up @@ -410,16 +410,19 @@ describe("Stamp Editor", () => {

// We check that the alt-text button works correctly with the
// keyboard.
await page.evaluate(sel => {
const handle = await page.evaluateHandle(sel => {
document.getElementById("viewerContainer").focus();
return new Promise(resolve => {
setTimeout(() => {
const el = document.querySelector(sel);
el.addEventListener("focus", resolve, { once: true });
el.focus({ focusVisible: true });
}, 0);
});
return [
new Promise(resolve => {
setTimeout(() => {
const el = document.querySelector(sel);
el.addEventListener("focus", resolve, { once: true });
el.focus({ focusVisible: true });
}, 0);
}),
];
}, buttonSelector);
await awaitPromise(handle);
await (browserName === "chrome"
? page.waitForSelector(`${buttonSelector}:focus`)
: page.waitForSelector(`${buttonSelector}:focus-visible`));
Expand Down
97 changes: 59 additions & 38 deletions test/integration/test_utils.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,18 @@ function loadAndWait(filename, selector, zoom, pageSetup) {
);
}

function createPromise(page, callback) {
return page.evaluateHandle(
// eslint-disable-next-line no-eval
cb => [new Promise(eval(`(${cb})`))],
callback.toString()
);
}

function awaitPromise(promise) {
return promise.evaluate(([p]) => p);
}

function closePages(pages) {
return Promise.all(
pages.map(async ([_, page]) => {
Expand Down Expand Up @@ -100,23 +112,29 @@ function getSelectedEditors(page) {
}

async function waitForEvent(page, eventName, timeout = 5000) {
const hasTimedout = await Promise.race([
// add event listener and wait for event to fire before returning
page.evaluate(
name =>
new Promise(resolve => {
document.addEventListener(name, () => resolve(false), { once: true });
}),
eventName
),
page.evaluate(
timeOut =>
new Promise(resolve => {
setTimeout(() => resolve(true), timeOut);
}),
timeout
),
]);
const handle = await page.evaluateHandle(
(name, timeOut) => {
let callback = null;
return [
Promise.race([
new Promise(resolve => {
// add event listener and wait for event to fire before returning
callback = () => resolve(false);
document.addEventListener(name, callback, { once: true });
}),
new Promise(resolve => {
setTimeout(() => {
document.removeEventListener(name, callback);
resolve(true);
}, timeOut);
}),
]),
];
},
eventName,
timeout
);
const hasTimedout = await awaitPromise(handle);
if (hasTimedout === true) {
console.log(`waitForEvent: timeout waiting for ${eventName}`);
}
Expand Down Expand Up @@ -254,35 +272,36 @@ async function dragAndDropAnnotation(page, startX, startY, tX, tY) {
await page.waitForSelector("#viewer:not(.noUserSelect)");
}

async function waitForAnnotationEditorLayer(page) {
return page.evaluate(() => {
return new Promise(resolve => {
window.PDFViewerApplication.eventBus.on(
"annotationeditorlayerrendered",
resolve
);
});
function waitForAnnotationEditorLayer(page) {
return createPromise(page, resolve => {
window.PDFViewerApplication.eventBus.on(
"annotationeditorlayerrendered",
resolve
);
});
}

async function waitForTextLayer(page) {
return page.evaluate(() => {
return new Promise(resolve => {
window.PDFViewerApplication.eventBus.on("textlayerrendered", resolve);
});
const handle = await createPromise(page, resolve => {
window.PDFViewerApplication.eventBus.on("textlayerrendered", resolve);
});
return awaitPromise(handle);
}

async function scrollIntoView(page, selector) {
await page.evaluate(sel => {
const element = document.querySelector(sel);
element.scrollIntoView({ behavior: "instant", block: "start" });
return new Promise(resolve => {
document
.getElementById("viewerContainer")
.addEventListener("scrollend", resolve, { once: true });
});
}, selector);
const handle = await page.evaluateHandle(
sel => [
new Promise(resolve => {
document
.getElementById("viewerContainer")
.addEventListener("scrollend", resolve, { once: true });
const element = document.querySelector(sel);
element.scrollIntoView({ behavior: "instant", block: "start" });
}),
],
selector
);
return awaitPromise(handle);
}

async function hover(page, selector) {
Expand Down Expand Up @@ -417,8 +436,10 @@ async function kbDeleteLastWord(page) {
}

export {
awaitPromise,
clearInput,
closePages,
createPromise,
dragAndDropAnnotation,
getAnnotationStorage,
getComputedStyleSelector,
Expand Down

0 comments on commit c63af10

Please sign in to comment.