Upgrade to React@18 (#209337)

## Summary

This PR upgrades React packages to version 18, while keeping Kibana
running in Legacy mode (`ReactDOM.render`). This is the first phase of
the React@18 upgrade; the second phase will gradually migrate Kibana to
Concurrent mode (`createRoot`) (exact plan is tbd).

Upgrade is intended to be non-breaking and behave just like React@17,
but it still requires thorough testing from all teams that own UI to
discover any potential critical UI issues. The testing was done in
#203114.

Most of the breaking work was completed in previous PRs and this PR only
includes minor breaking jest tests tweaks / snapshots updates

### Backports:

- This won't be backported to 9.0 
- We will discuss if we should backport this to 8.x

### Risks 

Kibana’s UI functional tests coverage and significant manual testing
that was done by a lot of teams in
#203114 gives us a lot of
confidence.

However, since this was a large internal change for React they still
could be issues hidden in "remote" parts of UIs, think of blank screens,
error splash screens, unresponsive pages, new errors in the console,
unpredictable UI behavior (like laggy text inputs that skip letters when
typing fast).

---------

Co-authored-by: Elastic Machine <[email protected]>
Co-authored-by: Konrad Szwarc <[email protected]>

package.json

@@ -1224,10 +1224,10 @@
     "rbush": "^3.0.1",
     "re-resizable": "^6.9.9",
     "re2js": "0.4.3",
-    "react": "^17.0.2",
+    "react": "~18.2.0",
     "react-18": "npm:react@~18.2.0",
     "react-diff-view": "^3.2.1",
-    "react-dom": "^17.0.2",
+    "react-dom": "~18.2.0",
     "react-dom-18": "npm:react-dom@~18.2.0",
     "react-dropzone": "^11.7.1",
     "react-fast-compare": "^2.0.4",
@@ -1662,7 +1662,7 @@
     "@types/react-router": "^5.1.20",
     "@types/react-router-config": "^5.0.7",
     "@types/react-router-dom": "^5.3.3",
-    "@types/react-test-renderer": "^17.0.2",
+    "@types/react-test-renderer": "~18.0.0",
     "@types/react-virtualized": "^9.21.30",
     "@types/react-window": "^1.8.8",
     "@types/react-window-infinite-loader": "^1.0.9",
@@ -1832,7 +1832,7 @@
     "prettier": "^2.8.8",
     "proxy": "^2.1.1",
     "react-is": "~18.2.0",
-    "react-test-renderer": "^17.0.2",
+    "react-test-renderer": "~18.2.0",
     "recast": "^0.23.9",
     "regenerate": "^1.4.0",
     "resolve": "^1.22.0",

src/platform/packages/shared/kbn-test/src/jest/setup/react_testing_library.js

@@ -80,8 +80,5 @@ console.error = (...args) => {
  * Tracking issue to clean this up https://github.com/elastic/kibana/issues/199100
  */
 if (REACT_VERSION.startsWith('18.')) {
-  if (!process.env.CI) {
-    console.warn('Running with React@18 and muting the legacy ReactDOM.render warning');
-  }
   muteLegacyRootWarning();
 }

src/platform/packages/shared/shared-ux/error_boundary/src/ui/error_boundary.test.tsx

@@ -118,7 +118,7 @@ describe('<KibanaErrorBoundary>', () => {
     ).toBe(true);
     expect(
       mockDeps.analytics.reportEvent.mock.calls[0][1].error_stack.startsWith(
-        'Error: This is an error to show the test user!'
+        'FatalReactError: This is an error to show the test user!'
       )
     ).toBe(true);
   });

src/platform/packages/shared/shared-ux/error_boundary/src/ui/section_error_boundary.test.tsx

@@ -114,7 +114,7 @@ describe('<KibanaSectionErrorBoundary>', () => {
     ).toBe(true);
     expect(
       mockDeps.analytics.reportEvent.mock.calls[0][1].error_stack.startsWith(
-        'Error: This is an error to show the test user!'
+        'FatalReactError: This is an error to show the test user!'
       )
     ).toBe(true);
   });

x-pack/solutions/observability/plugins/apm/public/context/apm_plugin/mock_apm_plugin_context.tsx

@@ -209,6 +209,7 @@ export function MockApmPluginContextWrapper({
   }
 
   performance.mark = jest.fn();
+  performance.clearMeasures = jest.fn();
 
   const contextHistory = useHistory();
 

x-pack/solutions/observability/plugins/infra/public/pages/metrics/metrics_explorer/hooks/use_metric_explorer_state.test.tsx

@@ -88,6 +88,7 @@ describe('useMetricsExplorerState', () => {
       pathname,
     }));
     performance.mark = jest.fn();
