如何在 jest/enzyme 中模拟点击选项卡答案

【问题标题】：how to simulate click on tab in jest/enzyme如何在 jest/enzyme 中模拟点击选项卡
【发布时间】：2020-03-05 22:08:44
【问题描述】：

我想写一个简单的测试 1-单击选项卡 2-看到状态是复活改变 3-标签内容真实改变

我的问题是模拟点击被触发但 setState 不起作用

test('selected tab change when click on tab', () => {
  const wrapper = shallow(<MyComponent />)
  const walletTab1 = findByTestAttr(wrapper, 'wallet-tab-1').dive().dive().dive().dive()


  console.log('shaloww',walletTab1.debug())
  walletTab1.simulate('click')

  const walletTabContainer = findByTestAttr(wrapper, 'wallet-tab-container-1')

  expect(walletTabContainer.length).toBe(1)
})

我的组件


        <AppBar position="static" color="default" data-test="component-wallet">
          <Tabs
            data-test="wallet-tabs"
            value={selectedTab}
            onChange={(event, value) => {
               this.setState({selectedTab: val})
            }}
            indicatorColor="primary"
            textColor="primary"
            variant="scrollable"
            scrollButtons="auto"
          >
            <Tab data-test="wallet-tab-0" label="Item One" />
            <Tab data-test="wallet-tab-1" label="Item Two" />
            <Tab data-test="wallet-tab-2" label="Item Three" />
          </Tabs>
        </AppBar>
        {selectedTab === 0 && <TabContainer data-test="wallet-tab-container-0">Item One</TabContainer>}
        {selectedTab === 1 && <TabContainer data-test="wallet-tab-container-1">Item Two</TabContainer>}
        {selectedTab === 2 && <TabContainer data-test="wallet-tab-container-2">Item Three</TabContainer>}

点击后应将状态（selectedTab）更新为1

【问题讨论】：

“复活”是什么意思？
@TalKoren Onclick 由标签定义，我们在 dom 中单击一个标签，其中标签内有触发按钮 -> onClick 标签也可以正常工作，但在酶中 onClick 没有发生

标签： reactjs jestjs material-ui enzyme

【解决方案1】：

onChange={(event, value) => {
  this.setState({selectedTab: val})
}}

你的代码中没有val这样的东西，你的函数的参数是value。这就是我认为的问题。

【讨论】：