Refactor the copy/paste logic in the integration tests

The integration tests are currently not consistent in how they do
copy/pasting: some tests use the `kbCopy`/`kbPaste` functions with
waiting for the event inline, some have their own helper function to
combine those actions and some even call `kbCopy`/`kbPaste` without
waiting for the event at all (which can cause intermittent failures).

This commit fixes the issues by providing a set of four helper functions
that all tests use and that abstract e.g. waiting for the event away
from the caller. This makes the invididual tests simpler and consistent,
reduces code duplication and fixes possible intermittent failures
due to not waiting for events to trigger.

test/integration/copy_paste_spec.mjs

@@ -15,7 +15,7 @@
 
 import {
   closePages,
-  kbCopy,
+  copy,
   kbSelectAll,
   loadAndWait,
   mockClipboard,
@@ -55,10 +55,7 @@ describe("Copy and paste", () => {
           );
           await selectAll(page);
 
-          const promise = waitForEvent(page, "copy");
+          await copy(page);
-          await kbCopy(page);
-          await promise;
-
           await page.waitForFunction(
             `document.querySelector('#viewerContainer').style.cursor !== "wait"`
           );
@@ -159,10 +156,7 @@ describe("Copy and paste", () => {
           );
           await selectAll(page);
 
-          const promise = waitForEvent(page, "copy");
+          await copy(page);
-          await kbCopy(page);
-          await promise;
-
           await page.waitForFunction(
             `document.querySelector('#viewerContainer').style.cursor !== "wait"`
           );

test/integration/freetext_editor_spec.mjs

@@ -16,6 +16,8 @@
 import {
   awaitPromise,
   closePages,
+  copy,
+  copyToClipboard,
   createPromise,
   dragAndDropAnnotation,
   firstPageOnTop,
@@ -30,21 +32,19 @@ import {
   kbBigMoveLeft,
   kbBigMoveRight,
   kbBigMoveUp,
-  kbCopy,
   kbGoToBegin,
   kbGoToEnd,
   kbModifierDown,
   kbModifierUp,
-  kbPaste,
   kbRedo,
   kbSelectAll,
   kbUndo,
   loadAndWait,
+  paste,
   pasteFromClipboard,
   scrollIntoView,
   switchToEditor,
   waitForAnnotationEditorLayer,
-  waitForEvent,
   waitForSelectedEditor,
   waitForSerialized,
   waitForStorageEntries,
@@ -53,16 +53,6 @@ import {
 } from "./test_utils.mjs";
 import { PNG } from "pngjs";
 
-const copyPaste = async page => {
-  let promise = waitForEvent(page, "copy");
-  await kbCopy(page);
-  await promise;
-
-  promise = waitForEvent(page, "paste");
-  await kbPaste(page);
-  await promise;
-};
-
 const selectAll = async page => {
   await kbSelectAll(page);
   await page.waitForFunction(
@@ -187,7 +177,8 @@ describe("FreeText Editor", () => {
         );
 
         await waitForSelectedEditor(page, getEditorSelector(0));
-        await copyPaste(page);
+        await copy(page);
+        await paste(page);
         await page.waitForSelector(getEditorSelector(1), {
           visible: true,
         });
@@ -203,7 +194,8 @@ describe("FreeText Editor", () => {
 
         expect(pastedContent).withContext(`In ${browserName}`).toEqual(content);
 
-        await copyPaste(page);
+        await copy(page);
+        await paste(page);
         await page.waitForSelector(getEditorSelector(2), {
           visible: true,
         });
@@ -263,7 +255,8 @@ describe("FreeText Editor", () => {
         );
 
         await waitForSelectedEditor(page, getEditorSelector(3));
-        await copyPaste(page);
+        await copy(page);
+        await paste(page);
         await page.waitForSelector(getEditorSelector(4), {
           visible: true,
         });
@@ -276,9 +269,7 @@ describe("FreeText Editor", () => {
         );
 
         for (let i = 0; i < 2; i++) {
-          const promise = waitForEvent(page, "paste");
+          await paste(page);
-          await kbPaste(page);
-          await promise;
           await page.waitForSelector(getEditorSelector(5 + i));
         }
 
@@ -597,7 +588,8 @@ describe("FreeText Editor", () => {
           .withContext(`In ${browserName}`)
           .toEqual([0, 1, 3]);
 
-        await copyPaste(page);
+        await copy(page);
+        await paste(page);
         await page.waitForSelector(getEditorSelector(6), {
           visible: true,
         });
@@ -1275,7 +1267,8 @@ describe("FreeText Editor", () => {
         );
         await waitForSelectedEditor(page, getEditorSelector(1));
 
-        await copyPaste(page);
+        await copy(page);
+        await paste(page);
         await page.waitForSelector(getEditorSelector(6), {
           visible: true,
         });
@@ -3425,14 +3418,11 @@ describe("FreeText Editor", () => {
             );
 
           await select(0);
-          await pasteFromClipboard(
+          await copyToClipboard(page, {
-            page,
-            {
             "text/html": "<b>Bold Foo</b>",
             "text/plain": "Foo",
-            },
+          });
-            `${editorSelector} .internal`
+          await pasteFromClipboard(page, `${editorSelector} .internal`);
-          );
 
           let lastText = data;
 
@@ -3442,14 +3432,11 @@ describe("FreeText Editor", () => {
           expect(text).withContext(`In ${browserName}`).toEqual(lastText);
 
           await select(3);
-          await pasteFromClipboard(
+          await copyToClipboard(page, {
-            page,
-            {
             "text/html": "<b>Bold Bar</b><br><b>Oof</b>",
             "text/plain": "Bar\nOof",
-            },
+          });
-            `${editorSelector} .internal`
+          await pasteFromClipboard(page, `${editorSelector} .internal`);
-          );
 
           await waitForTextChange(lastText, editorSelector);
           text = await getText(editorSelector);
@@ -3457,13 +3444,8 @@ describe("FreeText Editor", () => {
           expect(text).withContext(`In ${browserName}`).toEqual(lastText);
 
           await select(0);
-          await pasteFromClipboard(
+          await copyToClipboard(page, { "text/html": "<b>basic html</b>" });
-            page,
+          await pasteFromClipboard(page, `${editorSelector} .internal`);
-            {
-              "text/html": "<b>basic html</b>",
-            },
-            `${editorSelector} .internal`
-          );
 
           // Nothing should change, so it's hard to wait on something.
           // eslint-disable-next-line no-restricted-syntax
@@ -3477,15 +3459,12 @@ describe("FreeText Editor", () => {
           const prevHTML = await getHTML();
 
           // Try to paste an image.
-          await pasteFromClipboard(
+          await copyToClipboard(page, {
-            page,
-            {
             "image/png":
               // 1x1 transparent png.
               "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==",
-            },
+          });
-            `${editorSelector} .internal`
+          await pasteFromClipboard(page, `${editorSelector} .internal`);
-          );
 
           // Nothing should change, so it's hard to wait on something.
           // eslint-disable-next-line no-restricted-syntax
@@ -3505,14 +3484,11 @@ describe("FreeText Editor", () => {
           });
 
           const fooBar = "Foo\nBar\nOof";
-          await pasteFromClipboard(
+          await copyToClipboard(page, {
-            page,
-            {
             "text/html": "<b>html</b>",
             "text/plain": fooBar,
-            },
+          });
-            `${editorSelector} .internal`
+          await pasteFromClipboard(page, `${editorSelector} .internal`);
-          );
 
           await waitForTextChange("", editorSelector);
           text = await getText(editorSelector);

test/integration/stamp_editor_spec.mjs

@@ -17,6 +17,8 @@ import {
   applyFunctionToEditor,
   awaitPromise,
   closePages,
+  copy,
+  copyToClipboard,
   getEditorDimensions,
   getEditorSelector,
   getFirstSerialized,
@@ -24,11 +26,10 @@ import {
   getSerialized,
   kbBigMoveDown,
   kbBigMoveRight,
-  kbCopy,
-  kbPaste,
   kbSelectAll,
   kbUndo,
   loadAndWait,
+  paste,
   pasteFromClipboard,
   scrollIntoView,
   serializeBitmapDimensions,
@@ -78,12 +79,10 @@ const copyImage = async (page, imagePath, number) => {
   const data = fs
     .readFileSync(path.join(__dirname, imagePath))
     .toString("base64");
-  await pasteFromClipboard(
+
-    page,
+  await copyToClipboard(page, { "image/png": `data:image/png;base64,${data}` });
-    { "image/png": `data:image/png;base64,${data}` },
+  await pasteFromClipboard(page);
-    "",
+
-    500
-  );
   await waitForImage(page, getEditorSelector(number));
 };
 
@@ -570,13 +569,13 @@ describe("Stamp Editor", () => {
         await page1.click("#editorStamp");
 
         await copyImage(page1, "../images/firefox_logo.png", 0);
-        await kbCopy(page1);
+        await copy(page1);
 
         const [, page2] = pages2[i];
         await page2.bringToFront();
         await page2.click("#editorStamp");
 
-        await kbPaste(page2);
+        await paste(page2);
 
         await waitForImage(page2, getEditorSelector(0));
       }
@@ -831,8 +830,8 @@ describe("Stamp Editor", () => {
           );
           await page.waitForSelector(`${getEditorSelector(0)} .altText.done`);
 
-          await kbCopy(page);
+          await copy(page);
-          await kbPaste(page);
+          await paste(page);
           await page.waitForSelector(`${getEditorSelector(1)} .altText.done`);
           await waitForSerialized(page, 2);
 

test/integration/test_utils.mjs

@@ -292,7 +292,13 @@ async function mockClipboard(pages) {
   );
 }
 
-async function pasteFromClipboard(page, data, selector, timeout = 100) {
+async function copy(page) {
+  const promise = waitForEvent(page, "copy");
+  await kbCopy(page);
+  await promise;
+}
+
+async function copyToClipboard(page, data) {
   await page.evaluate(async dat => {
     const items = Object.create(null);
     for (const [type, value] of Object.entries(dat)) {
@@ -305,7 +311,15 @@ async function pasteFromClipboard(page, data, selector, timeout = 100) {
     }
     await navigator.clipboard.write([new ClipboardItem(items)]);
   }, data);
+}
 
+async function paste(page) {
+  const promise = waitForEvent(page, "paste");
+  await kbPaste(page);
+  await promise;
+}
+
+async function pasteFromClipboard(page, selector = null) {
   const validator = e => e.clipboardData.items.length !== 0;
   let hasPasteEvent = false;
   while (!hasPasteEvent) {
@@ -634,6 +648,8 @@ export {
   clearInput,
   closePages,
   closeSinglePage,
+  copy,
+  copyToClipboard,
   createPromise,
   dragAndDropAnnotation,
   firstPageOnTop,
@@ -654,7 +670,6 @@ export {
   kbBigMoveLeft,
   kbBigMoveRight,
   kbBigMoveUp,
-  kbCopy,
   kbDeleteLastWord,
   kbFocusNext,
   kbFocusPrevious,
@@ -662,12 +677,12 @@ export {
   kbGoToEnd,
   kbModifierDown,
   kbModifierUp,
-  kbPaste,
   kbRedo,
   kbSelectAll,
   kbUndo,
   loadAndWait,
   mockClipboard,
+  paste,
   pasteFromClipboard,
   scrollIntoView,
   serializeBitmapDimensions,