How to tell TestCafe to wait after navigateTo method?

Viewed 1694

I have following test in TestCafe:

import { Selector } from 'testcafe';

const TEST_URL = process.env.TEST_URL;

fixture('/').page(`${TEST_URL}/`);

test(`users should be able to view the '/' page`, async (t) => {
    await t
        .navigateTo(TEST_URL)
        .expect(Selector('H1').withText('All Users').exists).ok()
});

And this test fail:

/
 ✖ users should be able to view the '/' page

   1) AssertionError: expected false to be truthy

      Browser: Chrome 59.0.3071 / Mac OS X 10.12.5

          5 |fixture('/').page(`${TEST_URL}/`);
          6 |
          7 |test(`users should be able to view the '/' page`, async (t) => {
          8 |    await t
          9 |        .navigateTo(TEST_URL)
       > 10 |        .expect(Selector('H1').withText('All Users').exists).ok()
         11 |});
         12 |

Problem is that page don't fully load and there is no h1 tag (which is rendered from React component) but I don't know how to tell TestCafe to wait for page to load.

I tried this:

import { Selector } from 'testcafe';

const TEST_URL = process.env.TEST_URL;

fixture('/').page(`${TEST_URL}/`);

test(`users should be able to view the '/' page`, async (t) => {
    await t.expect(Selector('H1').withText('All Users').exists).ok()
});

which works but I need for some test to use navigateTo so I would like to know what to change so that version of test with navigateTo also works.

I tried to set await for every line like this:

import { Selector } from 'testcafe';

const TEST_URL = process.env.TEST_URL;

fixture('/').page(`${TEST_URL}/`);

test(`users should be able to view the '/' page`, async (t) => {
    await t.navigateTo(TEST_URL)
    await t.expect(Selector('H1').withText('All Users').exists).ok()
});

but that error is same.

1 Answers
Related