為什麼不用Enzyme要用React Testing Library

這是Enzyme的範例

it('simulates click events', () => {
    const onButtonClick = sinon.spy();
    const wrapper = mount((
      <Foo onButtonClick={onButtonClick} />
    ));
    wrapper.find('#foo').simulate('click');
    expect(onButtonClick).to.have.property('callCount', 1);
});
  1. 這個測試需要HTML上有一個id是foo的tag，假設id修改了，它不就爆掉了
  2. 使用者看網頁，不會看到它有一個id是foo的東西，他只會看到網頁畫面，例如一個按鈕，上面寫「如果你覺得露娜很可愛，點我」

這些文章解釋了為什麼不用Enzyme
React Testing Library: The Modern Way to Test React Components
How to use React Testing Library Tutorial

重點截取：
React beginners often confuse the tools for testing in React. React Testing Library is not an alternative to Jest, because they need each other and every one of them has a clear task.
In modern React, developers will not get around Jest for testing, because its the most popular testing framework out there for JavaScript applications.

~ How to use React Testing Library Tutorial

Post Views: 146