Feature/upgrade react and tests

[vraja-pro]

Context

We’re moving to React 18. WP 6.2 onwards is using that already. So we are not developing and testing with the correct React version.
Moving to React 18 is not compatible with our tests. This removes Enzyme in favor of Testing Library: https://testing-library.com/

Summary

This PR can be summarized in the following changelog entry:

• Upgrades WP Element to version included in WP 6.2.
• Upgrades React and React DOM to v18.2.0 (as included in WP 6.2).
• Upgrades React Test Rendered to version compatible with React 18.2.0.
• Removes Enzyme in favour of using the Testing Library.
• Updates @wordpress/element to 5.3.2.
• Replaces enzyme with react testing library.
• Adapts 2 indexation components to work with react 18.2.0 state batching.
• Fixes react prop type warning in EditorModal.js.
• Migrate all enzyme tests to use react testing library.
• [@yoast/analysis-report 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/components 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/components 0.1.0] Removes enzyme.
• [@yoast/helpers 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/replacement-variable-editor 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/replacement-variable-editor 0.1.0] Migrates enzyme tests to use react testing library.
• [@yoast/replacement-variable-editor 0.1.0] Adds eslint configuration.
• [@yoast/replacement-variable-editor 0.1.0] Refactors deprecated react life cycle method.
• [@yoast/search-metadata-previews 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/search-metadata-previews 0.1.0] Migrates enzyme tests to use react testing library.
• [@yoast/search-metadata-previews 0.1.0] Adds eslint configuration.
• [@yoast/search-metadata-previews 0.1.0] Refactors deprecated react life cycle method.
• [@yoast/social-metadata-forms 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/social-metadata-forms 0.1.0] Removes enzyme.
• [@yoast/social-metadata-previews 1.0.0] Upgrades react to 18.2.0, Upgrade react test renderer.
• [@yoast/social-metadata-previews 0.1.0] Removes enzyme.
• [@yoast/ui-library 0.0.1] Adds missing snapshot for autocomplete test.

Relevant technical choices:

• Upgrade React to v18.2.0 because this is what we use in the plugin, through WP.
• Removes the always update snapshots in the packages/js test command. As the snapshots seem to be stable again without the snapshot serializer.
• Adjustments to @yoast/components:
  • Removed two tests since we are moving to ui library
  • Changed one test

Test instructions

Test instructions for the acceptance test before the PR gets merged

This PR can be acceptance tested by following these steps:

Testing all the JavaScript things is needed, due to the upgrade to React 18. It might have consequences we did not spot.

Google/social preview

• Edit a post
• Under google preview, edit a title with text and replacement variables.
• Edit also description and slug.
• Check no console error appear and the title is saved.

Indexation

• Have a site with a decent amount of content so the indexation actually has to loop a bit
• Reset the indexable tables (via the Yoast test helper)
• Go to Yoast SEO > Tools
• Run and verify the indexation still functions like before
• Reset the indexable tables (via the Yoast test helper)
• Go to Yoast SEO > General > First-time configuration (tab)
• Run and verify the indexation still functions like before

Editor modal

• Be sure to have the SCRIPT_DEBUG flag enabled in your wp-config file: define( 'SCRIPT_DEBUG', true ); (as well as WP_DEBUG)
• Edit a post in the block editor
• Verify the React warning is gone:

  • Warning: Failed prop type: Invalid prop suffixIcon of type boolean supplied to SidebarButton, expected object.

• The editor modals are in the sidebar, basically all those non-chevron icons:
  

Relevant test scenarios

• Changes should be tested with the browser console open
• Changes should be tested on different posts/pages/taxonomies/custom post types/custom taxonomies
• Changes should be tested on different editors (Block/Classic/Elementor/other)
• Changes should be tested on different browsers
• Changes should be tested on multisite

Test instructions for QA when the code is in the RC

• QA should use the same steps as above.

QA can test this PR by following these steps:

Impact check

This PR affects the following parts of the plugin, which may require extra testing:

• all the JS in our plugins

UI changes

• This PR changes the UI in the plugin. I have added the 'UI change' label to this PR.

Other environments

• This PR also affects Shopify. I have added a changelog entry starting with [shopify-seo], added test instructions for Shopify and attached the Shopify label to this PR.

Documentation

• I have written documentation for this change.

Quality assurance

• I have tested this code to the best of my abilities.
• During testing, I had activated all plugins that Yoast SEO provides integrations for.
• I have added unit tests to verify the code works as intended.
• If any part of the code is behind a feature flag, my test instructions also cover cases where the feature flag is switched off.
• I have written this PR in accordance with my team's definition of done.
• I have checked that the base branch is correctly set.

Innovation

• No innovation project is applicable for this PR.
• This PR falls under an innovation project. I have attached the innovation label.
• I have added my hours to the WBSO document.

Fixes #20593

[coveralls]

Pull Request Test Coverage Report for Build 7030192515

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 49.342%

---

Totals
Change from base Build 7019747577:	0.0%
Covered Lines:	15371
Relevant Lines:	31152

---

💛 - Coveralls