[Feature] how to simulate a paste event

Hi,

I tried the following code to trigger a paste event

    const browser = await chromium.launch(options);
    const context = await browser.newContext();
    await context.grantPermissions(["clipboard-read", "clipboard-write"]);
    const page = await context.newPage();
    await page.goto('http://example.com/');
    await page.evaluate(async (text) => {
        await navigator.clipboard.writeText(text);
        document.execCommand("paste");
    }, "123");
    await page.screenshot({ path: `example.png` });

But i got a rejection

(node:29654) UnhandledPromiseRejectionWarning: Error: Evaluation failed: ReferenceError: __awaiter is not defined
    at __playwright_evaluation_script__:1:20
    at CRExecutionContext.evaluate (/home/project/node_modules/playwright-core/lib/chromium/crExecutionContext.js:82:23)
    at FrameManager.waitForSignalsCreatedBy (/home/project/node_modules/playwright-core/lib/frames.js:81:28)
    at FrameExecutionContext._doEvaluateInternal (/home/project/node_modules/playwright-core/lib/dom.js:42:16)
  -- ASYNC --
    at Frame.<anonymous> (/home/project/node_modules/playwright-core/lib/helper.js:63:23)
    at Page.evaluate (/home/project/node_modules/playwright-core/lib/page.js:257:33)
    at Page.<anonymous> (/home/project/node_modules/playwright-core/lib/helper.js:64:31)
    at /home/project/test/end2end/plop.spec.ts:16:16
    at step (/home/project/test/end2end/plop.spec.ts:33:23)
    at Object.next (/home/project/test/end2end/plop.spec.ts:14:53)
    at fulfilled (/home/project/test/end2end/plop.spec.ts:5:58)

I am not sure if it is an issue or if i am doing something wrong

[pavelfeldman]

A couple of issues here:

• navigator.clipboard is only available to content from the secure origins, replace url with https://example.com and it’ll be there. Secure origins include localhost.
• document.execCommand("paste") will trigger the paste event, but won’t trigger the default behavior.
• note that you are operating with the system clipboard, so other apps will have access to it and you can’t run tests like this simultaneously. We are working on resolving this last item and isolating clipboards of the browser contexts.

const { chromium } = require('playwright');

(async () => {
    const browser = await chromium.launch({ headless: false });
    const context = await browser.newContext();
    await context.grantPermissions(["clipboard-read", "clipboard-write"]);
    const page = await context.newPage();
    await page.goto('https://chromium.org');
    await page.evaluate(async (text) => {
        await navigator.clipboard.writeText(text);
        const clipText = await navigator.clipboard.readText();
        document.querySelector('#jot-ui-searchInput').value = clipText;
    }, "123");
    await page.screenshot({ path: `example.png` });
})();

[fzembow]

In case this helps anyone, I was able to emulate a text paste event using evaluate:

await page.locator('form').evaluate((formEl) => {
  const text = `Text to paste`;
  const clipboardData = new DataTransfer();
  clipboardData.setData('text/plain', text);
  const clipboardEvent = new ClipboardEvent('paste', {
    clipboardData
  });
  formEl.dispatchEvent(clipboardEvent);
});