CODEWITHSUNDEEP
testinghttpsautomated-testse2e-testingtestcafe
butterup
butterup

Reputation: 85

Access Clipboard in TestCafe

How can I access the clipboard in TestCafe? I am unable to use the navigator.clipboard API since we run in headless chrome --allow-insecure. (This is not something I can change).

Any ideas?

Thank you!

Upvotes: 3

Views: 1666

Answers (1)

Ilya Afanasenko
Ilya Afanasenko

Reputation: 527

TestCafe does not have built-in clipboard tools at the moment. However, you can use the client function to emulate the clipboard:

import { Selector, ClientFunction } from 'testcafe';
fixture `Example`
    .page `http://devexpress.github.io/testcafe/example/`;

test('Clipboard test', async t => {
    const text = 'Value for copy-paste';

    const emulateClipboard = ClientFunction(() => {
        let buffer = '';

        document.addEventListener('keypress', event => {
            if (event.ctrlKey) {
                if (event.key === 'c')
                    buffer = document.getSelection().toString();
                
                if (event.key === 'v')
                    document.activeElement.value = buffer;
            }
        });
    });

    await emulateClipboard();
    await t
        .typeText('#developer-name', text)
        .selectText('#developer-name')
        .pressKey('ctrl+c')
        .click('#tried-test-cafe')
        .click('#comments')
        .pressKey('ctrl+v')
        .expect(Selector('#comments').value).eql(text)
});

This example works correctly in Chrome. It may not work in other browsers due to the difference in accessing the content of <textarea> elements.

You may be able to glean more information from this discussion: https://github.com/DevExpress/testcafe/issues/2668

Upvotes: 2

Related Questions