Блог

Главная - Вопросы по программированию - Библиотека тестирования реакции — элементы-потомки теста

Библиотека тестирования реакции — элементы-потомки теста

#reactjs #jestjs #react-testing-library

Вопрос:

Например, у меня есть такой компонент, как этот:

 export const MyDiv = ({ faClassName, children }) => {
  return (
    <div>
      {faClassName amp;amp; <i className={faClassName} />}
      <div>{children}</div>
    </div>
  )
}

И проверить:

 it('Should render the component with all element', () => {
  render(<MyDiv faClassName="fa fa-pencil">Hello</MyDiv>)

  // more code here
}

Я не знаю, как проверить, что i в контейнере есть тег, а текст Hello завернут div тегом (а не другим тегом).

Комментарии:

1. Вы можете добавить роль или тест в элемент значка, и если имя класса не является пустой строкой, вы ожидаете, что тест будет в документе, есть несколько вариантов

2. Да, но я не могу изменить компонент, я просто пишу тест. Я новичок в тестировании, и для такого компонента, как этот, мы не можем использовать getByRole или getByText правильно?

3. Хорошо, поскольку вы знаете, что элемент i предоставляет интервал, вы можете ожидать, что этот интервал будет в документе, и вам не нужно изменять компонент, и если имя класса-пустая строка, этот интервал, как вы ожидаете, не будет в документе. Также ожидайте, что текст, который вы предоставляете детям, находится в документе или имеет текстовое содержимое привет

4. В этом случае вы не можете использовать getByRole, потому что вы не указали его в элементе i, вы не можете использовать getByText, потому что в элементе i нет текста, возможно, вы можете использовать querySelector и передать имя класса значка, что-то вроде этого: экран. querySelector(«имя класса, которое вы предоставляете значку»), а затем ожидайте, что это будет в документе

5. Добро пожаловать, я надеюсь, что это сработает!!

Метки: