Вопрос по javascript, reactjs, testing – Как мне симулировать события браузера при написании тестов для React js?

14

Как мне симулировать щелчок по элементу div? Или мышь движется? Или ввод текста?

Как мне сделать это в среде nodejs на стороне сервера, например, mocha? И как мне это сделать в браузерной среде с таким бегуном, как карма?

Ваш Ответ

2   ответа
12

ReactTestUtils это небольшой набор инструментов, которые помогут вам протестировать ваши компоненты. Самая полезная часть этого - симуляция событий - вы можете запуститьReactTestUtils.Simulate.click(node) для того, чтобы смоделировать событие нажатия с помощью React 'Синтетическая система событий.

Там'Есть также несколько других полезных утилит для утверждения о структуре DOM. Просто скачайте сборку аддонов разработки (react-with-addons.js) и вытащить это так:

var ReactTestUtils = React.addons.TestUtils;
ReactTestUtils.Simulate.click(node);

Дай мне знать, если чтотут неясно.

Проблема, на которую вы ссылались, теперь решена - способ доступаReactTestUtils это использоватьreact-with-addons.js и позвонитьReact.addons.TestUtils dbau
Правда! Я'Отредактирую, чтобы упомянуть об этом. Sophie Alpert
20

что, как правило, лучше отделить обработчики событий от логики изменения состояния, что я и хочу проверять.

Например, у меня есть компонент, который должен что-то сделать в ответ на "вкладка» нажатие клавиши

// this is hooked up in my render function
onKeyPress: function (e) {
  if (e === 9) {
    e.preventDefault()
    this.onTab(e.shiftKey)
    return
  }
  ..
},
onTab: function (shift) {
  var newstate = states.tab(shift, this.state)
  if (newstate) this.setState(newstate)
}

Тогда вstates.js Файл У меня есть логика обработки, как я должен изменить состояние на основе текущего состояния и того факта, что пользователь нажал клавишу табуляции.этоstates.tab метод на 100% тестируемый, потому что это "чистый» - без побочных эффектов, Он принимает состояние и возвращает новое состояние.

А может это и неОтвет на вопрос" прямо, но яЯ пытаюсь быть полезным =) Отключение вашей логики изменения состояния от обработчиков событий сделает ваш код намного более тестируемым и обслуживаемым.

Тот'Нельзя сказать, что вам никогда не нужно моделировать события - во многих случаях это может быть полезно, в том числе и в случае с дымом, чтобы убедиться, что все »правильно подключен.Но я только что обнаружил, что большую часть времени я хотел имитировать события браузера, потому что мой код был слишком связан.

Похожие вопросы