core-components: tweaked tests for compatibility

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
This commit is contained in:
Patrik Oldsberg
2022-08-23 18:18:44 +02:00
parent d6194b1988
commit c572e87ec1
3 changed files with 20 additions and 27 deletions
@@ -26,10 +26,12 @@ describe('<Button />', () => {
const buttonLabel = 'Navigate!';
const { getByText } = render(
wrapInTestApp(
<Routes>
<Route path="/test" element={<p>{testString}</p>} />
<>
<Button to="/test">{buttonLabel}</Button>
</Routes>,
<Routes>
<Route path="/test" element={<p>{testString}</p>} />
</Routes>
</>,
),
);
@@ -33,10 +33,12 @@ describe('<Link />', () => {
const linkText = 'Navigate!';
const { getByText } = render(
wrapInTestApp(
<Routes>
<>
<Link to="/test">{linkText}</Link>
<Route path="/test" element={<p>{testString}</p>} />
</Routes>,
<Routes>
<Route path="/test" element={<p>{testString}</p>} />
</Routes>
</>,
),
);
expect(() => getByText(testString)).toThrow();
@@ -116,8 +118,8 @@ describe('<Link />', () => {
const { getByText } = render(
wrapInTestApp(
<TestApiProvider apis={[[configApiRef, configApi]]}>
<Link to="/example/test">{linkText}</Link>
<Routes>
<Link to="/example/test">{linkText}</Link>
<Route path="/example/test" element={<p>{testString}</p>} />
</Routes>
</TestApiProvider>,
@@ -141,8 +143,8 @@ describe('<Link />', () => {
const { getByText } = render(
wrapInTestApp(
<TestApiProvider apis={[[configApiRef, configApi]]}>
<Link to="/test">{linkText}</Link>
<Routes>
<Link to="/test">{linkText}</Link>
<Route path="/example/test" element={<p>{testString}</p>} />
</Routes>
</TestApiProvider>,
@@ -16,7 +16,6 @@
import { renderInTestApp, withLogCollector } from '@backstage/test-utils';
import { act, fireEvent } from '@testing-library/react';
import React from 'react';
import { Route, Routes } from 'react-router';
import { TabbedLayout } from './TabbedLayout';
describe('TabbedLayout', () => {
@@ -59,24 +58,14 @@ describe('TabbedLayout', () => {
it('navigates when user clicks different tab', async () => {
const { getByText, queryByText, queryAllByRole } = await renderInTestApp(
<Routes>
<Route
path="/*"
element={
<TabbedLayout>
<TabbedLayout.Route path="/" title="tabbed-test-title">
<div>tabbed-test-content</div>
</TabbedLayout.Route>
<TabbedLayout.Route
path="/some-other-path"
title="tabbed-test-title-2"
>
<div>tabbed-test-content-2</div>
</TabbedLayout.Route>
</TabbedLayout>
}
/>
</Routes>,
<TabbedLayout>
<TabbedLayout.Route path="/" title="tabbed-test-title">
<div>tabbed-test-content</div>
</TabbedLayout.Route>
<TabbedLayout.Route path="/some-other-path" title="tabbed-test-title-2">
<div>tabbed-test-content-2</div>
</TabbedLayout.Route>
</TabbedLayout>,
);
const secondTab = queryAllByRole('tab')[1];