add some tests

Signed-off-by: Fredrik Adelöw <freben@gmail.com>
2022-02-07 10:38:57 +01:00
parent f8633307c4
commit b04ef1e425
5 changed files with 102 additions and 13 deletions
@@ -27,7 +27,7 @@ import {
  ResponseErrorPanel,
 } from '@backstage/core-components';
 import { useApi, useRouteRef } from '@backstage/core-plugin-api';
-import { DialogContentText, makeStyles } from '@material-ui/core';
+import { Box, DialogContentText, makeStyles } from '@material-ui/core';
 import classNames from 'classnames';
 import React, { useLayoutEffect, useRef, useState } from 'react';
 import { useNavigate } from 'react-router';
@@ -148,7 +148,6 @@ function CustomNode({ node }: DependencyGraphTypes.RenderNodeProps<NodeType>) {
      }),
    );
  };
-  const focused = false;

  return (
    <g onClick={onClick} className={classes.clickable}>
@@ -169,7 +168,6 @@ function CustomNode({ node }: DependencyGraphTypes.RenderNodeProps<NodeType>) {
        height={iconSize}
        className={classNames(
          classes.text,
-          focused && 'focused',
          node.root ? 'secondary' : 'primary',
        )}
      />
@@ -177,7 +175,6 @@ function CustomNode({ node }: DependencyGraphTypes.RenderNodeProps<NodeType>) {
        ref={idRef}
        className={classNames(
          classes.text,
-          focused && 'focused',
          node.root ? 'secondary' : 'primary',
        )}
        y={paddedHeight / 2}
@@ -211,13 +208,15 @@ export function AncestryPage(props: { entity: Entity }) {
        child entities that ultimately led to the current one existing. Note
        that this is a completely different mechanism from relations.
      </DialogContentText>
-      <DependencyGraph
-        nodes={nodes}
-        edges={edges}
-        renderNode={CustomNode}
-        direction={DependencyGraphTypes.Direction.BOTTOM_TOP}
-        zoom="enable-on-click"
-      />
+      <Box mt={4}>
+        <DependencyGraph
+          nodes={nodes}
+          edges={edges}
+          renderNode={CustomNode}
+          direction={DependencyGraphTypes.Direction.BOTTOM_TOP}
+          zoom="enable-on-click"
+        />
+      </Box>
    </>
  );
 }
@@ -0,0 +1,45 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * 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 { ComponentEntity } from '@backstage/catalog-model';
+import { renderInTestApp } from '@backstage/test-utils';
+import { screen } from '@testing-library/react';
+import React from 'react';
+import { JsonPage } from './JsonPage';
+
+describe('JsonPage', () => {
+  it('renders', async () => {
+    const entity: ComponentEntity = {
+      apiVersion: 'backstage.io/v1alpha1',
+      kind: 'Component',
+      metadata: {
+        namespace: 'default',
+        name: 'c1',
+      },
+      spec: {
+        type: 'service',
+        lifecycle: 'production',
+        owner: 'ops',
+      },
+    };
+
+    await renderInTestApp(<JsonPage entity={entity} />);
+
+    expect(screen.getByTestId('code-snippet')).toHaveTextContent(
+      '"lifecycle": "production"',
+    );
+  });
+});
@@ -28,7 +28,7 @@ export function JsonPage(props: { entity: Entity }) {
        This is the raw entity data as received from the catalog, on JSON form.
      </DialogContentText>
      <DialogContentText>
-        <div style={{ fontSize: '75%' }}>
+        <div style={{ fontSize: '75%' }} data-testid="code-snippet">
          <CodeSnippet
            text={JSON.stringify(sortKeys(props.entity), undefined, 2)}
            language="json"
@@ -0,0 +1,45 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * 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 { ComponentEntity } from '@backstage/catalog-model';
+import { renderInTestApp } from '@backstage/test-utils';
+import { screen } from '@testing-library/react';
+import React from 'react';
+import { YamlPage } from './YamlPage';
+
+describe('YamlPage', () => {
+  it('renders', async () => {
+    const entity: ComponentEntity = {
+      apiVersion: 'backstage.io/v1alpha1',
+      kind: 'Component',
+      metadata: {
+        namespace: 'default',
+        name: 'c1',
+      },
+      spec: {
+        type: 'service',
+        lifecycle: 'production',
+        owner: 'ops',
+      },
+    };
+
+    await renderInTestApp(<YamlPage entity={entity} />);
+
+    expect(screen.getByTestId('code-snippet')).toHaveTextContent(
+      'lifecycle: production',
+    );
+  });
+});
@@ -29,7 +29,7 @@ export function YamlPage(props: { entity: Entity }) {
        This is the raw entity data as received from the catalog, on YAML form.
      </DialogContentText>
      <DialogContentText>
-        <div style={{ fontSize: '75%' }}>
+        <div style={{ fontSize: '75%' }} data-testid="code-snippet">
          <CodeSnippet
            text={YAML.stringify(sortKeys(props.entity))}
            language="yaml"