Testcafe differences between selectors ".exits" and ".visible"

Question

Even tho` I have read the documentation that TC provides, I'm still not sure about what is the difference between:

await t.expect(element.visible).ok();

and

await t.expect(element.exists).ok();

I have a hunch that somehow visible includes the exists check, but on the other side, and element could exist, but just not in the visible area...

Thank you in advance

Answer 1

.exists only checks that element is in the DOM. It does not check for visibility.

If you want to check for visibility you have two ways:

await t.expect(element.with({visibilityCheck: true}).exists).ok();
await t.expect(element.visible).ok();