Closed
Description
Hello,
I've been trying to integrate the rule await-async-query
with a React project but it doesn't seem to be working as expected. Here's how to reproduce the problem:
import React from "react";
import { render, screen } from "@testing-library/react";
const Foo = () => <div>Hello</div>;
it("should fail rule", () => {
render(<Foo />);
screen.findByText('Hello'); // DOES NOT FAIL await-async-query even though it should
expect(1).toBe(1)
});
.eslintrc
{
"env": {
"browser": true,
"commonjs": true,
"es6": true,
"jest": true
},
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"plugins": ["testing-library"],
"rules": {
"testing-library/await-async-query": "error",
"testing-library/await-async-utils": "error",
"testing-library/no-await-sync-query": "error",
"testing-library/prefer-explicit-assert": "error",
"testing-library/prefer-presence-queries": "error",
"testing-library/prefer-wait-for": "error"
}
}
This is strange for me because the rule is recommended to work with the react version of testing-library which uses either screen or wrapper instead of the direct export of find* methods.
I also noticed that the rule's selector used to work with this example previously but was changed in 60862ad#diff-b939ebc192e4cb00915398cde14390f7R29
Please let me know if this rule is not intended to be used this way.
Thanks for the help :)