笑话：reactjs 组件中的测试方法

Question

我有功能组件 FilterBar -

const FilterBar=()=>{

....
....
useEffects..
states...

function apiCallToFilters()
{
  ...
  ...
}

...
..

}

由于无法共享整个代码，我共享了一个结构和一个方法，我想从 jest 中测试它。

我写了FilterBar.test.tsx-

describe('Filter Bar', () => {
  it('All Api Calls', () => {
    const wrapper = shallow(<FilterBar />);
    expect(wrapper.instance().apiCallToFilters //not able to find apiCallToFilters method here
  });
});

我已经关注了来自 SO 的问题。

有了wrapper.instance()之后。我得到以下属性和方法 -

context
forceUpdate
getSnapshotBeforeUpdate
props
render
setState
shouldComponentUpdate
state

如何通过 jest 测试 FilterBar 中的 apiCallToFilters 方法？

Answer 1

Enzyme - 提供对组件实例属性的编程访问的库只能提供对可从外部访问的属性的访问，因为它不能违反 JavaScript 的封装原则。

我无法从您的示例代码中看出您使用的是哪种组件，但我强烈建议您将其转换为 class 组件并将 apiCallToFilters 函数更改为方法（通过删除 function 关键字）。

Link 到这个被调用的线程可以找到 here.

笑话：reactjs 组件中的测试方法

Jest : Test method in reactjs component

javascript

jquery

reactjs

jestjs