Skip to content

False positive for await-async-utils #732

Closed
@iantocristian

Description

@iantocristian

Have you read the Troubleshooting section?

Yes

Plugin version

v5.10.1

ESLint version

v8.33.0

Node.js version

v18.12.1

package manager and version

npm 9.4.2

Operating system

macOS Ventura 13.2

Bug description

This appears to be a regression introduced with the latest patch release, v5.10.1. Not present in v5.10.0.

False positive rule await-async-utils triggered by inline async function definition on other variables and/or definitions.

Promise returned from x wrapper over async util must be handled but x is not a function.

Steps to reproduce

This code triggers a false positive on expectedValue:

import React from 'react';
import { render, act } from '@testing-library/react';

function wait(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

const waitWithAct = async (timeout) => {
  await act(async () => await wait(timeout));
};

describe('Component', () => {
  const mock = jest.fn();

  it('test', async () => {
    let Component = () => {
      mock(1);
      return <div />;
    };
    render(<Component />);

    await waitWithAct(500);

    const expectedValue = 1;
    expect(mock).toHaveBeenCalledWith(expectedValue);
  });
});

Rewriting the inline async function fixes the false positive:

import React from 'react';
import { render, act } from '@testing-library/react';

function wait(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

const waitWithAct = async (timeout) => {
  await act(async () => {
    await wait(timeout);
  });
};

describe('Component', () => {
  const mock = jest.fn();

  it('test', async () => {
    let Component = () => {
      mock(1);
      return <div />;
    };
    render(<Component />);

    await waitWithAct(500);

    const expectedValue = 1;
    expect(mock).toHaveBeenCalledWith(expectedValue);
  });
});

Another case of false positive, this results in false positives reported for mock and jest.fn:

import React from 'react';
import { render, act } from '@testing-library/react';

function wait(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

const waitWithAct = async (timeout) => {
  const fn = async () => await wait(timeout);
  await act(fn);
};

describe('Component', () => {
  const mock = jest.fn();

  it('test', async () => {
    let Component = () => {
      mock(1);
      return <div />;
    };
    render(<Component />);

    await waitWithAct(500);

    const expectedValue = 1;
    expect(mock).toHaveBeenCalledWith(expectedValue);
  });
});

Error output/screenshots

No response

ESLint configuration

module.exports = {
  env: {
    es6: true,
  },
  parserOptions: {
    ecmaVersion: 2021,
    ecmaFeatures: {
      jsx: true,
    },
    sourceType: 'module',
  },
  globals: {
    process: true,
    module: true,
  },
  extends: ['plugin:prettier/recommended'],
  plugins: ['prettier', 'eslint-plugin-no-only-tests', 'deprecate', 'jest', 'testing-library', 'cypress'],
  overrides: [
    {
      files: ['*.test.jsx', '*.test.js', 'jest/setup-tests.js'],
      extends: ['plugin:jest/recommended', 'plugin:testing-library/react'],
    },
  ],
};

Rule(s) affected

testing-library/await-async-utils

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

No

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions