diff --git a/.changeset/healthy-shirts-fold.md b/.changeset/healthy-shirts-fold.md new file mode 100644 index 0000000000..f2ac0a9e83 --- /dev/null +++ b/.changeset/healthy-shirts-fold.md @@ -0,0 +1,6 @@ +--- +'@backstage/plugin-catalog': patch +'@backstage/plugin-techdocs': patch +--- + +The `spec.lifecycle' field in entities will now always be rendered as a string. diff --git a/.changeset/lazy-hotels-wait.md b/.changeset/lazy-hotels-wait.md new file mode 100644 index 0000000000..85879880f5 --- /dev/null +++ b/.changeset/lazy-hotels-wait.md @@ -0,0 +1,109 @@ +--- +'@backstage/plugin-analytics-module-newrelic-browser': patch +'@backstage/plugin-api-docs-module-protoc-gen-doc': patch +'@backstage/plugin-techdocs-module-addons-contrib': patch +'@backstage/plugin-cicd-statistics-module-gitlab': patch +'@backstage/plugin-catalog-unprocessed-entities': patch +'@backstage/plugin-github-pull-requests-board': patch +'@backstage/plugin-techdocs-addons-test-utils': patch +'@backstage/frontend-plugin-api': patch +'@backstage/plugin-analytics-module-ga4': patch +'@backstage/plugin-analytics-module-ga': patch +'@backstage/plugin-git-release-manager': patch +'@backstage/integration-react': patch +'@backstage/plugin-github-deployments': patch +'@backstage/plugin-kubernetes-cluster': patch +'@backstage/plugin-microsoft-calendar': patch +'@backstage/plugin-newrelic-dashboard': patch +'@backstage/frontend-app-api': patch +'@backstage/plugin-entity-validation': patch +'@backstage/core-components': patch +'@backstage/core-plugin-api': patch +'@backstage/plugin-kubernetes-react': patch +'@backstage/plugin-permission-react': patch +'@backstage/plugin-scaffolder-react': patch +'@backstage/version-bridge': patch +'@backstage/plugin-apollo-explorer': patch +'@backstage/plugin-catalog-graphql': patch +'@backstage/plugin-cicd-statistics': patch +'@backstage/plugin-entity-feedback': patch +'@backstage/plugin-gitops-profiles': patch +'@backstage/plugin-graphql-voyager': patch +'@backstage/plugin-sonarqube-react': patch +'@backstage/plugin-apache-airflow': patch +'@backstage/plugin-catalog-import': patch +'@backstage/plugin-github-actions': patch +'@backstage/plugin-octopus-deploy': patch +'@backstage/plugin-splunk-on-call': patch +'@backstage/plugin-stack-overflow': patch +'@backstage/plugin-techdocs-react': patch +'@backstage/app-defaults': patch +'@backstage/core-app-api': patch +'@backstage/plugin-catalog-graph': patch +'@backstage/plugin-catalog-react': patch +'@backstage/plugin-code-coverage': patch +'@backstage/plugin-config-schema': patch +'@backstage/plugin-cost-insights': patch +'@backstage/plugin-explore-react': patch +'@backstage/plugin-github-issues': patch +'@backstage/plugin-tech-insights': patch +'@backstage/plugin-user-settings': patch +'@backstage/plugin-azure-devops': patch +'@backstage/plugin-code-climate': patch +'@backstage/plugin-gcp-projects': patch +'@backstage/plugin-search-react': patch +'@backstage/create-app': patch +'@backstage/test-utils': patch +'@backstage/plugin-azure-sites': patch +'@backstage/plugin-firehydrant': patch +'@backstage/plugin-cloudbuild': patch +'@backstage/plugin-home-react': patch +'@backstage/plugin-kubernetes': patch +'@backstage/plugin-lighthouse': patch +'@backstage/plugin-scaffolder': patch +'@backstage/plugin-stackstorm': patch +'@backstage/plugin-tech-radar': patch +'@backstage/plugin-codescene': patch +'@backstage/plugin-dynatrace': patch +'@backstage/plugin-gcalendar': patch +'@backstage/plugin-org-react': patch +'@backstage/plugin-pagerduty': patch +'@backstage/plugin-shortcuts': patch +'@backstage/plugin-sonarqube': patch +'@backstage/plugin-xcmetrics': patch +'@backstage/plugin-airbrake': patch +'@backstage/plugin-api-docs': patch +'@backstage/plugin-circleci': patch +'@backstage/plugin-devtools': patch +'@backstage/plugin-graphiql': patch +'@backstage/plugin-linguist': patch +'@backstage/plugin-newrelic': patch +'@backstage/plugin-opencost': patch +'@backstage/plugin-periskop': patch +'@backstage/plugin-playlist': patch +'@backstage/plugin-puppetdb': patch +'@backstage/plugin-techdocs': patch +'@backstage/plugin-bitrise': patch +'@backstage/plugin-catalog': patch +'@backstage/plugin-explore': patch +'@backstage/plugin-jenkins': patch +'@backstage/plugin-rollbar': patch +'@backstage/theme': patch +'@backstage/plugin-allure': patch +'@backstage/plugin-badges': patch +'@backstage/plugin-bazaar': patch +'@backstage/plugin-search': patch +'@backstage/plugin-sentry': patch +'@backstage/plugin-fossa': patch +'@backstage/plugin-ilert': patch +'@backstage/plugin-kafka': patch +'@backstage/plugin-nomad': patch +'@backstage/plugin-vault': patch +'@backstage/plugin-gocd': patch +'@backstage/plugin-home': patch +'@backstage/plugin-todo': patch +'@backstage/plugin-adr': patch +'@backstage/plugin-org': patch +--- + +Add official support for React 18. diff --git a/.changeset/popular-bikes-do.md b/.changeset/popular-bikes-do.md new file mode 100644 index 0000000000..b1cc5c2cdd --- /dev/null +++ b/.changeset/popular-bikes-do.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-code-coverage': patch +--- + +The warning for missing code coverage will now render the entity as a reference. diff --git a/.changeset/pretty-swans-worry.md b/.changeset/pretty-swans-worry.md new file mode 100644 index 0000000000..621ae98fe5 --- /dev/null +++ b/.changeset/pretty-swans-worry.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Fixed the type declaration of `DependencyGraphProps`, the `defs` prop now expects `JSX.Element`s. diff --git a/.changeset/shaggy-beers-collect.md b/.changeset/shaggy-beers-collect.md new file mode 100644 index 0000000000..471368d6f2 --- /dev/null +++ b/.changeset/shaggy-beers-collect.md @@ -0,0 +1,6 @@ +--- +'@backstage/dev-utils': patch +'@backstage/plugin-techdocs': patch +--- + +Added support for React 18. The new `createRoot` API from `react-dom/client` will now be used if present. diff --git a/.changeset/sweet-buckets-fry.md b/.changeset/sweet-buckets-fry.md new file mode 100644 index 0000000000..8f17617645 --- /dev/null +++ b/.changeset/sweet-buckets-fry.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +The `spec.type` field in entities will now always be rendered as a string. diff --git a/.changeset/thick-dolphins-boil.md b/.changeset/thick-dolphins-boil.md new file mode 100644 index 0000000000..dd562e620c --- /dev/null +++ b/.changeset/thick-dolphins-boil.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-import': patch +--- + +The `app.title` configuration is now properly required to be a string. diff --git a/.changeset/wet-cows-brake.md b/.changeset/wet-cows-brake.md new file mode 100644 index 0000000000..9e694d8452 --- /dev/null +++ b/.changeset/wet-cows-brake.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-search-react': patch +--- + +The filter options passed to `SearchResultGroupLayout` are now always explicitly rendered as strings by default. diff --git a/.changeset/wild-geese-occur.md b/.changeset/wild-geese-occur.md new file mode 100644 index 0000000000..b97620e7f5 --- /dev/null +++ b/.changeset/wild-geese-occur.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-search': patch +--- + +Minor internal code cleanup. diff --git a/.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch b/.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch new file mode 100644 index 0000000000..1e3c82e9dd --- /dev/null +++ b/.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch @@ -0,0 +1,112 @@ +diff --git a/DateTimePicker/DateTimePickerTabs.d.ts b/DateTimePicker/DateTimePickerTabs.d.ts +index 52396cccbb66861dd6519459141e7744aa25aaf8..75c5a9053a88abf2454b7783c0101a1a8c9375f1 100644 +--- a/DateTimePicker/DateTimePickerTabs.d.ts ++++ b/DateTimePicker/DateTimePickerTabs.d.ts +@@ -7,5 +7,5 @@ export interface DateTimePickerTabsProps { + timeIcon?: React.ReactNode; + } + export declare const useStyles: (props?: any) => Record<"tabs", string>; +-export declare const DateTimePickerTabs: React.SFC; ++export declare const DateTimePickerTabs: React.FC; + export default DateTimePickerTabs; +diff --git a/_shared/ModalDialog.d.ts b/_shared/ModalDialog.d.ts +index 067070067ccf6e7699d17f422934daf14370d225..c45a583adef09a2091865db91b2687e66af81b47 100644 +--- a/_shared/ModalDialog.d.ts ++++ b/_shared/ModalDialog.d.ts +@@ -15,7 +15,7 @@ export interface ModalDialogProps extends DialogProps { + showTabs?: boolean; + wider?: boolean; + } +-export declare const ModalDialog: React.SFC>; ++export declare const ModalDialog: React.FC>; + export declare const styles: Record<"dialog" | "dialogRoot" | "dialogRootWider" | "withAdditionalAction", import("@material-ui/core/styles/withStyles").CSSProperties | import("@material-ui/core/styles/withStyles").CreateCSSProperties<{}> | ((props: {}) => import("@material-ui/core/styles/withStyles").CreateCSSProperties<{}>)>; + declare const _default: React.ComponentType; +diff --git a/_shared/PickerToolbar.d.ts b/_shared/PickerToolbar.d.ts +index f1ccd368bf9ab853cf0356d03fce0390becad8cd..e75ef734788cb26cc07dc079c714f759f525c447 100644 +--- a/_shared/PickerToolbar.d.ts ++++ b/_shared/PickerToolbar.d.ts +@@ -5,5 +5,5 @@ export declare const useStyles: (props?: any) => Record<"toolbar" | "toolbarLand + interface PickerToolbarProps extends ExtendMui { + isLandscape: boolean; + } +-declare const PickerToolbar: React.SFC; ++declare const PickerToolbar: React.FC; + export default PickerToolbar; +diff --git a/_shared/WithUtils.d.ts b/_shared/WithUtils.d.ts +index 22fe0425817be182a6c9a1a21a0f9eefb61696e7..b5b2a966ec0ea8427c4355227d8425b9c1af3790 100644 +--- a/_shared/WithUtils.d.ts ++++ b/_shared/WithUtils.d.ts +@@ -4,4 +4,4 @@ import { MaterialUiPickersDate } from '../typings/date'; + export interface WithUtilsProps { + utils: IUtils; + } +-export declare const withUtils: () =>

(Component: React.ComponentType

) => React.SFC>>; ++export declare const withUtils: () =>

(Component: React.ComponentType

) => React.FC>>; +diff --git a/_shared/icons/ArrowLeftIcon.d.ts b/_shared/icons/ArrowLeftIcon.d.ts +index ce0f208a2aa6dae03a77dfe830a10a95c2085030..95a516da22e02b9a4167ee4a52bf2cd0a1b4aec6 100644 +--- a/_shared/icons/ArrowLeftIcon.d.ts ++++ b/_shared/icons/ArrowLeftIcon.d.ts +@@ -1,3 +1,3 @@ + import React from 'react'; + import { SvgIconProps } from '@material-ui/core/SvgIcon'; +-export declare const ArrowLeftIcon: React.SFC; ++export declare const ArrowLeftIcon: React.FC; +diff --git a/_shared/icons/ArrowRightIcon.d.ts b/_shared/icons/ArrowRightIcon.d.ts +index 71443a34f7bbd2cef8c2af487c817b7ea788dd7a..a96314aa8750180773f1d006ed766e5a7e8e071d 100644 +--- a/_shared/icons/ArrowRightIcon.d.ts ++++ b/_shared/icons/ArrowRightIcon.d.ts +@@ -1,3 +1,3 @@ + import React from 'react'; + import { SvgIconProps } from '@material-ui/core/SvgIcon'; +-export declare const ArrowRightIcon: React.SFC; ++export declare const ArrowRightIcon: React.FC; +diff --git a/_shared/icons/DateRangeIcon.d.ts b/_shared/icons/DateRangeIcon.d.ts +index 722f8736d86f248d464c5af855795663d9e220d3..6018043d41861d96335f060ea1dc78336892ce66 100644 +--- a/_shared/icons/DateRangeIcon.d.ts ++++ b/_shared/icons/DateRangeIcon.d.ts +@@ -1,3 +1,3 @@ + import React from 'react'; + import { SvgIconProps } from '@material-ui/core/SvgIcon'; +-export declare const DateRangeIcon: React.SFC; ++export declare const DateRangeIcon: React.FC; +diff --git a/_shared/icons/KeyboardIcon.d.ts b/_shared/icons/KeyboardIcon.d.ts +index c1a0a111d831acc58cf19aa6d54f8324e68de9d8..8d7d1dac47815cef02215c4f11f36e73509b4219 100644 +--- a/_shared/icons/KeyboardIcon.d.ts ++++ b/_shared/icons/KeyboardIcon.d.ts +@@ -1,3 +1,3 @@ + import React from 'react'; + import { SvgIconProps } from '@material-ui/core/SvgIcon'; +-export declare const KeyboardIcon: React.SFC; ++export declare const KeyboardIcon: React.FC; +diff --git a/_shared/icons/TimeIcon.d.ts b/_shared/icons/TimeIcon.d.ts +index 49e0b627132f7d31d1b0a205548229a9f7a2c0a6..15ebc6e630992edb3b01790c0dd651651adf51de 100644 +--- a/_shared/icons/TimeIcon.d.ts ++++ b/_shared/icons/TimeIcon.d.ts +@@ -1,3 +1,3 @@ + import React from 'react'; + import { SvgIconProps } from '@material-ui/core/SvgIcon'; +-export declare const TimeIcon: React.SFC; ++export declare const TimeIcon: React.FC; +diff --git a/views/Calendar/CalendarHeader.d.ts b/views/Calendar/CalendarHeader.d.ts +index 842cbd8e021eb6d8e6553ba68033f13140485b61..7f60b4bffce1a96ade02e2671fd705c8fe87dfa2 100644 +--- a/views/Calendar/CalendarHeader.d.ts ++++ b/views/Calendar/CalendarHeader.d.ts +@@ -15,5 +15,5 @@ export interface CalendarHeaderProps { + onMonthChange: (date: MaterialUiPickersDate, direction: SlideDirection) => void | Promise; + } + export declare const useStyles: (props?: any) => Record<"transitionContainer" | "switchHeader" | "iconButton" | "daysHeader" | "dayLabel", string>; +-export declare const CalendarHeader: React.SFC; ++export declare const CalendarHeader: React.FC; + export default CalendarHeader; +diff --git a/views/Calendar/SlideTransition.d.ts b/views/Calendar/SlideTransition.d.ts +index f00e98a72bd0e6cfd80ab45b33b905e802b60e9b..699119009fa5ea886e7f782425aee39b7608b8c2 100644 +--- a/views/Calendar/SlideTransition.d.ts ++++ b/views/Calendar/SlideTransition.d.ts +@@ -7,5 +7,5 @@ interface SlideTransitionProps { + children: React.ReactChild; + } + export declare const useStyles: (props?: any) => Record<"transitionContainer" | "slideEnter-left" | "slideEnter-right" | "slideEnterActive" | "slideExit" | "slideExitActiveLeft-left" | "slideExitActiveLeft-right", string>; +-declare const SlideTransition: React.SFC; ++declare const SlideTransition: React.FC; + export default SlideTransition; diff --git a/package.json b/package.json index 80b3d4a374..6a21034cae 100644 --- a/package.json +++ b/package.json @@ -47,10 +47,12 @@ ] }, "resolutions": { - "@types/react": "^17", - "@types/react-dom": "^17", + "@types/react": "^18", + "@types/react-dom": "^18", "jest-haste-map@^29.4.3": "patch:jest-haste-map@npm%3A29.4.3#./.yarn/patches/jest-haste-map-npm-29.4.3-19b03fcef3.patch", - "mock-fs@^5.2.0": "patch:mock-fs@npm%3A5.2.0#./.yarn/patches/mock-fs-npm-5.2.0-5103a7b507.patch" + "mock-fs@^5.2.0": "patch:mock-fs@npm%3A5.2.0#./.yarn/patches/mock-fs-npm-5.2.0-5103a7b507.patch", + "@material-ui/pickers@^3.3.10": "patch:@material-ui/pickers@npm%3A3.3.11#./.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch", + "@material-ui/pickers@^3.2.10": "patch:@material-ui/pickers@npm%3A3.3.11#./.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch" }, "version": "1.19.0", "dependencies": { diff --git a/packages/app-defaults/package.json b/packages/app-defaults/package.json index 40507f0bb9..9ab12f7cc5 100644 --- a/packages/app-defaults/package.json +++ b/packages/app-defaults/package.json @@ -42,15 +42,15 @@ "@material-ui/icons": "^4.9.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { "@backstage/cli": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0" }, "files": [ diff --git a/packages/app-next-example-plugin/package.json b/packages/app-next-example-plugin/package.json index 73666a569d..865c6e0800 100644 --- a/packages/app-next-example-plugin/package.json +++ b/packages/app-next-example-plugin/package.json @@ -39,8 +39,8 @@ "@material-ui/icons": "^4.9.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/packages/app-next/package.json b/packages/app-next/package.json index 0b0dcd7429..635a513c0f 100644 --- a/packages/app-next/package.json +++ b/packages/app-next/package.json @@ -89,8 +89,8 @@ "app-next-example-plugin": "workspace:^", "history": "^5.0.0", "lodash": "^4.17.21", - "react": "^17.0.2", - "react-dom": "^17.0.2", + "react": "^18.0.2", + "react-dom": "^18.0.2", "react-router": "^6.3.0", "react-router-dom": "^6.3.0", "react-use": "^17.2.4", @@ -100,7 +100,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/jquery": "^3.3.34", "@types/react": "*", diff --git a/packages/app-next/src/index.tsx b/packages/app-next/src/index.tsx index 3c354b06d0..37a2574484 100644 --- a/packages/app-next/src/index.tsx +++ b/packages/app-next/src/index.tsx @@ -15,7 +15,7 @@ */ import '@backstage/cli/asset-types'; -import ReactDOM from 'react-dom'; +import ReactDOM from 'react-dom/client'; import app from './App'; -ReactDOM.render(app, document.getElementById('root')); +ReactDOM.createRoot(document.getElementById('root')!).render(app); diff --git a/packages/app/package.json b/packages/app/package.json index 59aa16734e..df48491481 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -94,8 +94,8 @@ "@roadiehq/backstage-plugin-github-pull-requests": "^2.2.7", "@roadiehq/backstage-plugin-travis-ci": "^2.0.5", "history": "^5.0.0", - "react": "^17.0.2", - "react-dom": "^17.0.2", + "react": "^18.0.2", + "react-dom": "^18.0.2", "react-router": "^6.3.0", "react-router-dom": "^6.3.0", "react-use": "^17.2.4", @@ -106,7 +106,7 @@ "@playwright/test": "^1.32.3", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/jquery": "^3.3.34", "@types/react": "*", diff --git a/packages/app/src/index.tsx b/packages/app/src/index.tsx index b15bc4c102..e5ca03fe64 100644 --- a/packages/app/src/index.tsx +++ b/packages/app/src/index.tsx @@ -16,7 +16,7 @@ import '@backstage/cli/asset-types'; import React from 'react'; -import ReactDOM from 'react-dom'; +import ReactDOM from 'react-dom/client'; import App from './App'; -ReactDOM.render(, document.getElementById('root')); +ReactDOM.createRoot(document.getElementById('root')!).render(); diff --git a/packages/core-app-api/package.json b/packages/core-app-api/package.json index 3ae162315f..e6792a3402 100644 --- a/packages/core-app-api/package.json +++ b/packages/core-app-api/package.json @@ -57,8 +57,8 @@ "zod": "^3.21.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -66,7 +66,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/react-hooks": "^8.0.0", "@testing-library/user-event": "^14.0.0", "@types/zen-observable": "^0.8.0", diff --git a/packages/core-app-api/src/apis/system/ApiProvider.test.tsx b/packages/core-app-api/src/apis/system/ApiProvider.test.tsx index a6118f0f68..6460e12900 100644 --- a/packages/core-app-api/src/apis/system/ApiProvider.test.tsx +++ b/packages/core-app-api/src/apis/system/ApiProvider.test.tsx @@ -118,6 +118,10 @@ describe('ApiProvider', () => { }).toThrow(/^API context is not available/); }).error, ).toEqual([ + expect.objectContaining({ + detail: new Error('API context is not available'), + type: 'unhandled exception', + }), expect.objectContaining({ detail: new Error('API context is not available'), type: 'unhandled exception', @@ -134,6 +138,10 @@ describe('ApiProvider', () => { }).toThrow(/^API context is not available/); }).error, ).toEqual([ + expect.objectContaining({ + detail: new Error('API context is not available'), + type: 'unhandled exception', + }), expect.objectContaining({ detail: new Error('API context is not available'), type: 'unhandled exception', @@ -156,6 +164,10 @@ describe('ApiProvider', () => { }).toThrow('No implementation available for apiRef{x}'); }).error, ).toEqual([ + expect.objectContaining({ + detail: new Error('No implementation available for apiRef{x}'), + type: 'unhandled exception', + }), expect.objectContaining({ detail: new Error('No implementation available for apiRef{x}'), type: 'unhandled exception', @@ -176,6 +188,10 @@ describe('ApiProvider', () => { }).toThrow('No implementation available for apiRef{x}'); }).error, ).toEqual([ + expect.objectContaining({ + detail: new Error('No implementation available for apiRef{x}'), + type: 'unhandled exception', + }), expect.objectContaining({ detail: new Error('No implementation available for apiRef{x}'), type: 'unhandled exception', diff --git a/packages/core-app-api/src/app/AppContext.test.tsx b/packages/core-app-api/src/app/AppContext.test.tsx index ee7b90533f..a011b5966b 100644 --- a/packages/core-app-api/src/app/AppContext.test.tsx +++ b/packages/core-app-api/src/app/AppContext.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useVersionedContext } from '@backstage/version-bridge'; import { AppContext as AppContextV1 } from './types'; import { AppContextProvider } from './AppContext'; diff --git a/packages/core-app-api/src/app/AppManager.test.tsx b/packages/core-app-api/src/app/AppManager.test.tsx index 3d0c47c4d5..fe8d2fa91a 100644 --- a/packages/core-app-api/src/app/AppManager.test.tsx +++ b/packages/core-app-api/src/app/AppManager.test.tsx @@ -639,26 +639,24 @@ describe('Integration Test', () => { const Provider = app.getProvider(); const Router = app.getRouter(); const { error: errorLogs } = withLogCollector(() => { - expect(() => - render( - - - - }> - } /> - - - - , - ), - ).toThrow( - 'Parameter :thing is duplicated in path test/:thing/some/:thing', + render( + + + + }> + } /> + + + + , ); }); expect(errorLogs).toEqual([ - expect.stringContaining( - 'The above error occurred in the component', - ), + expect.objectContaining({ + message: expect.stringContaining( + 'Parameter :thing is duplicated in path test/:thing/some/:thing', + ), + }), ]); }); @@ -676,24 +674,22 @@ describe('Integration Test', () => { const Provider = app.getProvider(); const Router = app.getRouter(); const { error: errorLogs } = withLogCollector(() => { - expect(() => - render( - - - - } /> - - - , - ), - ).toThrow( - /^External route 'extRouteRef1' of the 'blob' plugin must be bound to a target route/, + render( + + + + } /> + + + , ); }); expect(errorLogs).toEqual([ - expect.stringContaining( - 'The above error occurred in the component', - ), + expect.objectContaining({ + message: expect.stringMatching( + /^External route 'extRouteRef1' of the 'blob' plugin must be bound to a target route/, + ), + }), ]); }); diff --git a/packages/core-app-api/src/routing/FlatRoutes.beta.test.tsx b/packages/core-app-api/src/routing/FlatRoutes.beta.test.tsx index 30be04d2d4..8d4d10c52a 100644 --- a/packages/core-app-api/src/routing/FlatRoutes.beta.test.tsx +++ b/packages/core-app-api/src/routing/FlatRoutes.beta.test.tsx @@ -56,7 +56,7 @@ function makeRouteRenderer(node: ReactNode) { ); if (rendered) { rendered.unmount(); - rendered.rerender(content); + rendered = render(content); } else { rendered = render(content); } diff --git a/packages/core-app-api/src/routing/FlatRoutes.compat.test.tsx b/packages/core-app-api/src/routing/FlatRoutes.compat.test.tsx index 5d2ca15672..c32b306387 100644 --- a/packages/core-app-api/src/routing/FlatRoutes.compat.test.tsx +++ b/packages/core-app-api/src/routing/FlatRoutes.compat.test.tsx @@ -83,7 +83,7 @@ describe.each(['beta', 'stable'])('FlatRoutes %s', rrVersion => { ); if (rendered) { rendered.unmount(); - rendered.rerender(content); + rendered = render(content); } else { rendered = render(content); } diff --git a/packages/core-app-api/src/routing/FlatRoutes.stable.test.tsx b/packages/core-app-api/src/routing/FlatRoutes.stable.test.tsx index 93297edc4c..ece6c22ff2 100644 --- a/packages/core-app-api/src/routing/FlatRoutes.stable.test.tsx +++ b/packages/core-app-api/src/routing/FlatRoutes.stable.test.tsx @@ -56,7 +56,7 @@ function makeRouteRenderer(node: ReactNode) { ); if (rendered) { rendered.unmount(); - rendered.rerender(content); + rendered = render(content); } else { rendered = render(content); } diff --git a/packages/core-app-api/src/routing/RoutingProvider.beta.test.tsx b/packages/core-app-api/src/routing/RoutingProvider.beta.test.tsx index 0f7a5cd3ad..ca089d0014 100644 --- a/packages/core-app-api/src/routing/RoutingProvider.beta.test.tsx +++ b/packages/core-app-api/src/routing/RoutingProvider.beta.test.tsx @@ -17,7 +17,7 @@ import React, { PropsWithChildren, ReactElement } from 'react'; import { MemoryRouter, Routes } from 'react-router-dom'; import { render } from '@testing-library/react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useVersionedContext } from '@backstage/version-bridge'; import { childDiscoverer, @@ -353,9 +353,7 @@ describe('v1 consumer', () => { initialProps: { routeRef: routeRef1 as AnyRouteRef, }, - wrapper: ({ - children, - }: React.PropsWithChildren<{ routeRef: AnyRouteRef }>) => ( + wrapper: ({ children }) => ( , string>([ diff --git a/packages/core-app-api/src/routing/RoutingProvider.stable.test.tsx b/packages/core-app-api/src/routing/RoutingProvider.stable.test.tsx index 495fc20b15..df0ce32e2b 100644 --- a/packages/core-app-api/src/routing/RoutingProvider.stable.test.tsx +++ b/packages/core-app-api/src/routing/RoutingProvider.stable.test.tsx @@ -17,7 +17,7 @@ import React, { PropsWithChildren, ReactElement } from 'react'; import { MemoryRouter, Routes, Route, useOutlet } from 'react-router-dom'; import { render } from '@testing-library/react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useVersionedContext } from '@backstage/version-bridge'; import { childDiscoverer, @@ -385,9 +385,7 @@ describe('v1 consumer', () => { initialProps: { routeRef: routeRef1 as AnyRouteRef, }, - wrapper: ({ - children, - }: React.PropsWithChildren<{ routeRef: AnyRouteRef }>) => ( + wrapper: ({ children }) => ( , string>([ diff --git a/packages/core-components/package.json b/packages/core-components/package.json index 09b6dfb2b8..842a52df43 100644 --- a/packages/core-components/package.json +++ b/packages/core-components/package.json @@ -78,8 +78,8 @@ "zod": "^3.21.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -88,8 +88,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/ansi-regex": "^5.0.0", "@types/classnames": "^2.2.9", diff --git a/packages/core-components/src/components/AutoLogout/disconnectedUsers.test.ts b/packages/core-components/src/components/AutoLogout/disconnectedUsers.test.ts index 87d6369eda..3d097dcc7f 100644 --- a/packages/core-components/src/components/AutoLogout/disconnectedUsers.test.ts +++ b/packages/core-components/src/components/AutoLogout/disconnectedUsers.test.ts @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { act } from 'react-dom/test-utils'; import { diff --git a/packages/core-components/src/components/Link/Link.test.tsx b/packages/core-components/src/components/Link/Link.test.tsx index f88d830479..42668b54c9 100644 --- a/packages/core-components/src/components/Link/Link.test.tsx +++ b/packages/core-components/src/components/Link/Link.test.tsx @@ -14,8 +14,8 @@ * limitations under the License. */ -import React from 'react'; -import { fireEvent, waitFor, screen } from '@testing-library/react'; +import React, { ComponentType } from 'react'; +import { fireEvent, waitFor, screen, renderHook } from '@testing-library/react'; import { MockAnalyticsApi, TestApiProvider, @@ -24,7 +24,6 @@ import { import { analyticsApiRef, configApiRef } from '@backstage/core-plugin-api'; import { isExternalUri, Link, useResolvedPath } from './Link'; import { Route, Routes } from 'react-router-dom'; -import { renderHook, WrapperComponent } from '@testing-library/react-hooks'; import { ConfigReader } from '@backstage/config'; describe('', () => { @@ -128,7 +127,7 @@ describe('', () => { }); describe('useResolvedPath', () => { - const wrapper: WrapperComponent> = ({ + const wrapper: ComponentType> = ({ children, }) => { const configApi = new ConfigReader({ diff --git a/packages/core-components/src/components/LogViewer/useLogViewerSearch.test.tsx b/packages/core-components/src/components/LogViewer/useLogViewerSearch.test.tsx index a64f22765b..1b54f552a5 100644 --- a/packages/core-components/src/components/LogViewer/useLogViewerSearch.test.tsx +++ b/packages/core-components/src/components/LogViewer/useLogViewerSearch.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook } from '@testing-library/react'; import { applySearchFilter, useLogViewerSearch } from './useLogViewerSearch'; import { AnsiLine } from './AnsiProcessor'; diff --git a/packages/core-components/src/components/LogViewer/useLogViewerSelection.test.tsx b/packages/core-components/src/components/LogViewer/useLogViewerSelection.test.tsx index a828818ed5..6c6f7da71b 100644 --- a/packages/core-components/src/components/LogViewer/useLogViewerSelection.test.tsx +++ b/packages/core-components/src/components/LogViewer/useLogViewerSelection.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook } from '@testing-library/react'; import { TestApiProvider, MockErrorApi } from '@backstage/test-utils'; import { errorApiRef } from '@backstage/core-plugin-api'; import { AnsiLine } from './AnsiProcessor'; diff --git a/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx b/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx index f5a059d615..c7109686d5 100644 --- a/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx +++ b/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx @@ -48,6 +48,11 @@ describe('TabbedLayout', () => { }); expect(error).toEqual([ + expect.objectContaining({ + detail: new Error( + 'Child of TabbedLayout must be an TabbedLayout.Route', + ), + }), expect.objectContaining({ detail: new Error( 'Child of TabbedLayout must be an TabbedLayout.Route', diff --git a/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.test.tsx b/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.test.tsx index 6a16224a02..8bfb228f53 100644 --- a/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.test.tsx +++ b/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.test.tsx @@ -67,6 +67,9 @@ describe('', () => { }); expect(error).toEqual([ + expect.objectContaining({ + detail: new Error('Bomb'), + }), expect.objectContaining({ detail: new Error('Bomb'), }), @@ -75,6 +78,6 @@ describe('', () => { ), expect.stringMatching(/^ErrorBoundary/), ]); - expect(error.length).toEqual(3); + expect(error.length).toEqual(4); }); }); diff --git a/packages/core-components/src/layout/HeaderTabs/HeaderTabs.test.tsx b/packages/core-components/src/layout/HeaderTabs/HeaderTabs.test.tsx index ce5c572eef..f656696f8a 100644 --- a/packages/core-components/src/layout/HeaderTabs/HeaderTabs.test.tsx +++ b/packages/core-components/src/layout/HeaderTabs/HeaderTabs.test.tsx @@ -19,6 +19,7 @@ import Badge from '@material-ui/core/Badge'; import { makeStyles } from '@material-ui/core/styles'; import React from 'react'; import { HeaderTabs } from './HeaderTabs'; +import userEvent from '@testing-library/user-event'; const mockTabs = [ { id: 'overview', label: 'Overview' }, @@ -41,7 +42,7 @@ describe('', () => { 'false', ); - rendered.getByText('Docs').click(); + await userEvent.click(rendered.getByText('Docs')); expect(rendered.getByText('Docs').parentElement).toHaveAttribute( 'aria-selected', diff --git a/packages/core-components/src/layout/Sidebar/Items.test.tsx b/packages/core-components/src/layout/Sidebar/Items.test.tsx index 9479180180..6c959bfd0d 100644 --- a/packages/core-components/src/layout/Sidebar/Items.test.tsx +++ b/packages/core-components/src/layout/Sidebar/Items.test.tsx @@ -26,7 +26,7 @@ import HomeIcon from '@material-ui/icons/Home'; import CreateComponentIcon from '@material-ui/icons/AddCircleOutline'; import { Sidebar } from './Bar'; import { SidebarItem, SidebarSearchField, SidebarExpandButton } from './Items'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { makeStyles } from '@material-ui/core/styles'; import { analyticsApiRef } from '@backstage/core-plugin-api'; diff --git a/packages/core-components/src/layout/Sidebar/SidebarOpenStateContext.test.tsx b/packages/core-components/src/layout/Sidebar/SidebarOpenStateContext.test.tsx index f1900f025c..8cc6f7858c 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarOpenStateContext.test.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarOpenStateContext.test.tsx @@ -16,7 +16,7 @@ import React, { ReactNode, useContext } from 'react'; import { renderWithEffects } from '@backstage/test-utils'; import { waitFor } from '@testing-library/react'; -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { LegacySidebarContext, SidebarOpenStateProvider, diff --git a/packages/core-components/src/layout/Sidebar/SidebarPinStateContext.test.tsx b/packages/core-components/src/layout/Sidebar/SidebarPinStateContext.test.tsx index 8bd1597725..8f6660707d 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarPinStateContext.test.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarPinStateContext.test.tsx @@ -16,7 +16,7 @@ import React, { ReactNode, useContext } from 'react'; import { renderWithEffects } from '@backstage/test-utils'; import { waitFor } from '@testing-library/react'; -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { LegacySidebarPinStateContext, SidebarPinStateProvider, diff --git a/packages/core-plugin-api/package.json b/packages/core-plugin-api/package.json index 56362eac7b..42f3b8b4d4 100644 --- a/packages/core-plugin-api/package.json +++ b/packages/core-plugin-api/package.json @@ -54,8 +54,8 @@ "i18next": "^22.4.15" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -64,8 +64,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0" }, "files": [ diff --git a/packages/core-plugin-api/src/analytics/AnalyticsContext.test.tsx b/packages/core-plugin-api/src/analytics/AnalyticsContext.test.tsx index 88e8afa6ef..c29ec5b3ca 100644 --- a/packages/core-plugin-api/src/analytics/AnalyticsContext.test.tsx +++ b/packages/core-plugin-api/src/analytics/AnalyticsContext.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { render } from '@testing-library/react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { AnalyticsContext, useAnalyticsContext } from './AnalyticsContext'; const AnalyticsSpy = () => { diff --git a/packages/core-plugin-api/src/analytics/useAnalytics.test.tsx b/packages/core-plugin-api/src/analytics/useAnalytics.test.tsx index 22021026af..037e585430 100644 --- a/packages/core-plugin-api/src/analytics/useAnalytics.test.tsx +++ b/packages/core-plugin-api/src/analytics/useAnalytics.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useAnalytics } from './useAnalytics'; import { useApi } from '../apis'; diff --git a/packages/core-plugin-api/src/apis/system/useApi.test.tsx b/packages/core-plugin-api/src/apis/system/useApi.test.tsx index 6f473d8f59..4b9d80fb62 100644 --- a/packages/core-plugin-api/src/apis/system/useApi.test.tsx +++ b/packages/core-plugin-api/src/apis/system/useApi.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { createVersionedContextForTesting } from '@backstage/version-bridge'; import { createApiRef } from './ApiRef'; import { useApi } from './useApi'; diff --git a/packages/core-plugin-api/src/app/useApp.test.tsx b/packages/core-plugin-api/src/app/useApp.test.tsx index f2e330e847..34c956138e 100644 --- a/packages/core-plugin-api/src/app/useApp.test.tsx +++ b/packages/core-plugin-api/src/app/useApp.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { createVersionedContextForTesting } from '@backstage/version-bridge'; import { useApp } from './useApp'; diff --git a/packages/core-plugin-api/src/extensions/useElementFilter.test.tsx b/packages/core-plugin-api/src/extensions/useElementFilter.test.tsx index 9a3760d019..8597274e35 100644 --- a/packages/core-plugin-api/src/extensions/useElementFilter.test.tsx +++ b/packages/core-plugin-api/src/extensions/useElementFilter.test.tsx @@ -15,7 +15,7 @@ */ import React, { ReactNode } from 'react'; import { useElementFilter } from './useElementFilter'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { attachComponentData } from './componentData'; import { featureFlagsApiRef } from '../apis'; import { LocalStorageFeatureFlags } from '@backstage/core-app-api'; @@ -316,23 +316,23 @@ describe('useElementFilter', () => { ); - const { result } = renderHook( - props => - useElementFilter(props.tree, elements => - elements - .selectByComponentData({ - key: WRAPPING_COMPONENT_KEY, - withStrictError: 'Could not find component', - }) - .findComponentData({ key: INNER_COMPONENT_KEY }), - ), - { - initialProps: { tree }, - wrapper: Wrapper, - }, - ); - - expect(result.error?.message).toEqual('Could not find component'); + expect(() => + renderHook( + props => + useElementFilter(props.tree, elements => + elements + .selectByComponentData({ + key: WRAPPING_COMPONENT_KEY, + withStrictError: 'Could not find component', + }) + .findComponentData({ key: INNER_COMPONENT_KEY }), + ), + { + initialProps: { tree }, + wrapper: Wrapper, + }, + ), + ).toThrow('Could not find component'); }); it('should support fragments and text node iteration', () => { diff --git a/packages/core-plugin-api/src/routing/useRouteRef.test.tsx b/packages/core-plugin-api/src/routing/useRouteRef.test.tsx index 7a03a1cdc4..b302fa6441 100644 --- a/packages/core-plugin-api/src/routing/useRouteRef.test.tsx +++ b/packages/core-plugin-api/src/routing/useRouteRef.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import React from 'react'; import { MemoryRouter, Router } from 'react-router-dom'; import { createVersionedContextForTesting } from '@backstage/version-bridge'; diff --git a/packages/core-plugin-api/src/translation/useTranslationRef.test.tsx b/packages/core-plugin-api/src/translation/useTranslationRef.test.tsx index 19f0516906..a7493152de 100644 --- a/packages/core-plugin-api/src/translation/useTranslationRef.test.tsx +++ b/packages/core-plugin-api/src/translation/useTranslationRef.test.tsx @@ -20,7 +20,7 @@ import { TestApiProvider, withLogCollector, } from '@backstage/test-utils'; -import { renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import { createTranslationRef, TranslationRef } from './TranslationRef'; import { useTranslationRef } from './useTranslationRef'; // eslint-disable-next-line @backstage/no-relative-monorepo-imports @@ -91,19 +91,15 @@ describe('useTranslationRef', () => { ], }); - const { result, waitForNextUpdate } = renderHook( - () => useTranslationRef(plainRef), - { - wrapper: makeWrapper(translationApi), - }, - ); + const { result } = renderHook(() => useTranslationRef(plainRef), { + wrapper: makeWrapper(translationApi), + }); - await waitForNextUpdate(); - - const { t } = result.current; - - expect(t('key1')).toBe('en1'); - expect(t('key2')).toBe('en2'); + await waitFor(() => { + const { t } = result.current; + expect(t('key1')).toBe('en1'); + expect(t('key2')).toBe('en2'); + }); }); it('should switch between languages', async () => { @@ -123,26 +119,25 @@ describe('useTranslationRef', () => { ], }); - const { result, waitForNextUpdate } = renderHook( - () => useTranslationRef(plainRef), - { - wrapper: makeWrapper(translationApi), - }, - ); + const { result } = renderHook(() => useTranslationRef(plainRef), { + wrapper: makeWrapper(translationApi), + }); - const { t } = result.current; + await waitFor(() => { + const { t } = result.current; - expect(t('key1')).toBe('default1'); - expect(t('key2')).toBe('default2'); + expect(t('key1')).toBe('default1'); + expect(t('key2')).toBe('default2'); + }); languageApi.setLanguage('de'); - await waitForNextUpdate(); + await waitFor(() => { + const { t: t2 } = result.current; - const { t: t2 } = result.current; - - expect(t2('key1')).toBe('de1'); - expect(t2('key2')).toBe('de2'); + expect(t2('key1')).toBe('de1'); + expect(t2('key2')).toBe('de2'); + }); }); it('should load default resource', async () => { @@ -165,19 +160,16 @@ describe('useTranslationRef', () => { languageApi, }); - const { result, waitForNextUpdate } = renderHook( - () => useTranslationRef(resourceRef), - { - wrapper: makeWrapper(translationApi), - }, - ); + const { result } = renderHook(() => useTranslationRef(resourceRef), { + wrapper: makeWrapper(translationApi), + }); - await waitForNextUpdate(); + await waitFor(() => { + const { t } = result.current; - const { t } = result.current; - - expect(t('key1')).toBe('de1'); - expect(t('key2')).toBe('de2'); + expect(t('key1')).toBe('de1'); + expect(t('key2')).toBe('de2'); + }); }); it('should log once and then ignore loading errors', async () => { @@ -212,7 +204,7 @@ describe('useTranslationRef', () => { }); const { error } = await withLogCollector(['error'], async () => { - await rendered2.waitForNextUpdate(); + await act(rendered2.rerender); }); const msg = diff --git a/packages/dev-utils/package.json b/packages/dev-utils/package.json index 31e12b80cd..d860d67070 100644 --- a/packages/dev-utils/package.json +++ b/packages/dev-utils/package.json @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "zen-observable": "^0.10.0" }, diff --git a/packages/dev-utils/src/devApp/render.tsx b/packages/dev-utils/src/devApp/render.tsx index 335308ff5e..e45ba649f9 100644 --- a/packages/dev-utils/src/devApp/render.tsx +++ b/packages/dev-utils/src/devApp/render.tsx @@ -49,10 +49,7 @@ import { createRoutesFromChildren, Route } from 'react-router-dom'; import { SidebarThemeSwitcher } from './SidebarThemeSwitcher'; import 'react-dom'; -let ReactDOM: - | typeof import('react-dom') - // TODO: replace with import('react-dom/client') when repo is migrated to 18 - | { createRoot(el: HTMLElement): { render(el: JSX.Element): void } }; +let ReactDOM: typeof import('react-dom') | typeof import('react-dom/client'); if (process.env.HAS_REACT_DOM_CLIENT) { ReactDOM = require('react-dom/client'); } else { diff --git a/packages/frontend-app-api/package.json b/packages/frontend-app-api/package.json index ebd4291317..d4a595707a 100644 --- a/packages/frontend-app-api/package.json +++ b/packages/frontend-app-api/package.json @@ -26,7 +26,7 @@ "@backstage/cli": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3" + "@testing-library/react": "^14.0.0" }, "configSchema": "config.d.ts", "files": [ @@ -49,7 +49,7 @@ "lodash": "^4.17.21" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" } } diff --git a/packages/frontend-app-api/src/routing/RouteResolver.test.ts b/packages/frontend-app-api/src/routing/RouteResolver.test.ts index ef7a438734..e37ee14929 100644 --- a/packages/frontend-app-api/src/routing/RouteResolver.test.ts +++ b/packages/frontend-app-api/src/routing/RouteResolver.test.ts @@ -26,9 +26,8 @@ import { BackstagePlugin } from '@backstage/core-plugin-api'; import { RouteResolver } from './RouteResolver'; import { MATCH_ALL_ROUTE } from './extractRouteInfoFromInstanceTree'; -const element = () => null; const rest = { - element, + element: null, caseSensitive: false, children: [MATCH_ALL_ROUTE], plugins: new Set(), diff --git a/packages/frontend-plugin-api/package.json b/packages/frontend-plugin-api/package.json index 8d90a84d71..baf8cb4575 100644 --- a/packages/frontend-plugin-api/package.json +++ b/packages/frontend-plugin-api/package.json @@ -27,15 +27,14 @@ "@backstage/frontend-app-api": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.1", + "@testing-library/react": "^14.0.0", "history": "^5.3.0" }, "files": [ "dist" ], "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "dependencies": { diff --git a/packages/frontend-plugin-api/src/routing/useRouteRef.test.tsx b/packages/frontend-plugin-api/src/routing/useRouteRef.test.tsx index c786cd71fa..dcd56f81a6 100644 --- a/packages/frontend-plugin-api/src/routing/useRouteRef.test.tsx +++ b/packages/frontend-plugin-api/src/routing/useRouteRef.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import React from 'react'; import { MemoryRouter, Router } from 'react-router-dom'; import { createVersionedContextForTesting } from '@backstage/version-bridge'; diff --git a/packages/integration-react/package.json b/packages/integration-react/package.json index 9909350e91..f5f77aa775 100644 --- a/packages/integration-react/package.json +++ b/packages/integration-react/package.json @@ -38,8 +38,8 @@ "@types/react": "^16.13.1 || ^17.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/packages/techdocs-cli-embedded-app/package.json b/packages/techdocs-cli-embedded-app/package.json index 71e80fa2f0..8cd74ea71a 100644 --- a/packages/techdocs-cli-embedded-app/package.json +++ b/packages/techdocs-cli-embedded-app/package.json @@ -29,8 +29,8 @@ "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", "history": "^5.0.0", - "react": "^17.0.2", - "react-dom": "^17.0.2", + "react": "^18.0.2", + "react-dom": "^18.0.2", "react-router-dom": "^6.3.0", "react-use": "^17.2.4" }, @@ -38,7 +38,7 @@ "@backstage/cli": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/react": "*", "@types/react-dom": "*", diff --git a/packages/techdocs-cli-embedded-app/src/index.tsx b/packages/techdocs-cli-embedded-app/src/index.tsx index b15bc4c102..e5ca03fe64 100644 --- a/packages/techdocs-cli-embedded-app/src/index.tsx +++ b/packages/techdocs-cli-embedded-app/src/index.tsx @@ -16,7 +16,7 @@ import '@backstage/cli/asset-types'; import React from 'react'; -import ReactDOM from 'react-dom'; +import ReactDOM from 'react-dom/client'; import App from './App'; -ReactDOM.render(, document.getElementById('root')); +ReactDOM.createRoot(document.getElementById('root')!).render(); diff --git a/packages/test-utils/src/testUtils/appWrappers.test.tsx b/packages/test-utils/src/testUtils/appWrappers.test.tsx index 19bdc15a48..79327afc0b 100644 --- a/packages/test-utils/src/testUtils/appWrappers.test.tsx +++ b/packages/test-utils/src/testUtils/appWrappers.test.tsx @@ -92,6 +92,11 @@ describe('wrapInTestApp', () => { }); expect(error).toEqual([ + expect.objectContaining({ + detail: new Error( + 'MockErrorApi received unexpected error, Error: NOPE', + ), + }), expect.objectContaining({ detail: new Error( 'MockErrorApi received unexpected error, Error: NOPE', diff --git a/packages/theme/package.json b/packages/theme/package.json index 15046d057b..77109aef87 100644 --- a/packages/theme/package.json +++ b/packages/theme/package.json @@ -40,8 +40,8 @@ "peerDependencies": { "@material-ui/core": "^4.12.2", "@types/react": "^16.13.1 || ^17.0.0", - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0" + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0" }, "devDependencies": { "@backstage/cli": "workspace:^", diff --git a/packages/version-bridge/package.json b/packages/version-bridge/package.json index 8424ac54fc..caf196f497 100644 --- a/packages/version-bridge/package.json +++ b/packages/version-bridge/package.json @@ -36,15 +36,14 @@ "@types/react": "^16.13.1 || ^17.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { "@backstage/cli": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0" + "@testing-library/react": "^14.0.0" }, "files": [ "dist" diff --git a/packages/version-bridge/src/lib/VersionedContext.test.tsx b/packages/version-bridge/src/lib/VersionedContext.test.tsx index 275e491324..4ffe3f45ca 100644 --- a/packages/version-bridge/src/lib/VersionedContext.test.tsx +++ b/packages/version-bridge/src/lib/VersionedContext.test.tsx @@ -15,7 +15,7 @@ */ import React, { useContext } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { createVersionedContext, createVersionedContextForTesting, diff --git a/plugins/adr/package.json b/plugins/adr/package.json index 8c20d7a93a..86e07013bf 100644 --- a/plugins/adr/package.json +++ b/plugins/adr/package.json @@ -62,8 +62,8 @@ "remark-gfm": "^3.0.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -73,7 +73,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/git-url-parse": "^9.0.0", "cross-fetch": "^3.1.5", diff --git a/plugins/airbrake/package.json b/plugins/airbrake/package.json index 80cf3adc35..4e6476ecea 100644 --- a/plugins/airbrake/package.json +++ b/plugins/airbrake/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -54,7 +54,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/allure/package.json b/plugins/allure/package.json index d351388326..628eea6651 100644 --- a/plugins/allure/package.json +++ b/plugins/allure/package.json @@ -42,8 +42,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -53,7 +53,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/analytics-module-ga/package.json b/plugins/analytics-module-ga/package.json index 5d5a9505da..44d922ed7a 100644 --- a/plugins/analytics-module-ga/package.json +++ b/plugins/analytics-module-ga/package.json @@ -40,8 +40,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -51,7 +51,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0", "msw": "^1.0.0" diff --git a/plugins/analytics-module-ga4/package.json b/plugins/analytics-module-ga4/package.json index a786986f5e..705a430424 100644 --- a/plugins/analytics-module-ga4/package.json +++ b/plugins/analytics-module-ga4/package.json @@ -37,8 +37,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -48,7 +48,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/jest": "^28.1.3", "@types/react": "^16.13.1 || ^17.0.0", diff --git a/plugins/analytics-module-newrelic-browser/package.json b/plugins/analytics-module-newrelic-browser/package.json index f42911a93c..06b3cf5e02 100644 --- a/plugins/analytics-module-newrelic-browser/package.json +++ b/plugins/analytics-module-newrelic-browser/package.json @@ -30,7 +30,7 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0" + "react": "^16.13.1 || ^17.0.0 || ^18.0.0" }, "devDependencies": { "@backstage/cli": "workspace:^", @@ -38,7 +38,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/apache-airflow/package.json b/plugins/apache-airflow/package.json index e0cc0619b3..e87179784f 100644 --- a/plugins/apache-airflow/package.json +++ b/plugins/apache-airflow/package.json @@ -40,8 +40,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -51,7 +51,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/api-docs-module-protoc-gen-doc/package.json b/plugins/api-docs-module-protoc-gen-doc/package.json index ac1b941a7d..80fe6645d7 100644 --- a/plugins/api-docs-module-protoc-gen-doc/package.json +++ b/plugins/api-docs-module-protoc-gen-doc/package.json @@ -36,8 +36,8 @@ "grpc-docs": "^1.1.2" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/api-docs/package.json b/plugins/api-docs/package.json index 0f5e9214a3..53832682af 100644 --- a/plugins/api-docs/package.json +++ b/plugins/api-docs/package.json @@ -52,8 +52,8 @@ "swagger-ui-react": "^5.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -63,7 +63,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/swagger-ui-react": "^4.18.0", "cross-fetch": "^3.1.5", diff --git a/plugins/apollo-explorer/package.json b/plugins/apollo-explorer/package.json index 386eab6ab0..6af85a2784 100644 --- a/plugins/apollo-explorer/package.json +++ b/plugins/apollo-explorer/package.json @@ -40,8 +40,8 @@ "use-deep-compare-effect": "^1.8.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -51,7 +51,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/azure-devops/package.json b/plugins/azure-devops/package.json index 2e88ac76ab..7b5d8ee97a 100644 --- a/plugins/azure-devops/package.json +++ b/plugins/azure-devops/package.json @@ -45,8 +45,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/azure-sites/package.json b/plugins/azure-sites/package.json index 77bc1d3833..c00f1f21af 100644 --- a/plugins/azure-sites/package.json +++ b/plugins/azure-sites/package.json @@ -47,8 +47,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -58,7 +58,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/badges/package.json b/plugins/badges/package.json index ccd4e37db0..6cb8fa7642 100644 --- a/plugins/badges/package.json +++ b/plugins/badges/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/bazaar/package.json b/plugins/bazaar/package.json index 2c2f2ba1e8..ed3428d7f9 100644 --- a/plugins/bazaar/package.json +++ b/plugins/bazaar/package.json @@ -51,8 +51,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/bitrise/package.json b/plugins/bitrise/package.json index fdf18f4380..023472669b 100644 --- a/plugins/bitrise/package.json +++ b/plugins/bitrise/package.json @@ -46,8 +46,8 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -57,7 +57,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/recharts": "^1.8.15", "msw": "^1.0.0" diff --git a/plugins/bitrise/src/components/BitriseBuildDetailsDialog/BitriseBuildDetailsDialog.test.tsx b/plugins/bitrise/src/components/BitriseBuildDetailsDialog/BitriseBuildDetailsDialog.test.tsx index 7992e08f37..65efb9b64f 100644 --- a/plugins/bitrise/src/components/BitriseBuildDetailsDialog/BitriseBuildDetailsDialog.test.tsx +++ b/plugins/bitrise/src/components/BitriseBuildDetailsDialog/BitriseBuildDetailsDialog.test.tsx @@ -18,6 +18,7 @@ import React from 'react'; import { render } from '@testing-library/react'; import { BitriseBuildDetailsDialog } from './BitriseBuildDetailsDialog'; import { BitriseBuildResult } from '../../api/bitriseApi.model'; +import userEvent from '@testing-library/user-event'; jest.mock('../BitriseArtifactsComponent', () => ({ BitriseArtifactsComponent: (_props: { build: string }) => <>VISIBLE, @@ -48,7 +49,7 @@ describe('BitriseArtifactsComponent', () => { expect(rendered.queryByText('VISIBLE')).not.toBeInTheDocument(); - btn.click(); + await userEvent.click(btn); expect(rendered.getByText('VISIBLE')).toBeInTheDocument(); }); diff --git a/plugins/catalog-graph/package.json b/plugins/catalog-graph/package.json index 52079e0fa1..0afb6d92f7 100644 --- a/plugins/catalog-graph/package.json +++ b/plugins/catalog-graph/package.json @@ -47,8 +47,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,8 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0" }, "files": [ diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts index 7a4d836365..a89fa353d6 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts @@ -14,7 +14,7 @@ * limitations under the License. */ import { RELATION_MEMBER_OF } from '@backstage/catalog-model'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook } from '@testing-library/react'; import { useLocation as useLocationMocked } from 'react-router-dom'; import { Direction } from '../EntityRelationsGraph'; import { useCatalogGraphPage } from './useCatalogGraphPage'; diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationGraph.test.ts b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationGraph.test.ts index 7e0cd411ce..420af5345c 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationGraph.test.ts +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationGraph.test.ts @@ -19,7 +19,7 @@ import { RELATION_OWNER_OF, RELATION_PART_OF, } from '@backstage/catalog-model'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { pick } from 'lodash'; import { useEntityRelationGraph } from './useEntityRelationGraph'; import { useEntityStore as useEntityStoreMocked } from './useEntityStore'; diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationNodesAndEdges.test.ts b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationNodesAndEdges.test.ts index c2ee918e5b..d17e8b1c9d 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationNodesAndEdges.test.ts +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationNodesAndEdges.test.ts @@ -21,7 +21,7 @@ import { RELATION_PART_OF, stringifyEntityRef, } from '@backstage/catalog-model'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { filter, keyBy } from 'lodash'; import { useEntityRelationGraph as useEntityRelationGraphMocked } from './useEntityRelationGraph'; import { useEntityRelationNodesAndEdges } from './useEntityRelationNodesAndEdges'; @@ -163,7 +163,7 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should generate unidirectional graph with merged relations', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], unidirectional: true, @@ -171,9 +171,9 @@ describe('useEntityRelationNodesAndEdges', () => { }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -236,7 +236,7 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should generate unidirectional graph', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], unidirectional: true, @@ -244,9 +244,9 @@ describe('useEntityRelationNodesAndEdges', () => { }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -309,7 +309,7 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should generate bidirectional graph with merged relations', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], unidirectional: false, @@ -317,9 +317,9 @@ describe('useEntityRelationNodesAndEdges', () => { }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -412,7 +412,7 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should generate bidirectional graph with all relations', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], unidirectional: false, @@ -420,9 +420,9 @@ describe('useEntityRelationNodesAndEdges', () => { }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -515,15 +515,15 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should generate graph with multiple root nodes', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c', 'b:d/c2'], }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -586,16 +586,16 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should filter by relation', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], relations: [RELATION_OWNER_OF], }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; @@ -646,16 +646,16 @@ describe('useEntityRelationNodesAndEdges', () => { }); test('should filter by kind', async () => { - const { result, waitForValueToChange } = renderHook(() => + const { result } = renderHook(() => useEntityRelationNodesAndEdges({ rootEntityRefs: ['b:d/c'], kinds: ['b'], }), ); - await waitForValueToChange( - () => result.current.nodes && result.current.edges, - ); + await waitFor(() => { + expect(result.current.nodes && result.current.edges).toBeDefined(); + }); const { nodes, edges, loading, error } = result.current; diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityStore.test.ts b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityStore.test.ts index 802f993802..0d75fabc3b 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityStore.test.ts +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityStore.test.ts @@ -16,7 +16,7 @@ import { Entity } from '@backstage/catalog-model'; import { useApi as useApiMocked } from '@backstage/core-plugin-api'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import { useEntityStore } from './useEntityStore'; jest.mock('@backstage/core-plugin-api'); @@ -65,7 +65,7 @@ describe('useEntityStore', () => { catalogApi.getEntityByRef.mockResolvedValue(entity); - const { result, waitFor } = renderHook(() => useEntityStore()); + const { result } = renderHook(() => useEntityStore()); act(() => { result.current.requestEntities(['kind:namespace/name']); @@ -85,7 +85,7 @@ describe('useEntityStore', () => { const err = new Error('Hello World'); catalogApi.getEntityByRef.mockRejectedValue(err); - const { result, waitFor } = renderHook(() => useEntityStore()); + const { result } = renderHook(() => useEntityStore()); act(() => { result.current.requestEntities(['kind:namespace/name']); @@ -134,7 +134,7 @@ describe('useEntityStore', () => { catalogApi.getEntityByRef.mockResolvedValue(entity1); - const { result, waitFor } = renderHook(() => useEntityStore()); + const { result } = renderHook(() => useEntityStore()); act(() => { result.current.requestEntities(['kind:namespace/name1']); @@ -189,7 +189,7 @@ describe('useEntityStore', () => { catalogApi.getEntityByRef.mockResolvedValue(entity1); - const { result, waitFor } = renderHook(() => useEntityStore()); + const { result } = renderHook(() => useEntityStore()); act(() => { result.current.requestEntities(['kind:namespace/name1']); diff --git a/plugins/catalog-graphql/package.json b/plugins/catalog-graphql/package.json index 599ca62d2b..d8869e2578 100644 --- a/plugins/catalog-graphql/package.json +++ b/plugins/catalog-graphql/package.json @@ -47,8 +47,8 @@ "winston": "^3.2.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/catalog-import/package.json b/plugins/catalog-import/package.json index efb4922f6f..b970736695 100644 --- a/plugins/catalog-import/package.json +++ b/plugins/catalog-import/package.json @@ -56,8 +56,8 @@ "yaml": "^2.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -67,8 +67,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewCatalogInfoComponent.test.tsx b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewCatalogInfoComponent.test.tsx index 0a6960cdc7..4e737bd115 100644 --- a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewCatalogInfoComponent.test.tsx +++ b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewCatalogInfoComponent.test.tsx @@ -19,7 +19,7 @@ import { configApiRef } from '@backstage/core-plugin-api'; import { MockConfigApi, TestApiProvider } from '@backstage/test-utils'; import { makeStyles } from '@material-ui/core'; import { render, screen } from '@testing-library/react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import React from 'react'; import { PreviewCatalogInfoComponent } from './PreviewCatalogInfoComponent'; diff --git a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewPullRequestComponent.test.tsx b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewPullRequestComponent.test.tsx index d983b6d359..53485bedb5 100644 --- a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewPullRequestComponent.test.tsx +++ b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/PreviewPullRequestComponent.test.tsx @@ -16,7 +16,7 @@ import { makeStyles } from '@material-ui/core'; import { render, screen } from '@testing-library/react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import React from 'react'; import { PreviewPullRequestComponent } from './PreviewPullRequestComponent'; diff --git a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/StepPrepareCreatePullRequest.test.tsx b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/StepPrepareCreatePullRequest.test.tsx index 36f1217c37..079b010ec6 100644 --- a/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/StepPrepareCreatePullRequest.test.tsx +++ b/plugins/catalog-import/src/components/StepPrepareCreatePullRequest/StepPrepareCreatePullRequest.test.tsx @@ -18,7 +18,7 @@ import { configApiRef, errorApiRef } from '@backstage/core-plugin-api'; import { catalogApiRef } from '@backstage/plugin-catalog-react'; import { TestApiProvider, MockConfigApi } from '@backstage/test-utils'; import { TextField } from '@material-ui/core'; -import { act, render, screen } from '@testing-library/react'; +import { render, screen, waitFor } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import React from 'react'; import { AnalyzeResult, catalogImportApiRef } from '../../api'; @@ -101,36 +101,34 @@ describe('', () => { it('renders without exploding', async () => { catalogApi.getEntities.mockReturnValue(Promise.resolve({ items: [] })); - await act(async () => { - render( - { - return ( - <> - - - - - - ); - }} - />, - { - wrapper: Wrapper, - }, - ); + render( + { + return ( + <> + + + + + + ); + }} + />, + { + wrapper: Wrapper, + }, + ); - const title = await screen.findByText('My title'); - const description = await screen.findByText('body', { - selector: 'strong', - }); - expect(title).toBeInTheDocument(); - expect(title).toBeVisible(); - expect(description).toBeInTheDocument(); - expect(description).toBeVisible(); + const title = await screen.findByText('My title'); + const description = await screen.findByText('body', { + selector: 'strong', }); + expect(title).toBeInTheDocument(); + expect(title).toBeVisible(); + expect(description).toBeInTheDocument(); + expect(description).toBeVisible(); }); it('should submit created PR', async () => { @@ -142,39 +140,37 @@ describe('', () => { }), ); - await act(async () => { - render( - { - return ( - <> - - - - - - ); - }} - />, - { - wrapper: Wrapper, - }, - ); + render( + { + return ( + <> + + + + + + ); + }} + />, + { + wrapper: Wrapper, + }, + ); - await userEvent.type(await screen.findByLabelText('name'), '-changed'); - await userEvent.type(await screen.findByLabelText('owner'), '-changed'); - await userEvent.click(screen.getByRole('button', { name: /Create PR/i })); - }); + await userEvent.type(await screen.findByLabelText('name'), '-changed'); + await userEvent.type(await screen.findByLabelText('owner'), '-changed'); + await userEvent.click(screen.getByRole('button', { name: /Create PR/i })); expect(catalogImportApi.submitPullRequest).toHaveBeenCalledTimes(1); expect(catalogImportApi.submitPullRequest.mock.calls[0]).toMatchObject([ @@ -226,31 +222,29 @@ spec: new Error('some error'), ); - await act(async () => { - render( - { - return ( - <> - - - - - - ); - }} - />, - { - wrapper: Wrapper, - }, - ); + render( + { + return ( + <> + + + + + + ); + }} + />, + { + wrapper: Wrapper, + }, + ); - await userEvent.click( - await screen.findByRole('button', { name: /Create PR/i }), - ); - }); + await userEvent.click( + await screen.findByRole('button', { name: /Create PR/i }), + ); expect(screen.getByText('some error')).toBeInTheDocument(); expect(catalogImportApi.submitPullRequest).toHaveBeenCalledTimes(1); @@ -273,30 +267,26 @@ spec: }), ); - await act(async () => { - render( - , - { - wrapper: Wrapper, - }, - ); + render( + , + { + wrapper: Wrapper, + }, + ); + + await waitFor(() => { + expect(catalogApi.getEntities).toHaveBeenCalledTimes(1); }); - expect(catalogApi.getEntities).toHaveBeenCalledTimes(1); expect(renderFormFieldsFn).toHaveBeenCalled(); expect(renderFormFieldsFn.mock.calls[0][0]).toMatchObject({ - groups: [], - groupsLoading: true, + groups: ['my-group'], + groupsLoading: false, }); - expect( - renderFormFieldsFn.mock.calls[ - renderFormFieldsFn.mock.calls.length - 1 - ][0], - ).toMatchObject({ groups: ['my-group'], groupsLoading: false }); }); describe('generateEntities', () => { diff --git a/plugins/catalog-import/src/components/useImportState.test.tsx b/plugins/catalog-import/src/components/useImportState.test.tsx index 155adb8290..dc2cb30f6f 100644 --- a/plugins/catalog-import/src/components/useImportState.test.tsx +++ b/plugins/catalog-import/src/components/useImportState.test.tsx @@ -16,7 +16,7 @@ import { Entity, CompoundEntityRef } from '@backstage/catalog-model'; import { cleanup } from '@testing-library/react'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook } from '@testing-library/react'; import { AnalyzeResult } from '../api'; import { @@ -73,7 +73,6 @@ describe('useImportState', () => { describe('onAnalysis & onPrepare & onReview & onReset', () => { it('should work', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current).toMatchObject({ activeFlow: 'unknown', @@ -148,7 +147,6 @@ describe('useImportState', () => { it('should work skipped', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current).toMatchObject({ activeFlow: 'unknown', @@ -198,7 +196,6 @@ describe('useImportState', () => { it('should ignore on invalid state', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); // state 'analyze' act(() => { @@ -264,7 +261,6 @@ describe('useImportState', () => { describe('onGoBack', () => { it('should work', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current.activeStepNumber).toBe(0); expect(result.current.onGoBack).toBeUndefined(); @@ -303,7 +299,6 @@ describe('useImportState', () => { it('should work for skipped', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current.activeStepNumber).toBe(0); expect(result.current.onGoBack).toBeUndefined(); @@ -329,7 +324,6 @@ describe('useImportState', () => { describe('should consider prepareNotRepeatable', () => { it('as true', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current.onGoBack).toBeUndefined(); @@ -351,7 +345,6 @@ describe('useImportState', () => { it('as false', async () => { const { result } = renderHook(() => useImportState()); - await cleanup(); expect(result.current.onGoBack).toBeUndefined(); diff --git a/plugins/catalog-react/package.json b/plugins/catalog-react/package.json index 7c1dcb5551..bb18160595 100644 --- a/plugins/catalog-react/package.json +++ b/plugins/catalog-react/package.json @@ -72,8 +72,8 @@ "zen-observable": "^0.10.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -84,8 +84,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/zen-observable": "^0.8.0", "react-test-renderer": "^16.13.1" diff --git a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx index 38edb9b064..32e66dc578 100644 --- a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx @@ -179,9 +179,7 @@ describe('', () => { , ); await waitFor(() => - expect(updateFilters).toHaveBeenLastCalledWith({ - options: undefined, - }), + expect(screen.getByTestId('options-picker-expand')).toBeInTheDocument(), ); fireEvent.click(screen.getByTestId('options-picker-expand')); diff --git a/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.test.tsx b/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.test.tsx index 19554f18b7..de40f90c55 100644 --- a/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.test.tsx @@ -74,9 +74,10 @@ describe('', () => { , ); - await waitFor(() => expect(catalogApi.getEntityFacets).toHaveBeenCalled()); - expect(updateFilters).toHaveBeenLastCalledWith({ - lifecycles: new EntityLifecycleFilter(['experimental']), + await waitFor(() => { + expect(updateFilters).toHaveBeenLastCalledWith({ + lifecycles: new EntityLifecycleFilter(['experimental']), + }); }); }); @@ -119,9 +120,10 @@ describe('', () => { , ); - await waitFor(() => expect(catalogApi.getEntityFacets).toHaveBeenCalled()); - expect(updateFilters).toHaveBeenLastCalledWith({ - lifecycles: new EntityLifecycleFilter(['production']), + await waitFor(() => { + expect(updateFilters).toHaveBeenLastCalledWith({ + lifecycles: new EntityLifecycleFilter(['production']), + }); }); fireEvent.click(screen.getByTestId('lifecycles-picker-expand')); expect(screen.getByLabelText('production')).toBeChecked(); @@ -147,9 +149,10 @@ describe('', () => { , ); - await waitFor(() => expect(catalogApi.getEntityFacets).toHaveBeenCalled()); - expect(updateFilters).toHaveBeenLastCalledWith({ - lifecycles: new EntityLifecycleFilter(['experimental']), + await waitFor(() => { + expect(updateFilters).toHaveBeenLastCalledWith({ + lifecycles: new EntityLifecycleFilter(['experimental']), + }); }); rendered.rerender( @@ -210,9 +213,10 @@ describe('', () => { , ); - await waitFor(() => expect(catalogApi.getEntityFacets).toHaveBeenCalled()); - expect(updateFilters).toHaveBeenLastCalledWith({ - lifecycles: new EntityLifecycleFilter(['production']), + await waitFor(() => { + expect(updateFilters).toHaveBeenLastCalledWith({ + lifecycles: new EntityLifecycleFilter(['production']), + }); }); }); }); diff --git a/plugins/catalog-react/src/components/EntityNamespacePicker/EntityNamespacePicker.test.tsx b/plugins/catalog-react/src/components/EntityNamespacePicker/EntityNamespacePicker.test.tsx index 7dd13620c7..c4b5e64c9d 100644 --- a/plugins/catalog-react/src/components/EntityNamespacePicker/EntityNamespacePicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityNamespacePicker/EntityNamespacePicker.test.tsx @@ -113,9 +113,7 @@ describe('', () => { , ); await waitFor(() => - expect(updateFilters).toHaveBeenLastCalledWith({ - namespace: undefined, - }), + expect(screen.getByTestId('namespace-picker-expand')).toBeInTheDocument(), ); fireEvent.click(screen.getByTestId('namespace-picker-expand')); diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/useFacetsEntities.test.ts b/plugins/catalog-react/src/components/EntityOwnerPicker/useFacetsEntities.test.ts index 6f6da43307..1d0d1130a6 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/useFacetsEntities.test.ts +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/useFacetsEntities.test.ts @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { useFacetsEntities } from './useFacetsEntities'; import { CatalogApi } from '@backstage/catalog-client'; @@ -50,9 +50,7 @@ describe('useFacetsEntities', () => { }, }); - const { result, waitFor } = renderHook(() => - useFacetsEntities({ enabled: true }), - ); + const { result } = renderHook(() => useFacetsEntities({ enabled: true })); result.current[1]({ text: '' }); await waitFor(() => { @@ -91,9 +89,7 @@ describe('useFacetsEntities', () => { }, }); - const { result, waitFor } = renderHook(() => - useFacetsEntities({ enabled: true }), - ); + const { result } = renderHook(() => useFacetsEntities({ enabled: true })); result.current[1]({ text: '' }); await waitFor(() => { @@ -147,9 +143,7 @@ describe('useFacetsEntities', () => { }, }); - const { result, waitFor } = renderHook(() => - useFacetsEntities({ enabled: true }), - ); + const { result } = renderHook(() => useFacetsEntities({ enabled: true })); result.current[1]({ text: '' }, { limit: 2 }); await waitFor(() => { @@ -261,9 +255,7 @@ describe('useFacetsEntities', () => { }, }); - const { result, waitFor } = renderHook(() => - useFacetsEntities({ enabled: true }), - ); + const { result } = renderHook(() => useFacetsEntities({ enabled: true })); result.current[1]({ text: 'der ' }); await waitFor(() => { diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/useQueryEntities.test.ts b/plugins/catalog-react/src/components/EntityOwnerPicker/useQueryEntities.test.ts index d974709d34..64cc7769a6 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/useQueryEntities.test.ts +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/useQueryEntities.test.ts @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { CatalogApi } from '@backstage/catalog-client'; import { useQueryEntities } from './useQueryEntities'; @@ -62,7 +62,7 @@ describe('useQueryEntities', () => { totalItems: 2, }); - const { result, waitFor } = renderHook(() => useQueryEntities()); + const { result } = renderHook(() => useQueryEntities()); const [, fetch] = result.current!; fetch({ text: 'text' }); diff --git a/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.test.tsx b/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.test.tsx index f665ca6c00..85a477801a 100644 --- a/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.test.tsx +++ b/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.test.tsx @@ -49,7 +49,7 @@ const apis = TestApiRegistry.from([catalogApiRef, catalogApi]); describe('', () => { it('renders all owners', async () => { - renderInTestApp( + await renderInTestApp( diff --git a/plugins/catalog-react/src/components/EntityTagPicker/EntityTagPicker.test.tsx b/plugins/catalog-react/src/components/EntityTagPicker/EntityTagPicker.test.tsx index bfaa689190..917ece047c 100644 --- a/plugins/catalog-react/src/components/EntityTagPicker/EntityTagPicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityTagPicker/EntityTagPicker.test.tsx @@ -14,7 +14,13 @@ * limitations under the License. */ -import { fireEvent, render, waitFor, screen } from '@testing-library/react'; +import { + fireEvent, + render, + waitFor, + screen, + act, +} from '@testing-library/react'; import React from 'react'; import { MockEntityListContextProvider } from '../../testUtils/providers'; import { EntityTagFilter } from '../../filters'; @@ -127,9 +133,7 @@ describe('', () => { , ); await waitFor(() => - expect(updateFilters).toHaveBeenLastCalledWith({ - tags: undefined, - }), + expect(screen.getByTestId('tags-picker-expand')).toBeInTheDocument(), ); fireEvent.click(screen.getByTestId('tags-picker-expand')); @@ -218,13 +222,16 @@ describe('', () => { , ); await waitFor(() => - expect(updateFilters).toHaveBeenLastCalledWith({ - tags: new EntityTagFilter(['tag1']), - }), + expect(screen.getByTestId('tags-picker-expand')).toBeInTheDocument(), ); - fireEvent.click(screen.getByTestId('tags-picker-expand')); - fireEvent.click(screen.getByLabelText('tag2')); - expect(screen.getByLabelText('tag2')).toBeChecked(); + + await act(async () => { + fireEvent.click(screen.getByTestId('tags-picker-expand')); + }); + await act(async () => { + fireEvent.click(screen.getByLabelText('tag2')); + }); + expect(updateFilters).toHaveBeenLastCalledWith({ tags: new EntityTagFilter(['tag1', 'tag2']), }); diff --git a/plugins/catalog-react/src/components/UnregisterEntityDialog/useUnregisterEntityDialogState.test.tsx b/plugins/catalog-react/src/components/UnregisterEntityDialog/useUnregisterEntityDialogState.test.tsx index 8591cdad93..f0da550d0b 100644 --- a/plugins/catalog-react/src/components/UnregisterEntityDialog/useUnregisterEntityDialogState.test.tsx +++ b/plugins/catalog-react/src/components/UnregisterEntityDialog/useUnregisterEntityDialogState.test.tsx @@ -17,16 +17,9 @@ import { CatalogApi, Location } from '@backstage/catalog-client'; import { Entity, ANNOTATION_ORIGIN_LOCATION } from '@backstage/catalog-model'; import { catalogApiRef } from '../../api'; -import { - act, - renderHook, - RenderHookResult, -} from '@testing-library/react-hooks'; -import React, { ReactNode } from 'react'; -import { - UseUnregisterEntityDialogState, - useUnregisterEntityDialogState, -} from './useUnregisterEntityDialogState'; +import { renderHook, waitFor } from '@testing-library/react'; +import React from 'react'; +import { useUnregisterEntityDialogState } from './useUnregisterEntityDialogState'; import { TestApiProvider } from '@backstage/test-utils'; function defer(): { promise: Promise; resolve: (value: T) => void } { @@ -85,31 +78,23 @@ describe('useUnregisterEntityDialogState', () => { }); it('goes through the happy unregister path', async () => { - let rendered: RenderHookResult< - { children?: ReactNode }, - UseUnregisterEntityDialogState - >; - act(() => { - rendered = renderHook(() => useUnregisterEntityDialogState(entity), { - wrapper: Wrapper, - }); + const rendered = renderHook(() => useUnregisterEntityDialogState(entity), { + wrapper: Wrapper, }); - expect(rendered!.result.current).toEqual({ type: 'loading' }); + expect(rendered.result.current).toEqual({ type: 'loading' }); resolveLocation({ type: 'url', target: 'https://example.com', id: 'x' }); resolveColocatedEntities([entity]); - await act(async () => { - await rendered!.waitForNextUpdate(); - }); - - expect(rendered!.result.current).toEqual({ - type: 'unregister', - location: 'url:https://example.com', - colocatedEntities: [{ kind: 'Component', namespace: 'ns', name: 'n' }], - unregisterLocation: expect.any(Function), - deleteEntity: expect.any(Function), + await waitFor(() => { + expect(rendered.result.current).toEqual({ + type: 'unregister', + location: 'url:https://example.com', + colocatedEntities: [{ kind: 'Component', namespace: 'ns', name: 'n' }], + unregisterLocation: expect.any(Function), + deleteEntity: expect.any(Function), + }); }); }); @@ -117,74 +102,53 @@ describe('useUnregisterEntityDialogState', () => { entity.metadata.annotations![ANNOTATION_ORIGIN_LOCATION] = 'bootstrap:bootstrap'; - let rendered: RenderHookResult< - { children?: ReactNode }, - UseUnregisterEntityDialogState - >; - act(() => { - rendered = renderHook(() => useUnregisterEntityDialogState(entity), { - wrapper: Wrapper, - }); + const rendered = renderHook(() => useUnregisterEntityDialogState(entity), { + wrapper: Wrapper, }); resolveLocation({ type: 'bootstrap', target: 'bootstrap', id: 'x' }); resolveColocatedEntities([]); - await act(async () => { - await rendered!.waitForNextUpdate(); - }); - expect(rendered!.result.current).toEqual({ - type: 'bootstrap', - location: 'bootstrap:bootstrap', - deleteEntity: expect.any(Function), + await waitFor(() => { + expect(rendered.result.current).toEqual({ + type: 'bootstrap', + location: 'bootstrap:bootstrap', + deleteEntity: expect.any(Function), + }); }); }); it('chooses only-delete when there was no location annotation', async () => { delete entity.metadata.annotations![ANNOTATION_ORIGIN_LOCATION]; - let rendered: RenderHookResult< - { children?: ReactNode }, - UseUnregisterEntityDialogState - >; - act(() => { - rendered = renderHook(() => useUnregisterEntityDialogState(entity), { - wrapper: Wrapper, - }); + const rendered = renderHook(() => useUnregisterEntityDialogState(entity), { + wrapper: Wrapper, }); resolveLocation(undefined); resolveColocatedEntities([]); - await act(async () => { - await rendered!.waitForNextUpdate(); - }); - expect(rendered!.result.current).toEqual({ - type: 'only-delete', - deleteEntity: expect.any(Function), + await waitFor(() => { + expect(rendered.result.current).toEqual({ + type: 'only-delete', + deleteEntity: expect.any(Function), + }); }); }); it('chooses only-delete when the location could not be found', async () => { - let rendered: RenderHookResult< - { children?: ReactNode }, - UseUnregisterEntityDialogState - >; - act(() => { - rendered = renderHook(() => useUnregisterEntityDialogState(entity), { - wrapper: Wrapper, - }); + const rendered = renderHook(() => useUnregisterEntityDialogState(entity), { + wrapper: Wrapper, }); resolveLocation(undefined); resolveColocatedEntities([]); - await act(async () => { - await rendered!.waitForNextUpdate(); - }); - expect(rendered!.result.current).toEqual({ - type: 'only-delete', - deleteEntity: expect.any(Function), + await waitFor(() => { + expect(rendered.result.current).toEqual({ + type: 'only-delete', + deleteEntity: expect.any(Function), + }); }); }); }); diff --git a/plugins/catalog-react/src/hooks/useEntity.test.tsx b/plugins/catalog-react/src/hooks/useEntity.test.tsx index 8fc388654a..3b1190de2b 100644 --- a/plugins/catalog-react/src/hooks/useEntity.test.tsx +++ b/plugins/catalog-react/src/hooks/useEntity.test.tsx @@ -15,7 +15,7 @@ */ import React, { PropsWithChildren } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useEntity, useAsyncEntity, @@ -31,13 +31,13 @@ const entity = { metadata: { name: 'my-entity' }, kind: 'MyKind' } as Entity; describe('useEntity', () => { it('should throw if no entity is provided', async () => { - const { result } = renderHook(() => useEntity(), { - wrapper: ({ children }: React.PropsWithChildren<{}>) => ( - - ), - }); - - expect(result.error?.message).toMatch(/entity has not been loaded/); + expect(() => + renderHook(() => useEntity(), { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + + ), + }), + ).toThrow(/entity has not been loaded/); }); it('should provide an entity', async () => { diff --git a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx index da27c61dcb..d77655ebcc 100644 --- a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx +++ b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx @@ -25,7 +25,7 @@ import { storageApiRef, } from '@backstage/core-plugin-api'; import { MockStorageApi, TestApiProvider } from '@backstage/test-utils'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import qs from 'qs'; import React, { PropsWithChildren } from 'react'; import { MemoryRouter } from 'react-router-dom'; @@ -119,10 +119,14 @@ describe('', () => { }); it('resolves backend filters', async () => { - const { result, waitForValueToChange } = renderHook(() => useEntityList(), { + const { result } = renderHook(() => useEntityList(), { wrapper, }); - await waitForValueToChange(() => result.current.backendEntities); + + await waitFor(() => { + expect(result.current.backendEntities.length).toBeGreaterThan(0); + }); + expect(result.current.backendEntities.length).toBe(2); expect(mockCatalogApi.getEntities).toHaveBeenCalledWith({ filter: { kind: 'component' }, @@ -130,13 +134,16 @@ describe('', () => { }); it('resolves frontend filters', async () => { - const { result, waitFor } = renderHook(() => useEntityList(), { + const { result } = renderHook(() => useEntityList(), { wrapper, initialProps: { userFilter: 'all', }, }); - await waitFor(() => !!result.current.entities.length); + + await waitFor(() => { + expect(result.current.backendEntities.length).toBeGreaterThan(0); + }); expect(result.current.backendEntities.length).toBe(2); act(() => @@ -160,13 +167,14 @@ describe('', () => { const query = qs.stringify({ filters: { kind: 'component', type: 'service' }, }); - const { result, waitFor } = renderHook(() => useEntityList(), { - wrapper, - initialProps: { - location: `/catalog?${query}`, - }, + const { result } = renderHook(() => useEntityList(), { + wrapper: ({ children }) => + wrapper({ location: `/catalog?${query}`, children }), + }); + + await waitFor(() => { + expect(result.current.queryParameters).toBeTruthy(); }); - await act(() => waitFor(() => !!result.current.queryParameters)); expect(result.current.queryParameters).toEqual({ kind: 'component', type: 'service', @@ -174,7 +182,7 @@ describe('', () => { }); it('does not fetch when only frontend filters change', async () => { - const { result, waitFor } = renderHook(() => useEntityList(), { + const { result } = renderHook(() => useEntityList(), { wrapper, }); @@ -200,32 +208,34 @@ describe('', () => { }); it('debounces multiple filter changes', async () => { - const { result, waitForNextUpdate, waitForValueToChange } = renderHook( - () => useEntityList(), - { - wrapper, - }, - ); - await waitForValueToChange(() => result.current.backendEntities); + const { result } = renderHook(() => useEntityList(), { + wrapper, + }); + + await waitFor(() => { + expect(result.current.backendEntities.length).toBeGreaterThan(0); + }); expect(result.current.backendEntities.length).toBe(2); expect(mockCatalogApi.getEntities).toHaveBeenCalledTimes(1); - act(() => { + await act(async () => { result.current.updateFilters({ kind: new EntityKindFilter('component') }); result.current.updateFilters({ type: new EntityTypeFilter('service') }); }); - await waitForNextUpdate(); - expect(mockCatalogApi.getEntities).toHaveBeenCalledTimes(2); + + await waitFor(() => { + expect(mockCatalogApi.getEntities).toHaveBeenCalledTimes(2); + }); }); it('returns an error on catalogApi failure', async () => { - const { result, waitForValueToChange, waitFor } = renderHook( - () => useEntityList(), - { - wrapper, - }, - ); - await waitForValueToChange(() => result.current.backendEntities); + const { result } = renderHook(() => useEntityList(), { + wrapper, + }); + + await waitFor(() => { + expect(result.current.backendEntities.length).toBeGreaterThan(0); + }); expect(result.current.backendEntities.length).toBe(2); mockCatalogApi.getEntities = jest.fn().mockRejectedValue('error'); diff --git a/plugins/catalog-react/src/hooks/useEntityOwnership.test.tsx b/plugins/catalog-react/src/hooks/useEntityOwnership.test.tsx index dc400b5c90..6c9519eb08 100644 --- a/plugins/catalog-react/src/hooks/useEntityOwnership.test.tsx +++ b/plugins/catalog-react/src/hooks/useEntityOwnership.test.tsx @@ -18,7 +18,7 @@ import { CatalogApi } from '@backstage/catalog-client'; import { ComponentEntity, RELATION_OWNED_BY } from '@backstage/catalog-model'; import { IdentityApi, identityApiRef } from '@backstage/core-plugin-api'; import { TestApiProvider } from '@backstage/test-utils'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import React from 'react'; import { catalogApiRef } from '../api'; import { useEntityOwnership } from './useEntityOwnership'; @@ -83,19 +83,15 @@ describe('useEntityOwnership', () => { }); mockCatalogApi.getEntityByRef.mockResolvedValue(undefined); - const { result, waitForValueToChange } = renderHook( - () => useEntityOwnership(), - { - wrapper: Wrapper, - }, - ); + const { result } = renderHook(() => useEntityOwnership(), { + wrapper: Wrapper, + }); expect(result.current.loading).toBe(true); expect(result.current.isOwnedEntity(ownedEntity)).toBe(false); - await waitForValueToChange(() => result.current.loading); + await waitFor(() => expect(result.current.loading).toBe(false)); - expect(result.current.loading).toBe(false); expect(result.current.isOwnedEntity(ownedEntity)).toBe(true); }); }); diff --git a/plugins/catalog-react/src/hooks/useEntityPermission.test.tsx b/plugins/catalog-react/src/hooks/useEntityPermission.test.tsx index aed6676838..0c389de747 100644 --- a/plugins/catalog-react/src/hooks/useEntityPermission.test.tsx +++ b/plugins/catalog-react/src/hooks/useEntityPermission.test.tsx @@ -15,7 +15,7 @@ */ import { catalogEntityDeletePermission } from '@backstage/plugin-catalog-common/alpha'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useEntityPermission } from './useEntityPermission'; import { useAsyncEntity } from './useEntity'; import { usePermission } from '@backstage/plugin-permission-react'; diff --git a/plugins/catalog-react/src/hooks/useRelatedEntities.test.tsx b/plugins/catalog-react/src/hooks/useRelatedEntities.test.tsx index 8de7822d59..092f8e164e 100644 --- a/plugins/catalog-react/src/hooks/useRelatedEntities.test.tsx +++ b/plugins/catalog-react/src/hooks/useRelatedEntities.test.tsx @@ -16,8 +16,8 @@ import { Entity } from '@backstage/catalog-model'; import { TestApiProvider } from '@backstage/test-utils'; -import { WrapperComponent, renderHook } from '@testing-library/react-hooks'; -import React, { PropsWithChildren } from 'react'; +import { renderHook, waitFor } from '@testing-library/react'; +import React, { ComponentType, PropsWithChildren } from 'react'; import { catalogApiRef } from '../api'; import { useRelatedEntities } from './useRelatedEntities'; @@ -50,7 +50,7 @@ describe('useRelatedEntities', () => { getEntitiesByRefs: jest.fn(), }; - const wrapper: WrapperComponent> = ({ children }) => { + const wrapper: ComponentType> = ({ children }) => { return ( {children} @@ -70,7 +70,9 @@ describe('useRelatedEntities', () => { expect(rendered.result.current).toEqual({ loading: true }); - await rendered.waitForValueToChange(() => rendered.result.current.loading); + await waitFor(() => { + expect(rendered.result.current.loading).toBe(false); + }); expect(catalogApi.getEntitiesByRefs).toHaveBeenCalledWith({ entityRefs: ['group:default/the-owners-1', 'group:default/the-owners-2'], diff --git a/plugins/catalog-react/src/hooks/useStarredEntities.test.tsx b/plugins/catalog-react/src/hooks/useStarredEntities.test.tsx index f21b3cb710..e3010a0f4a 100644 --- a/plugins/catalog-react/src/hooks/useStarredEntities.test.tsx +++ b/plugins/catalog-react/src/hooks/useStarredEntities.test.tsx @@ -16,7 +16,7 @@ import { Entity } from '@backstage/catalog-model'; import { TestApiProvider } from '@backstage/test-utils'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import React, { PropsWithChildren } from 'react'; import { starredEntitiesApiRef, @@ -56,14 +56,13 @@ describe('useStarredEntities', () => { }); it('should return an empty set', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntities(), - { wrapper }, - ); + const { result } = renderHook(() => useStarredEntities(), { + wrapper, + }); - await waitForNextUpdate(); - - expect(result.current.starredEntities.size).toBe(0); + await waitFor(() => { + expect(result.current.starredEntities.size).toBe(0); + }); }); it('should return a set with the current items', async () => { @@ -72,25 +71,21 @@ describe('useStarredEntities', () => { mockApi.toggleStarred(id); } - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntities(), - { wrapper }, - ); + const { result } = renderHook(() => useStarredEntities(), { + wrapper, + }); - await waitForNextUpdate(); - - for (const item of expectedIds) { - expect(result.current.starredEntities.has(item)).toBeTruthy(); - } + await waitFor(() => { + for (const item of expectedIds) { + expect(result.current.starredEntities.has(item)).toBeTruthy(); + } + }); }); it('should listen to changes when the storage is set elsewhere', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntities(), - { wrapper }, - ); - - await waitForNextUpdate(); + const { result } = renderHook(() => useStarredEntities(), { + wrapper, + }); expect(result.current.starredEntities.size).toBe(0); expect(result.current.isStarredEntity(mockEntity)).toBeFalsy(); @@ -99,42 +94,37 @@ describe('useStarredEntities', () => { // catch when the hook re-renders with the latest data setTimeout(() => result.current.toggleStarredEntity(mockEntity), 1); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.starredEntities.size).toBe(1); + }); - expect(result.current.starredEntities.size).toBe(1); expect(result.current.isStarredEntity(mockEntity)).toBeTruthy(); }); it('should write new entries to the local store when adding a toggling entity', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntities(), - { wrapper }, - ); - - act(() => { - result.current.toggleStarredEntity(mockEntity); + const { result } = renderHook(() => useStarredEntities(), { + wrapper, }); - await waitForNextUpdate(); + await act(async () => { + result.current.toggleStarredEntity(mockEntity); + }); expect(result.current.isStarredEntity(mockEntity)).toBeTruthy(); expect(result.current.isStarredEntity(secondMockEntity)).toBeFalsy(); }); it('should remove an existing entity when toggling entries', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntities(), - { wrapper }, - ); + const { result } = renderHook(() => useStarredEntities(), { + wrapper, + }); - act(() => { + await act(async () => { result.current.toggleStarredEntity(mockEntity); result.current.toggleStarredEntity(secondMockEntity); result.current.toggleStarredEntity(mockEntity); }); - await waitForNextUpdate(); - expect(result.current.isStarredEntity(mockEntity)).toBeFalsy(); expect(result.current.isStarredEntity(secondMockEntity)).toBeTruthy(); }); diff --git a/plugins/catalog-react/src/hooks/useStarredEntities.ts b/plugins/catalog-react/src/hooks/useStarredEntities.ts index 328a26e0f8..7e63aed10f 100644 --- a/plugins/catalog-react/src/hooks/useStarredEntities.ts +++ b/plugins/catalog-react/src/hooks/useStarredEntities.ts @@ -20,7 +20,7 @@ import { stringifyEntityRef, } from '@backstage/catalog-model'; import { useApi } from '@backstage/core-plugin-api'; -import { useCallback } from 'react'; +import { useCallback, useMemo } from 'react'; import useObservable from 'react-use/lib/useObservable'; import { starredEntitiesApiRef } from '../apis'; @@ -45,7 +45,7 @@ export function useStarredEntities(): { const starredEntitiesApi = useApi(starredEntitiesApiRef); const starredEntities = useObservable( - starredEntitiesApi.starredEntitie$(), + useMemo(() => starredEntitiesApi.starredEntitie$(), [starredEntitiesApi]), new Set(), ); diff --git a/plugins/catalog-react/src/hooks/useStarredEntity.test.tsx b/plugins/catalog-react/src/hooks/useStarredEntity.test.tsx index d24b27f903..e64a9bbdf8 100644 --- a/plugins/catalog-react/src/hooks/useStarredEntity.test.tsx +++ b/plugins/catalog-react/src/hooks/useStarredEntity.test.tsx @@ -16,7 +16,7 @@ import { Entity, CompoundEntityRef } from '@backstage/catalog-model'; import { TestApiProvider } from '@backstage/test-utils'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import React, { PropsWithChildren } from 'react'; import Observable from 'zen-observable'; import { StarredEntitiesApi, starredEntitiesApiRef } from '../apis'; @@ -83,18 +83,16 @@ describe('useStarredEntity', () => { ); mockStarredEntitiesApi.toggleStarred.mockResolvedValue(); - const { result, waitForNextUpdate } = renderHook( - () => useStarredEntity(entityOrRef), - { - wrapper, - }, - ); + const { result } = renderHook(() => useStarredEntity(entityOrRef), { + wrapper, + }); // the initial value will always be false because the observable triggers async expect(result.current.isStarredEntity).toBe(false); - await waitForNextUpdate(); - expect(result.current.isStarredEntity).toBe(true); + await waitFor(() => { + expect(result.current.isStarredEntity).toBe(true); + }); }); }); }); diff --git a/plugins/catalog-unprocessed-entities/package.json b/plugins/catalog-unprocessed-entities/package.json index 5bf8a0150c..b4d95ac20a 100644 --- a/plugins/catalog-unprocessed-entities/package.json +++ b/plugins/catalog-unprocessed-entities/package.json @@ -41,8 +41,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -51,7 +51,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/catalog/package.json b/plugins/catalog/package.json index 73440c6ba1..56ae771314 100644 --- a/plugins/catalog/package.json +++ b/plugins/catalog/package.json @@ -71,8 +71,8 @@ "zen-observable": "^0.10.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -83,7 +83,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0" }, "files": [ diff --git a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx index d9998b0ca5..aebdd6b9c2 100644 --- a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx +++ b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx @@ -19,7 +19,7 @@ import { AsyncEntityProvider, EntityProvider, } from '@backstage/plugin-catalog-react'; -import { render, screen, waitFor } from '@testing-library/react'; +import { render, screen } from '@testing-library/react'; import React, { useEffect } from 'react'; import { isKind } from './conditions'; import { EntitySwitch } from './EntitySwitch'; @@ -517,9 +517,7 @@ describe('EntitySwitch', () => { , ); - await waitFor(() => expect(shouldRender).toHaveBeenCalled()); - - expect(screen.getByText('C')).toBeInTheDocument(); + await expect(screen.findByText('C')).resolves.toBeInTheDocument(); expect(screen.queryByText('A')).not.toBeInTheDocument(); expect(screen.queryByText('B')).not.toBeInTheDocument(); }); diff --git a/plugins/cicd-statistics-module-gitlab/package.json b/plugins/cicd-statistics-module-gitlab/package.json index c5d2332904..6c7f3c150f 100644 --- a/plugins/cicd-statistics-module-gitlab/package.json +++ b/plugins/cicd-statistics-module-gitlab/package.json @@ -43,8 +43,8 @@ "p-limit": "^4.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/cicd-statistics/package.json b/plugins/cicd-statistics/package.json index 4a1fcfd960..fb8b736035 100644 --- a/plugins/cicd-statistics/package.json +++ b/plugins/cicd-statistics/package.json @@ -54,8 +54,8 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "files": [ diff --git a/plugins/circleci/package.json b/plugins/circleci/package.json index 590385e7c2..ddec70c2de 100644 --- a/plugins/circleci/package.json +++ b/plugins/circleci/package.json @@ -50,8 +50,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/humanize-duration": "^3.25.1", "cross-fetch": "^3.1.5", diff --git a/plugins/cloudbuild/package.json b/plugins/cloudbuild/package.json index 3a2d3c8d95..8b64387aa8 100644 --- a/plugins/cloudbuild/package.json +++ b/plugins/cloudbuild/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,7 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/code-climate/package.json b/plugins/code-climate/package.json index 21218a4850..dc01c52a13 100644 --- a/plugins/code-climate/package.json +++ b/plugins/code-climate/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -53,7 +53,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/humanize-duration": "^3.27.1", "@types/luxon": "^3.0.0", diff --git a/plugins/code-coverage/package.json b/plugins/code-coverage/package.json index 93b06e7c85..15343a8212 100644 --- a/plugins/code-coverage/package.json +++ b/plugins/code-coverage/package.json @@ -47,8 +47,8 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -58,7 +58,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/highlightjs": "^10.1.0", "@types/react": "^16.13.1 || ^17.0.0", diff --git a/plugins/codescene/package.json b/plugins/codescene/package.json index 3eeb6452af..e36c8e5575 100644 --- a/plugins/codescene/package.json +++ b/plugins/codescene/package.json @@ -42,8 +42,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -53,7 +53,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/config-schema/package.json b/plugins/config-schema/package.json index 55b716f1f4..387921650b 100644 --- a/plugins/config-schema/package.json +++ b/plugins/config-schema/package.json @@ -45,8 +45,8 @@ "zen-observable": "^0.10.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/cost-insights/package.json b/plugins/cost-insights/package.json index 8f9bb07fc8..5cd7c3458b 100644 --- a/plugins/cost-insights/package.json +++ b/plugins/cost-insights/package.json @@ -57,8 +57,8 @@ "yup": "^0.32.9" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -68,7 +68,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/pluralize": "^0.0.31", "@types/recharts": "^1.8.14", diff --git a/plugins/devtools/package.json b/plugins/devtools/package.json index c1ad7b53fd..41ea821dea 100644 --- a/plugins/devtools/package.json +++ b/plugins/devtools/package.json @@ -44,8 +44,8 @@ }, "peerDependencies": { "@types/react": "^16.13.1 || ^17.0.0", - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -54,7 +54,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/dynatrace/package.json b/plugins/dynatrace/package.json index 97c79f84f5..f8b35eafaa 100644 --- a/plugins/dynatrace/package.json +++ b/plugins/dynatrace/package.json @@ -41,8 +41,8 @@ }, "peerDependencies": { "@backstage/plugin-catalog-react": "workspace:^", - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -52,7 +52,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "express": "^4.18.1", "msw": "^1.0.0" diff --git a/plugins/entity-feedback/package.json b/plugins/entity-feedback/package.json index 876653986e..f2a4697454 100644 --- a/plugins/entity-feedback/package.json +++ b/plugins/entity-feedback/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -54,8 +54,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.1", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/entity-validation/package.json b/plugins/entity-validation/package.json index e47ff094bf..1fee0c7892 100644 --- a/plugins/entity-validation/package.json +++ b/plugins/entity-validation/package.json @@ -51,8 +51,8 @@ "yaml": "^2.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -62,7 +62,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/example-todo-list/package.json b/plugins/example-todo-list/package.json index 36eb464bb5..7bfc3f898c 100644 --- a/plugins/example-todo-list/package.json +++ b/plugins/example-todo-list/package.json @@ -39,8 +39,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -50,7 +50,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0", "msw": "^1.0.0" diff --git a/plugins/explore-react/package.json b/plugins/explore-react/package.json index d9b9145c27..7599da4ba8 100644 --- a/plugins/explore-react/package.json +++ b/plugins/explore-react/package.json @@ -37,8 +37,8 @@ "@backstage/plugin-explore-common": "workspace:^" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -47,7 +47,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0", "cross-fetch": "^3.1.5", diff --git a/plugins/explore/package.json b/plugins/explore/package.json index 1b4dc7b3e0..435c5df84d 100644 --- a/plugins/explore/package.json +++ b/plugins/explore/package.json @@ -66,8 +66,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -78,7 +78,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/firehydrant/package.json b/plugins/firehydrant/package.json index 6cd468514a..ed723f71cf 100644 --- a/plugins/firehydrant/package.json +++ b/plugins/firehydrant/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -54,7 +54,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/fossa/package.json b/plugins/fossa/package.json index 8851cfc766..6c08f3d4fd 100644 --- a/plugins/fossa/package.json +++ b/plugins/fossa/package.json @@ -50,8 +50,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/gcalendar/package.json b/plugins/gcalendar/package.json index 1b74941ce3..d84850677b 100644 --- a/plugins/gcalendar/package.json +++ b/plugins/gcalendar/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,7 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/dompurify": "^2.3.3", "@types/sanitize-html": "^2.6.2", diff --git a/plugins/gcp-projects/package.json b/plugins/gcp-projects/package.json index 0544c904a2..24bb9a99fa 100644 --- a/plugins/gcp-projects/package.json +++ b/plugins/gcp-projects/package.json @@ -44,8 +44,8 @@ "@types/react": "^16.13.1 || ^17.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -55,7 +55,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/git-release-manager/package.json b/plugins/git-release-manager/package.json index 1cb5f9e4f2..2c0ce60f6a 100644 --- a/plugins/git-release-manager/package.json +++ b/plugins/git-release-manager/package.json @@ -45,8 +45,8 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,8 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/recharts": "^1.8.15", "msw": "^1.0.0" diff --git a/plugins/git-release-manager/src/features/CreateReleaseCandidate/hooks/useCreateReleaseCandidate.test.tsx b/plugins/git-release-manager/src/features/CreateReleaseCandidate/hooks/useCreateReleaseCandidate.test.tsx index 25a987df2a..c5490103cb 100644 --- a/plugins/git-release-manager/src/features/CreateReleaseCandidate/hooks/useCreateReleaseCandidate.test.tsx +++ b/plugins/git-release-manager/src/features/CreateReleaseCandidate/hooks/useCreateReleaseCandidate.test.tsx @@ -13,8 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { renderHook, act } from '@testing-library/react-hooks'; -import { waitFor } from '@testing-library/react'; +import { renderHook, act } from '@testing-library/react'; import { mockCalverProject, @@ -48,10 +47,9 @@ describe('useCreateReleaseCandidate', () => { ); await act(async () => { - await waitFor(() => result.current.run()); + await result.current.run(); }); - expect(result.error).toEqual(undefined); expect(result.current.responseSteps).toHaveLength(6); }); @@ -67,7 +65,7 @@ describe('useCreateReleaseCandidate', () => { ); await act(async () => { - await waitFor(() => result.current.run()); + await result.current.run(); }); expect(result.current.responseSteps).toHaveLength(7); diff --git a/plugins/git-release-manager/src/features/Features.test.tsx b/plugins/git-release-manager/src/features/Features.test.tsx index f3a70c2bda..abde878648 100644 --- a/plugins/git-release-manager/src/features/Features.test.tsx +++ b/plugins/git-release-manager/src/features/Features.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { render, act, waitFor } from '@testing-library/react'; +import { render, waitFor } from '@testing-library/react'; import { Features } from './Features'; import { mockCalverProject } from '../test-helpers/test-helpers'; @@ -49,9 +49,7 @@ describe('Features', () => { />, ); - await act(async () => { - await waitFor(() => getByTestId(TEST_IDS.info.info)); - }); + await waitFor(() => getByTestId(TEST_IDS.info.info)); expect(getByTestId(TEST_IDS.info.info)).toMatchInlineSnapshot(`

