feat(core): add missing tests

This commit is contained in:
Remi
2020-11-15 16:18:13 +01:00
parent d04417cc88
commit 2d255052f0
7 changed files with 285 additions and 13 deletions
+2 -1
View File
@@ -60,7 +60,8 @@
"react-sparklines": "^1.7.0",
"react-syntax-highlighter": "^13.5.1",
"react-use": "^15.3.3",
"remark-gfm": "^1.0.0"
"remark-gfm": "^1.0.0",
"zen-observable": "^0.8.15"
},
"devDependencies": {
"@backstage/cli": "^0.2.0",
@@ -0,0 +1,65 @@
/*
* 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 { AlertDisplay } from './AlertDisplay';
import {
ApiProvider,
ApiRegistry,
alertApiRef,
AlertApiForwarder,
} from '@backstage/core-api';
import Observable from 'zen-observable';
import { renderInTestApp } from '@backstage/test-utils';
const TEST_MESSAGE = 'TEST_MESSAGE';
describe('<AlertDisplay />', () => {
it('renders without exploding', async () => {
const apiRegistry = ApiRegistry.from([
[alertApiRef, new AlertApiForwarder()],
]);
const { queryByText } = await renderInTestApp(
<ApiProvider apis={apiRegistry}>
<AlertDisplay />
</ApiProvider>,
);
expect(queryByText(TEST_MESSAGE)).not.toBeInTheDocument();
});
it('renders with message', async () => {
const apiRegistry = ApiRegistry.from([
[
alertApiRef,
{
post() {},
alert$() {
return Observable.of({ message: TEST_MESSAGE });
},
},
],
]);
const { queryByText } = await renderInTestApp(
<ApiProvider apis={apiRegistry}>
<AlertDisplay />
</ApiProvider>,
);
expect(queryByText(TEST_MESSAGE)).toBeInTheDocument();
});
});
@@ -0,0 +1,49 @@
/*
* 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 { renderWithEffects, wrapInTestApp } from '@backstage/test-utils';
import { EmptyStateImage } from './EmptyStateImage';
describe('<EmptyStateImage />', () => {
it('render EmptyStateImage component with missing field', async () => {
const rendered = await renderWithEffects(
wrapInTestApp(<EmptyStateImage missing="field" />),
);
expect(rendered.getByTestId('missingAnnotation')).toBeInTheDocument();
});
it('render EmptyStateImage component with missing info', async () => {
const rendered = await renderWithEffects(
wrapInTestApp(<EmptyStateImage missing="info" />),
);
expect(rendered.getByTestId('noInformation')).toBeInTheDocument();
});
it('render EmptyStateImage component with missing content', async () => {
const rendered = await renderWithEffects(
wrapInTestApp(<EmptyStateImage missing="content" />),
);
expect(rendered.getByTestId('createComponent')).toBeInTheDocument();
});
it('render EmptyStateImage component with missing data', async () => {
const rendered = await renderWithEffects(
wrapInTestApp(<EmptyStateImage missing="data" />),
);
expect(rendered.getByTestId('noBuild')).toBeInTheDocument();
});
});
@@ -54,6 +54,7 @@ export const EmptyStateImage = ({ missing }: Props) => {
src={noInformation}
alt="no Information"
className={classes.generalImg}
data-testid="noInformation"
/>
);
case 'content':
@@ -62,11 +63,17 @@ export const EmptyStateImage = ({ missing }: Props) => {
src={createComponent}
alt="create Component"
className={classes.generalImg}
data-testid="createComponent"
/>
);
case 'data':
return (
<img src={noBuild} alt="no Build" className={classes.generalImg} />
<img
src={noBuild}
alt="no Build"
className={classes.generalImg}
data-testid="noBuild"
/>
);
default:
return null;
@@ -0,0 +1,154 @@
/*
* 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 { act, fireEvent } from '@testing-library/react';
import { renderInTestApp } from '@backstage/test-utils';
import { FeatureCalloutCircular } from './FeatureCalloutCircular';
const INITIAL_BOUNDING_RECT: DOMRect = {
width: 100,
height: 100,
x: 0,
y: 0,
bottom: 0,
left: 0,
right: 0,
top: 0,
toJSON: () => {},
};
const UPDATED_BOUNDING_RECT: DOMRect = {
width: 200,
height: 200,
x: 50,
y: 50,
bottom: 0,
left: 0,
right: 0,
top: 0,
toJSON: () => {},
};
beforeEach(() => {
Element.prototype.getBoundingClientRect = jest.fn(
() => INITIAL_BOUNDING_RECT,
);
});
describe('<FeatureCalloutCircular />', () => {
it('renders without exploding', async () => {
const rendered = await renderInTestApp(
<FeatureCalloutCircular
featureId="feature-id"
title="title"
description="description"
/>,
);
rendered.getByText('description');
rendered.getByText('title');
});
it('renders with correct style', async () => {
const { getByTestId } = await renderInTestApp(
<FeatureCalloutCircular
featureId="feature-id"
title="title"
description="description"
/>,
);
const dot = await getByTestId('dot');
const text = await getByTestId('text');
expect(dot).toBeInTheDocument();
expect(text).toBeInTheDocument();
// Dot style
expect(dot.style.left).toBe('-800px');
expect(dot.style.top).toBe('-800px');
expect(dot.style.width).toBe('1700px');
expect(dot.style.height).toBe('1700px');
// Text style
expect(text.style.left).toBe('-400px');
expect(text.style.top).toBe('120px');
expect(text.style.width).toBe('450px');
});
it('update when the user scrolls', async () => {
const { getByTestId } = await renderInTestApp(
<FeatureCalloutCircular
featureId="feature-id"
title="title"
description="description"
/>,
);
const dot = await getByTestId('dot');
const text = await getByTestId('text');
act(() => {
Element.prototype.getBoundingClientRect = jest.fn(
() => UPDATED_BOUNDING_RECT,
);
// Trigger the window resize event.
fireEvent(window, new Event('resize'));
});
// Dot style
expect(dot.style.left).toBe('-750px');
expect(dot.style.top).toBe('-750px');
expect(dot.style.width).toBe('1800px');
expect(dot.style.height).toBe('1800px');
// Text style
expect(text.style.left).toBe('-300px');
expect(text.style.top).toBe('270px');
expect(text.style.width).toBe('450px');
});
it('update when the user resizes the window', async () => {
const { getByTestId } = await renderInTestApp(
<FeatureCalloutCircular
featureId="feature-id"
title="title"
description="description"
/>,
);
const dot = await getByTestId('dot');
const text = await getByTestId('text');
act(() => {
Element.prototype.getBoundingClientRect = jest.fn(
() => UPDATED_BOUNDING_RECT,
);
// Trigger the window resize event.
fireEvent(window, new Event('scroll'));
});
// Dot style
expect(dot.style.left).toBe('-750px');
expect(dot.style.top).toBe('-750px');
expect(dot.style.width).toBe('1800px');
expect(dot.style.height).toBe('1800px');
// Text style
expect(text.style.left).toBe('-300px');
expect(text.style.top).toBe('270px');
expect(text.style.width).toBe('450px');
});
});
@@ -160,6 +160,7 @@ export const FeatureCalloutCircular: FC<Props> = ({
<>
<div
className={classes.dot}
data-testid="dot"
style={{
left: placement?.dotLeft,
top: placement?.dotTop,
@@ -176,6 +177,7 @@ export const FeatureCalloutCircular: FC<Props> = ({
</div>
<div
className={classes.text}
data-testid="text"
style={{
left: placement?.textLeft,
top: placement?.textTop,
+5 -11
View File
@@ -1290,40 +1290,34 @@
to-fast-properties "^2.0.0"
"@backstage/core@^0.2.0":
version "0.3.0"
version "0.2.0"
resolved "https://registry.npmjs.org/@backstage/core/-/core-0.2.0.tgz#543246b2d87563c9aa4d9fb96e40fdfc7e827520"
integrity sha512-75m2u3FoUngBOvt9l65xZcYTzzB+49OXpY1A9VNFUR1+jMs3cL/0HDfByQV2H0xXaHzMngQ8C5u/sWhkQsij1w==
dependencies:
"@backstage/config" "^0.1.1"
"@backstage/core-api" "^0.2.1"
"@backstage/theme" "^0.2.1"
"@backstage/core-api" "^0.2.0"
"@backstage/theme" "^0.2.0"
"@material-ui/core" "^4.11.0"
"@material-ui/icons" "^4.9.1"
"@material-ui/lab" "4.0.0-alpha.45"
"@types/dagre" "^0.7.44"
"@types/react" "^16.9"
"@types/react-sparklines" "^1.7.0"
classnames "^2.2.6"
clsx "^1.1.0"
d3-selection "^2.0.0"
d3-shape "^2.0.0"
d3-zoom "^2.0.0"
dagre "^0.8.5"
immer "^7.0.9"
lodash "^4.17.15"
material-table "^1.69.1"
prop-types "^15.7.2"
qs "^6.9.4"
rc-progress "^3.0.0"
react "^16.12.0"
react-dom "^16.12.0"
react-helmet "6.1.0"
react-hook-form "^6.6.0"
react-markdown "^5.0.2"
react-router "6.0.0-beta.0"
react-router-dom "6.0.0-beta.0"
react-sparklines "^1.7.0"
react-syntax-highlighter "^13.5.1"
react-use "^15.3.3"
remark-gfm "^1.0.0"
"@bcoe/v8-coverage@^0.2.3":
version "0.2.3"