Testcafe .presskey for multiple presses

Question

I'm trying to write TestCafe Javascript to test a webpage using the keyboard as sole navigation (i.e. 'tabbing through the options').

TestCafe runs these tests, but they run extremely fast (5 seconds max), and nothing happens on the screen. So I'm wondering if it's even actually working.

On top of that, I'm trying to find a way to DRY out my code. From what I read in the docs, each time I want a key pressed, I need to call .pressKey('tab'). If I need to hit 'tab' 5 times in a row, I have 5 lines of that in my code. Is there any way to eliminate this unnecessary repetition?

Thanks!

Answer 1

TestCafe sets focus to the next element on the page when the .pressKey('tab') action is called. To make your code cleaner, you can pass several keys separated with spaces to the pressKey action.

I've created a simple example for this stackoverflow page:

import { Selector } from 'testcafe';

fixture `stackoverflow`
    .page `https://stackoverflow.com/questions/46612440/testcafe-presskey-for-multiple-presses`;

test('tab', async t => {
    await t
        .click(Selector('#search').find('[name="q"]'))
        .pressKey('tab tab tab tab tab tab tab tab tab tab tab tab tab tab');
});

Here is a screencast that demonstrates how it works (I've set the test run speed to 0.5 via the --speed option): https://www.screencast.com/t/dERD60nGc4f

Answer 2

If you want to slow it down to visually check, you can interleave calls to wait(x)

  await t.pressKey(TAB);
  await t.wait(800);
  await t.pressKey(TAB);
  await t.wait(800); 

etc.