`no-unnecessary-act`: Doesn't report when the variable has a name other than "userEvent"

[ahce]

Have you read the Troubleshooting section?

Yes

Plugin version

5.10.3

ESLint version

8.39.0

Node.js version

16.20.0

package manager and version

8.19.4

Operating system

macOS Ventura, version 13.2.1

Bug description

In the documentation, the examples named userEvent as "user".

When the variable has been named as "user" the no-unnecessary-act doesn't report.

Steps to reproduce

const { screen, act } = require('@testing-library/react');
const { default: userEventRoot } = require('@testing-library/user-event');

test('no-unnecessary-act no report with other root name', async () => {
  await act(async () => {
    await userEventRoot.click(
      screen.getByRole('button', { name: /click me!/i }),
    );
  });
});
test('no-unnecessary-act no report with setup', async () => {
  const user = userEventRoot.setup();

  await act(async () => {
    await user.click(screen.getByRole('button', { name: /click me!/i }));
  });
});
test('no-unnecessary-act report ok', async () => {
  const userEvent = userEventRoot.setup();

  await act(async () => {
    await userEvent.click(screen.getByRole('button', { name: /click me!/i }));
  });
});

Error output/screenshots

ESLint configuration

{
  "root": true,
  "extends": ["airbnb", "plugin:testing-library/react"],
  "env": {
    "jest": true
  }
}

Rule(s) affected

no-unnecessary-act

Anything else?

No response

Do you want to submit a pull request to fix this bug?

No

[Belco90]

Thanks for reporting @ahce. This is probably caused by the default import being renamed. That could potentially prevent every rule in the repo to report errors properly, so it's a core change to the plugin.

[thkim1011]

@Belco90 I think this still happens even when the default import isn't renamed. For example, the following will not report a lint error.

import { act, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";

describe("test", () => {
  it("this does not cause a lint error", async () => {
    const user = userEvent.setup();
    await act(() => user.click(screen.getByText("Test")));
  });

  it("this does cause a lint error", async () => {
    await act(() => userEvent.click(screen.getByText("Test")));
  });
});

[alexdunae]

I can confirm this is still an issue in plugin version 6.4.0. It's not related to naming from my experiments.

import userEvent from "@testing-library/user-event";
const u = userEvent.setup()

// calling with the imported userEvent triggers the linting error
await act(async () => {
  await userEvent.click(subEntry);
});

// calling with the result of userEvent.setup() does not trigger the linting error
await act(async () => {
  await u.click(subEntry);
});