[gh-59] add unit test for validating that filterUpdate event is calle…

…d with correct params when group type select changes

packages/vue3/src/tests/VueVisualFilter.test.js

@@ -1,4 +1,4 @@
-import { render } from "@testing-library/vue"
+import { render, fireEvent } from "@testing-library/vue"
 import "@testing-library/jest-dom"
 import { GroupType, FilterType } from "@visual-filter/common"
 
@@ -43,7 +43,9 @@ beforeEach((ctx) => {
   }
 })
 
-test("`filteringOptions` prop validator should work as expected", ({ commonProps }) => {
+test("`filteringOptions` prop validator should work as expected", ({
+  commonProps,
+}) => {
   const filteringOptionsValidator =
     VueVisualFilter.props.filteringOptions.validator
 
@@ -117,7 +119,7 @@ test("`filteringOptions` prop validator should work as expected", ({ commonProps
     }),
   ).toBeFalsy()
 
-  // TODO: should be considered
+  // TODO: should be handled
   // expect(
   //   filteringOptionsValidator({
   //     data: [{ name: "Firstname", type: "nominal", values: ["a"] }],
@@ -164,3 +166,21 @@ test("after initial render we should have group type and filter type selects wit
   expect(filterTypeSelect).toBeTruthy()
   expect(filterTypeSelect).toHaveValue(FilterType.GROUP)
 })
+
+test("expect `onFilterUpdate` event to be called with correct parameters when changing group type select", async ({ commonProps }) => {
+  const spyFilterUpdateEvent = vi.fn()
+  const methods = render(VueVisualFilter, {
+    propsData: { ...commonProps, onFilterUpdate: spyFilterUpdateEvent },
+  })
+
+  const groupTypeSelect = methods.queryByTestId("group-type-select")
+
+  await fireEvent.update(groupTypeSelect, GroupType.NOT_AND)
+  expect(spyFilterUpdateEvent.calls).toMatchSnapshot()
+
+  await fireEvent.update(groupTypeSelect, GroupType.OR)
+  expect(spyFilterUpdateEvent.calls).toMatchSnapshot()
+
+  await fireEvent.update(groupTypeSelect, GroupType.NOT_OR)
+  expect(spyFilterUpdateEvent.calls).toMatchSnapshot()
+})

packages/vue3/src/tests/__snapshots__/VueVisualFilter.test.js.snap

@@ -0,0 +1,199 @@
+// Vitest Snapshot v1
+
+exports[`expect \`onFilterUpdate\` event to be called with correct parameters when changing group type select 1`] = `
+[
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [
+            "Foo",
+            "Fizz",
+          ],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [
+            "Bar",
+            "Buzz",
+          ],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [
+            18,
+            19,
+          ],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "not and",
+        "type": "group",
+      },
+    },
+  ],
+]
+`;
+
+exports[`expect \`onFilterUpdate\` event to be called with correct parameters when changing group type select 2`] = `
+[
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [
+            "Foo",
+            "Fizz",
+          ],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [
+            "Bar",
+            "Buzz",
+          ],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [
+            18,
+            19,
+          ],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "not and",
+        "type": "group",
+      },
+    },
+  ],
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "or",
+        "type": "group",
+      },
+    },
+  ],
+]
+`;
+
+exports[`expect \`onFilterUpdate\` event to be called with correct parameters when changing group type select 3`] = `
+[
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [
+            "Foo",
+            "Fizz",
+          ],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [
+            "Bar",
+            "Buzz",
+          ],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [
+            18,
+            19,
+          ],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "not and",
+        "type": "group",
+      },
+    },
+  ],
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "or",
+        "type": "group",
+      },
+    },
+  ],
+  [
+    {
+      "data": [
+        {
+          "name": "First Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Last Name",
+          "type": "nominal",
+          "values": [],
+        },
+        {
+          "name": "Age",
+          "type": "numeric",
+          "values": [],
+        },
+      ],
+      "filter": {
+        "filters": [],
+        "groupType": "not or",
+        "type": "group",
+      },
+    },
+  ],
+]
+`;

packages/vue3/vite.config.js

@@ -5,6 +5,7 @@ module.exports = defineConfig({
   ...require("../../vite.config.js"),
   plugins: [vue()],
   test: {
+    globals: true,
     environment: "jsdom",
   },
 })