Skip to content

Commit

Permalink
Implement a helper function for selecting an editor in the integratio…
Browse files Browse the repository at this point in the history
…n tests

This has multiple advantages:

- it improves consistency between the various editor integration tests;
- it makes the code easier to read/understand;
- it reduces code duplication;
- it reduces the number of `getEditorSelector` calls that contained
  hardcoded IDs, which helps to isolate the tests and to simplify
  follow-up patches.
  • Loading branch information
timvandermeij committed Jan 19, 2025
1 parent 5026af1 commit 663e416
Show file tree
Hide file tree
Showing 4 changed files with 38 additions and 151 deletions.
147 changes: 19 additions & 128 deletions test/integration/freetext_editor_spec.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ import {
paste,
pasteFromClipboard,
scrollIntoView,
selectEditor,
switchToEditor,
waitForAnnotationEditorLayer,
waitForAnnotationModeChanged,
Expand Down Expand Up @@ -171,15 +172,7 @@ describe("FreeText Editor", () => {
it("must copy/paste", async () => {
// Run sequentially to avoid clipboard issues.
for (const [browserName, page] of pages) {
const editorRect = await getRect(page, getEditorSelector(0));

// Select the editor created previously.
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);

await waitForSelectedEditor(page, getEditorSelector(0));
await selectEditor(page, getEditorSelector(0));
await copy(page);
await paste(page);
await page.waitForSelector(getEditorSelector(1), {
Expand Down Expand Up @@ -243,14 +236,7 @@ describe("FreeText Editor", () => {
await page.type(`${getEditorSelector(3)} .internal`, data);
await commit(page);

// And select it again.
const editorRect = await getRect(page, getEditorSelector(3));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);

await waitForSelectedEditor(page, getEditorSelector(3));
await selectEditor(page, getEditorSelector(3));
await copy(page);
await paste(page);
await page.waitForSelector(getEditorSelector(4), {
Expand Down Expand Up @@ -350,14 +336,7 @@ describe("FreeText Editor", () => {
() => !document.querySelector(".selectedEditor")
);

const editorRect = await getRect(page, getEditorSelector(8));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);

await waitForSelectedEditor(page, getEditorSelector(8));

await selectEditor(page, getEditorSelector(8));
expect(await getEditors(page, "selected"))
.withContext(`In ${browserName}`)
.toEqual([8]);
Expand Down Expand Up @@ -397,16 +376,7 @@ describe("FreeText Editor", () => {
await commit(page);

if (i < 4) {
// And select it again.
const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(
`${editorSelector} .overlay:not(.enabled)`
);
await selectEditor(page, editorSelector, /* count = */ 2);
}
}

Expand Down Expand Up @@ -467,13 +437,7 @@ describe("FreeText Editor", () => {
expect(text).withContext(`In ${browserName}`).toEqual("A");

// Add a new A.
const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(`${editorSelector} .overlay:not(.enabled)`);
await selectEditor(page, editorSelector, /* count = */ 2);
await page.type(`${editorSelector} .internal`, "A");
await commit(page);

Expand Down Expand Up @@ -904,12 +868,9 @@ describe("FreeText Editor", () => {
const serialized = await getSerialized(page);
expect(serialized).withContext(`In ${browserName}`).toEqual([]);

const editorSelector = getEditorSelector(0);
const editorRect = await getRect(page, editorSelector);

// Select the annotation we want to move.
await page.mouse.click(editorRect.x + 2, editorRect.y + 2);
await waitForSelectedEditor(page, editorSelector);
const editorSelector = getEditorSelector(0);
await selectEditor(page, editorSelector);

await dragAndDrop(page, editorSelector, [[100, 100]]);
await waitForSerialized(page, 1);
Expand Down Expand Up @@ -942,15 +903,7 @@ describe("FreeText Editor", () => {
expect(editorIds.length).withContext(`In ${browserName}`).toEqual(6);

const editorRect = await getRect(page, getEditorSelector(0));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(
`${getEditorSelector(0)} .overlay:not(.enabled)`
);

await selectEditor(page, getEditorSelector(0), /* count = */ 2);
await kbGoToEnd(page);
await page.waitForFunction(
sel =>
Expand Down Expand Up @@ -1048,16 +1001,7 @@ describe("FreeText Editor", () => {
});

const editorSelector = getEditorSelector(1);
const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(
`${editorSelector} .overlay:not(.enabled)`
);

await selectEditor(page, editorSelector, /* count = */ 2);
await kbGoToEnd(page);
await page.waitForFunction(
sel =>
Expand Down Expand Up @@ -1134,12 +1078,7 @@ describe("FreeText Editor", () => {
let editorIds = await getEditors(page, "freeText");
expect(editorIds.length).withContext(`In ${browserName}`).toEqual(6);

const editorRect = await getRect(page, getEditorSelector(3));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await waitForSelectedEditor(page, getEditorSelector(3));
await selectEditor(page, getEditorSelector(3));
await page.keyboard.press("Backspace");
await page.waitForFunction(
sel => !document.querySelector(sel),
Expand Down Expand Up @@ -1199,13 +1138,7 @@ describe("FreeText Editor", () => {
const editorIds = await getEditors(page, "freeText");
expect(editorIds.length).withContext(`In ${browserName}`).toEqual(6);

const editorRect = await getRect(page, getEditorSelector(1));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await waitForSelectedEditor(page, getEditorSelector(1));

await selectEditor(page, getEditorSelector(1));
await copy(page);
await paste(page);
await page.waitForSelector(getEditorSelector(6), {
Expand Down Expand Up @@ -2106,12 +2039,7 @@ describe("FreeText Editor", () => {
await commit(page);

// Select the second editor.
rect = await getRect(page, getEditorSelector(1));
await page.mouse.click(
rect.x + 0.5 * rect.width,
rect.y + 0.5 * rect.height
);
await waitForSelectedEditor(page, getEditorSelector(1));
await selectEditor(page, getEditorSelector(1));

const pos = n =>
page.evaluate(sel => {
Expand Down Expand Up @@ -2300,13 +2228,8 @@ describe("FreeText Editor", () => {
await page.keyboard.press("Escape");
await waitForUnselectedEditor(page, editorSelector);

const editorRect = await getRect(page, editorSelector);

// Select the editor created previously.
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await selectEditor(page, editorSelector);

// Go to the last page.
await scrollIntoView(page, `.page[data-page-number = "14"]`);
Expand Down Expand Up @@ -2339,15 +2262,7 @@ describe("FreeText Editor", () => {
await page.waitForSelector(getEditorSelector(0), {
visible: true,
});

rect = await getRect(page, getEditorSelector(0));
await page.mouse.click(
rect.x + rect.width / 2,
rect.y + rect.height / 2
);

await waitForSelectedEditor(page, getEditorSelector(0));

await selectEditor(page, getEditorSelector(0));
const content = await page.$eval(getEditorSelector(0), el =>
el.innerText.trimEnd()
);
Expand Down Expand Up @@ -2388,13 +2303,8 @@ describe("FreeText Editor", () => {
await page.keyboard.press("Escape");
await waitForUnselectedEditor(page, editorSelector);

const editorRect = await getRect(page, editorSelector);

// Select the editor created previously.
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await selectEditor(page, editorSelector);

// Go to the last page.
await scrollIntoView(page, `.page[data-page-number = "14"]`);
Expand Down Expand Up @@ -2769,12 +2679,7 @@ describe("FreeText Editor", () => {
}

// Select the editor created previously.
const editorRect = await getRect(page, getEditorSelector(0));
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await waitForSelectedEditor(page, getEditorSelector(0));
await selectEditor(page, getEditorSelector(0));

await selectAll(page);

Expand Down Expand Up @@ -3137,13 +3042,7 @@ describe("FreeText Editor", () => {
const getText = edSelector =>
page.$eval(`${edSelector} .internal`, el => el.innerText.trimEnd());

const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(`${editorSelector} .overlay:not(.enabled)`);
await selectEditor(page, editorSelector, /* count = */ 2);

const select = position =>
page.evaluate(
Expand Down Expand Up @@ -3254,15 +3153,7 @@ describe("FreeText Editor", () => {

const editorSelector = getEditorSelector(0);
const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count: 2 }
);
await page.waitForSelector(
`${editorSelector} .overlay:not(.enabled)`
);

await selectEditor(page, editorSelector, /* count = */ 2);
await kbGoToEnd(page);
await page.waitForFunction(
sel =>
Expand Down
21 changes: 5 additions & 16 deletions test/integration/ink_editor_spec.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import {
kbUndo,
loadAndWait,
scrollIntoView,
selectEditor,
switchToEditor,
waitForAnnotationModeChanged,
waitForNoElement,
Expand Down Expand Up @@ -718,12 +719,7 @@ describe("Ink Editor", () => {
expect(editorIds.length).withContext(`In ${browserName}`).toEqual(15);

const pdfjsA = getEditorSelector(0);
const editorRect = await getRect(page, pdfjsA);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await waitForSelectedEditor(page, pdfjsA);
await selectEditor(page, pdfjsA);

const red = "#ff0000";
page.evaluate(value => {
Expand All @@ -749,6 +745,7 @@ describe("Ink Editor", () => {
editorIds = await getEditors(page, "ink");
expect(editorIds.length).withContext(`In ${browserName}`).toEqual(1);

const editorRect = await getRect(page, pdfjsA);
isWhite = await isCanvasWhite(page, 1, editorRect);
expect(isWhite).withContext(`In ${browserName}`).toBeTrue();

Expand Down Expand Up @@ -815,11 +812,8 @@ describe("Ink Editor", () => {
const serialized = await getSerialized(page);
expect(serialized).withContext(`In ${browserName}`).toEqual([]);

const editorRect = await getRect(page, edgeB);

// Select the annotation we want to move.
await page.mouse.click(editorRect.x + 2, editorRect.y + 2);
await waitForSelectedEditor(page, edgeB);
await selectEditor(page, edgeB);

await dragAndDrop(page, edgeB, [[100, 100]]);
await waitForSerialized(page, 1);
Expand Down Expand Up @@ -1067,12 +1061,7 @@ describe("Ink Editor", () => {
await page.waitForSelector("#editorUndoBar", { hidden: true });

editorSelector = getEditorSelector(0);
const editorRect = await getRect(page, editorSelector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2
);
await waitForSelectedEditor(page, editorSelector);
await selectEditor(page, editorSelector);

await dragAndDrop(page, editorSelector, [[30, 30]], /* steps = */ 10);
const finalRect = await getRect(page, `${pageOneSelector} svg`);
Expand Down
10 changes: 3 additions & 7 deletions test/integration/stamp_editor_spec.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ import {
paste,
pasteFromClipboard,
scrollIntoView,
selectEditor,
serializeBitmapDimensions,
switchToEditor,
waitForAnnotationEditorLayer,
Expand Down Expand Up @@ -524,9 +525,7 @@ describe("Stamp Editor", () => {
await copyImage(page, "../images/firefox_logo.png", 0);

const editorSelector = getEditorSelector(0);

await page.click(editorSelector);
await waitForSelectedEditor(page, editorSelector);
await selectEditor(page, editorSelector);

await page.waitForSelector(
`${editorSelector} .resizer.topLeft[tabindex="-1"]`
Expand Down Expand Up @@ -1494,11 +1493,8 @@ describe("Stamp Editor", () => {
const serialized = await getSerialized(page);
expect(serialized).withContext(`In ${browserName}`).toEqual([]);

const editorRect = await getRect(page, editorSelector);

// Select the annotation we want to move.
await page.mouse.click(editorRect.x + 2, editorRect.y + 2);
await waitForSelectedEditor(page, editorSelector);
await selectEditor(page, editorSelector);

await dragAndDrop(page, editorSelector, [[100, 100]]);
await waitForSerialized(page, 1);
Expand Down
11 changes: 11 additions & 0 deletions test/integration/test_utils.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -347,6 +347,16 @@ async function applyFunctionToEditor(page, editorId, func) {
);
}

async function selectEditor(page, selector, count = 1) {
const editorRect = await getRect(page, selector);
await page.mouse.click(
editorRect.x + editorRect.width / 2,
editorRect.y + editorRect.height / 2,
{ count }
);
await waitForSelectedEditor(page, selector);
}

async function waitForSelectedEditor(page, selector) {
return page.waitForSelector(`${selector}.selectedEditor`);
}
Expand Down Expand Up @@ -868,6 +878,7 @@ export {
paste,
pasteFromClipboard,
scrollIntoView,
selectEditor,
serializeBitmapDimensions,
setCaretAt,
switchToEditor,
Expand Down

0 comments on commit 663e416

Please sign in to comment.