Is there a way to access clipboard contents?

Question

I am testing a page that has an embed modal with a textbox with an embed code and a "Copy" button that should copy the contents of the textbox onto the clipboard so a user can paste it elsewhere. Is there a way to test clicking the "Copy" button and verifying that the clipboard contents match the contents of the textbox? Thanks!

Answer 1

TestCafe cannot automate a browser's built-in behavior, including the Copy & Paste functionality. It is expected that this functionality works correctly as it is tested by browser developers.

You can try to check that your script/button executes the copy command in the following way:

const overwriteCopyCommand = ClientFunction(() => {
    document.execCommand = command => window.lastExecutedCommand = command;
});

const getLastExecutedCommand = ClientFunction(() => window.lastExecutedCommand);

await overwriteCopyCommand();
await t
    .click('.copy-url-button')
    .expect(getLastExecutedCommand()).eql('copy');

Unfortunately, according to JavaScript restrictions, I don't see a way how to check the copied text.

See additional workarounds in these threads:

Support 'ctrl+c' and 'ctrl+v' key combinations for copying/pasting selected text

Allow to use HTML5 Clipboard API in tests