Update react 15.6.1

[sorenlouv]

React was recently upgraded to 15.6.1 for x-pack and this PR ensures the version in Kibana matches.
Closes #13610

Breaking changes between 15.4.2 and 15.6.1:

• Migrating away from React.PropTypes
• Moving React Test Utils
• Uncaught errors will unmount the whole React component tree

Changes made:

• Migrated from React.Proptypes (codemod)
• Upgraded Enzyme to 2.9.1 (to fix deprecation warnings when running Jest)
• Added react-test-renderer (needed for Enzyme)
• Upgraded react and react-dom to 15.6.1
• Upgraded react-color to 2.11.7

Plugins affected:

• Metrics
• Kibana (only this modal)

Further reading:

• React changelog
• React 15.5.0 blog post
• React 15.6.0 blog post

[weltenwort]

Awesome, almost there. There are just a few uses of React.PropTypes remaining in ui_framework/src/components, which produces deprecation warnings.

[sorenlouv]

@weltenwort Good catch. I only ran the codemod on the src folder, so missed the ui-framework files.

[epixa]

@sqren Can you add prop-types to the package.json? I'm not really sure how this is working at the moment, but I assume it just happens to be installed due to being a dependency of one of our dependencies.

[epixa]

Scratch that, I see it now. I must have typo'd my grep.

[epixa]

I'm still seeing 3 warnings about PropTypes usage in the jest tests:

 PASS  ui_framework/src/components/color_picker/color_picker.test.js
  ● Console

    console.warn node_modules/react/lib/lowPriorityWarning.js:40
      Warning: Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs

 PASS  ui_framework/src/components/popover/popover.test.js
 PASS  ui_framework/src/components/button/submit_button.test.js
 PASS  ui_framework/src/components/collapse_button/collapse_button.test.js
 PASS  ui_framework/src/components/tool_bar/tool_bar_search_box.test.js
 PASS  ui_framework/src/components/table/table.test.js
 PASS  ui_framework/src/components/accessibility/screen_reader.test.js
 PASS  src/core_plugins/kibana/public/dashboard/top_nav/clone_modal.test.js
  ● Console

    console.warn node_modules/react/lib/lowPriorityWarning.js:40
      Warning: Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs

 PASS  ui_framework/src/components/modal/confirm_modal.test.js (8.63s)
  ● Console

    console.warn node_modules/react/lib/lowPriorityWarning.js:40
      Warning: Accessing PropTypes via the main React package is deprecated, and will be removed in  React v16.0. Use the latest available v15.* prop-types package from npm instead. For info on usage, compatibility, migration and more, see https://fb.me/prop-types-docs

 PASS  ui_framework/src/components/button/button_icon/button_icon.test.js

Edit: node scripts/jest by the way

[sorenlouv]

I'm still seeing 3 warnings about PropTypes usage in the jest tests:

@epixa Yes, I'm not sure where those are coming from - I'm fairly certain it's not from the Kibana. Could be a dependency that we have to bump.

[weltenwort]

I couldn't find the source either, so I think a third-party dependency is the probable cause too.

[weltenwort]

I would be fine with tackling those warnings in a separate PR.

[cjcenizal]

I think these warning are coming from the enzyme dependency. Looked like they were addressed in 2.8.1 (enzymejs/enzyme#876, enzymejs/enzyme@75d1390).

[cjcenizal]

Oh wait, we upgraded enzyme in this PR... odd.

[cjcenizal]

LGTM! I think I've narrowed down the source of these warnings to be our react-color dependency, which we use in the KuiColorPicker component here: https://github.com/elastic/kibana/blob/master/ui_framework/src/components/color_picker/color_picker.js#L4.

Removing this line and updating this component to not depend upon it makes all of the warnings go away. Which is weird because I don't see the relationship between this component and the modals.

Bumping react-color to 2.11.7 should fix this: casesandberg/react-color#346.

[weltenwort]

wow, thanks for taking the time to dig into this, @cjcenizal

[sorenlouv]

@cjcenizal Great finding, thanks! I've bumped react-color and it now passes without warnings locally. If it passes CI I'll merge it in.

[sorenlouv]

jenkins test this

[weltenwort]

awesome, thanks again!