Simple form tests (#26)

* Setup hooks test + test array validation hook

* Tests for array and common validation rules

* Tests for date-time validation rules

* Tests for email validation rule

* Tests for number validation rules

* Tests for text validation rules

* Tests for uri validation rules

* Tests for utils

* Tests for utils

* Fix some spelling errors

* Rush change

common/changes/@ilbrando/simple-form/simple-form-tests_2024-12-11-12-28.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@ilbrando/simple-form",
+      "comment": "Implement tests",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@ilbrando/simple-form"
+}

common/changes/@ilbrando/utils/simple-form-tests_2024-12-11-12-28.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@ilbrando/utils",
+      "comment": "Fixed the type for getFieldValues",
+      "type": "major"
+    }
+  ],
+  "packageName": "@ilbrando/utils"
+}

examples/storybook/src/stories/material-ui/disabled-fields.stories.tsx

@@ -12,7 +12,7 @@ type FormFields = {
   jobTitle: string;
 };
 
-const FormStory = ({ onSubmit }: { onSubmit?: (values: MakeNullable<FormFields>) => void }) => {
+const FormStory = ({ onSubmit }: { onSubmit?: (values: Partial<MakeNullable<FormFields>>) => void }) => {
   const { required, maxLength } = useValidationRules();
 
   const [isSubmitting, setIsSubmitting] = useState(false); // story book simulate submitting

examples/storybook/src/stories/material-ui/validation.stories.tsx

@@ -11,7 +11,7 @@ type FormFields = {
   age: number;
 };
 
-const FormStory = ({ onSubmit }: { onSubmit?: (values: MakeNullable<FormFields>) => void }) => {
+const FormStory = ({ onSubmit }: { onSubmit?: (values: Partial<MakeNullable<FormFields>>) => void }) => {
   const { required, maxLength, min } = useValidationRules();
 
   const [isSubmitting, setIsSubmitting] = useState(false); // story book simulate submitting

packages/simple-form/package.json

@@ -32,16 +32,22 @@
     "vite": "vite",
     "type-check": "tsc --noEmit --watch",
     "build": "vite build && tsc -p tsconfig-declarations.json",
+    "test": "vitest run",
     "eslint": "eslint --max-warnings=0"
   },
   "devDependencies": {
     "@types/react": "~18",
     "@ilbrando/eslint-plugin": "workspace:*",
     "@vitejs/plugin-react": "~4.3.4",
+    "@testing-library/react": "~16.1.0",
     "eslint": "~9.16.0",
+    "happy-dom": "~15.11.7",
     "npm-run-all": "~4.1.5",
+    "react": "^18",
+    "react-dom": "^18",
     "typescript": "~5.7.2",
-    "vite": "~6.0.3"
+    "vite": "~6.0.3",
+    "vitest": "~2.1.4"
   },
   "dependencies": {
     "@ilbrando/utils": "workspace:*"

packages/simple-form/src/form-validation/validation-rules/array.test.ts

@@ -0,0 +1,58 @@
+import { describe, test } from "vitest";
+import { renderHook } from "@testing-library/react";
+
+import { useArrayValidationRules } from "./array";
+import { assertValidationResult, genericErrorMessage } from "./validation-test-utils";
+
+describe("array", () => {
+  test.each`
+    value     | parameter | expected
+    ${[1, 2]} | ${1}      | ${genericErrorMessage}
+    ${[1, 2]} | ${3}      | ${genericErrorMessage}
+    ${[1, 2]} | ${2}      | ${undefined}
+    ${[]}     | ${0}      | ${undefined}
+  `("count($parameter)($value) => $expected", ({ value, parameter, expected }) => {
+    // Arrange
+    const { result } = renderHook(() => useArrayValidationRules());
+
+    // Act
+    const actual = result.current.count(parameter)(value);
+
+    // Assert
+    assertValidationResult(expected, actual);
+  });
+
+  test.each`
+    value     | parameter | expected
+    ${[1, 2]} | ${1}      | ${genericErrorMessage}
+    ${[1, 2]} | ${3}      | ${undefined}
+    ${[1, 2]} | ${2}      | ${undefined}
+    ${[]}     | ${0}      | ${undefined}
+  `("maxCount($parameter)($value) => $expected", ({ value, parameter, expected }) => {
+    // Arrange
+    const { result } = renderHook(() => useArrayValidationRules());
+
+    // Act
+    const actual = result.current.maxCount(parameter)(value);
+
+    // Assert
+    assertValidationResult(expected, actual);
+  });
+
+  test.each`
+    value     | parameter | expected
+    ${[1, 2]} | ${1}      | ${undefined}
+    ${[1, 2]} | ${3}      | ${genericErrorMessage}
+    ${[1, 2]} | ${2}      | ${undefined}
+    ${[]}     | ${0}      | ${undefined}
+  `("minCount($parameter)($value) => $expected", ({ value, parameter, expected }) => {
+    // Arrange
+    const { result } = renderHook(() => useArrayValidationRules());
+
+    // Act
+    const actual = result.current.minCount(parameter)(value);
+
+    // Assert
+    assertValidationResult(expected, actual);
+  });
+});