reactjs - NextJS Router & Jest : How can I mock router change event

标签 reactjs unit-testing mocking jestjs next.js

我正在使用 next-routes在我的 React 组件中,我在下面使用 useEffect要检测的代码块 Router更改事件:

useEffect(() => {
  // THIS BLOCK WILL BE EXECUTED WHEN THE COMPONENT IS ALREADY MOUNTED AND SCREEN WOULD BE REDNDERED IN WHEN ROUTED CLIENT SIDE
  const handleRouterChangeComplete = url => {
    // console.log('INNNN handleRouterChangeComplete url = ', url);
    // MY REST OF THE LOGIC HERE
  };

  // THIS BLOCK WILL BE EXECUTED WHEN THE SCREEN WOULD BE REDNDERED IN WHEN ROUTED CLIENT SIDE
  Router.events.on('routeChangeComplete', handleRouterChangeComplete);
  return () => {
    Router.events.off('routeChangeComplete', handleRouterChangeComplete);
  };
}, []);

我正在使用 jest为此组件编写单元测试用例并面临以下错误:
TypeError: Cannot read property 'on' of undefined

      183 |
      184 |     // THIS BLOCK WILL BE EXECUTED WHEN THE SCREEN WOULD BE REDNDERED IN WHEN ROUTED CLIENT SIDE
    > 185 |     Router.events.on('routeChangeComplete', handleRouterChangeComplete);

任何人都可以帮我 mock Router Change事件?
谢谢

最佳答案

您可以使用 Router.events.emit('event-name') 触发相关的更改事件。 ;

代码取自 router implementation .

关于reactjs - NextJS Router & Jest : How can I mock router change event,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59961579/

相关文章:

javascript - 发生构建错误 ReferenceError : describe is not defined > During now. sh 部署

iOS 11 位置权限从一开始就三个选项

javascript - 如何使用 Jest 测试是否使用定义的参数( toHaveBeenCalledWith )调用了函数

swift - 将 Cuckoo 与 Swift 一起使用,为什么调用 `stub` 会提示来自 GeneratedMocks 的类不符合 Mock 协议(protocol)?

java - 如何使用 Mockito 捕获发送到 stub 方法的方法参数

html - react : How to make <td> collapse as column in a <tr> in mobile view

javascript - Mobx 存储未注入(inject)

java - Vertx.io 应用程序的单元测试

forms - 如何在测试 Angular 2 react 形式时使用 setValue 和 patchValue

react-native - Jest 模拟和监视导入的异步函数