packages,plugins: avoid usage of react-dom in tests

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx

@@ -15,8 +15,7 @@
  */
 
 import React from 'react';
-import { fireEvent } from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
+import { act, fireEvent } from '@testing-library/react';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import { CopyTextButton } from './CopyTextButton';
 import { errorApiRef } from '@backstage/core-plugin-api';

packages/core-components/src/components/Progress/Progress.test.tsx

@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
-import { act } from 'react-dom/test-utils';
+import { act } from '@testing-library/react';
 
 import { Progress } from './Progress';
 

packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx

@@ -14,9 +14,8 @@
  * limitations under the License.
  */
 import { renderInTestApp } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { RoutedTabs } from './RoutedTabs';
 

packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx

@@ -14,9 +14,8 @@
  * limitations under the License.
  */
 import { renderInTestApp, withLogCollector } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { TabbedLayout } from './TabbedLayout';
 

packages/test-utils/src/testUtils/testingLibrary.ts

@@ -15,8 +15,7 @@
  */
 
 import { ReactElement } from 'react';
-import { act } from 'react-dom/test-utils';
-import { render, RenderResult } from '@testing-library/react';
+import { act, render, RenderResult } from '@testing-library/react';
 
 /**
  * @public

plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx

@@ -31,9 +31,8 @@ import {
   renderInTestApp,
   TestApiRegistry,
 } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { EntityLayout } from './EntityLayout';
 

plugins/catalog/src/components/EntityPageLayout/Tabbed/Tabbed.test.tsx

@@ -16,8 +16,7 @@
 import React from 'react';
 import { Tabbed } from './Tabbed';
 import { renderInTestApp } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
+import { act, fireEvent } from '@testing-library/react';
 import { Routes, Route } from 'react-router';
 
 describe('Tabbed layout', () => {

plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx

@@ -18,7 +18,7 @@ import React from 'react';
 import { GraphiQLPage } from './GraphiQLPage';
 import { ThemeProvider } from '@material-ui/core';
 import { lightTheme } from '@backstage/theme';
-import { act } from 'react-dom/test-utils';
+import { act } from '@testing-library/react';
 import { renderWithEffects, TestApiProvider } from '@backstage/test-utils';
 import { GraphQLBrowseApi, graphQlBrowseApiRef } from '../../lib/api';
 import { configApiRef } from '@backstage/core-plugin-api';

plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx

@@ -20,9 +20,8 @@ import {
 } from '@backstage/test-utils';
 import { lightTheme } from '@backstage/theme';
 import { ThemeProvider } from '@material-ui/core';
-import { fireEvent, within } from '@testing-library/react';
+import { act, fireEvent, within } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { MemoryRouter, Route } from 'react-router';
 import { ScaffolderApi, scaffolderApiRef } from '../../api';
 import { rootRouteRef } from '../../routes';

plugins/search/src/components/util.test.tsx

@@ -16,11 +16,10 @@
 
 import React from 'react';
 import { wrapInTestApp } from '@backstage/test-utils';
-import { render } from '@testing-library/react';
+import { act, render } from '@testing-library/react';
 import { useNavigateToQuery } from './util';
 import { Routes, Route } from 'react-router-dom';
 import { rootRouteRef } from '../plugin';
-import { act } from 'react-dom/test-utils';
 
 const navigate = jest.fn();
 jest.mock('react-router-dom', () => ({

plugins/tech-radar/src/components/RadarComponent.test.tsx

@@ -15,10 +15,9 @@
  */
 
 import React from 'react';
-import { render, waitForElement } from '@testing-library/react';
+import { act, render, waitForElement } from '@testing-library/react';
 import { ThemeProvider } from '@material-ui/core';
 import { lightTheme } from '@backstage/theme';
-import { act } from 'react-dom/test-utils';
 import { TestApiProvider, withLogCollector } from '@backstage/test-utils';
 
 import GetBBoxPolyfill from '../utils/polyfills/getBBox';

plugins/tech-radar/src/components/RadarPage.test.tsx

@@ -22,9 +22,8 @@ import {
 } from '@backstage/test-utils';
 import { lightTheme } from '@backstage/theme';
 import { ThemeProvider } from '@material-ui/core';
-import { render, waitForElement } from '@testing-library/react';
+import { act, render, waitForElement } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import GetBBoxPolyfill from '../utils/polyfills/getBBox';
 import { RadarPage } from './RadarPage';
 import { TechRadarLoaderResponse, techRadarApiRef, TechRadarApi } from '../api';