Discussion on: React Specific Selectors in TestCafe

[marques woodson]

doubleArrowLeft.getReact() returns a promise. So try this:

var doubleArrowLeft = ReactSelector('Button').withProps(
  { Key : 'fal fa-chevron-double-left' }
);
const doubleArrowLeftData = await doubleArrowLeft.getReact();
console.log(doubleArrowLeftData)

[Tall-KU]

That didn't work....

[marques woodson]

Here's what I tested really quick:

fixture("A fixture this is").page("http://localhost:3002");

test("this is a test", async t => {
  const header = ReactSelector("Header").withProps({ name: "marques" });
  const stuff = await header.getReact();
  console.log(stuff);
});

outputs:

$ testcafe chrome:headless test.ts
 Running tests in:
 - HeadlessChrome 74.0.3729 / Mac OS X 10.14.5

 A fixture this is
{ state: {}, props: { name: 'marques' }, key: null }
 ✓ this is a test

Try this out

[Tall-KU]

Awesome, thanks for the help. So, I figured out my issue. I was trying to locate the selector by 'Key', which is NOT a property!

[marques woodson]

Aaah yea, you'd want to use withKey instead of withProps. I'm glad you got it figured out :)