feat(core): add missing tests
This commit is contained in:
@@ -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,
|
||||
|
||||
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user