diff --git a/packages/core/src/components/CodeSnippet/CodeSnippet.test.tsx b/packages/core/src/components/CodeSnippet/CodeSnippet.test.tsx
index 0d0c34a3e6..c019b316fd 100644
--- a/packages/core/src/components/CodeSnippet/CodeSnippet.test.tsx
+++ b/packages/core/src/components/CodeSnippet/CodeSnippet.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import CodeSnippet from './CodeSnippet';
@@ -33,16 +33,14 @@ const minProps = {
describe('', () => {
it('renders text without exploding', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(/"Hello"/)).toBeInTheDocument();
expect(getByText(/"World"/)).toBeInTheDocument();
});
it('renders without line numbers', () => {
const { queryByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(queryByText('1')).not.toBeInTheDocument();
expect(queryByText('2')).not.toBeInTheDocument();
@@ -51,7 +49,7 @@ describe('', () => {
it('renders with line numbers', () => {
const { queryByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(queryByText(/1/)).toBeInTheDocument();
expect(queryByText(/2/)).toBeInTheDocument();
diff --git a/packages/core/src/components/CopyTextButton/CopyTextButton.test.tsx b/packages/core/src/components/CopyTextButton/CopyTextButton.test.tsx
index e0f7271014..dd83cd318d 100644
--- a/packages/core/src/components/CopyTextButton/CopyTextButton.test.tsx
+++ b/packages/core/src/components/CopyTextButton/CopyTextButton.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import CopyTextButton from './CopyTextButton';
import {
ApiRegistry,
@@ -57,7 +57,7 @@ const apiRegistry = ApiRegistry.from([
describe('', () => {
it('renders without exploding', () => {
const { getByDisplayValue } = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -69,7 +69,7 @@ describe('', () => {
it('displays tooltip on click', async () => {
document.execCommand = jest.fn();
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
diff --git a/packages/core/src/components/DismissableBanner/DismissableBanner.test.js b/packages/core/src/components/DismissableBanner/DismissableBanner.test.js
index 485b6226d2..8981acf8af 100644
--- a/packages/core/src/components/DismissableBanner/DismissableBanner.test.js
+++ b/packages/core/src/components/DismissableBanner/DismissableBanner.test.js
@@ -16,7 +16,7 @@
import React from 'react';
// import { fireEvent, waitForElementToBeRemoved } from '@testing-library/react';
-import { renderWithEffects, wrapInThemedTestApp } from '@backstage/test-utils';
+import { renderWithEffects, wrapInTestApp } from '@backstage/test-utils';
// import { createSetting } from 'shared/apis/settings';
import DismissableBanner from './DismissableBanner';
@@ -30,7 +30,7 @@ describe('', () => {
*/
const rendered = await renderWithEffects(
- wrapInThemedTestApp(
+ wrapInTestApp(
', () => {
it('renders without exploding', () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
item1
item2
@@ -69,7 +69,7 @@ describe('', () => {
};
const rendered = await renderWithEffects(
- wrapInThemedTestApp(
+ wrapInTestApp(
item1
diff --git a/packages/core/src/components/Lifecycle/Lifecycle.test.jsx b/packages/core/src/components/Lifecycle/Lifecycle.test.jsx
index db0d2736ed..ac3823d85c 100644
--- a/packages/core/src/components/Lifecycle/Lifecycle.test.jsx
+++ b/packages/core/src/components/Lifecycle/Lifecycle.test.jsx
@@ -16,29 +16,27 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { Lifecycle } from './Lifecycle';
describe('', () => {
it('renders Alpha with shorthand', async () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText('α')).toBeInTheDocument();
});
it('renders Alpha without shorthand', async () => {
- const { getByText } = render(wrapInThemedTestApp());
+ const { getByText } = render(wrapInTestApp());
expect(getByText('Alpha')).toBeInTheDocument();
});
it('renders Beta with shorthand', async () => {
- const { getByText } = render(wrapInThemedTestApp());
+ const { getByText } = render(wrapInTestApp());
expect(getByText('β')).toBeInTheDocument();
});
it('renders Beta without shorthand', async () => {
- const { getByText } = render(wrapInThemedTestApp());
+ const { getByText } = render(wrapInTestApp());
expect(getByText('Beta')).toBeInTheDocument();
});
});
diff --git a/packages/core/src/components/ProgressBars/CircleProgress.test.jsx b/packages/core/src/components/ProgressBars/CircleProgress.test.jsx
index 4975e00cb8..b42559b7b7 100644
--- a/packages/core/src/components/ProgressBars/CircleProgress.test.jsx
+++ b/packages/core/src/components/ProgressBars/CircleProgress.test.jsx
@@ -16,37 +16,33 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import CircleProgress, { getProgressColor } from './CircleProgress';
describe('', () => {
it('renders without exploding', () => {
const { getByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
getByText('10%');
});
it('handles fractional prop', () => {
const { getByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
getByText('10%');
});
it('handles max prop', () => {
const { getByText } = render(
- wrapInThemedTestApp(
- ,
- ),
+ wrapInTestApp(),
);
getByText('1%');
});
it('handles unit prop', () => {
const { getByText } = render(
- wrapInThemedTestApp(
- ,
- ),
+ wrapInTestApp(),
);
getByText('10m');
});
diff --git a/packages/core/src/components/ProgressBars/ProgressCard.test.jsx b/packages/core/src/components/ProgressBars/ProgressCard.test.jsx
index 7357cab812..3e93e3f302 100644
--- a/packages/core/src/components/ProgressBars/ProgressCard.test.jsx
+++ b/packages/core/src/components/ProgressBars/ProgressCard.test.jsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import ProgressCard from './ProgressCard';
@@ -24,32 +24,26 @@ const minProps = { title: 'Tingle upgrade', progress: 0.12 };
describe('', () => {
it('renders without exploding', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(/Tingle.*/)).toBeInTheDocument();
});
it('renders progress and title', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(/Tingle.*/)).toBeInTheDocument();
expect(getByText(/12%.*/)).toBeInTheDocument();
});
it('does not render deepLink', () => {
const { queryByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(queryByText('View more')).not.toBeInTheDocument();
});
it('handles invalid numbers', () => {
const badProps = { title: 'Tingle upgrade', progress: 'hejjo' };
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(/N\/A.*/)).toBeInTheDocument();
});
});
diff --git a/packages/core/src/components/TrendLine/TrendLine.test.tsx b/packages/core/src/components/TrendLine/TrendLine.test.tsx
index 985e5d2b31..84e8413f01 100644
--- a/packages/core/src/components/TrendLine/TrendLine.test.tsx
+++ b/packages/core/src/components/TrendLine/TrendLine.test.tsx
@@ -17,7 +17,7 @@
/* eslint-disable jest/no-disabled-tests */
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import TrendLine from '.';
@@ -25,7 +25,7 @@ describe('TrendLine', () => {
describe('when no data is present', () => {
it('renders null without throwing', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.queryByTitle('sparkline')).not.toBeInTheDocument();
});
@@ -34,7 +34,7 @@ describe('TrendLine', () => {
describe('when one datapoint is present', () => {
it('renders as a straight line', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
});
@@ -43,7 +43,7 @@ describe('TrendLine', () => {
describe.skip('when the data finishes above the success threshold', () => {
it('renders with the correct color', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
});
@@ -52,7 +52,7 @@ describe('TrendLine', () => {
describe.skip('when the data finishes within the the warning threshold', () => {
it('renders with the correct color', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
});
@@ -61,7 +61,7 @@ describe('TrendLine', () => {
describe.skip('when the data finishes within the the error threshold', () => {
it('renders with the correct color', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByTitle('sparkline')).toBeInTheDocument();
});
diff --git a/packages/core/src/components/WarningPanel/WarningPanel.test.tsx b/packages/core/src/components/WarningPanel/WarningPanel.test.tsx
index 4094c65a1f..c4d836cfe1 100644
--- a/packages/core/src/components/WarningPanel/WarningPanel.test.tsx
+++ b/packages/core/src/components/WarningPanel/WarningPanel.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import WarningPanel from './WarningPanel';
@@ -24,15 +24,13 @@ const minProps = { title: 'Mock title', message: 'Some more info' };
describe('', () => {
it('renders without exploding', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText('Mock title')).toBeInTheDocument();
});
it('renders message and children', () => {
const { getByText } = render(
- wrapInThemedTestApp(children),
+ wrapInTestApp(children),
);
expect(getByText('Some more info')).toBeInTheDocument();
expect(getByText('children')).toBeInTheDocument();
diff --git a/packages/core/src/layout/ContentHeader/ContentHeader.test.tsx b/packages/core/src/layout/ContentHeader/ContentHeader.test.tsx
index 2f40511f35..5db676dcc5 100644
--- a/packages/core/src/layout/ContentHeader/ContentHeader.test.tsx
+++ b/packages/core/src/layout/ContentHeader/ContentHeader.test.tsx
@@ -17,7 +17,7 @@
import React from 'react';
import { render } from '@testing-library/react';
import { ContentHeader } from './ContentHeader';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
jest.mock('react-helmet', () => {
return {
@@ -27,9 +27,7 @@ jest.mock('react-helmet', () => {
describe('', () => {
it('should render with title', () => {
- const rendered = render(
- wrapInThemedTestApp(),
- );
+ const rendered = render(wrapInTestApp());
rendered.getByText('Title');
});
@@ -37,14 +35,14 @@ describe('', () => {
const title = 'Custom title';
const titleComponent = () => {title}
;
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
rendered.getByText(title);
});
it('should render with description', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
rendered.getByText('description');
});
diff --git a/packages/core/src/layout/ErrorPage/ErrorPage.test.tsx b/packages/core/src/layout/ErrorPage/ErrorPage.test.tsx
index d383c3fbf0..c47ff8d49e 100644
--- a/packages/core/src/layout/ErrorPage/ErrorPage.test.tsx
+++ b/packages/core/src/layout/ErrorPage/ErrorPage.test.tsx
@@ -17,14 +17,12 @@
import React from 'react';
import { render } from '@testing-library/react';
import { ErrorPage } from './ErrorPage';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
describe('', () => {
it('should render with status code, status message and go back link', () => {
const rendered = render(
- wrapInThemedTestApp(
- ,
- ),
+ wrapInTestApp(),
);
rendered.getByText(/page not found/i);
rendered.getByText(/404/i);
diff --git a/packages/core/src/layout/Header/Header.test.tsx b/packages/core/src/layout/Header/Header.test.tsx
index c1f9be6cf6..5d28c6633f 100644
--- a/packages/core/src/layout/Header/Header.test.tsx
+++ b/packages/core/src/layout/Header/Header.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { Header } from './Header';
jest.mock('react-helmet', () => {
@@ -27,19 +27,19 @@ jest.mock('react-helmet', () => {
describe('', () => {
it('should render with title', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
rendered.getByText('Title');
});
it('should set document title', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
rendered.getByText('Title1');
rendered.getByText('defaultTitle: Title1 | Backstage');
});
it('should override document title', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
rendered.getByText('Title1');
rendered.getByText('defaultTitle: Title2 | Backstage');
@@ -47,14 +47,14 @@ describe('', () => {
it('should have subtitle', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
rendered.getByText('Subtitle');
});
it('should have type rendered', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
rendered.getByText('tool');
});
diff --git a/packages/core/src/layout/HeaderActionMenu/HeaderActionMenu.test.tsx b/packages/core/src/layout/HeaderActionMenu/HeaderActionMenu.test.tsx
index a1b5740f88..00fa4d27ac 100644
--- a/packages/core/src/layout/HeaderActionMenu/HeaderActionMenu.test.tsx
+++ b/packages/core/src/layout/HeaderActionMenu/HeaderActionMenu.test.tsx
@@ -16,18 +16,18 @@
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
-import { wrapInThemedTestApp, Keyboard } from '@backstage/test-utils';
+import { wrapInTestApp, Keyboard } from '@backstage/test-utils';
import { HeaderActionMenu } from './HeaderActionMenu';
describe('', () => {
it('renders without any items and without exploding', () => {
- render(wrapInThemedTestApp());
+ render(wrapInTestApp());
});
it('can open the menu and click menu items', () => {
const onClickFunction = jest.fn();
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -49,7 +49,7 @@ describe('', () => {
it('Disabled', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -66,7 +66,7 @@ describe('', () => {
it('Test wrapper, and secondary label', () => {
const onClickFunction = jest.fn();
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
', () => {
it('should close when hitting escape', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
),
);
diff --git a/packages/core/src/layout/HeaderLabel/HeaderLabel.test.tsx b/packages/core/src/layout/HeaderLabel/HeaderLabel.test.tsx
index 11a22f9b5d..fdc6ef8c6e 100644
--- a/packages/core/src/layout/HeaderLabel/HeaderLabel.test.tsx
+++ b/packages/core/src/layout/HeaderLabel/HeaderLabel.test.tsx
@@ -16,39 +16,37 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { HeaderLabel } from './HeaderLabel';
describe('', () => {
it('should have a label', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
expect(rendered.getByText('Label')).toBeInTheDocument();
});
it('should say unknown', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
expect(rendered.getByText('')).toBeInTheDocument();
});
it('should say unknown when passing null as value prop', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByText('')).toBeInTheDocument();
});
it('should have value', () => {
const rendered = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(rendered.getByText('Value')).toBeInTheDocument();
});
it('should have a link', () => {
const rendered = render(
- wrapInThemedTestApp(
- ,
- ),
+ wrapInTestApp(),
);
const anchor = rendered.container.querySelector('a') as HTMLAnchorElement;
expect(rendered.getByText('Value')).toBeInTheDocument();
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index fd893f8c8c..c35e3a622e 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -29,6 +29,7 @@
},
"dependencies": {
"@backstage/cli": "^0.1.1-alpha.6",
+ "@backstage/core-api": "^0.1.1-alpha.6",
"@backstage/test-utils-core": "^0.1.1-alpha.6",
"@backstage/theme": "^0.1.1-alpha.6",
"@material-ui/core": "^4.9.1",
diff --git a/packages/test-utils/src/testUtils/appWrappers.test.tsx b/packages/test-utils/src/testUtils/appWrappers.test.tsx
index e2f1b6b7cb..e46b6a95ce 100644
--- a/packages/test-utils/src/testUtils/appWrappers.test.tsx
+++ b/packages/test-utils/src/testUtils/appWrappers.test.tsx
@@ -27,7 +27,7 @@ describe('wrapInTestApp', () => {
Route 1
Route 2
>,
- ['/route2'],
+ { routeEntries: ['/route2'] },
),
);
expect(rendered.getByText('Route 2')).toBeInTheDocument();
diff --git a/packages/test-utils/src/testUtils/appWrappers.tsx b/packages/test-utils/src/testUtils/appWrappers.tsx
index 06d8781669..c5839610d3 100644
--- a/packages/test-utils/src/testUtils/appWrappers.tsx
+++ b/packages/test-utils/src/testUtils/appWrappers.tsx
@@ -15,15 +15,52 @@
*/
import React, { ComponentType, ReactNode, FunctionComponent } from 'react';
-import { ThemeProvider } from '@material-ui/core';
import { MemoryRouter } from 'react-router';
import { Route } from 'react-router-dom';
import { lightTheme } from '@backstage/theme';
+import privateExports, {
+ defaultSystemIcons,
+ ApiTestRegistry,
+} from '@backstage/core-api';
+const { PrivateAppImpl } = privateExports;
+
+const NotFoundErrorPage = () => {
+ throw new Error('Reached NotFound Page');
+};
+
+/**
+ * Options to customize the behavior of the test app wrapper.
+ */
+type TestAppOptions = {
+ /**
+ * Initial route entries to pass along as `initialEntries` to the router.
+ */
+ routeEntries?: string[];
+};
export function wrapInTestApp(
Component: ComponentType | ReactNode,
- initialRouterEntries: string[] = ['/'],
+ options: TestAppOptions = {},
) {
+ const { routeEntries = ['/'] } = options;
+
+ const app = new PrivateAppImpl({
+ apis: new ApiTestRegistry(),
+ components: {
+ NotFoundErrorPage,
+ },
+ icons: defaultSystemIcons,
+ plugins: [],
+ themes: [
+ {
+ id: 'light',
+ theme: lightTheme,
+ title: 'Test App Theme',
+ variant: 'light',
+ },
+ ],
+ });
+
let Wrapper: ComponentType;
if (Component instanceof Function) {
Wrapper = Component;
@@ -31,21 +68,13 @@ export function wrapInTestApp(
Wrapper = (() => Component) as FunctionComponent;
}
+ const AppProvider = app.getProvider();
+
return (
-
-
-
+
+
+
+
+
);
}
-
-export function wrapInThemedTestApp(
- component: ReactNode,
- initialRouterEntries: string[] = ['/'],
-) {
- const themed = {component};
- return wrapInTestApp(themed, initialRouterEntries);
-}
-
-export const wrapInTheme = (component: ReactNode, theme = lightTheme) => (
- {component}
-);
diff --git a/plugins/catalog/src/components/CatalogFilter/CatalogFilter.test.tsx b/plugins/catalog/src/components/CatalogFilter/CatalogFilter.test.tsx
index 762a881302..ec44f53777 100644
--- a/plugins/catalog/src/components/CatalogFilter/CatalogFilter.test.tsx
+++ b/plugins/catalog/src/components/CatalogFilter/CatalogFilter.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { CatalogFilter, CatalogFilterGroup } from './CatalogFilter';
describe('Catalog Filter', () => {
@@ -26,7 +26,7 @@ describe('Catalog Filter', () => {
{ name: 'Test Group 2', items: [] },
];
const { findByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
for (const group of mockGroups) {
@@ -52,7 +52,7 @@ describe('Catalog Filter', () => {
];
const { findByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
const [group] = mockGroups;
@@ -81,7 +81,7 @@ describe('Catalog Filter', () => {
];
const { findByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
const [group] = mockGroups;
@@ -112,7 +112,7 @@ describe('Catalog Filter', () => {
const onSelectedChangeHandler = jest.fn();
const { findByText } = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
{} };
@@ -30,7 +30,7 @@ describe('CatalogPage', () => {
// https://github.com/mbrn/material-table/issues/1293
it('should render', async () => {
const rendered = render(
- wrapInTheme(
+ wrapInTestApp(
{
it('should render loading when loading prop it set to true', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
),
);
@@ -38,7 +38,7 @@ describe('CatalogTable component', () => {
it('should render error message when error is passed in props', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
{
it('should display component names when loading has finished and no error occurred', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
{
@@ -38,7 +38,7 @@ describe('ComponentPage', () => {
it('should redirect to component table page when name is not provided', async () => {
const props = getTestProps('');
await render(
- wrapInTheme(
+ wrapInTestApp(
,
diff --git a/plugins/explore/src/components/ExploreCard.test.js b/plugins/explore/src/components/ExploreCard.test.js
index fde36b529d..45652015a5 100644
--- a/plugins/explore/src/components/ExploreCard.test.js
+++ b/plugins/explore/src/components/ExploreCard.test.js
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import ExploreCard from './ExploreCard';
@@ -32,22 +32,18 @@ const minProps = {
describe('', () => {
it('renders without exploding', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText('Explore')).toBeInTheDocument();
});
it('renders props correctly', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(minProps.card.title)).toBeInTheDocument();
expect(getByText(minProps.card.description)).toBeInTheDocument();
});
it('should link out', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
const anchor = rendered.container.querySelector('a');
expect(anchor.href).toBe(minProps.card.url);
});
@@ -63,7 +59,7 @@ describe('', () => {
},
};
const { getByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(getByText('Description missing')).toBeInTheDocument();
});
@@ -78,15 +74,13 @@ describe('', () => {
},
};
const { queryByText } = render(
- wrapInThemedTestApp(),
+ wrapInTestApp(),
);
expect(queryByText('GA')).not.toBeInTheDocument();
});
it('renders tags correctly', () => {
- const { getByText } = render(
- wrapInThemedTestApp(),
- );
+ const { getByText } = render(wrapInTestApp());
expect(getByText(minProps.card.tags[0])).toBeInTheDocument();
expect(getByText(minProps.card.tags[1])).toBeInTheDocument();
});
diff --git a/plugins/lighthouse/src/components/AuditList/AuditListTable.test.tsx b/plugins/lighthouse/src/components/AuditList/AuditListTable.test.tsx
index cebab93f17..039b397083 100644
--- a/plugins/lighthouse/src/components/AuditList/AuditListTable.test.tsx
+++ b/plugins/lighthouse/src/components/AuditList/AuditListTable.test.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { ApiRegistry, ApiProvider } from '@backstage/core';
import AuditListTable from './AuditListTable';
@@ -50,12 +50,10 @@ describe('AuditListTable', () => {
);
};
it('renders the link to each website', () => {
- const rendered = render(
- wrapInThemedTestApp(auditList(websiteListResponse)),
- );
+ const rendered = render(wrapInTestApp(auditList(websiteListResponse)));
const link = rendered.queryByText('https://anchor.fm');
const website = websiteListResponse.items.find(
- (w) => w.url === 'https://anchor.fm',
+ w => w.url === 'https://anchor.fm',
);
if (!website)
throw new Error('https://anchor.fm must be present in fixture');
@@ -67,11 +65,9 @@ describe('AuditListTable', () => {
});
it('renders the dates that are available for a given row', () => {
- const rendered = render(
- wrapInThemedTestApp(auditList(websiteListResponse)),
- );
+ const rendered = render(wrapInTestApp(auditList(websiteListResponse)));
const website = websiteListResponse.items.find(
- (w) => w.url === 'https://anchor.fm',
+ w => w.url === 'https://anchor.fm',
);
if (!website)
throw new Error('https://anchor.fm must be present in fixture');
@@ -81,35 +77,30 @@ describe('AuditListTable', () => {
});
it('renders the status for a given row', async () => {
- const rendered = render(
- wrapInThemedTestApp(auditList(websiteListResponse)),
- );
+ const rendered = render(wrapInTestApp(auditList(websiteListResponse)));
const completed = await rendered.findAllByText('COMPLETED');
expect(completed).toHaveLength(
- websiteListResponse.items.filter(
- (w) => w.lastAudit.status === 'COMPLETED',
- ).length,
+ websiteListResponse.items.filter(w => w.lastAudit.status === 'COMPLETED')
+ .length,
);
const failed = await rendered.findAllByText('FAILED');
expect(failed).toHaveLength(
- websiteListResponse.items.filter((w) => w.lastAudit.status === 'FAILED')
+ websiteListResponse.items.filter(w => w.lastAudit.status === 'FAILED')
.length,
);
const running = await rendered.findAllByText('FAILED');
expect(running).toHaveLength(
- websiteListResponse.items.filter((w) => w.lastAudit.status === 'RUNNING')
+ websiteListResponse.items.filter(w => w.lastAudit.status === 'RUNNING')
.length,
);
});
describe('sparklines', () => {
it('correctly maps the data from the website payload', () => {
- const rendered = render(
- wrapInThemedTestApp(auditList(websiteListResponse)),
- );
+ const rendered = render(wrapInTestApp(auditList(websiteListResponse)));
const backstageSEO = rendered.getByTitle(
'trendline for SEO category of https://backstage.io',
);
@@ -117,9 +108,7 @@ describe('AuditListTable', () => {
});
it('does not break when no data is available', () => {
- const rendered = render(
- wrapInThemedTestApp(auditList(websiteListResponse)),
- );
+ const rendered = render(wrapInTestApp(auditList(websiteListResponse)));
const anchorSEO = rendered.queryByTitle(
'trendline for SEO category of https://anchor.fm',
);
diff --git a/plugins/lighthouse/src/components/AuditList/index.test.tsx b/plugins/lighthouse/src/components/AuditList/index.test.tsx
index 9bd6e98aaa..bcd486e876 100644
--- a/plugins/lighthouse/src/components/AuditList/index.test.tsx
+++ b/plugins/lighthouse/src/components/AuditList/index.test.tsx
@@ -27,11 +27,10 @@ jest.mock('react-router-dom', () => {
});
import React from 'react';
-import { MemoryRouter } from 'react-router-dom';
import mockFetch from 'jest-fetch-mock';
import { render, fireEvent } from '@testing-library/react';
import { ApiRegistry, ApiProvider } from '@backstage/core';
-import { wrapInThemedTestApp, wrapInTheme } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import {
lighthouseApiRef,
@@ -57,7 +56,7 @@ describe('AuditList', () => {
it('should render the table', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -69,7 +68,7 @@ describe('AuditList', () => {
it('renders a link to create a new audit', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -87,12 +86,11 @@ describe('AuditList', () => {
it('requests the correct limit and offset from the api based on the query', () => {
mockFetch.mockClear();
render(
- wrapInTheme(
-
-
-
-
- ,
+ wrapInTestApp(
+
+
+ ,
+ { routeEntries: ['/lighthouse?page=2'] },
),
);
expect(mockFetch).toHaveBeenLastCalledWith(
@@ -104,7 +102,7 @@ describe('AuditList', () => {
describe('when only one page is needed', () => {
it('hides pagination elements', () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -125,7 +123,7 @@ describe('AuditList', () => {
it('shows pagination elements', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -138,12 +136,11 @@ describe('AuditList', () => {
it('changes the page on click', async () => {
const rendered = render(
- wrapInTheme(
-
-
-
-
- ,
+ wrapInTestApp(
+
+
+ ,
+ { routeEntries: ['/lighthouse?page=2'] },
),
);
const element = await rendered.findByLabelText(/Go to page 1/);
@@ -157,7 +154,7 @@ describe('AuditList', () => {
it('should render the loader', async () => {
mockFetch.mockResponseOnce(() => new Promise(() => {}));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -172,7 +169,7 @@ describe('AuditList', () => {
it('should render an error', async () => {
mockFetch.mockRejectOnce(new Error('failed to fetch'));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
diff --git a/plugins/lighthouse/src/components/AuditView/index.test.tsx b/plugins/lighthouse/src/components/AuditView/index.test.tsx
index 4e261fcf39..b2c15cd8b7 100644
--- a/plugins/lighthouse/src/components/AuditView/index.test.tsx
+++ b/plugins/lighthouse/src/components/AuditView/index.test.tsx
@@ -27,7 +27,7 @@ jest.mock('react-router-dom', () => {
import React from 'react';
import mockFetch from 'jest-fetch-mock';
import { render } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { ApiRegistry, ApiProvider } from '@backstage/core';
import AuditView from '.';
@@ -56,7 +56,7 @@ describe('AuditView', () => {
it('renders the iframe for the selected audit', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -72,7 +72,7 @@ describe('AuditView', () => {
it('renders a link to create a new audit for this website', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -92,7 +92,7 @@ describe('AuditView', () => {
describe('sidebar', () => {
it('renders a list of all audits for the website', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -110,7 +110,7 @@ describe('AuditView', () => {
it('sets the current audit as active', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -138,7 +138,7 @@ describe('AuditView', () => {
it('navigates to the next report when an audit is clicked', async () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -160,7 +160,7 @@ describe('AuditView', () => {
it('it shows the loading', async () => {
mockFetch.mockImplementationOnce(() => new Promise(() => {}));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -174,7 +174,7 @@ describe('AuditView', () => {
it('it shows an error', async () => {
mockFetch.mockRejectOnce(new Error('failed to fetch'));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -191,7 +191,7 @@ describe('AuditView', () => {
useParams.mockReturnValueOnce({ id });
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -211,7 +211,7 @@ describe('AuditView', () => {
useParams.mockReturnValueOnce({ id });
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
diff --git a/plugins/lighthouse/src/components/CreateAudit/index.test.tsx b/plugins/lighthouse/src/components/CreateAudit/index.test.tsx
index 79897539c4..08e8005530 100644
--- a/plugins/lighthouse/src/components/CreateAudit/index.test.tsx
+++ b/plugins/lighthouse/src/components/CreateAudit/index.test.tsx
@@ -29,14 +29,13 @@ jest.mock('react-router-dom', () => {
import React from 'react';
import mockFetch from 'jest-fetch-mock';
import { wait, render, fireEvent } from '@testing-library/react';
-import { MemoryRouter } from 'react-router-dom';
import {
ApiRegistry,
ApiProvider,
ErrorApi,
errorApiRef,
} from '@backstage/core';
-import { wrapInThemedTestApp, wrapInTheme } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import { lighthouseApiRef, LighthouseRestApi, Audit } from '../../api';
import CreateAudit from '.';
@@ -62,7 +61,7 @@ describe('CreateAudit', () => {
it('renders the form', () => {
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -77,16 +76,15 @@ describe('CreateAudit', () => {
it('prefills the url into the form', () => {
const url = 'https://spotify.com';
const rendered = render(
- wrapInTheme(
-
+
+ ,
+ {
+ routeEntries: [
`/lighthouse/create-audit?url=${encodeURIComponent(url)}`,
- ]}
- >
-
-
-
- ,
+ ],
+ },
),
);
expect(rendered.getByLabelText(/URL/)).toHaveAttribute('value', url);
@@ -98,7 +96,7 @@ describe('CreateAudit', () => {
mockFetch.mockResponseOnce(() => new Promise(() => {}));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -121,7 +119,7 @@ describe('CreateAudit', () => {
mockFetch.mockResponseOnce(JSON.stringify(createAuditResponse));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
@@ -152,7 +150,7 @@ describe('CreateAudit', () => {
mockFetch.mockRejectOnce(new Error('failed to post'));
const rendered = render(
- wrapInThemedTestApp(
+ wrapInTestApp(
,
diff --git a/plugins/lighthouse/src/components/Intro/index.test.tsx b/plugins/lighthouse/src/components/Intro/index.test.tsx
index e64e8114d3..183008dc3c 100644
--- a/plugins/lighthouse/src/components/Intro/index.test.tsx
+++ b/plugins/lighthouse/src/components/Intro/index.test.tsx
@@ -18,13 +18,13 @@
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
-import { wrapInThemedTestApp } from '@backstage/test-utils';
+import { wrapInTestApp } from '@backstage/test-utils';
import LighthouseIntro from '.';
describe('LighthouseIntro', () => {
it('renders successfully', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
expect(
rendered.queryByText('Welcome to Lighthouse in Backstage!'),
).toBeInTheDocument();
@@ -35,13 +35,13 @@ describe('LighthouseIntro', () => {
const secondTabRe = /you will need a running instance of/;
it('selects the first text element', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
expect(rendered.queryByText(firstTabRe)).toBeInTheDocument();
expect(rendered.queryByText(secondTabRe)).not.toBeInTheDocument();
});
it('shows the other text when the tab is clicked', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
fireEvent.click(rendered.getByText('Setup'));
expect(rendered.queryByText(firstTabRe)).not.toBeInTheDocument();
expect(rendered.queryByText(secondTabRe)).toBeInTheDocument();
@@ -50,7 +50,7 @@ describe('LighthouseIntro', () => {
describe('closing', () => {
it('hides the content on click', () => {
- const rendered = render(wrapInThemedTestApp());
+ const rendered = render(wrapInTestApp());
const welcomeMessage = rendered.queryByText(
'Welcome to Lighthouse in Backstage!',
);