Go Pro Sign Up Login
0 days 0 hrs 0 min 0 sec

Summer Sale

50% off Level Up Pro until you unsubscribe.
Get access to ALL 128 courses on Level Up Tutorials

This is your last chance to get Level Up Pro for $145/year.

or Learn More
Moon Moon

Buy Now and unlock this series

$

39

.99

yours forever

Become a Pro and unlock everything

$

24

.99

per month

Negative Assertions & Testing With React Router

In this video, we will go over some pitfalls you will run into during real world tests. We will encounter issues when working with React Router, writing negative assertions, and using multiple tests at once.

Downloads

Become a pro to download code and videos

Comments

User avatar

Raul

about 2 years ago [edited]

@JD As it says on your error message you have two options:

  • Move code with side effects to componentDidMount, and set initial state in the constructor. (change componentWillMount for componentDidMount)
  • Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to...

JD

over 2 years ago

Test still fails, code is identical

i get the following error message.

console.warn node_modules\react-dom\cjs\react-dom.development.js:88 Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.

  * Move code with side effects to componentDidMount, and set initial state in the constructor.
  * Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to 

their new names, you can run npx react-codemod rename-unsafe-lifecycles in your project source folder.

  Please update the following components: MemoryRouter, Router, styled.img
console.warn node_modules\react-dom\cjs\react-dom.development.js:88
  Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.

  * Move data fetching code or side effects to componentDidUpdate.
  * If you're updating state whenever props change, refactor 

your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://fb.me/react-derived-state * Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run npx react-codemod rename-unsafe-lifecycles in your project source folder.

  Please update the following components: Router, e, styled.img

with movie

expect(jest.fn()).not.toHaveBeenCalled()

Expected mock function not to be called but it was called with:
  ["Warning: Failed prop type: The prop `movie.poster` is marked as required in `Movie`, but its value is `undefined`.        
    in Movie (at Movie.test.js:27)"]

  at Object.<anonymous> (src/Movie.test.js:30:29)
      at new Promise (<anonymous>)
  at node_modules/p-map/index.js:46:16
  at processTicksAndRejections (internal/process/task_queues.js:97:5)

Want to join the conversation?

Become a Pro member today!