如何使用赛普拉斯存根模块功能？

Question

我想用赛普拉斯创建一个测试，该测试具有一个React组件，该组件使用一个带有HOC（@okta/okta-react）的身份验证库（withOktaAuth）。

我的组件看起来像这样：

// Welcome.js

import { withOktaAuth } from '@okta/okta-react'

const Welcome = ({authState}) => {
  return <div>{authState.isAuthenticated ? 'stubbed' : 'not working'}</div>
}

export default withOktaAuth(Welcome)

我试图像这样进行测试：

// test.js

import * as OktaReact from '@okta/okta-react'

const withOktaAuthStub = Component => {
  Component.defaultProps = {
    ...Component.defaultProps,
    authState: {
      isAuthenticated: true,
      isPending: false
    },
    authService: {
      accessToken: '123'
    }
  }

  return Component
}

describe('Test auth', () => {
  before(() => {
    cy.stub(OktaReact, 'withOktaAuth').callsFake(withOktaAuthStub)
  })

  it('Stubs auth', () => {
    cy.visit('/welcome')
    cy.contains('stubbed')
  })
})

运行测试时，该组件仍然不使用存根函数。非常感谢您的帮助！