+    performance.clearMeasures = jest.fn();
   });
 
   afterEach(() => {

yarn.lock

@@ -12487,12 +12487,12 @@
     "@types/history" "^4.7.11"
     "@types/react" "*"
 
-"@types/react-test-renderer@^17.0.2":
-  version "17.0.2"
-  resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-17.0.2.tgz#5f800a39b12ac8d2a2149e7e1885215bcf4edbbf"
-  integrity sha512-+F1KONQTBHDBBhbHuT2GNydeMpPuviduXIVJRB7Y4nma4NR5DrTJfMMZ+jbhEHbpwL+Uqhs1WXh4KHiyrtYTPg==
+"@types/react-test-renderer@~18.0.0":
+  version "18.0.7"
+  resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-18.0.7.tgz#2cfe657adb3688cdf543995eceb2e062b5a68728"
+  integrity sha512-1+ANPOWc6rB3IkSnElhjv6VLlKg2dSv/OWClUyZimbLsQyBn8Js9Vtdsi3UICJ2rIQ3k2la06dkB+C92QfhKmg==
   dependencies:
-    "@types/react" "^17"
+    "@types/react" "*"
 
 "@types/react-transition-group@^4.4.0":
   version "4.4.5"
@@ -12524,7 +12524,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@16 || 17 || 18", "@types/react@^17", "@types/react@~18.2.0":
+"@types/react@*", "@types/react@16 || 17 || 18", "@types/react@~18.2.0":
   version "18.2.79"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.79.tgz#c40efb4f255711f554d47b449f796d1c7756d865"
   integrity sha512-RwGAGXPl9kSXwdNTafkOEuFrTBD5SA2B3iEB96xi8+xu5ddUa/cpvyVCSNn+asgLCTHkb5ZxN8gbuibYJi4s1w==
@@ -27963,7 +27963,7 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/re2js/-/re2js-0.4.3.tgz#1318cd0c12aa6ed3ba56d5e012311ffbfb2aef35"
   integrity sha512-EuNmh7jurhHEE8Ge/lBo9JuMLb3qf866Xjjfyovw3wPc7+hlqDkZq4LwhrCQMEI+ARWfrKrHozEndzlpNT0WDg==
 
-"react-18@npm:react@~18.2.0":
+"react-18@npm:react@~18.2.0", react@~18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"
   integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==
@@ -28013,7 +28013,7 @@ react-docgen@^5.0.0:
     node-dir "^0.1.10"
     strip-indent "^3.0.0"
 
-"react-dom-18@npm:react-dom@~18.2.0":
+"react-dom-18@npm:react-dom@~18.2.0", react-dom@~18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d"
   integrity sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==
@@ -28028,15 +28028,6 @@ react-docgen@^5.0.0:
   dependencies:
     scheduler "^0.25.0"
 
-react-dom@^17.0.2:
-  version "17.0.2"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
-  integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    scheduler "^0.20.2"
-
 react-dropzone@^11.7.1:
   version "11.7.1"
   resolved "https://registry.yarnpkg.com/react-dropzone/-/react-dropzone-11.7.1.tgz#3851bb75b26af0bf1b17ce1449fd980e643b9356"
@@ -28158,7 +28149,7 @@ react-is@^16.12.0, react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
 
-"react-is@^16.12.0 || ^17.0.0 || ^18.0.0", react-is@^18.0.0:
+"react-is@^16.12.0 || ^17.0.0 || ^18.0.0", react-is@^18.0.0, react-is@^18.2.0:
   version "18.3.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.3.1.tgz#e83557dc12eae63a99e003a46388b1dcbb44db7e"
   integrity sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==
@@ -28350,7 +28341,7 @@ react-select@^5.0.0:
     prop-types "^15.6.0"
     react-transition-group "^4.3.0"
 
-react-shallow-renderer@^16.13.1:
+react-shallow-renderer@^16.13.1, react-shallow-renderer@^16.15.0:
   version "16.15.0"
   resolved "https://registry.yarnpkg.com/react-shallow-renderer/-/react-shallow-renderer-16.15.0.tgz#48fb2cf9b23d23cde96708fe5273a7d3446f4457"
   integrity sha512-oScf2FqQ9LFVQgA73vr86xl2NaOIX73rh+YFqcOp68CWj56tSfgtGKrEbyhCj0rSijyG9M1CYprTh39fBi5hzA==
@@ -28397,7 +28388,7 @@ react-tabs@^6.0.2:
     clsx "^2.0.0"
     prop-types "^15.5.0"
 
-"react-test-renderer@^16.8.0 || ^17.0.0", react-test-renderer@^17.0.0, react-test-renderer@^17.0.2:
+"react-test-renderer@^16.8.0 || ^17.0.0", react-test-renderer@^17.0.0:
   version "17.0.2"
   resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-17.0.2.tgz#4cd4ae5ef1ad5670fc0ef776e8cc7e1231d9866c"
   integrity sha512-yaQ9cB89c17PUb0x6UfWRs7kQCorVdHlutU1boVPEsB8IDZH6n9tHxMacc3y0JoXOJUsZb/t/Mb8FUWMKaM7iQ==
@@ -28407,6 +28398,15 @@ react-tabs@^6.0.2:
     react-shallow-renderer "^16.13.1"
     scheduler "^0.20.2"
 
+react-test-renderer@~18.2.0:
+  version "18.2.0"
+  resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-18.2.0.tgz#1dd912bd908ff26da5b9fca4fd1c489b9523d37e"
+  integrity sha512-JWD+aQ0lh2gvh4NM3bBM42Kx+XybOxCpgYK7F8ugAlpaTSnWsX+39Z4XkOykGZAHrjwwTZT3x3KxswVWxHPUqA==
+  dependencies:
+    react-is "^18.2.0"
+    react-shallow-renderer "^16.15.0"
+    scheduler "^0.23.0"
+
 react-transition-group@^4.3.0:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.1.tgz#63868f9325a38ea5ee9535d828327f85773345c9"
@@ -28477,14 +28477,6 @@ react-window@^1.8.10:
   resolved "https://registry.yarnpkg.com/react/-/react-19.0.0.tgz#6e1969251b9f108870aa4bff37a0ce9ddfaaabdd"
   integrity sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==
 
-react@^17.0.2:
-  version "17.0.2"
-  resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
-  integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-
 read-installed@~4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/read-installed/-/read-installed-4.0.3.tgz#ff9b8b67f187d1e4c29b9feb31f6b223acd19067"