Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Wrapping Redux connect() with withRouter() confuses WDYR

See original GitHub issue

As per title, not really sure what else I can add!

export default withRouter(connect(mapStateToProps)(_NotificationBar));

whyDidYouRender error. Please file a bug at https://github.com/welldone-software/why-did-you-render/issues. 
{errorInfo: {…}}
errorInfo:
WDYRPatchedComponent: null
componentNameOrComponent: ƒ C(props)
displayName: "withRouter(Connect(_NotificationBar))"
error: TypeError: Cannot read property 'prototype' of undefined at mn 
(http://localhost:7979/business.f5e0eaa5.js:45079:27658) at e 
(http://localhost:7979/business.f5e0eaa5.js:45079:32377) at Un 
(http://localhost:7979/business.f5e0eaa5.js:45079:32627) at $n 
(http://localhost:7979/business.f5e0eaa5.js:45079:32976) at Object.Vn.e.createElement 
(http://localhost:7979/business.f5e0eaa5.js:45079:34253) at AuthedLayout 
(http://localhost:7979/AuthedLayout.dd37237b.js:2517:85) at renderWithHooks 
(http://localhost:7979/business.f5e0eaa5.js:29330:22) at updateFunctionComponent 
(http://localhost:7979/business.f5e0eaa5.js:31509:24) at mountLazyComponent 
(http://localhost:7979/business.f5e0eaa5.js:31817:21) at beginWork 
(http://localhost:7979/business.f5e0eaa5.js:33026:20)
isShouldTrack: true
options: {include: null, exclude: null, onlyLogs: false, notifier: ƒ, consoleLog: ƒ, …}
rest: [null]
__proto__: Object
__proto__: Object

/* eslint-disable global-require */
import React from 'react';

export default () => {
  if (process.env.NODE_ENV === 'development') {
    const whyDidYouRender = require('@welldone-software/why-did-you-render');
    whyDidYouRender(React, {
      trackAllPureComponents: true,
      logOwnerReasons: true,
    });
  }
};

Issue Analytics

State:
Created 3 years ago
Comments:26

Top GitHub Comments

2reactions

vzaidmancommented, May 31, 2020

try 4.2.5 please! i had an idea

0reactions

MaffooBristolcommented, May 31, 2020

No problem, glad to help 🙂

Top Results From Across the Web

connect and withRouter issue - Stack Overflow

It already receives location and history props. I am figuring out the theory behind why the order does matter ? javascript · reactjs...

React Redux

The connect() function takes two primary arguments, both optional. The first, mapStateToProps , is a function you provide to pull data from ...

Using withRouter() to Inject the Params into Connected ...

We will learn how to use withRouter() to inject params provided by React Router into connected ... Redux: Wrapping dispatch() to Recognize Promises....

React Router with Redux: Understanding navigation state

Use React Router to declaratively navigate within your React and Redux applications and maintain state across your app's navigation ...

Higher-Order Components - React

HOCs are common in third-party React libraries, such as Redux's connect and Relay's ... Rather, a HOC composes the original component by wrapping...