testcafe-testing-library icon indicating copy to clipboard operation
testcafe-testing-library copied to clipboard

Property 'exists' does not exist on type 'NodeSnapshot'.

Open AdrienLemaire opened this issue 2 years ago • 1 comments

Describe the bug Following the documentation, I tried to write the following test

const main = Selector('main[role="main"]');
const dialog = Selector('div[role="dialog"]');

signin = within(main).queryByText("Sign in");
google = within(dialog).queryByText(/Google/i);

test("user clicks the sign-in button", async (t) => {
  await t
    .expect(google.exists)
    .notOk("Modal should not be opened")
    .takeScreenshot()
    .click(signin)
    .expect(google.exists)
    .ok("Modal is opened")
    .takeScreenshot();
}

When running tests, I get the following error pointing on the notOk line

   1) An error occurred in Selector code:

      TypeError: Expected container to be an Element, a Document or a DocumentFragment but
      got undefined.

And when trying to console.log the value of await googe.exists, I get

ERROR Cannot prepare tests due to the following error:

Error: TypeScript compilation failed.
/path/to/e2e/signin.ts (7, 27): Property 'exists' does not exist on type 'NodeSnapshot'.

Expected behavior

I thought from reading the examples that @testing-library/testcafe queries would return a TestCafe Selector object, making properties like exists available.

Here's a working test without using testing-library

  const main = Selector('main[role="main"]');
  const dialog = Selector('div[role="dialog"]');

  const signin = main.find("button").withText("Sign in");
  const google = dialog.find("button").withText("Google");

  await t
    .expect(google.exists)
    .notOk("Modal should not be opened")
    .takeScreenshot()
    .click(signin)
    .expect(google.exists)
    .ok("Modal is opened")
    .takeScreenshot();

AdrienLemaire avatar Feb 24 '22 01:02 AdrienLemaire

would welcome a PR if you want to take a stab at fixing this. :)

benmonro avatar Jun 09 '22 16:06 benmonro