diff --git a/src/renderer/components/select/select.test.tsx b/src/renderer/components/select/select.test.tsx
index 675368b917..ec0013a96c 100644
--- a/src/renderer/components/select/select.test.tsx
+++ b/src/renderer/components/select/select.test.tsx
@@ -17,6 +17,7 @@ import rendererExtensionsInjectable from "../../../extensions/renderer-extension
import { computed } from "mobx";
import type { LensRendererExtension } from "../../../extensions/lens-renderer-extension";
+
describe("", () => {
let di: DependencyInjectionContainer;
let render: DiRender;
@@ -32,8 +33,8 @@ describe("", () => {
di.override(directoryForUserDataInjectable, () => "some-directory-for-user-data");
di.override(rendererExtensionsInjectable, () => computed(() => [] as LensRendererExtension[]));
- ThemeStore.createInstance();
UserStore.createInstance();
+ ThemeStore.createInstance();
});
afterEach(() => {
@@ -61,4 +62,76 @@ describe("", () => {
expect(container).toBeInstanceOf(HTMLElement);
});
+
+ it("should show selected option", async () => {
+ const options = [
+ {
+ label: "Option one label",
+ value: "optionOneValue",
+ },
+ {
+ label: "Option two label",
+ value: "optionTwoValue",
+ },
+ ];
+
+ const onChange = jest.fn();
+
+ const { container } = render();
+ const selectedValueContainer = container.querySelector(".Select__single-value");
+
+ expect(selectedValueContainer.textContent).toBe(options[0].label);
+ });
+
+ it("should reflect to change value", async () => {
+ const options = [
+ {
+ label: "Option one label",
+ value: "optionOneValue",
+ },
+ {
+ label: "Option two label",
+ value: "optionTwoValue",
+ },
+ ];
+
+ const onChange = jest.fn();
+
+ const { container, rerender } = render();
+ const selectedValueContainer = container.querySelector(".Select__single-value");
+
+ expect(selectedValueContainer.textContent).toBe(options[0].label);
+
+ rerender();
+
+ expect(selectedValueContainer.textContent).toBe(options[1].label);
+
+ rerender();
+
+ expect(selectedValueContainer).not.toBeInTheDocument();
+ });
+
+ it("should unselect value if no value is passed", async () => {
+ const options = [
+ {
+ label: "Option one label",
+ value: "optionOneValue",
+ },
+ {
+ label: "Option two label",
+ value: "optionTwoValue",
+ },
+ ];
+
+ const onChange = jest.fn();
+
+ const { container, rerender } = render();
+ const selectedValueContainer = container.querySelector(".Select__single-value");
+
+ expect(selectedValueContainer.textContent).toBe(options[0].label);
+
+ rerender();
+
+ expect(selectedValueContainer).not.toBeInTheDocument();
+ });
});