无法通过以下方式找到元素:[data-testid="movieList"]

时间:2021-06-23 22:26:53

标签: javascript reactjs react-native react-redux jestjs

我需要从电影列表组件中测试我的 ul 中的结果,但我一直无法找到元素 [data-testid=movieList]

我的电影列表组件


      </section>
      {isLoaded ? (
        items.length === 0 ? (
          <div>No Results Found</div>
        ) : (
          <ul className="mt-50 styled" data-testid='movieList'>
            {items.map((item) => (
              <li className="slide-up-fade-in py-10" key={item.id}>
                {item.Title}
              </li>
            ))}
          </ul>
        )
      ) : (
        <div className="mt-50 slide-up-fade-in" data-testid="no-result"></div>
      )}
    </div>

我的测试

import React from 'react';
import App from './App';
import { render, fireEvent, cleanup, waitFor , screen} from '@testing-library/react';
import fetchMock from 'fetch-mock';
import '@testing-library/jest-dom/extend-expect';

const renderApp = () => render(<App/>);

afterEach(() => {
  fetchMock.restore();
  cleanup()
});

test('initial UI is rendered as expected', () => {
  let { getByTestId, queryByTestId } = renderApp();
  expect(getByTestId('app-input')).toHaveValue(null);
  expect(getByTestId('submit-button')).toHaveTextContent("Search");
  expect(screen.getByTestId('movieList').childNodes).toHaveLength(0);
  expect(queryByTestId('no-result')).toBe(null);
});

0 个答案:

没有答案