diff --git a/.changeset/flat-bugs-do.md b/.changeset/flat-bugs-do.md
new file mode 100644
index 0000000000..672daf657d
--- /dev/null
+++ b/.changeset/flat-bugs-do.md
@@ -0,0 +1,8 @@
+---
+'@backstage/core': patch
+'@backstage/plugin-graphiql': patch
+'@backstage/plugin-tech-radar': patch
+'@backstage/plugin-techdocs': patch
+---
+
+add test case for Progress component
diff --git a/packages/core/src/components/Progress/Progress.test.tsx b/packages/core/src/components/Progress/Progress.test.tsx
new file mode 100644
index 0000000000..46a162e8b3
--- /dev/null
+++ b/packages/core/src/components/Progress/Progress.test.tsx
@@ -0,0 +1,34 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { renderInTestApp } from '@backstage/test-utils';
+import { act } from 'react-dom/test-utils';
+
+import { Progress } from './Progress';
+
+describe('', () => {
+ it('renders without exploding', async () => {
+ jest.useFakeTimers();
+ const { getByTestId, queryByTestId } = await renderInTestApp();
+ expect(queryByTestId('progress')).not.toBeInTheDocument();
+ act(() => {
+ jest.advanceTimersByTime(250);
+ });
+ expect(getByTestId('progress')).toBeInTheDocument();
+ jest.useRealTimers();
+ });
+});
diff --git a/packages/core/src/components/Progress/Progress.tsx b/packages/core/src/components/Progress/Progress.tsx
index e66220e4e7..80f4f38cc9 100644
--- a/packages/core/src/components/Progress/Progress.tsx
+++ b/packages/core/src/components/Progress/Progress.tsx
@@ -28,6 +28,6 @@ export const Progress: FC = props => {
return isVisible ? (
) : (
-
+
);
};
diff --git a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
index fb401494eb..7bf48eb7f6 100644
--- a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
+++ b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
@@ -19,6 +19,7 @@ import { GraphiQLPage } from './GraphiQLPage';
import { ThemeProvider } from '@material-ui/core';
import { lightTheme } from '@backstage/theme';
import { ApiProvider, ApiRegistry } from '@backstage/core';
+import { act } from 'react-dom/test-utils';
import { renderWithEffects } from '@backstage/test-utils';
import { GraphQLBrowseApi, graphQlBrowseApiRef } from '../../lib/api';
@@ -28,6 +29,7 @@ jest.mock('../GraphiQLBrowser', () => ({
describe('GraphiQLPage', () => {
it('should show progress', async () => {
+ jest.useFakeTimers();
const loadingApi: GraphQLBrowseApi = {
async getEndpoints() {
await new Promise(() => {});
@@ -43,9 +45,12 @@ describe('GraphiQLPage', () => {
,
,
);
-
+ act(() => {
+ jest.advanceTimersByTime(250);
+ });
rendered.getByText('GraphiQL');
rendered.getByTestId('progress');
+ jest.useRealTimers();
});
it('should show error', async () => {
diff --git a/plugins/tech-radar/src/components/RadarComponent.test.tsx b/plugins/tech-radar/src/components/RadarComponent.test.tsx
index 5591d74b82..59cababbc9 100644
--- a/plugins/tech-radar/src/components/RadarComponent.test.tsx
+++ b/plugins/tech-radar/src/components/RadarComponent.test.tsx
@@ -19,6 +19,7 @@ import { render, waitForElement } from '@testing-library/react';
import { ThemeProvider } from '@material-ui/core';
import { lightTheme } from '@backstage/theme';
import { ApiRegistry, ApiProvider, errorApiRef } from '@backstage/core';
+import { act } from 'react-dom/test-utils';
import { withLogCollector } from '@backstage/test-utils';
import GetBBoxPolyfill from '../utils/polyfills/getBBox';
@@ -34,8 +35,9 @@ describe('RadarComponent', () => {
});
it('should render a progress bar', async () => {
- const errorApi = { post: () => {} };
+ jest.useFakeTimers();
+ const errorApi = { post: () => {} };
const { getByTestId, queryByTestId } = render(
@@ -48,9 +50,13 @@ describe('RadarComponent', () => {
,
);
+ act(() => {
+ jest.advanceTimersByTime(250);
+ });
expect(getByTestId('progress')).toBeInTheDocument();
await waitForElement(() => queryByTestId('tech-radar-svg'));
+ jest.useRealTimers();
});
it('should call the errorApi if load fails', async () => {
diff --git a/plugins/tech-radar/src/components/RadarPage.test.tsx b/plugins/tech-radar/src/components/RadarPage.test.tsx
index 97fae16380..ee5cf8e131 100644
--- a/plugins/tech-radar/src/components/RadarPage.test.tsx
+++ b/plugins/tech-radar/src/components/RadarPage.test.tsx
@@ -22,6 +22,7 @@ import { ApiRegistry, ApiProvider, errorApiRef } from '@backstage/core';
import GetBBoxPolyfill from '../utils/polyfills/getBBox';
import { RadarPage } from './RadarPage';
+import { act } from 'react-dom/test-utils';
import { MockErrorApi, wrapInTestApp } from '@backstage/test-utils';
describe('RadarPage', () => {
@@ -34,6 +35,8 @@ describe('RadarPage', () => {
});
it('should render a progress bar', async () => {
+ jest.useFakeTimers();
+
const techRadarProps = {
width: 1200,
height: 800,
@@ -48,9 +51,13 @@ describe('RadarPage', () => {
),
);
+ act(() => {
+ jest.advanceTimersByTime(250);
+ });
expect(getByTestId('progress')).toBeInTheDocument();
await waitForElement(() => queryByTestId('tech-radar-svg'));
+ jest.useRealTimers();
});
it('should render a header with a svg', async () => {
diff --git a/plugins/techdocs/src/reader/components/TechDocsProgressBar.test.tsx b/plugins/techdocs/src/reader/components/TechDocsProgressBar.test.tsx
index be464bd485..f97fcda3f1 100644
--- a/plugins/techdocs/src/reader/components/TechDocsProgressBar.test.tsx
+++ b/plugins/techdocs/src/reader/components/TechDocsProgressBar.test.tsx
@@ -25,12 +25,14 @@ jest.useFakeTimers();
describe('', () => {
it('should render a message if techdocs page takes more time to load', () => {
const rendered = render(wrapInTestApp());
-
- expect(rendered.getByTestId('progress')).toBeDefined();
+ act(() => {
+ jest.advanceTimersByTime(250);
+ });
+ expect(rendered.getByTestId('progress')).toBeInTheDocument();
expect(rendered.queryByTestId('delay-reason')).toBeNull();
act(() => {
jest.advanceTimersByTime(5000);
});
- expect(rendered.getByTestId('delay-reason')).toBeDefined();
+ expect(rendered.getByTestId('delay-reason')).toBeInTheDocument();
});
});