some more progress toward ubiquitous eslint-plugin-testing-library
Signed-off-by: Fredrik Adelöw <freben@gmail.com>
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
|
||||
import React from 'react';
|
||||
import { FeatureFlagged } from './FeatureFlagged';
|
||||
import { render } from '@testing-library/react';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { LocalStorageFeatureFlags } from '../apis';
|
||||
import { TestApiProvider } from '@backstage/test-utils';
|
||||
import { featureFlagsApiRef } from '@backstage/core-plugin-api';
|
||||
@@ -35,7 +35,7 @@ describe('FeatureFlagged', () => {
|
||||
.spyOn(mockFeatureFlagsApi, 'isActive')
|
||||
.mockImplementation(() => true);
|
||||
|
||||
const { queryByText } = render(
|
||||
render(
|
||||
<Wrapper>
|
||||
<div>
|
||||
<FeatureFlagged with="hello-flag">
|
||||
@@ -45,14 +45,14 @@ describe('FeatureFlagged', () => {
|
||||
</Wrapper>,
|
||||
);
|
||||
|
||||
expect(queryByText('BACKSTAGE!')).toBeInTheDocument();
|
||||
expect(screen.getByText('BACKSTAGE!')).toBeInTheDocument();
|
||||
});
|
||||
it('should not render contents when the feature flag is disabled', async () => {
|
||||
jest
|
||||
.spyOn(mockFeatureFlagsApi, 'isActive')
|
||||
.mockImplementation(() => false);
|
||||
|
||||
const { queryByText } = render(
|
||||
render(
|
||||
<Wrapper>
|
||||
<div>
|
||||
<FeatureFlagged with="hello-flag">
|
||||
@@ -62,7 +62,7 @@ describe('FeatureFlagged', () => {
|
||||
</Wrapper>,
|
||||
);
|
||||
|
||||
expect(queryByText('BACKSTAGE!')).not.toBeInTheDocument();
|
||||
expect(screen.queryByText('BACKSTAGE!')).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
describe('without', () => {
|
||||
@@ -71,7 +71,7 @@ describe('FeatureFlagged', () => {
|
||||
.spyOn(mockFeatureFlagsApi, 'isActive')
|
||||
.mockImplementation(() => true);
|
||||
|
||||
const { queryByText } = render(
|
||||
render(
|
||||
<Wrapper>
|
||||
<div>
|
||||
<FeatureFlagged without="hello-flag">
|
||||
@@ -81,14 +81,14 @@ describe('FeatureFlagged', () => {
|
||||
</Wrapper>,
|
||||
);
|
||||
|
||||
expect(queryByText('BACKSTAGE!')).not.toBeInTheDocument();
|
||||
expect(screen.queryByText('BACKSTAGE!')).not.toBeInTheDocument();
|
||||
});
|
||||
it('should render contents when the feature flag is disabled', async () => {
|
||||
jest
|
||||
.spyOn(mockFeatureFlagsApi, 'isActive')
|
||||
.mockImplementation(() => false);
|
||||
|
||||
const { queryByText } = render(
|
||||
render(
|
||||
<Wrapper>
|
||||
<div>
|
||||
<FeatureFlagged without="hello-flag">
|
||||
@@ -98,7 +98,7 @@ describe('FeatureFlagged', () => {
|
||||
</Wrapper>,
|
||||
);
|
||||
|
||||
expect(queryByText('BACKSTAGE!')).toBeInTheDocument();
|
||||
expect(screen.getByText('BACKSTAGE!')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -15,6 +15,7 @@
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { screen } from '@testing-library/react';
|
||||
import { AlertDisplay } from './AlertDisplay';
|
||||
import { alertApiRef } from '@backstage/core-plugin-api';
|
||||
import { AlertApiForwarder } from '@backstage/core-app-api';
|
||||
@@ -34,7 +35,7 @@ describe('<AlertDisplay />', () => {
|
||||
});
|
||||
|
||||
it('renders with message', async () => {
|
||||
const { queryByText } = await renderInTestApp(
|
||||
await renderInTestApp(
|
||||
<TestApiProvider
|
||||
apis={[
|
||||
[
|
||||
@@ -52,7 +53,7 @@ describe('<AlertDisplay />', () => {
|
||||
</TestApiProvider>,
|
||||
);
|
||||
|
||||
expect(queryByText(TEST_MESSAGE)).toBeInTheDocument();
|
||||
expect(screen.getByText(TEST_MESSAGE)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
describe('with multiple messages', () => {
|
||||
@@ -73,23 +74,23 @@ describe('<AlertDisplay />', () => {
|
||||
] as const;
|
||||
|
||||
it('renders first message', async () => {
|
||||
const { queryByText } = await renderInTestApp(
|
||||
await renderInTestApp(
|
||||
<TestApiProvider apis={apis}>
|
||||
<AlertDisplay />
|
||||
</TestApiProvider>,
|
||||
);
|
||||
|
||||
expect(queryByText('message one')).toBeInTheDocument();
|
||||
expect(screen.getByText('message one')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders a count of remaining messages', async () => {
|
||||
const { queryByText } = await renderInTestApp(
|
||||
await renderInTestApp(
|
||||
<TestApiProvider apis={apis}>
|
||||
<AlertDisplay />
|
||||
</TestApiProvider>,
|
||||
);
|
||||
|
||||
expect(queryByText('(2 older messages)')).toBeInTheDocument();
|
||||
expect(screen.getByText('(2 older messages)')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -60,11 +60,11 @@ describe('RealLogViewer', () => {
|
||||
await userEvent.keyboard('{shift>}{enter}{/shift}');
|
||||
expect(rendered.getByText('3/3')).toBeInTheDocument();
|
||||
|
||||
expect(rendered.queryByText('Some Log Line')).toBeInTheDocument();
|
||||
expect(rendered.getByText('Some Log Line')).toBeInTheDocument();
|
||||
await userEvent.keyboard('{meta>}{enter}{/meta}');
|
||||
expect(rendered.queryByText('Some Log Line')).not.toBeInTheDocument();
|
||||
await userEvent.keyboard('{meta>}{enter}{/meta}');
|
||||
expect(rendered.queryByText('Some Log Line')).toBeInTheDocument();
|
||||
expect(rendered.getByText('Some Log Line')).toBeInTheDocument();
|
||||
|
||||
// Tab down to line #2 and click
|
||||
await userEvent.tab();
|
||||
|
||||
@@ -14,15 +14,15 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { fireEvent, screen } from '@testing-library/react';
|
||||
import { configApiRef } from '@backstage/core-plugin-api';
|
||||
import {
|
||||
MockConfigApi,
|
||||
renderInTestApp,
|
||||
TestApiProvider,
|
||||
} from '@backstage/test-utils';
|
||||
import { act, fireEvent, screen } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { SupportButton } from './SupportButton';
|
||||
import { configApiRef } from '@backstage/core-plugin-api';
|
||||
|
||||
const configApi = new MockConfigApi({
|
||||
app: {
|
||||
@@ -45,8 +45,9 @@ const POPOVER_ID = 'support-button-popover';
|
||||
describe('<SupportButton />', () => {
|
||||
it('renders without exploding', async () => {
|
||||
await renderInTestApp(<SupportButton />);
|
||||
|
||||
expect(screen.getByTestId(SUPPORT_BUTTON_ID)).toBeInTheDocument();
|
||||
await expect(
|
||||
screen.findByTestId(SUPPORT_BUTTON_ID),
|
||||
).resolves.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('supports passing a title', async () => {
|
||||
@@ -96,11 +97,13 @@ describe('<SupportButton />', () => {
|
||||
it('shows popover on click', async () => {
|
||||
await renderInTestApp(<SupportButton />);
|
||||
|
||||
const supportButton = screen.getByTestId(SUPPORT_BUTTON_ID);
|
||||
expect(supportButton).toBeInTheDocument();
|
||||
await expect(
|
||||
screen.findByTestId(SUPPORT_BUTTON_ID),
|
||||
).resolves.toBeInTheDocument();
|
||||
await act(async () => {
|
||||
fireEvent.click(screen.getByTestId(SUPPORT_BUTTON_ID));
|
||||
});
|
||||
|
||||
fireEvent.click(supportButton);
|
||||
|
||||
expect(screen.getByTestId(POPOVER_ID)).toBeInTheDocument();
|
||||
await expect(screen.findByTestId(POPOVER_ID)).resolves.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -13,6 +13,7 @@
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { renderInTestApp } from '@backstage/test-utils';
|
||||
import { act, fireEvent } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
@@ -65,14 +66,14 @@ describe('RoutedTabs', () => {
|
||||
expect(rendered.queryByText('tabbed-test-content')).not.toBeInTheDocument();
|
||||
|
||||
expect(rendered.getByText('tabbed-test-title-2')).toBeInTheDocument();
|
||||
expect(rendered.queryByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(rendered.getByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
|
||||
const thirdTab = rendered.queryAllByRole('tab')[2];
|
||||
act(() => {
|
||||
fireEvent.click(thirdTab);
|
||||
});
|
||||
expect(rendered.getByText('tabbed-test-title-3')).toBeInTheDocument();
|
||||
expect(rendered.queryByText('tabbed-test-content-3')).toBeInTheDocument();
|
||||
expect(rendered.getByText('tabbed-test-content-3')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
describe('correctly delegates nested links', () => {
|
||||
@@ -113,9 +114,9 @@ describe('RoutedTabs', () => {
|
||||
expect(
|
||||
rendered.queryByText('tabbed-test-content'),
|
||||
).not.toBeInTheDocument();
|
||||
expect(rendered.queryByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(rendered.getByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(
|
||||
rendered.queryByText('tabbed-test-nested-content-2'),
|
||||
rendered.getByText('tabbed-test-nested-content-2'),
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
|
||||
@@ -125,7 +126,7 @@ describe('RoutedTabs', () => {
|
||||
expect(
|
||||
rendered.queryByText('tabbed-test-content'),
|
||||
).not.toBeInTheDocument();
|
||||
expect(rendered.queryByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(rendered.getByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(
|
||||
rendered.queryByText('tabbed-test-nested-content-2'),
|
||||
).not.toBeInTheDocument();
|
||||
@@ -142,7 +143,7 @@ describe('RoutedTabs', () => {
|
||||
expect(rendered.queryByText('tabbed-test-content')).not.toBeInTheDocument();
|
||||
|
||||
expect(rendered.getByText('tabbed-test-title-2')).toBeInTheDocument();
|
||||
expect(rendered.queryByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(rendered.getByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('redirects to the top level when no route is matching the url', async () => {
|
||||
|
||||
@@ -79,6 +79,6 @@ describe('TabbedLayout', () => {
|
||||
expect(queryByText('tabbed-test-content')).not.toBeInTheDocument();
|
||||
|
||||
expect(getByText('tabbed-test-title-2')).toBeInTheDocument();
|
||||
expect(queryByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
expect(getByText('tabbed-test-content-2')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -43,7 +43,7 @@ describe('<ComponentContextMenu />', () => {
|
||||
await fireEvent.click(rendered.queryByText('Some label') as Node);
|
||||
expect(onClickFunction).toHaveBeenCalled();
|
||||
// We do not expect the dropdown to disappear after click
|
||||
expect(rendered.queryByText('Some label')).toBeInTheDocument();
|
||||
expect(rendered.getByText('Some label')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('Disabled', async () => {
|
||||
@@ -80,7 +80,7 @@ describe('<ComponentContextMenu />', () => {
|
||||
await fireEvent.click(rendered.queryByText('Secondary label') as Node);
|
||||
expect(onClickFunction).toHaveBeenCalled();
|
||||
// We do not expect the dropdown to disappear after click
|
||||
expect(rendered.queryByText('Some label')).toBeInTheDocument();
|
||||
expect(rendered.getByText('Some label')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should close when hitting escape', async () => {
|
||||
|
||||
Reference in New Issue
Block a user