Skip to content

await-async-query not waiting when method is called from wrapper #113

Closed
@victorandcode

Description

@victorandcode

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 :)

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingreleased

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions