Skip to content

Getting componentWill.. warnings after updating to react 16.9 #696

Description

@bytewoopy

Current Behavior

image

Warning: componentWillUpdate has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.

  • Move data fetching code or side effects to componentDidUpdate.
  • Rename componentWillUpdate to UNSAFE_componentWillUpdate 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: ReactPlayer

app.js:114539 Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks 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: Player

Expected Behavior

No warnings.., was working in previous version of react before i updated.

Steps to Reproduce

  1. updated to latest version of react and try using the player

Environment

  • URL attempting to play:
  • Browser: Chrome
  • Operating system: Windows 10 Home

Other Information

"devDependencies": {
"@babel/plugin-proposal-class-properties": "^7.5.5",
"@babel/preset-react": "^7.0.0",
"axios": "^0.19.0",
"bootstrap": "^4.1.0",
"cross-env": "^5.1",
"jquery": "^3.2",
"laravel-mix": "^4.1.2",
"lodash": "^4.17.15",
"popper.js": "^1.12",
"react": "^16.9.0",
"react-dom": "^16.9.0",
"resolve-url-loader": "^2.3.2",
"sass": "^1.22.9",
"sass-loader": "^7.2.0"
}
"dependencies": {
"formik": "^1.5.8",
"grommet": "^2.7.6",
"grommet-icons": "^4.3.0",
"immutability-helper": "^3.0.0",
"js-cookie": "^2.2.1",
"polished": "^3.4.1",
"prop-types": "^15.7.2",
"react-cookie": "^4.0.1",
"react-player": "^1.11.2",
"react-router-dom": "^5.0.0",
"react-spinners": "^0.5.13",
"react-spring": "^9.0.0-beta.31",
"react-timeago": "^4.4.0",
"react-with-gesture": "^4.0.8",
"styled-components": "^4.3.2"
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions