Javascript 如何测试/模拟挂钩？

最近我升级了okta react库，并将应用程序转换为使用新的挂钩。我现在正在更新我的测试

useOktaAuth（）

是

未定义的

。我希望能够模拟它，以便在用户登录时进行测试

const { authState, authService } = useOktaAuth();

// TypeError: Cannot destructure property `authState` of 'undefined' or 'null'

为了解决这个问题，我尝试通过以下方式模拟钩子：

    jest.mock('@okta/okta-react', () => ({
      useOktaAuth: () => {
        return {
          authState: {},
          authService: {}
        };
      }
    }));

那不行。我对如何测试这些组件还有什么想法吗

谢谢

jest.mock（“@okta/okta react”，（）=>({
useOktaAuth:（）=>{
返回{
authState:{}，
身份验证服务：{}
};
}
}));
测试（'应呈现CreateDeploymentManifestPage和ShowDeploymentManifest'，
() => {
const myMock=jest.fn（）；
常量包装器=浅（）；
const basicInfo=wrapper.find（DeploymentBasicInfo）；
expect（wrapper.containsAllMatchingElements）([
,
])).托比（对）；
});

我收到了几乎相同的信息，说

TypeError:无法对（0，_oktaReact.useOktaAuth）（…）的属性“authState”进行分解，因为它未定义。**

组成部分：

import { useOktaAuth } from "@okta/okta-react";

const Login = () => {
const { authState } = useOktaAuth();
...

测试：

jest.mock（'@okta/okta react'，（）=>({
useOktaAuth:（）=>{
返回{
authState:{}，
身份验证服务：{}
};
}
}));
描述（“组件测试”，（）=>{
它（“应该呈现登录组件”，完成=>{
常量包装器=浅（）；
setImmediate（（）=>{
wrapper.update（）；
试一试{
//你在这里的主张
完成（）；
}捕获（错误）{
完成。失败（错误）；
}
});
});

---

})；

除了Elmatsidis Paul answer，我还必须添加一个mock来涵盖useOktaAuth和withOktaAuth：

jest.mock('@okta/okta-react', () => ({
    useOktaAuth: () => {
        return {
            authState: {},
            authService: {}
        };
    },
    withOktaAuth: (x: any) => x
}));

你很接近：

jest.mock('@okta/okta-react', () => ({
  useOktaAuth: () => ({
    authState: { isAuthenticated: true},
    authService: { handleAuthentication: jest.fn() }
  })
}));

---

经过不断的研究和工作，这对我很有效

jest.mock("@okta/okta-react/dist/OktaContext", () => ({
  useOktaAuth: () => {
    return {
      authState: {},
      authService: {},
    };
  },
}));

describe("Login", () => {
  test("should ", () => {
    const wrapper = shallow(<Login authService={null} />);
    expect(wrapper.length).toBe(1);
  });
});

jest.mock（“@okta/okta react/dist/OktaContext”，（）=>({
useOktaAuth:（）=>{
返回{
authState:{}，
authService:{}，
};
},
}));
描述（“登录”，（）=>{
测试（“应该”，（）=>{
常量包装器=浅（）；
expect（包装器长度）.toBe（1）；
});
});

---

注意：我已将authService参数传递给组件。

只需在测试组件外部编写mock，它就会工作。它对我起作用。CreateDeploymentManifestPage是包含另一个组件DeploymentBasicInfo的组件。CreateDeploymentManifestPage正在使用useOktaAuth钩子获取authState和authService。知道如何模拟该组件吗onent？知道如何模拟组件吗？知道如何模拟组件吗？

jest.mock('@okta/okta-react', () => ({
  useOktaAuth: () => ({
    authState: { isAuthenticated: true},
    authService: { handleAuthentication: jest.fn() }
  })
}));

jest.mock("@okta/okta-react/dist/OktaContext", () => ({
  useOktaAuth: () => {
    return {
      authState: {},
      authService: {},
    };
  },
}));

describe("Login", () => {
  test("should ", () => {
    const wrapper = shallow(<Login authService={null} />);
    expect(wrapper.length).toBe(1);
  });
});