{ ); await act(async () => { - await waitFor(() => result.current.run(mockSelectedPatchCommit)); + await result.current.run(mockSelectedPatchCommit); }); - expect(result.error).toEqual(undefined); expect(result.current.responseSteps).toHaveLength(18); }); @@ -69,10 +67,9 @@ describe('patch', () => { ); await act(async () => { - await waitFor(() => result.current.run(mockSelectedPatchCommit)); + await result.current.run(mockSelectedPatchCommit); }); - expect(result.error).toEqual(undefined); expect(result.current.responseSteps).toHaveLength(19); expect(result.current).toMatchInlineSnapshot(` { diff --git a/plugins/git-release-manager/src/features/PromoteRc/hooks/usePromoteRc.test.ts b/plugins/git-release-manager/src/features/PromoteRc/hooks/usePromoteRc.test.ts index f4e0fcb081..1b1bb54df0 100644 --- a/plugins/git-release-manager/src/features/PromoteRc/hooks/usePromoteRc.test.ts +++ b/plugins/git-release-manager/src/features/PromoteRc/hooks/usePromoteRc.test.ts @@ -14,9 +14,7 @@ * limitations under the License. */ -import { renderHook, act } from '@testing-library/react-hooks'; -import { waitFor } from '@testing-library/react'; - +import { renderHook, act } from '@testing-library/react'; import { mockCalverProject, mockReleaseCandidateCalver, @@ -50,10 +48,9 @@ describe('usePromoteRc', () => { ); await act(async () => { - await waitFor(() => result.current.run()); + await result.current.run(); }); - expect(result.error).toEqual(undefined); expect(result.current.responseSteps).toHaveLength(4); }); @@ -67,7 +64,7 @@ describe('usePromoteRc', () => { ); await act(async () => { - await waitFor(() => result.current.run()); + await result.current.run(); }); expect(result.current.responseSteps).toHaveLength(5); diff --git a/plugins/git-release-manager/src/hooks/useGetGitBatchInfo.test.ts b/plugins/git-release-manager/src/hooks/useGetGitBatchInfo.test.ts index 8e89add810..d1bf28bccb 100644 --- a/plugins/git-release-manager/src/hooks/useGetGitBatchInfo.test.ts +++ b/plugins/git-release-manager/src/hooks/useGetGitBatchInfo.test.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { waitFor } from '@testing-library/react'; import { mockApiClient } from '../test-helpers/mock-api-client'; diff --git a/plugins/git-release-manager/src/hooks/useResponseSteps.test.ts b/plugins/git-release-manager/src/hooks/useResponseSteps.test.ts index 513c51758d..c406a353b2 100644 --- a/plugins/git-release-manager/src/hooks/useResponseSteps.test.ts +++ b/plugins/git-release-manager/src/hooks/useResponseSteps.test.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { useResponseSteps } from './useResponseSteps'; diff --git a/plugins/github-actions/package.json b/plugins/github-actions/package.json index de8f2e64dc..ec0d9a03db 100644 --- a/plugins/github-actions/package.json +++ b/plugins/github-actions/package.json @@ -52,8 +52,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -63,7 +63,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.test.tsx b/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.test.tsx index 2d006b32c2..772a33c4fe 100644 --- a/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.test.tsx +++ b/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.test.tsx @@ -75,7 +75,7 @@ describe('', () => { }); const renderSubject = async (props: any = {}) => { - renderInTestApp( + await renderInTestApp( { lifecycle: 'development', }, }; - const { result } = subject(); - expect(() => result.current).toThrow(); - expect(result.error).toStrictEqual( - new Error( - `Failed to parse kafka consumer group annotation: got "dev/another,consumer"`, - ), + expect(() => subject()).toThrow( + `Failed to parse kafka consumer group annotation: got "dev/another,consumer"`, ); }); }); diff --git a/plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.test.tsx b/plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.test.tsx index 8a7f28d69b..2f3fc21f93 100644 --- a/plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.test.tsx +++ b/plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.test.tsx @@ -15,7 +15,7 @@ */ import { Entity } from '@backstage/catalog-model'; import { EntityProvider } from '@backstage/plugin-catalog-react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { when } from 'jest-when'; import React, { PropsWithChildren } from 'react'; import { @@ -96,27 +96,28 @@ describe('useConsumerGroupOffsets', () => { .mockResolvedValue(consumerGroupOffsets); when(mockKafkaDashboardApi.getDashboardUrl).mockReturnValue({}); - const { result, waitForNextUpdate } = subject(); - await waitForNextUpdate(); - const [tableProps] = result.current; + const { result } = subject(); - expect(tableProps.consumerGroupsTopics).toStrictEqual([ - { - clusterId: 'prod', - consumerGroup: consumerGroupOffsets.consumerId, - dashboardUrl: undefined, - topics: consumerGroupOffsets.offsets, - }, - ]); + await waitFor(() => { + expect(result.current[0].consumerGroupsTopics).toStrictEqual([ + { + clusterId: 'prod', + consumerGroup: consumerGroupOffsets.consumerId, + dashboardUrl: undefined, + topics: consumerGroupOffsets.offsets, + }, + ]); + }); }); it('posts an error to the error api', async () => { const error = new Error('error!'); mockKafkaApi.getConsumerGroupOffsets.mockRejectedValueOnce(error); - const { waitForNextUpdate } = subject(); - await waitForNextUpdate(); + subject(); - expect(mockErrorApi.post).toHaveBeenCalledWith(error); + await waitFor(() => { + expect(mockErrorApi.post).toHaveBeenCalledWith(error); + }); }); }); diff --git a/plugins/kubernetes-cluster/package.json b/plugins/kubernetes-cluster/package.json index b54c32f214..1949941d47 100644 --- a/plugins/kubernetes-cluster/package.json +++ b/plugins/kubernetes-cluster/package.json @@ -57,8 +57,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -68,8 +68,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/node": "^16.11.26", "msw": "^1.0.0" diff --git a/plugins/kubernetes-react/package.json b/plugins/kubernetes-react/package.json index 59d4b15bee..03f647cfb2 100644 --- a/plugins/kubernetes-react/package.json +++ b/plugins/kubernetes-react/package.json @@ -48,15 +48,14 @@ "xterm-addon-fit": "^0.8.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0" + "react": "^16.13.1 || ^17.0.0 || ^18.0.0" }, "devDependencies": { "@backstage/cli": "workspace:^", "@backstage/core-app-api": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.1", + "@testing-library/react": "^14.0.0", "jest-websocket-mock": "^2.5.0", "msw": "^1.3.1" }, diff --git a/plugins/kubernetes-react/src/components/Pods/Events/useEvents.test.tsx b/plugins/kubernetes-react/src/components/Pods/Events/useEvents.test.tsx index 15da221f64..f98e4f5e6e 100644 --- a/plugins/kubernetes-react/src/components/Pods/Events/useEvents.test.tsx +++ b/plugins/kubernetes-react/src/components/Pods/Events/useEvents.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import { useApi } from '@backstage/core-plugin-api'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { useEvents } from './useEvents'; import { DateTime } from 'luxon'; @@ -49,7 +49,7 @@ describe('Events', () => { mockGetEventsByInvolvedObjectName.mockResolvedValue(response), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useEvents({ involvedObjectName: 'some-objecgt', namespace: 'some-namespace', @@ -59,7 +59,9 @@ describe('Events', () => { expect(result.current.loading).toEqual(true); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.loading).toEqual(false); + }); expect(result.current.error).toBeUndefined(); expect(result.current.loading).toEqual(false); diff --git a/plugins/kubernetes-react/src/hooks/useCustomResources.test.ts b/plugins/kubernetes-react/src/hooks/useCustomResources.test.ts index abd8fc392c..40ab619180 100644 --- a/plugins/kubernetes-react/src/hooks/useCustomResources.test.ts +++ b/plugins/kubernetes-react/src/hooks/useCustomResources.test.ts @@ -16,7 +16,7 @@ import { useCustomResources } from './useCustomResources'; import { Entity } from '@backstage/catalog-model'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { useApi } from '@backstage/core-plugin-api'; import { CustomResourceMatcher } from '@backstage/plugin-kubernetes-common'; import { generateAuth } from './auth'; @@ -97,17 +97,17 @@ describe('useCustomResources', () => { getCustomObjectsByEntity: mockGetCustomObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers), ); expect(result.current.loading).toEqual(true); - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); + }); expectMocksCalledCorrectly(); }); @@ -117,20 +117,17 @@ describe('useCustomResources', () => { getCustomObjectsByEntity: mockGetCustomObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers, 100), ); - await waitForNextUpdate(); - expect(result.current.error).toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); - - expectMocksCalledCorrectly(2); + expectMocksCalledCorrectly(2); + }); }); it('should return error when getObjectsByEntity throws', async () => { mockGenerateAuth.mockResolvedValue(entityWithAuthToken.auth); @@ -139,17 +136,17 @@ describe('useCustomResources', () => { message: 'some error', }), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers), ); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('some error'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); - expect(result.current.error).toBe('some error'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - expectMocksCalledCorrectly(); + expectMocksCalledCorrectly(); + }); }); describe('when retrying', () => { @@ -162,21 +159,21 @@ describe('useCustomResources', () => { mockGetCustomObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers, 100), ); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('generateAuth failed'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); - expect(result.current.error).toBe('generateAuth failed'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); }); it('should reset error after getCustomObjectsByEntity has failed and then succeeded', async () => { @@ -186,21 +183,21 @@ describe('useCustomResources', () => { .mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers, 100), ); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('failed to fetch'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); - expect(result.current.error).toBe('failed to fetch'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); }); it('should reset data after generateAuth succeeded then failed', async () => { @@ -212,21 +209,21 @@ describe('useCustomResources', () => { mockGetCustomObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers, 100), ); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBe('generateAuth failed'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBe('generateAuth failed'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); }); it('should reset data after getCustomObjectsByEntity succeeded then failed', async () => { @@ -236,21 +233,21 @@ describe('useCustomResources', () => { .mockRejectedValue({ message: 'failed to fetch' }), }); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useCustomResources(entity, customResourceMatchers, 100), ); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBe('failed to fetch'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBe('failed to fetch'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); }); }); }); diff --git a/plugins/kubernetes-react/src/hooks/useIsPodExecTerminalSupported.test.ts b/plugins/kubernetes-react/src/hooks/useIsPodExecTerminalSupported.test.ts index 1772e0d4f2..93bfb6dd4d 100644 --- a/plugins/kubernetes-react/src/hooks/useIsPodExecTerminalSupported.test.ts +++ b/plugins/kubernetes-react/src/hooks/useIsPodExecTerminalSupported.test.ts @@ -14,7 +14,7 @@ * limitations under the License. */ import { useApi } from '@backstage/core-plugin-api'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { useIsPodExecTerminalSupported } from './useIsPodExecTerminalSupported'; @@ -68,15 +68,14 @@ describe('useIsClusterShellEnabled', () => { async ({ testClusters, returnValue }) => { clusters = testClusters; - const { result, waitForNextUpdate } = renderHook(() => - useIsPodExecTerminalSupported(), - ); + const { result } = renderHook(() => useIsPodExecTerminalSupported()); expect(result.current.loading).toEqual(true); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.loading).toEqual(false); + }); - expect(result.current.loading).toEqual(false); expect(result.current.value).toBe(returnValue); }, ); diff --git a/plugins/kubernetes-react/src/hooks/useKubernetesObjects.test.ts b/plugins/kubernetes-react/src/hooks/useKubernetesObjects.test.ts index 5c4db4db14..e88432f980 100644 --- a/plugins/kubernetes-react/src/hooks/useKubernetesObjects.test.ts +++ b/plugins/kubernetes-react/src/hooks/useKubernetesObjects.test.ts @@ -16,7 +16,7 @@ import { useKubernetesObjects } from './useKubernetesObjects'; import { Entity } from '@backstage/catalog-model'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { useApi } from '@backstage/core-plugin-api'; import { generateAuth } from './auth'; @@ -87,19 +87,17 @@ describe('useKubernetesObjects', () => { getObjectsByEntity: mockGetObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity), - ); + const { result } = renderHook(() => useKubernetesObjects(entity)); expect(result.current.loading).toEqual(true); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); - - expectMocksCalledCorrectly(); + expectMocksCalledCorrectly(); + }); }); it('should update on an interval', async () => { mockGenerateAuth.mockResolvedValue(entityWithAuthToken.auth); @@ -107,20 +105,17 @@ describe('useKubernetesObjects', () => { getObjectsByEntity: mockGetObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity, 100), - ); - - await waitForNextUpdate(); - expect(result.current.error).toBeUndefined(); - - await waitForNextUpdate(); + const { result } = renderHook(() => useKubernetesObjects(entity, 100)); expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); - expectMocksCalledCorrectly(2); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toStrictEqual(mockResponse); + + expectMocksCalledCorrectly(2); + }); }); it('should return error when getObjectsByEntity throws', async () => { mockGenerateAuth.mockResolvedValue(entityWithAuthToken.auth); @@ -129,17 +124,15 @@ describe('useKubernetesObjects', () => { message: 'some error', }), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity), - ); + const { result } = renderHook(() => useKubernetesObjects(entity)); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('some error'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); - expect(result.current.error).toBe('some error'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - expectMocksCalledCorrectly(); + expectMocksCalledCorrectly(); + }); }); describe('when retrying', () => { @@ -152,21 +145,19 @@ describe('useKubernetesObjects', () => { mockGetObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity, 100), - ); + const { result } = renderHook(() => useKubernetesObjects(entity, 100)); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('generateAuth failed'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); - expect(result.current.error).toBe('generateAuth failed'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); }); it('should reset error after getObjectsByEntity has failed and then succeeded', async () => { @@ -176,21 +167,19 @@ describe('useKubernetesObjects', () => { .mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity, 100), - ); + const { result } = renderHook(() => useKubernetesObjects(entity, 100)); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBe('failed to fetch'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); - expect(result.current.error).toBe('failed to fetch'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); }); it('should reset data after generateAuth succeeded then failed', async () => { @@ -202,21 +191,19 @@ describe('useKubernetesObjects', () => { mockGetObjectsByEntity.mockResolvedValue(mockResponse), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity, 100), - ); + const { result } = renderHook(() => useKubernetesObjects(entity, 100)); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBe('generateAuth failed'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBe('generateAuth failed'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); }); it('should reset data after getObjectsByEntity succeeded then failed', async () => { @@ -226,21 +213,19 @@ describe('useKubernetesObjects', () => { .mockRejectedValue({ message: 'failed to fetch' }), }); - const { result, waitForNextUpdate } = renderHook(() => - useKubernetesObjects(entity, 100), - ); + const { result } = renderHook(() => useKubernetesObjects(entity, 100)); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.error).toBeUndefined(); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).not.toBeUndefined(); + }); - expect(result.current.error).toBeUndefined(); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).not.toBeUndefined(); - - await waitForNextUpdate(); - - expect(result.current.error).toBe('failed to fetch'); - expect(result.current.loading).toEqual(false); - expect(result.current.kubernetesObjects).toBeUndefined(); + await waitFor(() => { + expect(result.current.error).toBe('failed to fetch'); + expect(result.current.loading).toEqual(false); + expect(result.current.kubernetesObjects).toBeUndefined(); + }); }); }); }); diff --git a/plugins/kubernetes-react/src/hooks/useMatchingErrors.test.tsx b/plugins/kubernetes-react/src/hooks/useMatchingErrors.test.tsx index 4d817e838d..f8312eac4e 100644 --- a/plugins/kubernetes-react/src/hooks/useMatchingErrors.test.tsx +++ b/plugins/kubernetes-react/src/hooks/useMatchingErrors.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { DetectedErrorsContext, useMatchingErrors } from './useMatchingErrors'; import { DetectedError, diff --git a/plugins/kubernetes-react/src/hooks/usePodMetrics.test.tsx b/plugins/kubernetes-react/src/hooks/usePodMetrics.test.tsx index be74448abd..45c53e822d 100644 --- a/plugins/kubernetes-react/src/hooks/usePodMetrics.test.tsx +++ b/plugins/kubernetes-react/src/hooks/usePodMetrics.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { PodMetricsContext, usePodMetrics } from './usePodMetrics'; import { ClientPodStatus } from '@backstage/plugin-kubernetes-common'; diff --git a/plugins/kubernetes/package.json b/plugins/kubernetes/package.json index db8f6455ce..ed2dfd35ec 100644 --- a/plugins/kubernetes/package.json +++ b/plugins/kubernetes/package.json @@ -62,8 +62,8 @@ "xterm-addon-fit": "^0.8.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -73,8 +73,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "jest-websocket-mock": "^2.4.1", "msw": "^1.0.0" diff --git a/plugins/lighthouse/package.json b/plugins/lighthouse/package.json index a63c6bab59..c039ae6b30 100644 --- a/plugins/lighthouse/package.json +++ b/plugins/lighthouse/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,8 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/lighthouse/src/hooks/useWebsiteForEntity.test.tsx b/plugins/lighthouse/src/hooks/useWebsiteForEntity.test.tsx index 199ede3049..69acd34dc3 100644 --- a/plugins/lighthouse/src/hooks/useWebsiteForEntity.test.tsx +++ b/plugins/lighthouse/src/hooks/useWebsiteForEntity.test.tsx @@ -15,7 +15,7 @@ */ import { Entity } from '@backstage/catalog-model'; import { EntityProvider } from '@backstage/plugin-catalog-react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import React, { PropsWithChildren } from 'react'; import { WebsiteListResponse } from '@backstage/plugin-lighthouse-common'; import { lighthouseApiRef } from '../api'; @@ -77,9 +77,10 @@ describe('useWebsiteForEntity', () => { }); it('returns the lighthouse information for the website url in annotations', async () => { - const { result, waitForNextUpdate } = subject(); - await waitForNextUpdate(); - expect(result.current?.value).toBe(website); + const { result } = subject(); + await waitFor(() => { + expect(result.current?.value).toBe(website); + }); }); describe('where there is an error', () => { @@ -92,10 +93,11 @@ describe('useWebsiteForEntity', () => { }); it('posts the error to the error api and returns the error to the caller', async () => { - const { result, waitForNextUpdate } = subject(); - await waitForNextUpdate(); - expect(result.current?.error).toBe(error); - expect(mockErrorApi.post).toHaveBeenCalledWith(error); + const { result } = subject(); + await waitFor(() => { + expect(result.current?.error).toBe(error); + expect(mockErrorApi.post).toHaveBeenCalledWith(error); + }); }); }); @@ -109,10 +111,11 @@ describe('useWebsiteForEntity', () => { }); it('does not post the error to the error api and returns the error to the caller', async () => { - const { result, waitForNextUpdate } = subject(); - await waitForNextUpdate(); - expect(result.current?.error).toBe(error); - expect(mockErrorApi.post).not.toHaveBeenCalledWith(error); + const { result } = subject(); + await waitFor(() => { + expect(result.current?.error).toBe(error); + expect(mockErrorApi.post).not.toHaveBeenCalledWith(error); + }); }); }); }); diff --git a/plugins/linguist/package.json b/plugins/linguist/package.json index df1e1f962b..3d101548a2 100644 --- a/plugins/linguist/package.json +++ b/plugins/linguist/package.json @@ -45,8 +45,8 @@ "slugify": "^1.6.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/microsoft-calendar/package.json b/plugins/microsoft-calendar/package.json index 8b19d35ef0..57c4a75c39 100644 --- a/plugins/microsoft-calendar/package.json +++ b/plugins/microsoft-calendar/package.json @@ -65,8 +65,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -76,7 +76,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/newrelic-dashboard/package.json b/plugins/newrelic-dashboard/package.json index bd24971549..15f25d6cc7 100644 --- a/plugins/newrelic-dashboard/package.json +++ b/plugins/newrelic-dashboard/package.json @@ -41,8 +41,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/newrelic/package.json b/plugins/newrelic/package.json index 3fb1326005..c4da950dee 100644 --- a/plugins/newrelic/package.json +++ b/plugins/newrelic/package.json @@ -45,8 +45,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -57,7 +57,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/parse-link-header": "^2.0.1", "cross-fetch": "^3.1.5", diff --git a/plugins/nomad/package.json b/plugins/nomad/package.json index 3623019c4c..617c8e2c5a 100644 --- a/plugins/nomad/package.json +++ b/plugins/nomad/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -53,7 +53,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/octopus-deploy/package.json b/plugins/octopus-deploy/package.json index 6c72fe2446..3da25dc2c3 100644 --- a/plugins/octopus-deploy/package.json +++ b/plugins/octopus-deploy/package.json @@ -41,8 +41,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -52,7 +52,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/opencost/package.json b/plugins/opencost/package.json index a79b79c0b2..f751ed3ba5 100644 --- a/plugins/opencost/package.json +++ b/plugins/opencost/package.json @@ -40,7 +40,7 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "*" }, "devDependencies": { @@ -49,7 +49,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/org-react/package.json b/plugins/org-react/package.json index 9e49b7bda6..2097c7658a 100644 --- a/plugins/org-react/package.json +++ b/plugins/org-react/package.json @@ -45,8 +45,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/org/package.json b/plugins/org/package.json index d5dca29faa..b9bf7f0c02 100644 --- a/plugins/org/package.json +++ b/plugins/org/package.json @@ -46,8 +46,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,8 +61,7 @@ "@backstage/types": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.1", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.test.ts b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.test.ts index 587dc689e3..eac5a171ba 100644 --- a/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.test.ts +++ b/plugins/org/src/components/Cards/OwnershipCard/useGetEntities.test.ts @@ -16,7 +16,7 @@ import { CompoundEntityRef, Entity } from '@backstage/catalog-model'; import { useGetEntities } from './useGetEntities'; import { CatalogApi } from '@backstage/catalog-client'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { getEntityRelations } from '@backstage/plugin-catalog-react'; const givenParentGroup = 'team.squad1'; @@ -66,14 +66,14 @@ describe('useGetEntities', () => { describe('given aggregated relationsType', () => { const whenHookIsCalledWith = async (_entity: Entity) => { - const hook = renderHook( + const { result } = renderHook( ({ entity }) => useGetEntities(entity, 'aggregated'), { initialProps: { entity: _entity }, }, ); - await hook.waitForNextUpdate(); + await waitFor(() => expect(result.current.loading).toBe(false)); }; beforeEach(() => { @@ -207,14 +207,14 @@ describe('useGetEntities', () => { describe('given direct relationsType', () => { const whenHookIsCalledWith = async (_entity: Entity) => { - const hook = renderHook( + const { result } = renderHook( ({ entity }) => useGetEntities(entity, 'direct'), { initialProps: { entity: _entity }, }, ); - await hook.waitForNextUpdate(); + await waitFor(() => expect(result.current.loading).toBe(false)); }; it('given group entity should return directly owned entities', async () => { diff --git a/plugins/pagerduty/package.json b/plugins/pagerduty/package.json index d221a753e4..0130724cfa 100644 --- a/plugins/pagerduty/package.json +++ b/plugins/pagerduty/package.json @@ -50,8 +50,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/periskop/package.json b/plugins/periskop/package.json index e1cd374cce..9ec13e9ce1 100644 --- a/plugins/periskop/package.json +++ b/plugins/periskop/package.json @@ -43,8 +43,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -54,7 +54,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/luxon": "^3.0.0", "msw": "^1.0.0" diff --git a/plugins/permission-react/package.json b/plugins/permission-react/package.json index 145b6f7d42..9a9650e762 100644 --- a/plugins/permission-react/package.json +++ b/plugins/permission-react/package.json @@ -41,15 +41,15 @@ "swr": "^2.0.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { "@backstage/cli": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3" + "@testing-library/react": "^14.0.0" }, "files": [ "dist" diff --git a/plugins/playlist/package.json b/plugins/playlist/package.json index 224705983b..de53e9fafe 100644 --- a/plugins/playlist/package.json +++ b/plugins/playlist/package.json @@ -51,8 +51,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -63,8 +63,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0", "swr": "^2.0.0" diff --git a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.test.tsx b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.test.tsx index ef8ca57b69..c21283bcce 100644 --- a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.test.tsx +++ b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.test.tsx @@ -22,8 +22,7 @@ import { } from '@backstage/plugin-permission-react'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; import { Button } from '@material-ui/core'; -import { fireEvent, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, waitFor, act } from '@testing-library/react'; import React from 'react'; import { SWRConfig } from 'swr'; import { PlaylistApi, playlistApiRef } from '../../api'; @@ -111,6 +110,8 @@ describe('', () => { act(() => { fireEvent.click(rendered.getByRole('button')); + }); + act(() => { fireEvent.click(rendered.getByTestId('mock-playlist-edit-dialog')); }); @@ -129,6 +130,8 @@ describe('', () => { act(() => { fireEvent.click(rendered.getByRole('button')); + }); + act(() => { fireEvent.click(rendered.getByTestId('mock-playlist-edit-dialog')); }); diff --git a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.test.tsx b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.test.tsx index 828485bc3d..68e00b6b96 100644 --- a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.test.tsx +++ b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.test.tsx @@ -24,8 +24,7 @@ import { permissionApiRef, } from '@backstage/plugin-permission-react'; import { Button } from '@material-ui/core'; -import { fireEvent, getByRole, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, getByRole, waitFor, act } from '@testing-library/react'; import React from 'react'; import { SWRConfig } from 'swr'; import { PlaylistApi, playlistApiRef } from '../../api'; diff --git a/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.test.tsx b/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.test.tsx index b01b5acbf2..eaf00cbde1 100644 --- a/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.test.tsx +++ b/plugins/playlist/src/components/PlaylistEditDialog/PlaylistEditDialog.test.tsx @@ -16,8 +16,7 @@ import { IdentityApi, identityApiRef } from '@backstage/core-plugin-api'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; -import { fireEvent, getByRole, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, getByRole, waitFor, act } from '@testing-library/react'; import { PlaylistApi, playlistApiRef } from '../../api'; import React from 'react'; @@ -79,7 +78,9 @@ describe('', () => { }, }, ); + }); + act(() => { fireEvent.input( getByRole( rendered.getByTestId('edit-dialog-description-input'), @@ -91,17 +92,25 @@ describe('', () => { }, }, ); + }); + act(() => { fireEvent.mouseDown( getByRole(rendered.getByTestId('edit-dialog-owner-select'), 'button'), ); + }); + act(() => { fireEvent.click(rendered.getByText('test-owner')); + }); + act(() => { fireEvent.click( getByRole(rendered.getByTestId('edit-dialog-public-option'), 'radio'), ); + }); + act(() => { fireEvent.click(rendered.getByTestId('edit-dialog-save-button')); }); diff --git a/plugins/playlist/src/components/PlaylistPage/AddEntitiesDrawer.test.tsx b/plugins/playlist/src/components/PlaylistPage/AddEntitiesDrawer.test.tsx index d1bdf1d46a..96ec5677e7 100644 --- a/plugins/playlist/src/components/PlaylistPage/AddEntitiesDrawer.test.tsx +++ b/plugins/playlist/src/components/PlaylistPage/AddEntitiesDrawer.test.tsx @@ -21,8 +21,7 @@ import { } from '@backstage/plugin-catalog-react'; import { SearchApi, searchApiRef } from '@backstage/plugin-search-react'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; -import { fireEvent, getByText } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, getByText, act } from '@testing-library/react'; import React from 'react'; import { AddEntitiesDrawer } from './AddEntitiesDrawer'; diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.test.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.test.tsx index 21658ef36e..ba6f94e945 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.test.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistEntitiesTable.test.tsx @@ -23,8 +23,7 @@ import { } from '@backstage/plugin-permission-react'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; import { Button } from '@material-ui/core'; -import { fireEvent, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, waitFor, act } from '@testing-library/react'; import React from 'react'; import { SWRConfig } from 'swr'; import { PlaylistApi, playlistApiRef } from '../../api'; diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.test.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.test.tsx index 4594a43a88..480ac038f2 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.test.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.test.tsx @@ -27,8 +27,7 @@ import { import { permissions, Playlist } from '@backstage/plugin-playlist-common'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; import { Button } from '@material-ui/core'; -import { fireEvent, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, waitFor, act } from '@testing-library/react'; import React from 'react'; import { SWRConfig } from 'swr'; import { PlaylistApi, playlistApiRef } from '../../api'; @@ -193,6 +192,8 @@ describe('PlaylistHeader', () => { act(() => { fireEvent.click(rendered.getByTestId('header-action-menu')); + }); + act(() => { fireEvent.click( rendered .getAllByTestId('header-action-item') @@ -225,11 +226,15 @@ describe('PlaylistHeader', () => { act(() => { fireEvent.click(rendered.getByTestId('header-action-menu')); + }); + act(() => { fireEvent.click( rendered .getAllByTestId('header-action-item') .find(e => e.innerHTML.includes('Delete Playlist'))!, ); + }); + act(() => { fireEvent.click(rendered.getByTestId('delete-playlist-dialog-button')); }); diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistPage.test.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistPage.test.tsx index 65d3d79be6..ef9b6d060b 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistPage.test.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistPage.test.tsx @@ -21,8 +21,7 @@ import { permissionApiRef, } from '@backstage/plugin-permission-react'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; -import { fireEvent, getByText, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { fireEvent, getByText, waitFor, act } from '@testing-library/react'; import React from 'react'; import { SWRConfig } from 'swr'; @@ -110,8 +109,8 @@ describe('PlaylistPage', () => { act(() => { fireEvent.click(rendered.getByTestId('playlist-page-follow-button')); - testPlaylist.isFollowing = true; }); + testPlaylist.isFollowing = true; await waitFor(() => { expect(playlistApi.followPlaylist).toHaveBeenCalledWith('id1'); @@ -125,8 +124,8 @@ describe('PlaylistPage', () => { act(() => { fireEvent.click(rendered.getByTestId('playlist-page-follow-button')); - testPlaylist.isFollowing = false; }); + testPlaylist.isFollowing = false; await waitFor(() => { expect(playlistApi.unfollowPlaylist).toHaveBeenCalledWith('id1'); diff --git a/plugins/playlist/src/components/PlaylistSortPicker/PlaylistSortPicker.test.tsx b/plugins/playlist/src/components/PlaylistSortPicker/PlaylistSortPicker.test.tsx index 9317bfd4c1..6c86b7b34d 100644 --- a/plugins/playlist/src/components/PlaylistSortPicker/PlaylistSortPicker.test.tsx +++ b/plugins/playlist/src/components/PlaylistSortPicker/PlaylistSortPicker.test.tsx @@ -14,8 +14,13 @@ * limitations under the License. */ -import { fireEvent, getByRole, render, waitFor } from '@testing-library/react'; -import { act } from '@testing-library/react-hooks'; +import { + fireEvent, + getByRole, + render, + waitFor, + act, +} from '@testing-library/react'; import React from 'react'; import { MockPlaylistListProvider } from '../../testUtils'; diff --git a/plugins/playlist/src/hooks/PlaylistListProvider.test.tsx b/plugins/playlist/src/hooks/PlaylistListProvider.test.tsx index 26e162ebf7..ce0d49802b 100644 --- a/plugins/playlist/src/hooks/PlaylistListProvider.test.tsx +++ b/plugins/playlist/src/hooks/PlaylistListProvider.test.tsx @@ -22,7 +22,7 @@ import { } from '@backstage/core-plugin-api'; import { Playlist } from '@backstage/plugin-playlist-common'; import { TestApiProvider } from '@backstage/test-utils'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import qs from 'qs'; import React, { PropsWithChildren } from 'react'; import { MemoryRouter } from 'react-router-dom'; @@ -114,23 +114,22 @@ describe('', () => { }); it('resolves backend filters', async () => { - const { result, waitForValueToChange } = renderHook( - () => usePlaylistList(), - { - wrapper, - }, - ); - await waitForValueToChange(() => result.current.backendPlaylists); - expect(result.current.backendPlaylists.length).toBe(2); - expect(mockPlaylistApi.getAllPlaylists).toHaveBeenCalled(); + const { result } = renderHook(() => usePlaylistList(), { + wrapper, + }); + await waitFor(() => { + expect(result.current.backendPlaylists.length).toBe(2); + expect(mockPlaylistApi.getAllPlaylists).toHaveBeenCalled(); + }); }); it('resolves frontend filters', async () => { - const { result, waitFor } = renderHook(() => usePlaylistList(), { + const { result } = renderHook(() => usePlaylistList(), { wrapper, }); - await waitFor(() => !!result.current.playlists.length); - expect(result.current.backendPlaylists.length).toBe(2); + await waitFor(() => { + expect(result.current.backendPlaylists.length).toBe(2); + }); act(() => result.current.updateFilters({ @@ -152,21 +151,21 @@ describe('', () => { const query = qs.stringify({ filters: { personal: 'all', owners: ['user:default/guest'] }, }); - const { result, waitFor } = renderHook(() => usePlaylistList(), { - wrapper, - initialProps: { - location: `/playlist?${query}`, - }, + const { result } = renderHook(() => usePlaylistList(), { + wrapper: ({ children }) => + wrapper({ location: `/playlist?${query}`, children }), }); - await waitFor(() => !!result.current.queryParameters); - expect(result.current.queryParameters).toEqual({ - personal: 'all', - owners: ['user:default/guest'], + + await waitFor(() => { + expect(result.current.queryParameters).toEqual({ + personal: 'all', + owners: ['user:default/guest'], + }); }); }); it('does not fetch when only frontend filters change', async () => { - const { result, waitFor } = renderHook(() => usePlaylistList(), { + const { result } = renderHook(() => usePlaylistList(), { wrapper, }); @@ -191,7 +190,7 @@ describe('', () => { }); it('applies custom sorting', async () => { - const { result, waitFor } = renderHook(() => usePlaylistList(), { + const { result } = renderHook(() => usePlaylistList(), { wrapper, }); @@ -216,7 +215,7 @@ describe('', () => { it('returns an error on playlistApi failure', async () => { mockPlaylistApi.getAllPlaylists = jest.fn().mockRejectedValue('error'); - const { result, waitFor } = renderHook(() => usePlaylistList(), { + const { result } = renderHook(() => usePlaylistList(), { wrapper, }); await waitFor(() => { diff --git a/plugins/puppetdb/package.json b/plugins/puppetdb/package.json index ae351f5df7..89cd83fcde 100644 --- a/plugins/puppetdb/package.json +++ b/plugins/puppetdb/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -58,7 +58,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.1" }, diff --git a/plugins/rollbar/package.json b/plugins/rollbar/package.json index 316f9532a1..d82402c03e 100644 --- a/plugins/rollbar/package.json +++ b/plugins/rollbar/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,8 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/scaffolder-react/package.json b/plugins/scaffolder-react/package.json index df4a3c867f..5f29f96946 100644 --- a/plugins/scaffolder-react/package.json +++ b/plugins/scaffolder-react/package.json @@ -81,8 +81,8 @@ "zod-to-json-schema": "^3.20.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -93,8 +93,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/humanize-duration": "^3.18.1", "@types/luxon": "^3.0.0" diff --git a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx index 24126152ed..34243e232d 100644 --- a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx +++ b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx @@ -273,12 +273,12 @@ describe('Stepper', () => { />, ); - await act(async () => { - await fireEvent.click(getByRole('button', { name: 'Review' })); - - expect(getByRole('progressbar')).toBeInTheDocument(); - expect(getByRole('button', { name: 'Review' })).toBeDisabled(); + act(() => { + fireEvent.click(getByRole('button', { name: 'Review' })); }); + + expect(getByRole('progressbar')).toBeInTheDocument(); + expect(getByRole('button', { name: 'Review' })).toBeDisabled(); }); it('should transform default error message', async () => { diff --git a/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.test.tsx b/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.test.tsx index ce6e342809..f3a6a99c42 100644 --- a/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.test.tsx +++ b/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.test.tsx @@ -20,6 +20,7 @@ import { TemplateCategoryPicker } from './TemplateCategoryPicker'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; import { alertApiRef } from '@backstage/core-plugin-api'; import { fireEvent } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; jest.mock('@backstage/plugin-catalog-react', () => ({ useEntityTypeFilter: jest.fn(), @@ -91,7 +92,7 @@ describe('TemplateCategoryPicker', () => { ); const openButton = getByRole('button', { name: 'Open' }); - openButton.click(); + await userEvent.click(openButton); expect(getByRole('checkbox', { name: 'Foo' })).toBeInTheDocument(); expect(getByRole('checkbox', { name: 'Bar' })).toBeInTheDocument(); diff --git a/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.test.tsx b/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.test.tsx index 9a0732442c..d2771b2eb9 100644 --- a/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.test.tsx +++ b/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import { useTemplateSchema } from './useTemplateSchema'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { TestApiProvider } from '@backstage/test-utils'; import React from 'react'; import { featureFlagsApiRef } from '@backstage/core-plugin-api'; diff --git a/plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.test.tsx b/plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.test.tsx index 7ee5cbfdfd..4138c8cde0 100644 --- a/plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.test.tsx +++ b/plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React, { PropsWithChildren } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { TestApiProvider } from '@backstage/test-utils'; import { type ParsedTemplateSchema } from './useTemplateSchema'; import { useTransformSchemaToProps } from './useTransformSchemaToProps'; diff --git a/plugins/scaffolder-react/src/secrets/SecretsContext.test.tsx b/plugins/scaffolder-react/src/secrets/SecretsContext.test.tsx index 553f27d2a9..4d56b5764c 100644 --- a/plugins/scaffolder-react/src/secrets/SecretsContext.test.tsx +++ b/plugins/scaffolder-react/src/secrets/SecretsContext.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; import { useTemplateSecrets, SecretsContextProvider } from './SecretsContext'; -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; describe('SecretsContext', () => { it('should allow the setting of secrets in the context', async () => { diff --git a/plugins/scaffolder/package.json b/plugins/scaffolder/package.json index f6ca5b5003..d36ce86acc 100644 --- a/plugins/scaffolder/package.json +++ b/plugins/scaffolder/package.json @@ -92,8 +92,8 @@ "zod-to-json-schema": "^3.20.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -104,8 +104,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/humanize-duration": "^3.18.1", "@types/json-schema": "^7.0.9", diff --git a/plugins/scaffolder/src/components/ActionsPage/ActionsPage.test.tsx b/plugins/scaffolder/src/components/ActionsPage/ActionsPage.test.tsx index a402e078a8..614e3fcff0 100644 --- a/plugins/scaffolder/src/components/ActionsPage/ActionsPage.test.tsx +++ b/plugins/scaffolder/src/components/ActionsPage/ActionsPage.test.tsx @@ -22,6 +22,7 @@ import { import { renderInTestApp, TestApiRegistry } from '@backstage/test-utils'; import { ApiProvider } from '@backstage/core-app-api'; import { rootRouteRef } from '../../routes'; +import { userEvent } from '@testing-library/user-event'; const scaffolderApiMock: jest.Mocked = { scaffold: jest.fn(), @@ -261,7 +262,7 @@ describe('TemplatePage', () => { expect(rendered.queryByText('nested prop b')).not.toBeInTheDocument(); expect(rendered.queryByText('number')).not.toBeInTheDocument(); - objectChip.click(); + await userEvent.click(objectChip); expect(rendered.queryByText('nested prop a')).toBeInTheDocument(); expect(rendered.queryByText('string')).toBeInTheDocument(); @@ -323,7 +324,7 @@ describe('TemplatePage', () => { expect(rendered.queryByText('nested prop b')).not.toBeInTheDocument(); expect(rendered.queryByText('nested object c')).not.toBeInTheDocument(); - objectChip.click(); + await userEvent.click(objectChip); expect(rendered.queryByText('nested object a')).toBeInTheDocument(); expect(rendered.queryByText('nested prop b')).toBeInTheDocument(); @@ -331,7 +332,7 @@ describe('TemplatePage', () => { const allObjectChips = rendered.getAllByText('object'); expect(allObjectChips.length).toBe(2); - allObjectChips[1].click(); + await userEvent.click(allObjectChips[1]); expect(rendered.queryByText('nested object a')).toBeInTheDocument(); expect(rendered.queryByText('nested prop b')).toBeInTheDocument(); @@ -374,7 +375,7 @@ describe('TemplatePage', () => { expect(rendered.queryByText('No schema defined')).not.toBeInTheDocument(); - objectChip.click(); + await userEvent.click(objectChip); expect(rendered.queryByText('No schema defined')).toBeInTheDocument(); }); @@ -471,7 +472,7 @@ describe('TemplatePage', () => { expect(rendered.queryByText('nested object a')).not.toBeInTheDocument(); expect(rendered.queryByText('nested prop b')).not.toBeInTheDocument(); - objectChip.click(); + await userEvent.click(objectChip); expect(rendered.queryByText('nested object a')).toBeInTheDocument(); expect(rendered.queryByText('nested prop b')).toBeInTheDocument(); diff --git a/plugins/scaffolder/src/legacy/TemplateEditorPage/CustomFieldExplorer.tsx b/plugins/scaffolder/src/legacy/TemplateEditorPage/CustomFieldExplorer.tsx index 0ba5db560a..9107ac67eb 100644 --- a/plugins/scaffolder/src/legacy/TemplateEditorPage/CustomFieldExplorer.tsx +++ b/plugins/scaffolder/src/legacy/TemplateEditorPage/CustomFieldExplorer.tsx @@ -101,7 +101,7 @@ export const CustomFieldExplorer = ({ }, [customFieldExtensions]); const handleSelectionChange = useCallback( - selection => { + (selection: LegacyFieldExtensionOptions) => { setSelectedField(selection); setFieldFormState({}); setFormState({}); @@ -110,7 +110,7 @@ export const CustomFieldExplorer = ({ ); const handleFieldConfigChange = useCallback( - state => { + (state: {}) => { setFieldFormState(state); // Force TemplateEditorForm to re-render since some fields // may not be responsive to ui:option changes @@ -130,7 +130,11 @@ export const CustomFieldExplorer = ({ value={selectedField} label="Choose Custom Field Extension" labelId="select-field-label" - onChange={e => handleSelectionChange(e.target.value)} + onChange={e => + handleSelectionChange( + e.target.value as LegacyFieldExtensionOptions, + ) + } > {fieldOptions.map((option, idx) => ( diff --git a/plugins/scaffolder/src/legacy/TemplateEditorPage/TemplateFormPreviewer.tsx b/plugins/scaffolder/src/legacy/TemplateEditorPage/TemplateFormPreviewer.tsx index b83acf85a5..9e92d12d93 100644 --- a/plugins/scaffolder/src/legacy/TemplateEditorPage/TemplateFormPreviewer.tsx +++ b/plugins/scaffolder/src/legacy/TemplateEditorPage/TemplateFormPreviewer.tsx @@ -162,7 +162,8 @@ export const TemplateFormPreviewer = ({ ); const handleSelectChange = useCallback( - selected => { + // TODO(Rugvip): Afaik this should be Entity, but didn't want to make runtime changes while fixing types + (selected: any) => { setSelectedTemplate(selected); setTemplateYaml(yaml.stringify(selected.spec)); }, diff --git a/plugins/scaffolder/src/next/TemplateEditorPage/DryRunResults/DryRunResultsView.test.tsx b/plugins/scaffolder/src/next/TemplateEditorPage/DryRunResults/DryRunResultsView.test.tsx index c2d8d3a2a4..c5c391907e 100644 --- a/plugins/scaffolder/src/next/TemplateEditorPage/DryRunResults/DryRunResultsView.test.tsx +++ b/plugins/scaffolder/src/next/TemplateEditorPage/DryRunResults/DryRunResultsView.test.tsx @@ -16,7 +16,7 @@ import { entityRouteRef } from '@backstage/plugin-catalog-react'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; -import { screen } from '@testing-library/react'; +import { screen, waitFor } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import React, { ReactNode, useEffect } from 'react'; import { scaffolderApiRef } from '@backstage/plugin-scaffolder-react'; @@ -91,9 +91,13 @@ describe('DryRunResultsView', () => { expect(screen.queryByText('Foo Link')).not.toBeInTheDocument(); await userEvent.click(screen.getByText('Log')); - expect(screen.getByText('Foo Message')).toBeInTheDocument(); + await waitFor(() => { + expect(screen.getByText('Foo Message')).toBeInTheDocument(); + }); await userEvent.click(screen.getByText('Output')); - expect(screen.getByText('Foo Link')).toBeInTheDocument(); + await waitFor(() => { + expect(screen.getByText('Foo Link')).toBeInTheDocument(); + }); }); }); diff --git a/plugins/search-react/package.json b/plugins/search-react/package.json index b4a370e639..c2c181f657 100644 --- a/plugins/search-react/package.json +++ b/plugins/search-react/package.json @@ -62,8 +62,8 @@ "react-use": "^17.3.2" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -72,8 +72,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0" }, "files": [ diff --git a/plugins/search-react/src/components/SearchBar/SearchBar.test.tsx b/plugins/search-react/src/components/SearchBar/SearchBar.test.tsx index ce3c285852..d9b29584f8 100644 --- a/plugins/search-react/src/components/SearchBar/SearchBar.test.tsx +++ b/plugins/search-react/src/components/SearchBar/SearchBar.test.tsx @@ -318,7 +318,7 @@ describe('SearchBar', () => { , ); - const textbox = screen.getByLabelText('Search'); + const textbox = screen.getByLabelText('Search'); let value = 'value'; await user.type(textbox, value); @@ -339,6 +339,8 @@ describe('SearchBar', () => { value = 'new value'; await user.clear(textbox); + await waitFor(() => expect(textbox.value).toBe('')); + // make sure new term is captured await user.type(textbox, value); await waitFor(() => { diff --git a/plugins/search-react/src/components/SearchFilter/SearchFilter.Autocomplete.test.tsx b/plugins/search-react/src/components/SearchFilter/SearchFilter.Autocomplete.test.tsx index e95f7fa856..abf5e828f6 100644 --- a/plugins/search-react/src/components/SearchFilter/SearchFilter.Autocomplete.test.tsx +++ b/plugins/search-react/src/components/SearchFilter/SearchFilter.Autocomplete.test.tsx @@ -364,7 +364,7 @@ describe('SearchFilter.Autocomplete', () => { }); // Blur the field and only one tag should be shown with a +1. - input.blur(); + await userEvent.tab(); expect( screen.queryByRole('button', { name: values[0] }), ).not.toBeInTheDocument(); diff --git a/plugins/search-react/src/components/SearchFilter/hooks.test.tsx b/plugins/search-react/src/components/SearchFilter/hooks.test.tsx index 5135cd4ae6..884512963f 100644 --- a/plugins/search-react/src/components/SearchFilter/hooks.test.tsx +++ b/plugins/search-react/src/components/SearchFilter/hooks.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { ApiProvider } from '@backstage/core-app-api'; import { MockConfigApi, TestApiRegistry } from '@backstage/test-utils'; -import { renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import { searchApiRef } from '../../api'; import { SearchContextProvider, useSearch } from '../../context'; @@ -67,7 +67,7 @@ describe('SearchFilter.hooks', () => { it('should set non-empty string value', async () => { const expectedFilter = 'someField'; const expectedValue = 'someValue'; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, expectedValue); return useSearch(); @@ -77,15 +77,15 @@ describe('SearchFilter.hooks', () => { }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should set non-empty array value', async () => { const expectedFilter = 'someField'; const expectedValue = ['someValue', 'anotherValue']; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, expectedValue); return useSearch(); @@ -95,134 +95,139 @@ describe('SearchFilter.hooks', () => { }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should not set undefined value', async () => { const expectedFilter = 'someField'; const expectedValue = 'notEmpty'; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, undefined); return useSearch(); }, { - wrapper, - initialProps: { - overrides: { - filters: { - [expectedFilter]: expectedValue, + wrapper: ({ children }) => + wrapper({ + children, + overrides: { + filters: { + [expectedFilter]: expectedValue, + }, }, - }, - }, + }), }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should not set null value', async () => { const expectedFilter = 'someField'; const expectedValue = 'notEmpty'; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, null); return useSearch(); }, { - wrapper, - initialProps: { - overrides: { - filters: { - [expectedFilter]: expectedValue, + wrapper: ({ children }) => + wrapper({ + children, + overrides: { + filters: { + [expectedFilter]: expectedValue, + }, }, - }, - }, + }), }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should not set empty string value', async () => { const expectedFilter = 'someField'; const expectedValue = 'notEmpty'; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, ''); return useSearch(); }, { - wrapper, - initialProps: { - overrides: { - filters: { - [expectedFilter]: expectedValue, + wrapper: ({ children }) => + wrapper({ + children, + overrides: { + filters: { + [expectedFilter]: expectedValue, + }, }, - }, - }, + }), }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should not set empty array value', async () => { const expectedFilter = 'someField'; const expectedValue = ['not', 'empty']; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, []); return useSearch(); }, { - wrapper, - initialProps: { - overrides: { - filters: { - [expectedFilter]: expectedValue, + wrapper: ({ children }) => + wrapper({ + children, + overrides: { + filters: { + [expectedFilter]: expectedValue, + }, }, - }, - }, + }), }, ); - await waitForNextUpdate(); - - expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + await waitFor(() => { + expect(result.current.filters[expectedFilter]).toEqual(expectedValue); + }); }); it('should not affect unrelated filters', async () => { const expectedFilter = 'someField'; const expectedValue = 'someValue'; - const { result, waitForNextUpdate } = renderHook( + const { result } = renderHook( () => { useDefaultFilterValue(expectedFilter, expectedValue); return useSearch(); }, { - wrapper, - initialProps: { - overrides: { - filters: { - unrelatedField: 'unrelatedValue', + wrapper: ({ children }) => + wrapper({ + children, + overrides: { + filters: { + unrelatedField: 'unrelatedValue', + }, }, - }, - }, + }), }, ); - await waitForNextUpdate(); - - expect(result.current.filters.unrelatedField).toEqual('unrelatedValue'); + await waitFor(() => { + expect(result.current.filters.unrelatedField).toEqual('unrelatedValue'); + }); }); }); @@ -240,14 +245,15 @@ describe('SearchFilter.hooks', () => { it('should return resolved values of provided async function', async () => { const expectedValues = ['value1', 'value2']; const asyncFn = () => Promise.resolve(expectedValues); - const { result, waitForNextUpdate } = renderHook(() => + const { result } = renderHook(() => useAsyncFilterValues(asyncFn, '', undefined, 1000), ); expect(result.current.loading).toEqual(true); - jest.runAllTimers(); - await waitForNextUpdate(); + await act(async () => { + jest.runAllTimers(); + }); expect(result.current.loading).toEqual(false); expect(result.current.value).toEqual(expectedValues); @@ -261,11 +267,15 @@ describe('SearchFilter.hooks', () => { expect(asyncFn).not.toHaveBeenCalled(); // Advance timers by 600ms - jest.advanceTimersByTime(600); + await act(async () => { + jest.advanceTimersByTime(600); + }); expect(asyncFn).not.toHaveBeenCalled(); // Another 600ms to exceed the 1000ms debounce - jest.advanceTimersByTime(600); + await act(async () => { + jest.advanceTimersByTime(600); + }); expect(asyncFn).toHaveBeenCalled(); }); @@ -273,21 +283,23 @@ describe('SearchFilter.hooks', () => { const asyncFn = jest .fn() .mockImplementation((x: string) => Promise.resolve([x])); - const { rerender, waitForNextUpdate } = renderHook( + const { rerender } = renderHook( (props: { inputValue: string } = { inputValue: '' }) => useAsyncFilterValues(asyncFn, props.inputValue, undefined, 1000), ); expect(asyncFn).not.toHaveBeenCalled(); - jest.runAllTimers(); - await waitForNextUpdate(); + await act(async () => { + jest.runAllTimers(); + }); expect(asyncFn).toHaveBeenCalledTimes(1); expect(asyncFn).toHaveBeenCalledWith(''); // Re-render with different input value. rerender({ inputValue: 'somethingElse' }); - jest.runAllTimers(); - await waitForNextUpdate(); + await act(async () => { + jest.runAllTimers(); + }); expect(asyncFn).toHaveBeenCalledTimes(2); expect(asyncFn).toHaveBeenLastCalledWith('somethingElse'); }); @@ -295,15 +307,16 @@ describe('SearchFilter.hooks', () => { it('should not call provided method more than once when re-rendered with same input', async () => { const expectedValues = ['value1', 'value2']; const asyncFn = jest.fn().mockResolvedValue(expectedValues); - const { rerender, waitForNextUpdate } = renderHook( + const { rerender } = renderHook( (props: { inputValue: string } = { inputValue: '' }) => useAsyncFilterValues(asyncFn, props.inputValue, undefined, 1000), ); expect(asyncFn).not.toHaveBeenCalled(); - jest.runAllTimers(); - await waitForNextUpdate(); + await act(async () => { + jest.runAllTimers(); + }); expect(asyncFn).toHaveBeenCalledTimes(1); // Re-render multiple times with the same input. diff --git a/plugins/search-react/src/context/SearchContext.test.tsx b/plugins/search-react/src/context/SearchContext.test.tsx index df71a848b0..5aa217553f 100644 --- a/plugins/search-react/src/context/SearchContext.test.tsx +++ b/plugins/search-react/src/context/SearchContext.test.tsx @@ -15,8 +15,13 @@ */ import { configApiRef } from '@backstage/core-plugin-api'; -import { render, screen, waitFor } from '@testing-library/react'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { + render, + screen, + waitFor, + act, + renderHook, +} from '@testing-library/react'; import { MockConfigApi, TestApiProvider } from '@backstage/test-utils'; import React from 'react'; import { @@ -70,10 +75,8 @@ describe('SearchContext', () => { }); it('Throws error when no context is set', () => { - const { result } = renderHook(() => useSearch()); - - expect(result.error).toEqual( - Error('useSearch must be used within a SearchContextProvider'), + expect(() => renderHook(() => useSearch())).toThrow( + 'useSearch must be used within a SearchContextProvider', ); }); @@ -82,203 +85,188 @@ describe('SearchContext', () => { expect(hook.result.current).toEqual(false); - const { result, waitForNextUpdate } = renderHook( - () => useSearchContextCheck(), - { - wrapper, - initialProps: { - initialState, - }, - }, - ); + const { result } = renderHook(() => useSearchContextCheck(), { + wrapper: ({ children }) => wrapper({ children, initialState }), + }); - await waitForNextUpdate(); - - expect(result.current).toEqual(true); + await waitFor(() => { + expect(result.current).toEqual(true); + }); }); describe('Uses initial state values', () => { it('Uses default initial state values', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { + const { result } = renderHook(() => useSearch(), { wrapper, }); - await waitForNextUpdate(); - - expect(result.current).toEqual( - expect.objectContaining({ - term: '', - types: [], - filters: {}, - pageLimit: undefined, - pageCursor: undefined, - }), - ); + await waitFor(() => { + expect(result.current).toEqual( + expect.objectContaining({ + term: '', + types: [], + filters: {}, + pageLimit: undefined, + pageCursor: undefined, + }), + ); + }); }); it('Uses provided initial state values', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); - - expect(result.current).toEqual(expect.objectContaining(initialState)); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); }); it('Uses page limit provided via config api', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - config: { - search: { - query: { - pageLimit: 100, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => + wrapper({ + children, + initialState, + config: { + search: { + query: { + pageLimit: 100, + }, }, }, - }, - }, + }), }); - await waitForNextUpdate(); - - expect(result.current).toEqual( - expect.objectContaining({ ...initialState, pageLimit: 100 }), - ); + await waitFor(() => { + expect(result.current).toEqual( + expect.objectContaining({ ...initialState, pageLimit: 100 }), + ); + }); }); }); describe('Resets cursor', () => { it('When term is cleared', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState: { - ...initialState, - term: 'first term', - pageCursor: 'SOMEPAGE', - }, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => + wrapper({ + children, + initialState: { + ...initialState, + term: 'first term', + pageCursor: 'SOMEPAGE', + }, + }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.term).toEqual('first term'); + expect(result.current.pageCursor).toEqual('SOMEPAGE'); + }); - expect(result.current.term).toEqual('first term'); - expect(result.current.pageCursor).toEqual('SOMEPAGE'); - - act(() => { + await act(async () => { result.current.setTerm(''); }); - await waitForNextUpdate(); - expect(result.current.pageCursor).toBeUndefined(); }); it('When term is set (and different from previous)', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState: { - ...initialState, - term: 'first term', - pageCursor: 'SOMEPAGE', - }, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => + wrapper({ + children, + initialState: { + ...initialState, + term: 'first term', + pageCursor: 'SOMEPAGE', + }, + }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.term).toEqual('first term'); + expect(result.current.pageCursor).toEqual('SOMEPAGE'); + }); - expect(result.current.term).toEqual('first term'); - expect(result.current.pageCursor).toEqual('SOMEPAGE'); - - act(() => { + await act(async () => { result.current.setTerm('second term'); }); - await waitForNextUpdate(); - expect(result.current.pageCursor).toBeUndefined(); }); it('When filters are cleared', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState: { - ...initialState, - term: 'first term', - filters: { foo: 'bar' }, - pageCursor: 'SOMEPAGE', - }, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => + wrapper({ + children, + initialState: { + ...initialState, + term: 'first term', + filters: { foo: 'bar' }, + pageCursor: 'SOMEPAGE', + }, + }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.filters).toEqual({ foo: 'bar' }); + expect(result.current.pageCursor).toEqual('SOMEPAGE'); + }); - expect(result.current.filters).toEqual({ foo: 'bar' }); - expect(result.current.pageCursor).toEqual('SOMEPAGE'); - - act(() => { + await act(async () => { result.current.setFilters({}); }); - await waitForNextUpdate(); - expect(result.current.pageCursor).toBeUndefined(); }); it('When filters are set (and different from previous)', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState: { - ...initialState, - term: 'first term', - filters: { foo: 'bar' }, - pageCursor: 'SOMEPAGE', - }, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => + wrapper({ + children, + initialState: { + ...initialState, + term: 'first term', + filters: { foo: 'bar' }, + pageCursor: 'SOMEPAGE', + }, + }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current.filters).toEqual({ foo: 'bar' }); + expect(result.current.pageCursor).toEqual('SOMEPAGE'); + }); - expect(result.current.filters).toEqual({ foo: 'bar' }); - expect(result.current.pageCursor).toEqual('SOMEPAGE'); - - act(() => { + await act(async () => { result.current.setFilters({ foo: 'test' }); }); - await waitForNextUpdate(); - expect(result.current.pageCursor).toBeUndefined(); }); }); describe('Performs search (and sets results)', () => { it('When term is set', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); const term = 'term'; - act(() => { + await act(async () => { result.current.setTerm(term); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ term, types: ['*'], @@ -287,23 +275,20 @@ describe('SearchContext', () => { }); it('When types is set', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); const types = ['type']; - act(() => { + await act(async () => { result.current.setTypes(types); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ types, term: '', @@ -312,23 +297,20 @@ describe('SearchContext', () => { }); it('When filters are set', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); const filters = { filter: 'filter' }; - act(() => { + await act(async () => { result.current.setFilters(filters); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ filters, term: '', @@ -337,23 +319,20 @@ describe('SearchContext', () => { }); it('When page limit is set', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); const pageLimit = 30; - act(() => { + await act(async () => { result.current.setPageLimit(pageLimit); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ pageLimit, term: '', @@ -363,23 +342,20 @@ describe('SearchContext', () => { }); it('When page cursor is set', async () => { - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); const pageCursor = 'SOMEPAGE'; - act(() => { + await act(async () => { result.current.setPageCursor(pageCursor); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ pageCursor, term: '', @@ -394,24 +370,21 @@ describe('SearchContext', () => { nextPageCursor: 'NEXT', }); - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); expect(result.current.fetchNextPage).toBeDefined(); expect(result.current.fetchPreviousPage).toBeUndefined(); - act(() => { + await act(async () => { result.current.fetchNextPage!(); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ term: '', types: ['*'], @@ -426,24 +399,21 @@ describe('SearchContext', () => { previousPageCursor: 'PREVIOUS', }); - const { result, waitForNextUpdate } = renderHook(() => useSearch(), { - wrapper, - initialProps: { - initialState, - }, + const { result } = renderHook(() => useSearch(), { + wrapper: ({ children }) => wrapper({ children, initialState }), }); - await waitForNextUpdate(); + await waitFor(() => { + expect(result.current).toEqual(expect.objectContaining(initialState)); + }); expect(result.current.fetchNextPage).toBeUndefined(); expect(result.current.fetchPreviousPage).toBeDefined(); - act(() => { + await act(async () => { result.current.fetchPreviousPage!(); }); - await waitForNextUpdate(); - expect(searchApiMock.query).toHaveBeenLastCalledWith({ term: '', types: ['*'], diff --git a/plugins/search/package.json b/plugins/search/package.json index fe84cbe0df..23abaefa1d 100644 --- a/plugins/search/package.json +++ b/plugins/search/package.json @@ -66,8 +66,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -77,8 +77,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "history": "^5.0.0", "msw": "^1.0.0" diff --git a/plugins/search/src/components/SearchModal/useSearchModal.test.tsx b/plugins/search/src/components/SearchModal/useSearchModal.test.tsx index e21f864ac2..a78f9b92af 100644 --- a/plugins/search/src/components/SearchModal/useSearchModal.test.tsx +++ b/plugins/search/src/components/SearchModal/useSearchModal.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook } from '@testing-library/react'; import { useSearchModal } from './useSearchModal'; import { BrowserRouter, Router } from 'react-router-dom'; import { createMemoryHistory } from 'history'; diff --git a/plugins/sentry/package.json b/plugins/sentry/package.json index f0a47e966b..3856270628 100644 --- a/plugins/sentry/package.json +++ b/plugins/sentry/package.json @@ -50,8 +50,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/luxon": "^3.0.0", "cross-fetch": "^3.1.5", diff --git a/plugins/shortcuts/package.json b/plugins/shortcuts/package.json index 263b476c0e..c38125d561 100644 --- a/plugins/shortcuts/package.json +++ b/plugins/shortcuts/package.json @@ -44,8 +44,8 @@ "zen-observable": "^0.10.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -55,7 +55,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/zen-observable": "^0.8.2", "msw": "^1.0.0" diff --git a/plugins/sonarqube-react/package.json b/plugins/sonarqube-react/package.json index c04fdf394c..c643df3702 100644 --- a/plugins/sonarqube-react/package.json +++ b/plugins/sonarqube-react/package.json @@ -45,8 +45,8 @@ "@backstage/core-plugin-api": "workspace:^" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { diff --git a/plugins/sonarqube/package.json b/plugins/sonarqube/package.json index b812b5dd8f..00d6c494db 100644 --- a/plugins/sonarqube/package.json +++ b/plugins/sonarqube/package.json @@ -53,8 +53,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -64,7 +64,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/splunk-on-call/package.json b/plugins/splunk-on-call/package.json index bef2ebbb52..e07a08254f 100644 --- a/plugins/splunk-on-call/package.json +++ b/plugins/splunk-on-call/package.json @@ -48,8 +48,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -59,7 +59,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/luxon": "^3.0.0", "msw": "^1.0.0" diff --git a/plugins/splunk-on-call/src/components/Incident/Incidents.test.tsx b/plugins/splunk-on-call/src/components/Incident/Incidents.test.tsx index 665dd3281c..9b8d5feb97 100644 --- a/plugins/splunk-on-call/src/components/Incident/Incidents.test.tsx +++ b/plugins/splunk-on-call/src/components/Incident/Incidents.test.tsx @@ -34,8 +34,12 @@ const apis = TestApiRegistry.from( ); describe('Incidents', () => { + beforeEach(() => { + jest.useFakeTimers(); + }); afterEach(() => { jest.resetAllMocks(); + jest.useRealTimers(); }); it('Renders an empty state when there are no incidents', async () => { @@ -47,13 +51,10 @@ describe('Incidents', () => { , ); - await waitFor(() => !screen.queryByTestId('progress')); - await waitFor( - () => - expect( - screen.getByText('Nice! No incidents found!'), - ).toBeInTheDocument(), - { timeout: 2000 }, + jest.advanceTimersByTime(2000); + await waitFor(() => expect(screen.queryByTestId('progress')).toBe(null)); + await waitFor(() => + expect(screen.getByText('Nice! No incidents found!')).toBeInTheDocument(), ); }); @@ -66,15 +67,14 @@ describe('Incidents', () => { , ); - await waitFor(() => !screen.queryByTestId('progress')); - await waitFor( - () => - expect( - screen.getByText('user', { - exact: false, - }), - ).toBeInTheDocument(), - { timeout: 2000 }, + jest.advanceTimersByTime(2000); + await waitFor(() => expect(screen.queryByTestId('progress')).toBe(null)); + await waitFor(() => + expect( + screen.getByText('user', { + exact: false, + }), + ).toBeInTheDocument(), ); expect(screen.getByText('test-incident')).toBeInTheDocument(); expect(screen.getByTitle('Acknowledged')).toBeInTheDocument(); @@ -93,15 +93,14 @@ describe('Incidents', () => { , ); - await waitFor(() => !screen.queryByTestId('progress')); - await waitFor( - () => - expect( - screen.getByText('user', { - exact: false, - }), - ).toBeInTheDocument(), - { timeout: 2000 }, + jest.advanceTimersByTime(2000); + await waitFor(() => expect(screen.queryByTestId('progress')).toBe(null)); + await waitFor(() => + expect( + screen.getByText('user', { + exact: false, + }), + ).toBeInTheDocument(), ); expect(screen.getByText('test-incident')).toBeInTheDocument(); expect(screen.getByLabelText('Status warning')).toBeInTheDocument(); @@ -127,15 +126,14 @@ describe('Incidents', () => { , ); - await waitFor(() => !screen.queryByTestId('progress')); - await waitFor( - () => - expect( - screen.getByText( - 'Error encountered while fetching information. Error occurred', - ), - ).toBeInTheDocument(), - { timeout: 2000 }, + jest.advanceTimersByTime(2000); + await waitFor(() => expect(screen.queryByTestId('progress')).toBe(null)); + await waitFor(() => + expect( + screen.getByText( + 'Error encountered while fetching information. Error occurred', + ), + ).toBeInTheDocument(), ); }); }); diff --git a/plugins/stack-overflow/package.json b/plugins/stack-overflow/package.json index 74a30cfd73..f60800d1f9 100644 --- a/plugins/stack-overflow/package.json +++ b/plugins/stack-overflow/package.json @@ -46,8 +46,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/dev-utils": "workspace:^", "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/stackstorm/package.json b/plugins/stackstorm/package.json index ac96d2dbc2..76f9958812 100644 --- a/plugins/stackstorm/package.json +++ b/plugins/stackstorm/package.json @@ -45,8 +45,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/tech-insights/package.json b/plugins/tech-insights/package.json index 6539d74abb..7735fb3719 100644 --- a/plugins/tech-insights/package.json +++ b/plugins/tech-insights/package.json @@ -45,8 +45,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -56,7 +56,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/tech-radar/package.json b/plugins/tech-radar/package.json index b7bb44bf81..82fd7ca147 100644 --- a/plugins/tech-radar/package.json +++ b/plugins/tech-radar/package.json @@ -59,8 +59,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -70,7 +70,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/color": "^3.0.1", "@types/d3-force": "^3.0.0", diff --git a/plugins/techdocs-addons-test-utils/package.json b/plugins/techdocs-addons-test-utils/package.json index b59ffc537c..b65cc1d2b1 100644 --- a/plugins/techdocs-addons-test-utils/package.json +++ b/plugins/techdocs-addons-test-utils/package.json @@ -46,14 +46,14 @@ "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.61", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0", "react-use": "^17.2.4", "testing-library__dom": "^7.29.4-beta.1" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,6 @@ "@backstage/dev-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/techdocs-addons-test-utils/src/test-utils.tsx b/plugins/techdocs-addons-test-utils/src/test-utils.tsx index 1a921437b1..865e8c0d3b 100644 --- a/plugins/techdocs-addons-test-utils/src/test-utils.tsx +++ b/plugins/techdocs-addons-test-utils/src/test-utils.tsx @@ -19,7 +19,6 @@ import React, { ReactElement } from 'react'; // Shadow DOM support for the simple and complete DOM testing utilities // https://github.com/testing-library/dom-testing-library/issues/742#issuecomment-674987855 import { screen } from 'testing-library__dom'; -import { renderToStaticMarkup } from 'react-dom/server'; import { Route } from 'react-router-dom'; import { act, render } from '@testing-library/react'; @@ -39,6 +38,13 @@ import { catalogPlugin } from '@backstage/plugin-catalog'; import { searchApiRef } from '@backstage/plugin-search-react'; import { scmIntegrationsApiRef } from '@backstage/integration-react'; +// Since React 18 react-dom/server eagerly uses TextEncoder, so lazy load and make it available globally first +if (!global.TextEncoder) { + global.TextEncoder = require('util').TextEncoder; +} +const { renderToStaticMarkup } = + require('react-dom/server') as typeof import('react-dom/server'); + const techdocsApi = { getTechDocsMetadata: jest.fn(), getEntityMetadata: jest.fn(), diff --git a/plugins/techdocs-module-addons-contrib/package.json b/plugins/techdocs-module-addons-contrib/package.json index 76f358a3a7..cf92b0c969 100644 --- a/plugins/techdocs-module-addons-contrib/package.json +++ b/plugins/techdocs-module-addons-contrib/package.json @@ -49,8 +49,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -61,7 +61,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/react": "^16.13.1 || ^17.0.0", "msw": "^1.0.0" diff --git a/plugins/techdocs-react/package.json b/plugins/techdocs-react/package.json index 17b681a68b..79d2b3cc17 100644 --- a/plugins/techdocs-react/package.json +++ b/plugins/techdocs-react/package.json @@ -49,8 +49,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -58,8 +58,7 @@ "@backstage/test-utils": "workspace:^", "@backstage/theme": "workspace:^", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0" + "@testing-library/react": "^14.0.0" }, "files": [ "alpha", diff --git a/plugins/techdocs-react/src/context.test.tsx b/plugins/techdocs-react/src/context.test.tsx index 4800204f36..bcab445729 100644 --- a/plugins/techdocs-react/src/context.test.tsx +++ b/plugins/techdocs-react/src/context.test.tsx @@ -14,12 +14,16 @@ * limitations under the License. */ import React from 'react'; -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act, waitFor } from '@testing-library/react'; import { ThemeProvider } from '@material-ui/core'; import { lightTheme } from '@backstage/theme'; -import { MockAnalyticsApi, TestApiProvider } from '@backstage/test-utils'; +import { + MockAnalyticsApi, + MockConfigApi, + TestApiProvider, +} from '@backstage/test-utils'; import { Entity, CompoundEntityRef } from '@backstage/catalog-model'; import { analyticsApiRef, @@ -30,6 +34,7 @@ import { import { techdocsApiRef } from './api'; import { useTechDocsReaderPage, TechDocsReaderPageProvider } from './context'; import { TechDocsMetadata } from './types'; +import { JsonObject } from '@backstage/config'; const mockShadowRoot = () => { const div = document.createElement('div'); @@ -60,10 +65,6 @@ const techdocsApiMock = { getTechDocsMetadata: jest.fn().mockResolvedValue(mockTechDocsMetadata), }; -const configApiMock = { - getOptionalBoolean: jest.fn().mockReturnValue(undefined), -}; - const analyticsApiMock = new MockAnalyticsApi(); const wrapper = ({ @@ -72,16 +73,18 @@ const wrapper = ({ name: mockEntityMetadata.metadata.name, namespace: mockEntityMetadata.metadata.namespace!!, }, + config, children, }: { entityRef?: CompoundEntityRef; + config?: JsonObject; children: React.ReactNode; }) => ( @@ -98,47 +101,32 @@ describe('useTechDocsReaderPage', () => { }); it('should set title', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useTechDocsReaderPage(), - { wrapper }, - ); + const { result } = renderHook(() => useTechDocsReaderPage(), { wrapper }); expect(result.current.title).toBe(''); - act(() => result.current.setTitle('test site title')); - - await waitForNextUpdate(); + await act(async () => result.current.setTitle('test site title')); expect(result.current.title).toBe('test site title'); }); it('should set subtitle', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useTechDocsReaderPage(), - { wrapper }, - ); + const { result } = renderHook(() => useTechDocsReaderPage(), { wrapper }); expect(result.current.subtitle).toBe(''); - act(() => result.current.setSubtitle('test site subtitle')); - - await waitForNextUpdate(); + await act(async () => result.current.setSubtitle('test site subtitle')); expect(result.current.subtitle).toBe('test site subtitle'); }); it('should set shadow root', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useTechDocsReaderPage(), - { wrapper }, - ); + const { result } = renderHook(() => useTechDocsReaderPage(), { wrapper }); // mock shadowroot const shadowRoot = mockShadowRoot(); - act(() => result.current.setShadowRoot(shadowRoot)); - - await waitForNextUpdate(); + await act(async () => result.current.setShadowRoot(shadowRoot)); expect(result.current.shadowRoot?.innerHTML).toBe( '

Shadow DOM Mock

', @@ -152,37 +140,42 @@ describe('useTechDocsReaderPage', () => { namespace: mockEntityMetadata.metadata.namespace?.toLocaleLowerCase(), }; const { result } = renderHook(() => useTechDocsReaderPage(), { wrapper }); - - expect(result.current.entityRef).toStrictEqual(lowercaseEntityRef); + await waitFor(() => { + expect(result.current.entityRef).toStrictEqual(lowercaseEntityRef); + }); }); it('entityRef is not modified when legacyUseCaseSensitiveTripletPaths is true', async () => { - configApiMock.getOptionalBoolean.mockReturnValueOnce(true); const caseSensitiveEntityRef = { kind: mockEntityMetadata.kind, name: mockEntityMetadata.metadata.name, namespace: mockEntityMetadata.metadata.namespace!!, }; - const { result } = renderHook(() => useTechDocsReaderPage(), { wrapper }); - - expect(result.current.entityRef).toStrictEqual(caseSensitiveEntityRef); + const { result } = renderHook(() => useTechDocsReaderPage(), { + wrapper: ({ children }) => + wrapper({ + children, + config: { techdocs: { legacyUseCaseSensitiveTripletPaths: true } }, + }), + }); + await waitFor(() => { + expect(result.current.entityRef).toStrictEqual(caseSensitiveEntityRef); + }); }); it('entityRef provided as analytics context', async () => { - const { waitForNextUpdate } = renderHook( - () => useAnalytics().captureEvent('action', 'subject'), - { wrapper }, - ); - - await waitForNextUpdate(); - - expect(analyticsApiMock.getEvents()[0]).toMatchObject({ - action: 'action', - subject: 'subject', - context: { - entityRef: 'component:default/test', - }, + renderHook(() => useAnalytics().captureEvent('action', 'subject'), { + wrapper, + }); + await waitFor(() => { + expect(analyticsApiMock.getEvents()[0]).toMatchObject({ + action: 'action', + subject: 'subject', + context: { + entityRef: 'component:default/test', + }, + }); }); }); }); diff --git a/plugins/techdocs-react/src/hooks.test.ts b/plugins/techdocs-react/src/hooks.test.ts index 2aa53b32d5..0cd55fa10f 100644 --- a/plugins/techdocs-react/src/hooks.test.ts +++ b/plugins/techdocs-react/src/hooks.test.ts @@ -19,7 +19,7 @@ import { useShadowRootElements, useShadowRootSelection, } from './hooks'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { fireEvent, waitFor } from '@testing-library/react'; const fireSelectionChangeEvent = (window: Window) => { diff --git a/plugins/techdocs/package.json b/plugins/techdocs/package.json index eb69181027..3df7399521 100644 --- a/plugins/techdocs/package.json +++ b/plugins/techdocs/package.json @@ -86,8 +86,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", - "@testing-library/react-hooks": "^8.0.0", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/dompurify": "^2.2.2", "@types/event-source-polyfill": "^1.0.0", diff --git a/plugins/techdocs/src/reader/components/TechDocsBuildLogs.test.tsx b/plugins/techdocs/src/reader/components/TechDocsBuildLogs.test.tsx index afdac63a99..34aaf76394 100644 --- a/plugins/techdocs/src/reader/components/TechDocsBuildLogs.test.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsBuildLogs.test.tsx @@ -20,6 +20,7 @@ import { TechDocsBuildLogs, TechDocsBuildLogsDrawerContent, } from './TechDocsBuildLogs'; +import { userEvent } from '@testing-library/user-event'; // The inside needs mocking to render in jsdom jest.mock('react-virtualized-auto-sizer', () => ({ @@ -38,7 +39,7 @@ describe('', () => { it('should open drawer', async () => { const rendered = await renderInTestApp(); - rendered.getByText(/Show Build Logs/i).click(); + await userEvent.click(rendered.getByText(/Show Build Logs/i)); expect(rendered.getByText(/Build Details/i)).toBeInTheDocument(); }); }); diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPage/TechDocsReaderPage.test.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPage/TechDocsReaderPage.test.tsx index e11b7b6e81..f732afd31d 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPage/TechDocsReaderPage.test.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPage/TechDocsReaderPage.test.tsx @@ -14,7 +14,6 @@ * limitations under the License. */ import React from 'react'; -import { act } from '@testing-library/react'; import { scmIntegrationsApiRef } from '@backstage/integration-react'; import { entityRouteRef } from '@backstage/plugin-catalog-react'; @@ -150,31 +149,25 @@ describe('', () => { }); it('should render a techdocs reader page with children', async () => { - await act(async () => { - const rendered = await renderInTestApp( - - - techdocs reader page - - , - { - mountedRoutes, - }, - ); - expect( - rendered.container.querySelector('header'), - ).not.toBeInTheDocument(); - expect( - rendered.container.querySelector('article'), - ).not.toBeInTheDocument(); - expect(rendered.getByText('techdocs reader page')).toBeInTheDocument(); - }); + const rendered = await renderInTestApp( + + + techdocs reader page + + , + { + mountedRoutes, + }, + ); + expect(rendered.container.querySelector('header')).not.toBeInTheDocument(); + expect(rendered.container.querySelector('article')).not.toBeInTheDocument(); + expect(rendered.getByText('techdocs reader page')).toBeInTheDocument(); }); it('should render techdocs reader page with addons', async () => { @@ -183,56 +176,52 @@ describe('', () => { const namespace = 'test-namespace'; const kind = 'test'; - await act(async () => { - const rendered = await renderInTestApp( - - - } - > - - - - - - , - { - mountedRoutes, - routeEntries: ['/docs/test-namespace/test/test-name'], - }, - ); + const rendered = await renderInTestApp( + + + } + > + + + + + + , + { + mountedRoutes, + routeEntries: ['/docs/test-namespace/test/test-name'], + }, + ); - expect( - rendered.getByText(`PageMock: ${namespace}#${kind}#${name}`), - ).toBeInTheDocument(); - }); + expect( + rendered.getByText(`PageMock: ${namespace}#${kind}#${name}`), + ).toBeInTheDocument(); }); it('should render techdocs reader page with addons and page', async () => { (Page as jest.Mock).mockImplementation(PageMock); - await act(async () => { - const rendered = await renderInTestApp( - - - } - > -

the page

- - - - - - , - { - mountedRoutes, - routeEntries: ['/docs/test-namespace/test/test-name'], - }, - ); + const rendered = await renderInTestApp( + + + } + > +

the page

+ + + + + + , + { + mountedRoutes, + routeEntries: ['/docs/test-namespace/test/test-name'], + }, + ); - expect(rendered.getByText('the page')).toBeInTheDocument(); - }); + expect(rendered.getByText('the page')).toBeInTheDocument(); }); }); diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPage/context.test.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPage/context.test.tsx index 2380724960..670653ce6b 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPage/context.test.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPage/context.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook, waitFor } from '@testing-library/react'; import { ThemeProvider } from '@material-ui/core'; @@ -95,16 +95,13 @@ describe('context', () => { }); it('should return expected entity values', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useEntityMetadata(), - { wrapper }, - ); + const { result } = renderHook(() => useEntityMetadata(), { wrapper }); - await waitForNextUpdate(); - - expect(result.current.value).toBeDefined(); - expect(result.current.error).toBeUndefined(); - expect(result.current.value).toMatchObject(mockEntityMetadata); + await waitFor(() => { + expect(result.current.value).toBeDefined(); + expect(result.current.error).toBeUndefined(); + expect(result.current.value).toMatchObject(mockEntityMetadata); + }); }); }); @@ -116,16 +113,13 @@ describe('context', () => { }); it('should return expected techdocs metadata values', async () => { - const { result, waitForNextUpdate } = renderHook( - () => useTechDocsMetadata(), - { wrapper }, - ); + const { result } = renderHook(() => useTechDocsMetadata(), { wrapper }); - await waitForNextUpdate(); - - expect(result.current.value).toBeDefined(); - expect(result.current.error).toBeUndefined(); - expect(result.current.value).toMatchObject(mockTechDocsMetadata); + await waitFor(() => { + expect(result.current.value).toBeDefined(); + expect(result.current.error).toBeUndefined(); + expect(result.current.value).toMatchObject(mockTechDocsMetadata); + }); }); }); }); diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.test.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.test.tsx index 3e5a4c73c3..32fbe21714 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.test.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { act, waitFor } from '@testing-library/react'; +import { waitFor } from '@testing-library/react'; import { CompoundEntityRef } from '@backstage/catalog-model'; import { @@ -90,18 +90,16 @@ describe('', () => { useTechDocsReaderDom.mockReturnValue(document.createElement('html')); useReaderState.mockReturnValue({ state: 'cached' }); - await act(async () => { - const rendered = await renderInTestApp( - - - , - ); + const rendered = await renderInTestApp( + + + , + ); - await waitFor(() => { - expect( - rendered.getByTestId('techdocs-native-shadowroot'), - ).toBeInTheDocument(); - }); + await waitFor(() => { + expect( + rendered.getByTestId('techdocs-native-shadowroot'), + ).toBeInTheDocument(); }); }); @@ -110,21 +108,19 @@ describe('', () => { useTechDocsReaderDom.mockReturnValue(document.createElement('html')); useReaderState.mockReturnValue({ state: 'cached' }); - await act(async () => { - const rendered = await renderInTestApp( - - - , - ); + const rendered = await renderInTestApp( + + + , + ); - await waitFor(() => { - expect( - rendered.queryByTestId('techdocs-native-shadowroot'), - ).not.toBeInTheDocument(); - expect( - rendered.getByText('ERROR 404: PAGE NOT FOUND'), - ).toBeInTheDocument(); - }); + await waitFor(() => { + expect( + rendered.queryByTestId('techdocs-native-shadowroot'), + ).not.toBeInTheDocument(); + expect( + rendered.getByText('ERROR 404: PAGE NOT FOUND'), + ).toBeInTheDocument(); }); }); @@ -134,21 +130,19 @@ describe('', () => { useTechDocsReaderDom.mockReturnValue(undefined); useReaderState.mockReturnValue({ state: 'CONTENT_NOT_FOUND' }); - await act(async () => { - const rendered = await renderInTestApp( - - - , - ); + const rendered = await renderInTestApp( + + + , + ); - await waitFor(() => { - expect( - rendered.queryByTestId('techdocs-native-shadowroot'), - ).not.toBeInTheDocument(); - expect( - rendered.getByText('ERROR 404: Documentation not found'), - ).toBeInTheDocument(); - }); + await waitFor(() => { + expect( + rendered.queryByTestId('techdocs-native-shadowroot'), + ).not.toBeInTheDocument(); + expect( + rendered.getByText('ERROR 404: Documentation not found'), + ).toBeInTheDocument(); }); }); }); diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.test.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.test.tsx index a3e03b7cf0..d2956ce919 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.test.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPageHeader/TechDocsReaderPageHeader.test.tsx @@ -14,7 +14,6 @@ * limitations under the License. */ import React from 'react'; -import { act, waitFor } from '@testing-library/react'; import { CompoundEntityRef } from '@backstage/catalog-model'; import { entityRouteRef } from '@backstage/plugin-catalog-react'; @@ -80,112 +79,77 @@ describe('', () => { getEntityMetadata.mockResolvedValue(mockEntityMetadata); getTechDocsMetadata.mockResolvedValue(mockTechDocsMetadata); - await act(async () => { - const rendered = await renderInTestApp( - - - , - { - mountedRoutes: { - '/catalog/:namespace/:kind/:name/*': entityRouteRef, - '/docs': rootRouteRef, - }, + const rendered = await renderInTestApp( + + + , + { + mountedRoutes: { + '/catalog/:namespace/:kind/:name/*': entityRouteRef, + '/docs': rootRouteRef, }, - ); + }, + ); - expect(rendered.container.innerHTML).toContain('header'); + expect(rendered.container.innerHTML).toContain('header'); - await waitFor(() => { - expect(rendered.getAllByText('test-site-name')).toHaveLength(2); - }); + expect(rendered.getAllByText('test-site-name')).toHaveLength(2); + expect(rendered.getByText('test-site-desc')).toBeDefined(); - expect(rendered.getByText('test-site-desc')).toBeDefined(); - }); + expect( + rendered.getByRole('link', { name: 'test:test-namespace/test-name' }), + ).toHaveAttribute('href', '/catalog/test-namespace/test/test-name'); }); it('should render a techdocs page header even if metadata is not loaded', async () => { - await act(async () => { - const rendered = await renderInTestApp( - - - , - { - mountedRoutes: { - '/catalog/:namespace/:kind/:name/*': entityRouteRef, - '/docs': rootRouteRef, - }, + const rendered = await renderInTestApp( + + + , + { + mountedRoutes: { + '/catalog/:namespace/:kind/:name/*': entityRouteRef, + '/docs': rootRouteRef, }, - ); + }, + ); - expect(rendered.container.innerHTML).toContain('header'); - }); + expect(rendered.container.innerHTML).toContain('header'); }); it('should not render a techdocs page header if entity metadata is missing', async () => { getEntityMetadata.mockResolvedValue(undefined); - await act(async () => { - const rendered = await renderInTestApp( - - - , - { - mountedRoutes: { - '/catalog/:namespace/:kind/:name/*': entityRouteRef, - '/docs': rootRouteRef, - }, + const rendered = await renderInTestApp( + + + , + { + mountedRoutes: { + '/catalog/:namespace/:kind/:name/*': entityRouteRef, + '/docs': rootRouteRef, }, - ); + }, + ); - await waitFor(() => { - expect(rendered.container.innerHTML).not.toContain('header'); - }); - }); + expect(rendered.container.innerHTML).not.toContain('header'); }); it('should not render a techdocs page header if techdocs metadata is missing', async () => { getTechDocsMetadata.mockResolvedValue(undefined); - await act(async () => { - const rendered = await renderInTestApp( - - - , - { - mountedRoutes: { - '/catalog/:namespace/:kind/:name/*': entityRouteRef, - '/docs': rootRouteRef, - }, + const rendered = await renderInTestApp( + + + , + { + mountedRoutes: { + '/catalog/:namespace/:kind/:name/*': entityRouteRef, + '/docs': rootRouteRef, }, - ); + }, + ); - await waitFor(() => { - expect(rendered.container.innerHTML).not.toContain('header'); - }); - }); - }); - - it('should render a link back to the component page', async () => { - getTechDocsMetadata.mockResolvedValue(mockTechDocsMetadata); - - await act(async () => { - const rendered = await renderInTestApp( - - - , - { - mountedRoutes: { - '/catalog/:namespace/:kind/:name/*': entityRouteRef, - '/docs': rootRouteRef, - }, - }, - ); - - await waitFor(() => { - expect( - rendered.getByRole('link', { name: 'test:test-namespace/test-name' }), - ).toHaveAttribute('href', '/catalog/test-namespace/test/test-name'); - }); - }); + expect(rendered.container.innerHTML).not.toContain('header'); }); }); diff --git a/plugins/techdocs/src/reader/components/useReaderState.test.tsx b/plugins/techdocs/src/reader/components/useReaderState.test.tsx index 5f3e2d9662..60898ab288 100644 --- a/plugins/techdocs/src/reader/components/useReaderState.test.tsx +++ b/plugins/techdocs/src/reader/components/useReaderState.test.tsx @@ -16,7 +16,7 @@ import { NotFoundError } from '@backstage/errors'; import { TestApiProvider } from '@backstage/test-utils'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { act, renderHook, waitFor } from '@testing-library/react'; import React from 'react'; import { techdocsStorageApiRef } from '../../api'; import { @@ -284,24 +284,22 @@ describe('useReaderState', () => { return 'cached'; }); - await act(async () => { - const { result, waitForValueToChange } = await renderHook( - () => useReaderState('Component', 'default', 'backstage', '/example'), - { wrapper: Wrapper }, - ); + const { result } = renderHook( + () => useReaderState('Component', 'default', 'backstage', '/example'), + { wrapper: Wrapper }, + ); - expect(result.current).toEqual({ - state: 'CHECKING', - path: '/example', - content: undefined, - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); - - await waitForValueToChange(() => result.current.state); + expect(result.current).toEqual({ + state: 'CHECKING', + path: '/example', + content: undefined, + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_FRESH', path: '/example', @@ -311,20 +309,20 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); - - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/example', - ); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( - { - kind: 'Component', - namespace: 'default', - name: 'backstage', - }, - expect.any(Function), - ); }); + + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/example', + ); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( + { + kind: 'Component', + namespace: 'default', + name: 'backstage', + }, + expect.any(Function), + ); }); it('should reload initially missing content', async () => { @@ -336,6 +334,7 @@ describe('useReaderState', () => { }); techdocsStorageApi.syncEntityDocs.mockImplementation( async (_, logHandler) => { + await 'a tick'; logHandler?.call(this, 'Line 1'); logHandler?.call(this, 'Line 2'); await new Promise(resolve => setTimeout(resolve, 1100)); @@ -343,38 +342,39 @@ describe('useReaderState', () => { }, ); - await act(async () => { - const { result, waitForValueToChange } = await renderHook( - () => useReaderState('Component', 'default', 'backstage', '/example'), - { wrapper: Wrapper }, - ); + const { result } = renderHook( + () => useReaderState('Component', 'default', 'backstage', '/example'), + { wrapper: Wrapper }, + ); - expect(result.current).toEqual({ - state: 'CHECKING', - path: '/example', - content: undefined, - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); + expect(result.current).toEqual({ + state: 'CHECKING', + path: '/example', + content: undefined, + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); - await waitForValueToChange(() => result.current.state, { + await waitFor( + () => { + expect(result.current).toEqual({ + state: 'INITIAL_BUILD', + path: '/example', + content: undefined, + contentErrorMessage: 'NotFoundError: Page Not Found', + syncErrorMessage: undefined, + buildLog: ['Line 1', 'Line 2'], + contentReload: expect.any(Function), + }); + }, + { timeout: 2000, - }); - - expect(result.current).toEqual({ - state: 'INITIAL_BUILD', - path: '/example', - content: undefined, - contentErrorMessage: 'NotFoundError: Page Not Found', - syncErrorMessage: undefined, - buildLog: ['Line 1', 'Line 2'], - contentReload: expect.any(Function), - }); - - await waitForValueToChange(() => result.current.state); + }, + ); + await waitFor(() => { expect(result.current).toEqual({ state: 'CHECKING', path: '/example', @@ -384,9 +384,9 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); + }); - await waitForValueToChange(() => result.current.state); - + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_FRESH', path: '/example', @@ -396,22 +396,22 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); - - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledTimes(2); - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/example', - ); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledTimes(1); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( - { - kind: 'Component', - namespace: 'default', - name: 'backstage', - }, - expect.any(Function), - ); }); + + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledTimes(2); + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/example', + ); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledTimes(1); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( + { + kind: 'Component', + namespace: 'default', + name: 'backstage', + }, + expect.any(Function), + ); }); it('should handle stale content', async () => { @@ -423,6 +423,7 @@ describe('useReaderState', () => { }); techdocsStorageApi.syncEntityDocs.mockImplementation( async (_, logHandler) => { + await 'a tick'; logHandler?.call(this, 'Line 1'); logHandler?.call(this, 'Line 2'); await new Promise(resolve => setTimeout(resolve, 1100)); @@ -430,24 +431,23 @@ describe('useReaderState', () => { }, ); - await act(async () => { - const { result, waitForValueToChange } = await renderHook( - () => useReaderState('Component', 'default', 'backstage', '/example'), - { wrapper: Wrapper }, - ); + const { result } = renderHook( + () => useReaderState('Component', 'default', 'backstage', '/example'), + { wrapper: Wrapper }, + ); - expect(result.current).toEqual({ - state: 'CHECKING', - path: '/example', - content: undefined, - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); + expect(result.current).toEqual({ + state: 'CHECKING', + path: '/example', + content: undefined, + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); - // the content is returned but the sync is in progress - await waitForValueToChange(() => result.current.state); + // the content is returned but the sync is in progress + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_FRESH', path: '/example', @@ -457,9 +457,10 @@ describe('useReaderState', () => { buildLog: ['Line 1', 'Line 2'], contentReload: expect.any(Function), }); + }); - // the sync takes longer than 1 seconds so the refreshing state starts - await waitForValueToChange(() => result.current.state); + // the sync takes longer than 1 seconds so the refreshing state starts + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_STALE_REFRESHING', path: '/example', @@ -469,9 +470,10 @@ describe('useReaderState', () => { buildLog: ['Line 1', 'Line 2'], contentReload: expect.any(Function), }); + }); - // the content is updated but not yet displayed - await waitForValueToChange(() => result.current.state); + // the content is updated but not yet displayed + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_STALE_READY', path: '/example', @@ -481,12 +483,15 @@ describe('useReaderState', () => { buildLog: ['Line 1', 'Line 2'], contentReload: expect.any(Function), }); + }); - // reload the content + // reload the content + await act(async () => { result.current.contentReload(); + }); - // the new content refresh is triggered - await waitForValueToChange(() => result.current.state); + // the new content refresh is triggered + await waitFor(() => { expect(result.current).toEqual({ state: 'CHECKING', path: '/example', @@ -496,35 +501,39 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); - - // the new content is loaded - await waitForValueToChange(() => result.current.state, { - timeout: 2000, - }); - expect(result.current).toEqual({ - state: 'CONTENT_FRESH', - path: '/example', - content: 'my new content', - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); - - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledTimes(2); - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/example', - ); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( - { - kind: 'Component', - namespace: 'default', - name: 'backstage', - }, - expect.any(Function), - ); }); + + // the new content is loaded + await waitFor( + () => { + expect(result.current).toEqual({ + state: 'CONTENT_FRESH', + path: '/example', + content: 'my new content', + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); + }, + { + timeout: 2000, + }, + ); + + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledTimes(2); + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/example', + ); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( + { + kind: 'Component', + namespace: 'default', + name: 'backstage', + }, + expect.any(Function), + ); }); it('should handle navigation', async () => { @@ -537,25 +546,24 @@ describe('useReaderState', () => { .mockRejectedValueOnce(new NotFoundError('Some error description')); techdocsStorageApi.syncEntityDocs.mockResolvedValue('cached'); - await act(async () => { - const { result, waitForValueToChange, rerender } = await renderHook( - ({ path }: { path: string }) => - useReaderState('Component', 'default', 'backstage', path), - { initialProps: { path: '/example' }, wrapper: Wrapper as any }, - ); + const { result, rerender } = renderHook( + ({ path }: { path: string }) => + useReaderState('Component', 'default', 'backstage', path), + { initialProps: { path: '/example' }, wrapper: Wrapper as any }, + ); - expect(result.current).toEqual({ - state: 'CHECKING', - path: '/example', - content: undefined, - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); + expect(result.current).toEqual({ + state: 'CHECKING', + path: '/example', + content: undefined, + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); - // show the content - await waitForValueToChange(() => result.current.state); + // show the content + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_FRESH', path: '/example', @@ -565,11 +573,12 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); + }); - // navigate - rerender({ path: '/new' }); + // navigate + rerender({ path: '/new' }); - await waitForValueToChange(() => result.current.state); + await waitFor(() => { expect(result.current).toEqual({ state: 'CHECKING', path: '/example', @@ -579,24 +588,29 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); + }); - await waitForValueToChange(() => result.current.state, { + await waitFor( + () => { + expect(result.current).toEqual({ + state: 'CONTENT_FRESH', + path: '/new', + content: 'my new content', + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); + }, + { timeout: 2000, - }); - expect(result.current).toEqual({ - state: 'CONTENT_FRESH', - path: '/new', - content: 'my new content', - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); + }, + ); - // navigate - rerender({ path: '/missing' }); + // navigate + rerender({ path: '/missing' }); - await waitForValueToChange(() => result.current.state); + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_NOT_FOUND', path: '/missing', @@ -606,24 +620,24 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); - - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/example', - ); - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/new', - ); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( - { - kind: 'Component', - namespace: 'default', - name: 'backstage', - }, - expect.any(Function), - ); }); + + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/example', + ); + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/new', + ); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( + { + kind: 'Component', + namespace: 'default', + name: 'backstage', + }, + expect.any(Function), + ); }); it('should handle content error', async () => { @@ -632,24 +646,23 @@ describe('useReaderState', () => { ); techdocsStorageApi.syncEntityDocs.mockResolvedValue('cached'); - await act(async () => { - const { result, waitForValueToChange } = await renderHook( - () => useReaderState('Component', 'default', 'backstage', '/example'), - { wrapper: Wrapper }, - ); + const { result } = renderHook( + () => useReaderState('Component', 'default', 'backstage', '/example'), + { wrapper: Wrapper }, + ); - expect(result.current).toEqual({ - state: 'CHECKING', - path: '/example', - content: undefined, - contentErrorMessage: undefined, - syncErrorMessage: undefined, - buildLog: [], - contentReload: expect.any(Function), - }); + expect(result.current).toEqual({ + state: 'CHECKING', + path: '/example', + content: undefined, + contentErrorMessage: undefined, + syncErrorMessage: undefined, + buildLog: [], + contentReload: expect.any(Function), + }); - // the content loading threw an error - await waitForValueToChange(() => result.current.state); + // the content loading threw an error + await waitFor(() => { expect(result.current).toEqual({ state: 'CONTENT_NOT_FOUND', path: '/example', @@ -659,20 +672,20 @@ describe('useReaderState', () => { buildLog: [], contentReload: expect.any(Function), }); - - expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( - { kind: 'Component', namespace: 'default', name: 'backstage' }, - '/example', - ); - expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( - { - kind: 'Component', - namespace: 'default', - name: 'backstage', - }, - expect.any(Function), - ); }); + + expect(techdocsStorageApi.getEntityDocs).toHaveBeenCalledWith( + { kind: 'Component', namespace: 'default', name: 'backstage' }, + '/example', + ); + expect(techdocsStorageApi.syncEntityDocs).toHaveBeenCalledWith( + { + kind: 'Component', + namespace: 'default', + name: 'backstage', + }, + expect.any(Function), + ); }); }); }); diff --git a/plugins/techdocs/src/reader/transformers/html/transformer.test.tsx b/plugins/techdocs/src/reader/transformers/html/transformer.test.tsx index 2b1f427be3..ed5fbba085 100644 --- a/plugins/techdocs/src/reader/transformers/html/transformer.test.tsx +++ b/plugins/techdocs/src/reader/transformers/html/transformer.test.tsx @@ -15,7 +15,7 @@ */ import React, { FC, PropsWithChildren } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { ConfigReader } from '@backstage/core-app-api'; import { ConfigApi, configApiRef } from '@backstage/core-plugin-api'; diff --git a/plugins/techdocs/src/reader/transformers/renderReactElement.ts b/plugins/techdocs/src/reader/transformers/renderReactElement.ts index 86d44532c5..f9b45065f1 100644 --- a/plugins/techdocs/src/reader/transformers/renderReactElement.ts +++ b/plugins/techdocs/src/reader/transformers/renderReactElement.ts @@ -14,10 +14,7 @@ * limitations under the License. */ -let ReactDOM: - | typeof import('react-dom') - // TODO: replace with import('react-dom/client') when repo is migrated to 18 - | { createRoot(el: HTMLElement): { render(el: JSX.Element): void } }; +let ReactDOM: typeof import('react-dom') | typeof import('react-dom/client'); if (process.env.HAS_REACT_DOM_CLIENT) { ReactDOM = require('react-dom/client'); } else { diff --git a/plugins/techdocs/src/reader/transformers/styles/transformer.test.ts b/plugins/techdocs/src/reader/transformers/styles/transformer.test.ts index 84ba16d6e6..90244e96ad 100644 --- a/plugins/techdocs/src/reader/transformers/styles/transformer.test.ts +++ b/plugins/techdocs/src/reader/transformers/styles/transformer.test.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useStylesTransformer } from './transformer'; describe('Transformers > Styles', () => { diff --git a/plugins/todo/package.json b/plugins/todo/package.json index 0ce3e92315..ec27528d72 100644 --- a/plugins/todo/package.json +++ b/plugins/todo/package.json @@ -44,8 +44,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -55,7 +55,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/user-settings/package.json b/plugins/user-settings/package.json index 849785907d..264521ee45 100644 --- a/plugins/user-settings/package.json +++ b/plugins/user-settings/package.json @@ -62,8 +62,8 @@ "zen-observable": "^0.10.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -73,7 +73,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "cross-fetch": "^3.1.5", "msw": "^1.0.0" diff --git a/plugins/vault/package.json b/plugins/vault/package.json index bd7dc3cd7f..055d38073a 100644 --- a/plugins/vault/package.json +++ b/plugins/vault/package.json @@ -47,8 +47,8 @@ "react-use": "^17.2.4" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -58,7 +58,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "msw": "^1.0.0" }, diff --git a/plugins/xcmetrics/package.json b/plugins/xcmetrics/package.json index 27216f5fc2..97887eb2ea 100644 --- a/plugins/xcmetrics/package.json +++ b/plugins/xcmetrics/package.json @@ -44,8 +44,8 @@ "recharts": "^2.5.0" }, "peerDependencies": { - "react": "^16.13.1 || ^17.0.0", - "react-dom": "^16.13.1 || ^17.0.0", + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", "react-router-dom": "6.0.0-beta.0 || ^6.3.0" }, "devDependencies": { @@ -55,7 +55,7 @@ "@backstage/test-utils": "workspace:^", "@testing-library/dom": "^9.0.0", "@testing-library/jest-dom": "^6.0.0", - "@testing-library/react": "^12.1.3", + "@testing-library/react": "^14.0.0", "@testing-library/user-event": "^14.0.0", "@types/luxon": "^3.0.0", "msw": "^1.0.0" diff --git a/storybook/package.json b/storybook/package.json index 6a86cd90bd..46cf09dc79 100644 --- a/storybook/package.json +++ b/storybook/package.json @@ -9,8 +9,8 @@ }, "dependencies": { "@swc/core": "^1.3.46", - "react": "^17.0.2", - "react-dom": "^17.0.2", + "react": "^18.0.2", + "react-dom": "^18.0.2", "react-hot-loader": "^4.13.0", "swc-loader": "^0.2.3" }, diff --git a/storybook/yarn.lock b/storybook/yarn.lock index 9a533c46c0..00ec6908f0 100644 --- a/storybook/yarn.lock +++ b/storybook/yarn.lock @@ -9592,16 +9592,15 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^17.0.2": - version: 17.0.2 - resolution: "react-dom@npm:17.0.2" +"react-dom@npm:^18.0.2": + version: 18.2.0 + resolution: "react-dom@npm:18.2.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - scheduler: ^0.20.2 + scheduler: ^0.23.0 peerDependencies: - react: 17.0.2 - checksum: 1c1eaa3bca7c7228d24b70932e3d7c99e70d1d04e13bb0843bbf321582bc25d7961d6b8a6978a58a598af2af496d1cedcfb1bf65f6b0960a0a8161cb8dab743c + react: ^18.2.0 + checksum: 7d323310bea3a91be2965f9468d552f201b1c27891e45ddc2d6b8f717680c95a75ae0bc1e3f5cf41472446a2589a75aed4483aee8169287909fcd59ad149e8cc languageName: node linkType: hard @@ -9710,13 +9709,12 @@ __metadata: languageName: node linkType: hard -"react@npm:^17.0.2": - version: 17.0.2 - resolution: "react@npm:17.0.2" +"react@npm:^18.0.2": + version: 18.2.0 + resolution: "react@npm:18.2.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - checksum: b254cc17ce3011788330f7bbf383ab653c6848902d7936a87b09d835d091e3f295f7e9dd1597c6daac5dc80f90e778c8230218ba8ad599f74adcc11e33b9d61b + checksum: 88e38092da8839b830cda6feef2e8505dec8ace60579e46aa5490fc3dc9bba0bd50336507dc166f43e3afc1c42939c09fe33b25fae889d6f402721dcd78fca1b languageName: node linkType: hard @@ -10149,13 +10147,12 @@ __metadata: languageName: node linkType: hard -"scheduler@npm:^0.20.2": - version: 0.20.2 - resolution: "scheduler@npm:0.20.2" +"scheduler@npm:^0.23.0": + version: 0.23.0 + resolution: "scheduler@npm:0.23.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - checksum: c4b35cf967c8f0d3e65753252d0f260271f81a81e427241295c5a7b783abf4ea9e905f22f815ab66676f5313be0a25f47be582254db8f9241b259213e999b8fc + checksum: d79192eeaa12abef860c195ea45d37cbf2bbf5f66e3c4dcd16f54a7da53b17788a70d109ee3d3dde1a0fd50e6a8fc171f4300356c5aee4fc0171de526bf35f8a languageName: node linkType: hard @@ -10682,8 +10679,8 @@ __metadata: "@storybook/react": ^6.5.9 "@storybook/testing-library": ^0.2.0 "@swc/core": ^1.3.46 - react: ^17.0.2 - react-dom: ^17.0.2 + react: ^18.0.2 + react-dom: ^18.0.2 react-hot-loader: ^4.13.0 storybook-dark-mode: ^1.1.0 swc-loader: ^0.2.3 diff --git a/yarn.lock b/yarn.lock index b2d6c3b2e7..adcd02c577 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3368,11 +3368,11 @@ __metadata: "@material-ui/core": ^4.12.2 "@material-ui/icons": ^4.9.1 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -3927,7 +3927,7 @@ __metadata: "@backstage/version-bridge": "workspace:^" "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/react-hooks": ^8.0.0 "@testing-library/user-event": ^14.0.0 "@types/prop-types": ^15.7.3 @@ -3946,8 +3946,8 @@ __metadata: zen-observable: ^0.10.0 zod: ^3.21.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -3974,8 +3974,7 @@ __metadata: "@react-hookz/web": ^20.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/ansi-regex": ^5.0.0 "@types/classnames": ^2.2.9 @@ -4022,8 +4021,8 @@ __metadata: zen-observable: ^0.10.0 zod: ^3.21.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4090,15 +4089,14 @@ __metadata: "@backstage/version-bridge": "workspace:^" "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 history: ^5.0.0 i18next: ^22.4.15 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4148,7 +4146,7 @@ __metadata: "@material-ui/icons": ^4.9.1 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 react-use: ^17.2.4 @@ -4216,11 +4214,11 @@ __metadata: "@material-ui/core": ^4.12.4 "@material-ui/icons": ^4.11.3 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 lodash: ^4.17.21 peerDependencies: - react: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4236,15 +4234,14 @@ __metadata: "@backstage/types": "workspace:^" "@backstage/version-bridge": "workspace:^" "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.1 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 history: ^5.3.0 lodash: ^4.17.21 zod: ^3.21.4 zod-to-json-schema: ^3.21.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4286,8 +4283,8 @@ __metadata: "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4376,7 +4373,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/git-url-parse": ^9.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -4387,8 +4384,8 @@ __metadata: react-use: ^17.2.4 remark-gfm: ^3.0.1 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4432,14 +4429,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4462,14 +4459,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4488,7 +4485,7 @@ __metadata: "@backstage/theme": "workspace:^" "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/jest": ^28.1.3 "@types/react": ^16.13.1 || ^17.0.0 @@ -4496,8 +4493,8 @@ __metadata: react-ga4: ^2.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4519,15 +4516,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-ga: ^3.3.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4545,12 +4542,12 @@ __metadata: "@backstage/test-utils": "workspace:^" "@newrelic/browser-agent": ^1.236.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -4569,7 +4566,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -4577,8 +4574,8 @@ __metadata: qs: ^6.10.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4592,8 +4589,8 @@ __metadata: "@types/react": ^16.13.1 || ^17.0.0 grpc-docs: ^1.1.2 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4618,7 +4615,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/swagger-ui-react": ^4.18.0 @@ -4631,8 +4628,8 @@ __metadata: react-use: ^17.2.4 swagger-ui-react: ^5.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4653,15 +4650,15 @@ __metadata: "@material-ui/icons": ^4.9.1 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 use-deep-compare-effect: ^1.8.1 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -4992,7 +4989,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 humanize-duration: ^3.27.0 @@ -5000,8 +4997,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5055,15 +5052,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^3.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5117,8 +5114,8 @@ __metadata: "@types/react": ^16.13.1 || ^17.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5169,8 +5166,8 @@ __metadata: react-hook-form: ^7.13.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5206,7 +5203,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/recharts": ^1.8.15 @@ -5217,8 +5214,8 @@ __metadata: react-use: ^17.2.4 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5705,8 +5702,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 classnames: ^2.3.1 @@ -5715,8 +5711,8 @@ __metadata: qs: ^6.9.4 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5746,8 +5742,8 @@ __metadata: node-fetch: ^2.6.7 winston: ^3.2.1 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5776,8 +5772,7 @@ __metadata: "@octokit/rest": ^19.0.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 git-url-parse: ^13.0.0 @@ -5788,8 +5783,8 @@ __metadata: react-use: ^17.2.4 yaml: ^2.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5836,8 +5831,7 @@ __metadata: "@react-hookz/web": ^23.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/zen-observable": ^0.8.0 @@ -5850,8 +5844,8 @@ __metadata: yaml: ^2.0.0 zen-observable: ^0.10.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5873,14 +5867,14 @@ __metadata: "@material-ui/icons": ^4.9.1 "@material-ui/lab": ^4.0.0-alpha.60 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5913,7 +5907,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 history: ^5.0.0 @@ -5922,8 +5916,8 @@ __metadata: react-use: ^17.2.4 zen-observable: ^0.10.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5942,8 +5936,8 @@ __metadata: luxon: ^3.0.0 p-limit: ^4.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5970,8 +5964,8 @@ __metadata: react-use: ^17.3.1 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -5994,7 +5988,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/humanize-duration": ^3.25.1 "@types/react": ^16.13.1 || ^17.0.0 @@ -6006,8 +6000,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6030,7 +6024,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -6039,8 +6033,8 @@ __metadata: qs: ^6.9.4 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6062,7 +6056,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/humanize-duration": ^3.27.1 "@types/luxon": ^3.0.0 @@ -6072,8 +6066,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6128,7 +6122,7 @@ __metadata: "@material-ui/styles": ^4.11.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/highlightjs": ^10.1.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -6139,8 +6133,8 @@ __metadata: react-use: ^17.2.4 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6163,15 +6157,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 rc-progress: 3.5.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6195,7 +6189,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 jsonschema: ^1.2.6 @@ -6203,8 +6197,8 @@ __metadata: react-use: ^17.2.4 zen-observable: ^0.10.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6238,7 +6232,7 @@ __metadata: "@material-ui/styles": ^4.9.6 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/pluralize": ^0.0.31 "@types/react": ^16.13.1 || ^17.0.0 @@ -6258,8 +6252,8 @@ __metadata: regression: ^2.0.1 yup: ^0.32.9 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6331,7 +6325,7 @@ __metadata: "@material-ui/icons": ^4.9.1 "@material-ui/lab": ^4.0.0-alpha.57 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 cross-fetch: ^3.1.5 msw: ^1.0.0 @@ -6339,8 +6333,8 @@ __metadata: react-use: ^17.2.4 peerDependencies: "@types/react": ^16.13.1 || ^17.0.0 - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6362,7 +6356,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 express: ^4.18.1 @@ -6370,8 +6364,8 @@ __metadata: react-use: ^17.2.4 peerDependencies: "@backstage/plugin-catalog-react": "workspace:^" - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6430,15 +6424,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.1 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6468,7 +6461,7 @@ __metadata: "@react-hookz/web": ^20.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@uiw/react-codemirror": ^4.9.3 @@ -6477,8 +6470,8 @@ __metadata: react-use: ^17.2.4 yaml: ^2.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6657,14 +6650,14 @@ __metadata: "@backstage/test-utils": "workspace:^" "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 msw: ^1.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6694,7 +6687,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 classnames: ^2.2.6 @@ -6703,8 +6696,8 @@ __metadata: pluralize: ^8.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6727,15 +6720,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^3.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6759,7 +6752,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -6768,8 +6761,8 @@ __metadata: p-limit: ^3.0.2 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6793,7 +6786,7 @@ __metadata: "@tanstack/react-query": ^4.1.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/dompurify": ^2.3.3 "@types/react": ^16.13.1 || ^17.0.0 @@ -6807,8 +6800,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6830,14 +6823,14 @@ __metadata: "@react-hookz/web": ^20.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 msw: ^1.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6860,8 +6853,7 @@ __metadata: "@octokit/rest": ^19.0.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/recharts": ^1.8.15 @@ -6871,8 +6863,8 @@ __metadata: react-use: ^17.2.4 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6898,7 +6890,7 @@ __metadata: "@octokit/rest": ^19.0.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -6907,8 +6899,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6935,15 +6927,15 @@ __metadata: "@octokit/graphql": ^5.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^3.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -6968,7 +6960,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^3.0.0 @@ -6976,8 +6968,8 @@ __metadata: octokit: ^2.0.4 react-use: ^17.4.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7001,7 +6993,7 @@ __metadata: "@octokit/rest": ^19.0.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^3.0.0 @@ -7009,8 +7001,8 @@ __metadata: p-limit: ^4.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7032,15 +7024,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7064,7 +7056,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/lodash": ^4.14.173 "@types/luxon": ^3.0.0 @@ -7075,8 +7067,8 @@ __metadata: qs: ^6.10.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7098,7 +7090,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/codemirror": ^5.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -7109,8 +7101,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7156,15 +7148,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 graphql-voyager: ^1.0.0-rc.31 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7184,15 +7176,15 @@ __metadata: "@rjsf/utils": 5.13.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/react-grid-layout": ^1.3.2 cross-fetch: ^3.1.5 msw: ^1.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7222,8 +7214,7 @@ __metadata: "@rjsf/validator-ajv8": 5.13.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.1 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/react-grid-layout": ^1.3.2 @@ -7235,8 +7226,8 @@ __metadata: react-use: ^17.2.4 zod: ^3.21.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7262,7 +7253,7 @@ __metadata: "@material-ui/pickers": ^3.3.10 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 humanize-duration: ^3.26.0 @@ -7270,8 +7261,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7336,7 +7327,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/testing-library__jest-dom": ^5.9.1 @@ -7345,8 +7336,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7393,16 +7384,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 jest-when: ^3.1.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7483,8 +7473,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/node": ^16.11.26 "@types/react": ^16.13.1 || ^17.0.0 @@ -7496,8 +7485,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7553,8 +7542,7 @@ __metadata: "@material-ui/icons": ^4.11.3 "@material-ui/lab": ^4.0.0-alpha.61 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.1 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cronstrue: ^2.32.0 jest-websocket-mock: ^2.5.0 @@ -7568,7 +7556,7 @@ __metadata: xterm-addon-attach: ^0.9.0 xterm-addon-fit: ^0.8.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -7598,8 +7586,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cronstrue: ^2.2.0 @@ -7614,8 +7601,8 @@ __metadata: xterm-addon-attach: ^0.9.0 xterm-addon-fit: ^0.8.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7667,15 +7654,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7743,7 +7729,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 luxon: ^2.0.2 @@ -7751,8 +7737,8 @@ __metadata: react-use: ^17.2.4 slugify: ^1.6.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7775,7 +7761,7 @@ __metadata: "@tanstack/react-query": ^4.1.3 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 classnames: ^2.3.1 @@ -7786,8 +7772,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7811,8 +7797,8 @@ __metadata: "@types/react": ^16.13.1 || ^17.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7834,7 +7820,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/parse-link-header": ^2.0.1 "@types/react": ^16.13.1 || ^17.0.0 @@ -7843,8 +7829,8 @@ __metadata: parse-link-header: ^2.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7888,7 +7874,7 @@ __metadata: "@material-ui/icons": ^4.9.1 "@material-ui/lab": ^4.0.0-alpha.60 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -7896,8 +7882,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7920,14 +7906,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -7950,7 +7936,7 @@ __metadata: "@material-ui/pickers": ^3.3.10 "@material-ui/styles": ^4.11.5 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 axios: ^1.4.0 @@ -7961,7 +7947,7 @@ __metadata: react-use: ^17.2.4 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: "*" languageName: unknown linkType: soft @@ -7985,14 +7971,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8019,8 +8005,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.1 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 lodash: ^4.17.21 @@ -8030,8 +8015,8 @@ __metadata: qs: ^6.10.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8056,7 +8041,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 classnames: ^2.2.6 @@ -8064,8 +8049,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8109,7 +8094,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/luxon": ^3.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -8117,8 +8102,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8213,14 +8198,14 @@ __metadata: "@backstage/plugin-permission-common": "workspace:^" "@backstage/test-utils": "workspace:^" "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 react-use: ^17.2.4 swr: ^2.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8290,8 +8275,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 lodash: ^4.17.21 @@ -8302,8 +8286,8 @@ __metadata: react-use: ^17.2.4 swr: ^2.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8355,14 +8339,14 @@ __metadata: "@material-ui/icons": ^4.9.1 "@material-ui/lab": ^4.0.0-alpha.57 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8410,8 +8394,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -8420,8 +8403,8 @@ __metadata: react-sparklines: ^1.7.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8669,8 +8652,7 @@ __metadata: "@rjsf/validator-ajv8": 5.13.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/humanize-duration": ^3.18.1 "@types/json-schema": ^7.0.9 @@ -8690,8 +8672,8 @@ __metadata: zod: ^3.21.4 zod-to-json-schema: ^3.20.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8733,8 +8715,7 @@ __metadata: "@rjsf/validator-ajv8": 5.13.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/humanize-duration": ^3.18.1 "@types/json-schema": ^7.0.9 @@ -8758,8 +8739,8 @@ __metadata: zod: ^3.21.4 zod-to-json-schema: ^3.20.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8955,16 +8936,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 lodash: ^4.17.21 qs: ^6.9.4 react-use: ^17.3.2 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -8994,8 +8974,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 history: ^5.0.0 @@ -9003,8 +8982,8 @@ __metadata: qs: ^6.9.4 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9029,7 +9008,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/luxon": ^3.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -9039,8 +9018,8 @@ __metadata: react-sparklines: ^1.7.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9062,7 +9041,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/zen-observable": ^0.8.2 @@ -9072,8 +9051,8 @@ __metadata: uuid: ^8.3.2 zen-observable: ^0.10.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9109,8 +9088,8 @@ __metadata: "@backstage/core-plugin-api": "workspace:^" "@types/react": ^16.13.1 || ^17.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9135,7 +9114,7 @@ __metadata: "@material-ui/styles": ^4.10.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -9144,8 +9123,8 @@ __metadata: rc-progress: 3.5.1 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9168,7 +9147,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/luxon": ^3.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -9177,8 +9156,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9219,7 +9198,7 @@ __metadata: "@material-ui/icons": ^4.9.1 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -9228,8 +9207,8 @@ __metadata: qs: ^6.9.4 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9250,14 +9229,14 @@ __metadata: "@material-ui/icons": ^4.9.1 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9361,15 +9340,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 qs: ^6.9.4 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9391,7 +9370,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/color": ^3.0.1 "@types/d3-force": ^3.0.0 @@ -9402,8 +9381,8 @@ __metadata: msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9429,15 +9408,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 testing-library__dom: ^7.29.4-beta.1 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9498,7 +9477,7 @@ __metadata: "@react-hookz/web": ^20.0.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 git-url-parse: ^13.0.0 @@ -9506,8 +9485,8 @@ __metadata: photoswipe: ^5.3.7 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9571,16 +9550,15 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@material-ui/styles": ^4.11.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 jss: ~10.10.0 lodash: ^4.17.21 react-helmet: 6.1.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9613,8 +9591,7 @@ __metadata: "@material-ui/styles": ^4.10.0 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/dompurify": ^2.2.2 "@types/event-source-polyfill": ^1.0.0 @@ -9681,14 +9658,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9738,7 +9715,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 cross-fetch: ^3.1.5 @@ -9746,8 +9723,8 @@ __metadata: react-use: ^17.2.4 zen-observable: ^0.10.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9798,14 +9775,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9827,7 +9804,7 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/luxon": ^3.0.0 "@types/react": ^16.13.1 || ^17.0.0 @@ -9837,8 +9814,8 @@ __metadata: react-use: ^17.2.4 recharts: ^2.5.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -9946,8 +9923,8 @@ __metadata: peerDependencies: "@material-ui/core": ^4.12.2 "@types/react": ^16.13.1 || ^17.0.0 - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -9980,12 +9957,11 @@ __metadata: dependencies: "@backstage/cli": "workspace:^" "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 - "@testing-library/react-hooks": ^8.0.0 + "@testing-library/react": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -12304,14 +12280,14 @@ __metadata: "@material-ui/lab": 4.0.0-alpha.61 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 msw: ^1.0.0 react-use: ^17.2.4 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -13098,7 +13074,7 @@ __metadata: languageName: node linkType: hard -"@material-ui/pickers@npm:^3.2.10, @material-ui/pickers@npm:^3.3.10": +"@material-ui/pickers@npm:3.3.11": version: 3.3.11 resolution: "@material-ui/pickers@npm:3.3.11" dependencies: @@ -13118,6 +13094,26 @@ __metadata: languageName: node linkType: hard +"@material-ui/pickers@patch:@material-ui/pickers@npm%3A3.3.11#./.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch::locator=root%40workspace%3A.": + version: 3.3.11 + resolution: "@material-ui/pickers@patch:@material-ui/pickers@npm%3A3.3.11#./.yarn/patches/@material-ui-pickers-npm-3.3.11-1c8f68ea20.patch::version=3.3.11&hash=c18f79&locator=root%40workspace%3A." + dependencies: + "@babel/runtime": ^7.6.0 + "@date-io/core": 1.x + "@types/styled-jsx": ^2.2.8 + clsx: ^1.0.2 + react-transition-group: ^4.0.0 + rifm: ^0.7.0 + peerDependencies: + "@date-io/core": ^1.3.6 + "@material-ui/core": ^4.0.0 + prop-types: ^15.6.0 + react: ^16.8.0 || ^17.0.0 + react-dom: ^16.8.0 || ^17.0.0 + checksum: e736e4d53f1b660f4a338e8ca3537dc86638ed41ed988f42baebb18d35d5eab19e4b35952217a46032128639a9af59b354f78dbccc02d90971b844bc5a8cdcf0 + languageName: node + linkType: hard + "@material-ui/styles@npm:^4.10.0, @material-ui/styles@npm:^4.11.0, @material-ui/styles@npm:^4.11.4, @material-ui/styles@npm:^4.11.5, @material-ui/styles@npm:^4.9.6": version: 4.11.5 resolution: "@material-ui/styles@npm:4.11.5" @@ -16687,22 +16683,6 @@ __metadata: languageName: unknown linkType: soft -"@testing-library/dom@npm:^8.0.0": - version: 8.20.1 - resolution: "@testing-library/dom@npm:8.20.1" - dependencies: - "@babel/code-frame": ^7.10.4 - "@babel/runtime": ^7.12.5 - "@types/aria-query": ^5.0.1 - aria-query: 5.1.3 - chalk: ^4.1.0 - dom-accessibility-api: ^0.5.9 - lz-string: ^1.5.0 - pretty-format: ^27.0.2 - checksum: 06fc8dc67849aadb726cbbad0e7546afdf8923bd39acb64c576d706249bd7d0d05f08e08a31913fb621162e3b9c2bd0dce15964437f030f9fa4476326fdd3007 - languageName: node - linkType: hard - "@testing-library/dom@npm:^9.0.0": version: 9.3.3 resolution: "@testing-library/dom@npm:9.3.3" @@ -16749,7 +16729,7 @@ __metadata: languageName: node linkType: hard -"@testing-library/react-hooks@npm:^8.0.0, @testing-library/react-hooks@npm:^8.0.1": +"@testing-library/react-hooks@npm:^8.0.0": version: 8.0.1 resolution: "@testing-library/react-hooks@npm:8.0.1" dependencies: @@ -16771,17 +16751,17 @@ __metadata: languageName: node linkType: hard -"@testing-library/react@npm:^12.1.3": - version: 12.1.5 - resolution: "@testing-library/react@npm:12.1.5" +"@testing-library/react@npm:^14.0.0": + version: 14.0.0 + resolution: "@testing-library/react@npm:14.0.0" dependencies: "@babel/runtime": ^7.12.5 - "@testing-library/dom": ^8.0.0 - "@types/react-dom": <18.0.0 + "@testing-library/dom": ^9.0.0 + "@types/react-dom": ^18.0.0 peerDependencies: - react: <18.0.0 - react-dom: <18.0.0 - checksum: 4abd0490405e709a7df584a0db604e508a4612398bb1326e8fa32dd9393b15badc826dcf6d2f7525437886d507871f719f127b9860ed69ddd204d1fa834f576a + react: ^18.0.0 + react-dom: ^18.0.0 + checksum: 4a54c8f56cc4a39b50803205f84f06280bb76521d6d5d4b3b36651d760c7c7752ef142d857d52aaf4fad4848ed7a8be49afc793a5dda105955d2f8bef24901ac languageName: node linkType: hard @@ -18198,12 +18178,12 @@ __metadata: languageName: node linkType: hard -"@types/react-dom@npm:^17": - version: 17.0.21 - resolution: "@types/react-dom@npm:17.0.21" +"@types/react-dom@npm:^18": + version: 18.2.13 + resolution: "@types/react-dom@npm:18.2.13" dependencies: - "@types/react": ^17 - checksum: a2e3f068c1374601856b63bc57f3f436cf6270c1ba5c5cef0776def6de296c8bdd31c39b5be9e9e77f4652e923bef1e71ae377a2b038f4a81bfd0fec8d10d0d0 + "@types/react": "*" + checksum: 22ba066b141dca5a5a9227fae0afc7c94b470fff8e8a38ade72649da57a8ea04d0cb2ba3e22005e7d8e772d49bddd28855b1dd98e6defd033bba6afb6edff883 languageName: node linkType: hard @@ -18300,14 +18280,14 @@ __metadata: languageName: node linkType: hard -"@types/react@npm:^17": - version: 17.0.68 - resolution: "@types/react@npm:17.0.68" +"@types/react@npm:^18": + version: 18.2.28 + resolution: "@types/react@npm:18.2.28" dependencies: "@types/prop-types": "*" "@types/scheduler": "*" csstype: ^3.0.2 - checksum: c6ca4415b53b1abe91162b29af541a1797a56a6f462ef796e8ebda3eaa4d0609205f4f17b3fce8d9a12235d4ffd8a67c47b5e018ed85c2f3bee0fba8f54638c1 + checksum: 81381bedeba83278f4c9febb0b83e0bd3f42a25897a50b9cb36ef53651d34b3d50f87ebf11211ea57ea575131f85d31e93e496ce46478a00b0f9bf7b26b5917a languageName: node linkType: hard @@ -19741,8 +19721,8 @@ __metadata: cross-fetch: ^3.1.5 msw: ^1.0.0 peerDependencies: - react: ^16.13.1 || ^17.0.0 - react-dom: ^16.13.1 || ^17.0.0 + react: ^16.13.1 || ^17.0.0 || ^18.0.0 + react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0 react-router-dom: 6.0.0-beta.0 || ^6.3.0 languageName: unknown linkType: soft @@ -25335,7 +25315,7 @@ __metadata: "@roadiehq/backstage-plugin-travis-ci": ^2.0.5 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/jquery": ^3.3.34 "@types/react": "*" @@ -25345,8 +25325,8 @@ __metadata: cross-env: ^7.0.0 history: ^5.0.0 lodash: ^4.17.21 - react: ^17.0.2 - react-dom: ^17.0.2 + react: ^18.0.2 + react-dom: ^18.0.2 react-router: ^6.3.0 react-router-dom: ^6.3.0 react-use: ^17.2.4 @@ -25448,7 +25428,7 @@ __metadata: "@roadiehq/backstage-plugin-travis-ci": ^2.0.5 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/jquery": ^3.3.34 "@types/react": "*" @@ -25456,8 +25436,8 @@ __metadata: "@types/zen-observable": ^0.8.0 cross-env: ^7.0.0 history: ^5.0.0 - react: ^17.0.2 - react-dom: ^17.0.2 + react: ^18.0.2 + react-dom: ^18.0.2 react-router: ^6.3.0 react-router-dom: ^6.3.0 react-use: ^17.2.4 @@ -36546,16 +36526,15 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^17.0.2": - version: 17.0.2 - resolution: "react-dom@npm:17.0.2" +"react-dom@npm:^18.0.2": + version: 18.2.0 + resolution: "react-dom@npm:18.2.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - scheduler: ^0.20.2 + scheduler: ^0.23.0 peerDependencies: - react: 17.0.2 - checksum: 1c1eaa3bca7c7228d24b70932e3d7c99e70d1d04e13bb0843bbf321582bc25d7961d6b8a6978a58a598af2af496d1cedcfb1bf65f6b0960a0a8161cb8dab743c + react: ^18.2.0 + checksum: 7d323310bea3a91be2965f9468d552f201b1c27891e45ddc2d6b8f717680c95a75ae0bc1e3f5cf41472446a2589a75aed4483aee8169287909fcd59ad149e8cc languageName: node linkType: hard @@ -37121,13 +37100,12 @@ __metadata: languageName: node linkType: hard -"react@npm:^17.0.2": - version: 17.0.2 - resolution: "react@npm:17.0.2" +"react@npm:^18.0.2": + version: 18.2.0 + resolution: "react@npm:18.2.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - checksum: b254cc17ce3011788330f7bbf383ab653c6848902d7936a87b09d835d091e3f295f7e9dd1597c6daac5dc80f90e778c8230218ba8ad599f74adcc11e33b9d61b + checksum: 88e38092da8839b830cda6feef2e8505dec8ace60579e46aa5490fc3dc9bba0bd50336507dc166f43e3afc1c42939c09fe33b25fae889d6f402721dcd78fca1b languageName: node linkType: hard @@ -38384,13 +38362,12 @@ __metadata: languageName: node linkType: hard -"scheduler@npm:^0.20.2": - version: 0.20.2 - resolution: "scheduler@npm:0.20.2" +"scheduler@npm:^0.23.0": + version: 0.23.0 + resolution: "scheduler@npm:0.23.0" dependencies: loose-envify: ^1.1.0 - object-assign: ^4.1.1 - checksum: c4b35cf967c8f0d3e65753252d0f260271f81a81e427241295c5a7b783abf4ea9e905f22f815ab66676f5313be0a25f47be582254db8f9241b259213e999b8fc + checksum: d79192eeaa12abef860c195ea45d37cbf2bbf5f66e3c4dcd16f54a7da53b17788a70d109ee3d3dde1a0fd50e6a8fc171f4300356c5aee4fc0171de526bf35f8a languageName: node linkType: hard @@ -40239,14 +40216,14 @@ __metadata: "@material-ui/icons": ^4.9.1 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 - "@testing-library/react": ^12.1.3 + "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 "@types/react": "*" "@types/react-dom": "*" cross-env: ^7.0.0 history: ^5.0.0 - react: ^17.0.2 - react-dom: ^17.0.2 + react: ^18.0.2 + react-dom: ^18.0.2 react-router-dom: ^6.3.0 react-use: ^17.2.4 languageName: unknown