diff --git a/src/ui/src/components/core/input/CoreCheckboxInput.spec.ts b/src/ui/src/components/core/input/CoreCheckboxInput.spec.ts new file mode 100644 index 00000000..a900428a --- /dev/null +++ b/src/ui/src/components/core/input/CoreCheckboxInput.spec.ts @@ -0,0 +1,58 @@ +import { describe, expect, it, vi } from "vitest"; + +import CoreCheckboxInput from "./CoreCheckboxInput.vue"; +import { flushPromises, mount } from "@vue/test-utils"; +import injectionKeys from "@/injectionKeys"; +import { ref } from "vue"; +import { buildMockComponent, buildMockCore, mockProvides } from "@/tests/mocks"; + +describe("CoreCheckboxInput", () => { + it("should render value from the state and forward emit", async () => { + const { core, userState } = buildMockCore(); + userState.value = { key: ["b"] }; + + core.addComponent( + buildMockComponent({ + handlers: { "wf-options-change": "python_handler" }, + binding: { + eventType: "", + stateRef: "key", + }, + }), + ); + + const wrapper = mount(CoreCheckboxInput, { + global: { + provide: { + ...mockProvides, + [injectionKeys.core as symbol]: core, + [injectionKeys.evaluatedFields as symbol]: { + label: ref("This is the label"), + orientation: ref("horizontal"), + options: ref({ a: "Option A", b: "Option B" }), + }, + }, + }, + }); + + await flushPromises(); + + const options = wrapper.findAll("input"); + expect(options).toHaveLength(2); + + const optionA = options.at(0); + expect(optionA.attributes().value).toBe("a"); + expect(optionA.element.checked).toBe(false); + + const optionB = options.at(1); + expect(optionB.attributes().value).toBe("b"); + expect(optionB.element.checked).toBe(true); + + const dispatchEvent = vi.spyOn(wrapper.vm.$el, "dispatchEvent"); + await optionA.trigger("input"); + await flushPromises(); + expect(dispatchEvent).toHaveBeenCalledOnce(); + + expect(wrapper.element).toMatchSnapshot(); + }); +}); diff --git a/src/ui/src/components/core/input/CoreDateInput.spec.ts b/src/ui/src/components/core/input/CoreDateInput.spec.ts index 4fe83c83..41e045fd 100644 --- a/src/ui/src/components/core/input/CoreDateInput.spec.ts +++ b/src/ui/src/components/core/input/CoreDateInput.spec.ts @@ -44,5 +44,7 @@ describe("CoreDateInput", () => { await flushPromises(); expect(dispatchEvent).toHaveBeenCalledOnce(); + + expect(wrapper.element).toMatchSnapshot(); }); }); diff --git a/src/ui/src/components/core/input/CoreRadioInput.spec.ts b/src/ui/src/components/core/input/CoreRadioInput.spec.ts index b5ca302b..13be3f96 100644 --- a/src/ui/src/components/core/input/CoreRadioInput.spec.ts +++ b/src/ui/src/components/core/input/CoreRadioInput.spec.ts @@ -52,5 +52,7 @@ describe("CoreRadioInput", () => { await optionA.trigger("input"); await flushPromises(); expect(dispatchEvent).toHaveBeenCalledOnce(); + + expect(wrapper.element).toMatchSnapshot(); }); }); diff --git a/src/ui/src/components/core/input/__snapshots__/CoreCheckboxInput.spec.ts.snap b/src/ui/src/components/core/input/__snapshots__/CoreCheckboxInput.spec.ts.snap new file mode 100644 index 00000000..16c8995b --- /dev/null +++ b/src/ui/src/components/core/input/__snapshots__/CoreCheckboxInput.spec.ts.snap @@ -0,0 +1,56 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`CoreCheckboxInput > should render value from the state and forward emit 1`] = ` +
+ + +
+ +
+ + +
+
+ + +
+ +
+ +
+`; diff --git a/src/ui/src/components/core/input/__snapshots__/CoreDateInput.spec.ts.snap b/src/ui/src/components/core/input/__snapshots__/CoreDateInput.spec.ts.snap new file mode 100644 index 00000000..3e4b825f --- /dev/null +++ b/src/ui/src/components/core/input/__snapshots__/CoreDateInput.spec.ts.snap @@ -0,0 +1,21 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`CoreDateInput > should render value from the state and forward emit 1`] = ` +
+ + + + +
+`; diff --git a/src/ui/src/components/core/input/__snapshots__/CoreRadioInput.spec.ts.snap b/src/ui/src/components/core/input/__snapshots__/CoreRadioInput.spec.ts.snap new file mode 100644 index 00000000..9b19ed41 --- /dev/null +++ b/src/ui/src/components/core/input/__snapshots__/CoreRadioInput.spec.ts.snap @@ -0,0 +1,60 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`CoreRadioInput > should render value from the state and forward emit 1`] = ` +
+ + +
+ +
+ + +
+
+ + +
+ +
+ +
+`;