javascript - 与 Mocha watch 一起使用时，Sinon stub 有奇怪的行为

Question

这是我们的基本设置

src/MyComponent.js

import actions from `src/actions`

 export const mapDispatchToProps = dispatch => {
    return {
      onClick: () => {
        dispatch(actions.myAction())
      }
    }
 }

src/actions.js

const actions = { 
  myAction: () => () => ...
}
export default actions

src/MyComponentTest.js

 import sinon from 'sinon'
 import actions from 'src/actions'
 import { mapDispatchToProps } from 'src/MyComponent'

 describe('onClickTests, () => {
   let dispatch = sinon.spy()
   let onClick

   beforeEach(() => {
     onClick = mapDispatchToProps(dispatch).onClick
   })

   it('calls dispatch with myAction', () => {
     function f () {}
     sinon.stub(actions, 'myAction').returns(f)
     onClick()
     expect(dispatch.args[0]).to.deep.equal([f])
   })
 })

基本上，我们正在检查onClick函数正在调用dispatch返回值为 actions.myAction 。自实actions.myAction返回一个匿名函数，我们对其进行 stub 以返回函数 f 。当我们使用 Mocha 运行时，一切正常，直到我们使用 --watch 运行。 。第一次运行仍然按预期通过，但是当我们保存测试并重新运行测试时，该测试失败并显示

expected [ [Function: f] ] to deeply equal [ [Function: f] ]

如果我对测试进行了这些更改

   it('calls dispatch with myAction', () => {
     function f () {}
     sinon.stub(actions, 'myAction').returns(2)
     onClick()
     expect(dispatch.args[0]).to.deep.equal([2])
   })

我明白

expected [ [Function: f] ] to deeply equal [ [2] ]

所以我从中收集到的是，在第二次运行时，f那actions.minimize返回的是“旧”f从第一次运行开始。我们对此尝试了各种不同的变体，例如使用 module.exports/require而不是export/import并将东西移动到 Mocha hooks ( beforeEach 等)中，但似乎没有任何效果，这让我相信这是我们测试方式的一个更根本的问题。有什么建议吗？

Answer 1

我以前遇到过这个问题，花了一段时间才弄清楚。

不确定这是否是您的情况，但我在组件中使用了 .jsx 扩展名，结果发现这会带来各种随机问题。

将 Component.jsx 重命名为 Component.js 解决了它。