赛普拉斯：无法用一个基本的例子来存根。我可能会错过什么？

Question

出于某种原因，我无法在此处存根。我在这里将我的代码减少到几乎完全一样。这应该根据文档工作，但我想知道我是否遗漏了打字稿/反应挂钩的更详细信息？感觉完全不像这种情况，但谁知道呢。如果您正在阅读本文并占用您的时间，请提前致谢。我很欣赏你所做的。这是我的例子：

// connection.ts (the method to stub)
export const connectFn = async () => {
  return 'i should not be here'
}

// ./reactHook.ts
import { connectFn } from './connection'

export const useMyHook = () => {
  const handleConnect = async () => {
    const result = await connectFn()
    console.log(result)
    // expected: 'i have been stubbed!'
    // actual: 'i should not be here
  }

  return {
    handleConnect
  }
}

// ./App.ts
export const App = () => {
  const { handleConnect } = useMyHook()
  return <button onClick={handleConnect}>Connect</button>
}

// ./cypress/integration/connection.spec.ts
import * as myConnectModule from '../../connection'

describe('stub test', () => {
  it('stubs the connectFn', () => {
    cy.stub(myConnectModule, 'connectFn').resolves('i have been stubbed!')
    cy.get('[data-testid=connect-btn]').click()
    // assertions about the view here...
  })
})

我以为我很了解 cypress 和 Sinon 文档。我读过柏树需要一个对象到存根而不是直接命名的导出 - 因此 * 作为导入。我也尝试了各种方式来导出它。我直接使用文档中的示例无济于事。然后我认为这可能是打字稿问题，但似乎并非如此。我已经将我的实际代码减少到几乎这个例子。我什至删除了除测试日志以外的所有内容，但我仍然没有得到它。

Answer 1

要成功存根，您需要存根（替换）相同的实例。

在reactHook.ts

import { connectFn } from './connection'

if (window.Cypress) {
  window.connectFn = connectFn
}

测试中

cy.window().then(win => {
  cy.stub(win, 'connectFn').resolves('i have been stubbed!')
  cy.get('[data-testid=connect-btn]').click()
  ...
}}

顺便说一句 useMyHook 意味着一个 React 钩子，如果是这样你可能需要一个 cy.wait(0) 来释放主 JS 线程并允许钩子运行.

赛普拉斯：无法用一个基本的例子来存根。我可能会错过什么？

Cypress: Not able to stub with a basic example. What might i be missing?

stubbing

typescript

reactjs

cypress