Question

第一次测试通过。

第二个我得到错误：

import React from 'react';
import { render, fireEvent, waitFor, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import '@testing-library/jest-dom/extend-expect';

import WrapProvider from '__tests__/__utils__/WrapProvider';

import PageMovies from 'src/pages/movies/index';
import { dataTestid as dataTestIdMoviesCount } from 'src/components/Specific/Movies/MoviesCount';
import { dataTestid as dataTestidDropdown } from 'src/components/Specific/Movies/SearchMovies/DropdownMovieGenres';

describe('<PageMovies>', () => {
  beforeAll(async () => {
    render(
      <WrapProvider>
        <PageMovies />
      </WrapProvider>
    );
    await waitFor(() => screen.getByTestId(dataTestIdMoviesCount)); // success
  });
  describe('onload', () => {
    it('Should have search results', () => {
      expect(screen.getByTestId(dataTestIdMoviesCount)).toHaveTextContent(/ [1-9]/); //success
    });
  });
  describe('dropdown and search', () => {
    it('Should have dropdown', () => {
      const $dropdown = screen.getByTestId(dataTestidDropdown); // <- error - not found.
      // userEvent.selectOptions(screen.getByTestId(dataTestidDropdown), '28');
      // expect((screen.getByLabelText('Action') as HTMLOptionElement).selected).toBeTruthy();
    });
  });
});

<块引用>

错误：TestingLibraryElementError：无法通过以下方式找到元素：[data-testid="movies-dropdown"]

然而这个元素确实存在于页面上

<div name="genre" style="width:400px" data-testid="movies-dropdown" role="combobox" aria-expanded="false" class="ui compact fluid multiple search selection dropdown">

我是否正确使用了 screen.getByTestId？似乎有 3 种方法可以使用它。哪种方式是正确的？

import { getByTestId } from '@testing-library/react';
const { getByTestId } = render(<MyComponent/>);
import { screen } from '@testing-library/react'; screen.getByTestId()

Answer 1

也许初始加载时没有出现下拉菜单，您可以findByTestId（这是一个搜索 1000 毫秒的承诺）

理想情况下，您希望使用 render() 返回的函数。有一些例外，例如使用 React.portal 时。

实际上，您想避免使用 data-testid，最好搜索用户可以访问的内容，例如无障碍角色/名称和文本。

使用 beforeAll 渲染的 React 测试库在第二次测试中找不到项目

1 个答案: