1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Adding tests for new token

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2023-03-21 15:28:45 +03:00
parent 9d4dbcecef
commit 6ed1188456
2 changed files with 103 additions and 2 deletions

View File

@ -51,3 +51,55 @@ exports[`Icon settings given no external registrations for cluster settings menu
</div>
</body>
`;
exports[`Icon settings given no registrations for cluster settings component injection token renders 1`] = `
<body>
<div>
<div>
<div
class="file-loader flex flex-row items-center"
>
<div
class="mr-5"
>
<div
class="FilePicker"
>
<label
class="flex gaps align-center"
for="file-upload"
>
<div
class="Avatar rounded"
style="width: 53px; height: 53px; background: rgb(9, 124, 92);"
>
skc
</div>
</label>
<input
accept="image/*"
id="file-upload"
name="FilePicker"
type="file"
/>
</div>
</div>
<i
class="Icon material interactive focusable"
data-testid="icon-for-menu-actions-for-cluster-icon-settings-for-some-entity-id"
id="menu-actions-for-cluster-icon-settings-for-some-entity-id"
tabindex="0"
>
<span
class="icon"
data-icon-name="more_horiz"
>
more_horiz
</span>
</i>
</div>
</div>
</div>
</body>
`;

View File

@ -2,8 +2,7 @@
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import type { DiContainer } from "@ogre-tools/injectable";
import { getInjectable } from "@ogre-tools/injectable";
import type { RenderResult } from "@testing-library/react";
import React from "react";
import { KubernetesCluster } from "../../../../common/catalog-entities";
@ -15,6 +14,8 @@ import { screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { clusterIconSettingsMenuInjectionToken } from "../cluster-settings-menu-injection-token";
import { runInAction } from "mobx";
import { getInjectable, type DiContainer } from "@ogre-tools/injectable";
import { ClusterIconSettingComponentProps, clusterIconSettingsComponentInjectionToken } from "../cluster-settings-component-injection-token";
const cluster = new Cluster({
contextName: "some-context",
@ -39,6 +40,8 @@ const clusterEntity = new KubernetesCluster({
},
});
cluster.preferences.clusterName = "some-cluster-name";
const newMenuItem = getInjectable({
id: "cluster-icon-settings-menu-test-item",
@ -53,6 +56,26 @@ const newMenuItem = getInjectable({
injectionToken: clusterIconSettingsMenuInjectionToken,
});
function customSettingsComponent(props: ClusterIconSettingComponentProps) {
return (
<div data-testid="my-react-component">
<span>Test React Component</span>
<span>Cluster {props.preferences.clusterName}</span>
</div>
);
}
const newSettingsReactComponent = getInjectable({
id: "cluster-icon-settings-react-component",
instantiate: () => ({
id: "test-react-component",
Component: customSettingsComponent,
}),
injectionToken: clusterIconSettingsComponentInjectionToken,
});
describe("Icon settings", () => {
let rendered: RenderResult;
let di: DiContainer;
@ -98,4 +121,30 @@ describe("Icon settings", () => {
expect(rendered.getByText("Hello World")).toBeInTheDocument();
});
});
describe("given no registrations for cluster settings component injection token", () => {
it("renders", () => {
expect(rendered.baseElement).toMatchSnapshot();
});
it("does not have any external components", async () => {
expect(rendered.queryByTestId("test-react-component")).not.toBeInTheDocument();
});
});
describe("given registration for cluster settings component injection token", () => {
beforeEach(() => {
runInAction(() => {
di.register(newSettingsReactComponent);
});
});
it("renders external component", async () => {
expect(rendered.queryByTestId("my-react-component")).toBeInTheDocument();
});
it("external component has cluster preferences in props", async () => {
expect(rendered.getByText("Cluster some-cluster-name")).toBeInTheDocument();
});
});
});