@tft/crispr-forms-testing 21.0.13 → 21.0.15

package/README.md

@@ -0,0 +1,163 @@
+# @tft/crispr-forms-testing
+
+Playwright helpers and test factories for apps built with [`@tft/crispr-forms`](../crispr-forms/README.md).
+
+Point it at the same `FormConfig` your component renders and it generates a standard set of e2e tests for every field, covering labels, hints, options and validation errors. When you need to write your own assertions, it also provides locators and actions that already handle Angular Material's quirks.
+
+## Installation
+
+```bash
+npm install --save-dev @tft/crispr-forms-testing
+```
+
+Peer dependencies: `@playwright/test` (>= 1.40), `@angular/compiler` and `@angular/forms` (^21), and `@tft/crispr-forms`.
+
+The package re-exports everything from `@playwright/test`, so a spec file needs only one import:
+
+```ts
+import { test, expect, testForm, getInput } from '@tft/crispr-forms-testing';
+```
+
+Importing the package also loads `@angular/compiler`. crispr-forms ships in partial-compilation (Ivy linker) format, and its configs need the JIT compiler to load in Node. If a Playwright file imports a crispr-forms config **without** importing this package, add `import '@angular/compiler';` at the top of it.
+
+## Quick start
+
+Keep your form config in its own file so the component and the spec can share it:
+
+```ts
+// profile.config.ts
+export const profileFormConfig: FormConfig = {
+  fields: [
+    { controlType: ControlType.INPUT, controlName: 'name', label: 'Name', validators: [Validators.required] },
+    { controlType: ControlType.SELECT, controlName: 'role', label: 'Role', options: [/* ... */] },
+  ],
+};
+```
+
+Then generate the tests from it:
+
+```ts
+// profile.spec.ts
+import { test, testForm } from '@tft/crispr-forms-testing';
+import { profileFormConfig } from '../app/profile/profile.config';
+
+test.describe('Profile form', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('/profile');
+  });
+
+  testForm(profileFormConfig);
+});
+```
+
+Because the tests are derived from the config, a validator added there is tested automatically.
+
+To cover just some fields, call `testField` per field instead:
+
+```ts
+for (const field of profileFormConfig.fields) {
+  testField(field);
+}
+```
+
+## Generated tests
+
+`testForm(config)` calls `testField` for every top-level field. `testField(config)` opens a `test.describe` named after the `controlName` and picks the factory for its `controlType`. Each factory only registers tests for what the config defines; a field without a `hint`, for example, gets no hint test.
+
+| Control type | Factory | Tests |
+|---|---|---|
+| `INPUT` | `testInputField` | label, input type, placeholder, hint, required, min, max, maxLength |
+| `TEXTAREA` | `testTextareaField` | label, hint, required |
+| `CHECKBOX` | `testCheckboxField` | label, `requiredTrue` error |
+| `SELECT` | `testSelectField` | label, hint, option count, selecting an option, required |
+| `DATEPICKER` | `testDatepickerField` | label, hint, toggle button, required |
+| `SLIDER` | `testSliderField` | renders, label, min, max |
+| `AUTOCOMPLETE` | `testAutocompleteField` | label, hint, dropdown, selecting an option, required |
+| `AUTOCOMPLETE_CHIPLIST` | `testAutocompleteChiplistField` | label, hint, typing shows options, add chip, remove chip, `minArrayLength` error |
+| `FILE_UPLOAD` | `testFileUploadField` | label, drop zone text, select button |
+| `UNIT_CONVERSION` | `testUnitConversionField` | label, number input, unit select |
+
+`testForm` and `testField` do **not** cover:
+
+- Fields without a `controlName` (headings, dividers, buttons). These are skipped.
+- `SUB_GROUP` and `GROUP_LIST` children. Nested fields aren't walked; test them with the helpers below.
+- `IMAGE_UPLOAD` and `MAP`. These have no factory yet.
+
+The individual factories are exported too, if you want one suite for one field.
+
+## Test ids
+
+Every crispr-forms control renders a `data-testid` set to its control path. All helpers take this path as their `testId` argument.
+
+| Field | `data-testid` |
+|---|---|
+| Top-level `firstName` | `firstName` |
+| `firstName` in sub group `address` | `address.firstName` |
+| `firstName` in group list `contacts`, item 2 | `contacts[2].firstName` |
+| Nested in both | `contacts[2].address.city` |
+
+Fields without a `controlName`, such as buttons, have no test id by default. Set `testId` on the field config to add one. Any parent prefix still applies, so `testId: 'save'` inside sub group `actions` renders `actions.save`.
+
+## Helpers
+
+### Locators
+
+| Helper | Returns |
+|---|---|
+| `getMatFormField(page, testId)` | The element carrying the `data-testid`. Usually a `mat-form-field`, a `mat-checkbox` or a `mat-slider`. |
+| `getInput(page, testId)` | The `input` inside the field |
+| `getLabel(page, testId)` | The `mat-label` inside the field |
+| `getHint(page, testId)` | The `mat-hint` inside the field |
+| `getMatSelect(page, testId)` | The `mat-select` inside a select field |
+| `getCheckbox(page, testId)` | The `mat-checkbox` element |
+| `getAutocompleteInput(page, testId)` | The visible text input of an autocomplete or chiplist |
+| `getError(page, testId, fieldType = 'input')` | The displayed error message. Pass the field's kebab-case type for non-input fields: `'select'`, `'textarea'`, `'checkbox'`, `'datepicker'`, `'autocomplete'` or `'autocomplete-chiplist'`. |
+
+### Actions
+
+| Helper | Does |
+|---|---|
+| `touchInput(page, testId)` | Clicks the input, then Tabs away to blur it |
+| `touchSelect(page, testId)` | Opens the select, presses Escape, then Tabs away |
+| `touchCheckbox(page, testId)` | Clicks twice, so the box ends unchecked, then Tabs away |
+| `touchAutocomplete(page, testId)` | Clicks the visible input, then Tabs away |
+| `touchDatepicker(page, testId)` | Clicks the input, then Tabs away |
+| `openSelect(page, testId)` | Opens the select panel |
+| `selectOption(page, testId, optionLabel)` | Opens the select and picks the option with that label |
+| `submitForm(page, nth = 0)` | Submits the `nth` crispr form on the page, which shows every control's errors |
+
+### Example
+
+```ts
+import { test, expect, getInput, getError, touchInput, submitForm } from '@tft/crispr-forms-testing';
+
+test('name is required', async ({ page }) => {
+  await page.goto('/profile');
+
+  await touchInput(page, 'name');
+  await expect(getError(page, 'name')).toHaveText('This field is required');
+
+  await getInput(page, 'name').fill('Ada');
+  await expect(getError(page, 'name')).toHaveCount(0);
+});
+
+test('nested list item shows its errors on submit', async ({ page }) => {
+  await page.goto('/profile');
+  await submitForm(page);
+  await expect(getError(page, 'contacts[0].email')).toBeVisible();
+});
+```
+
+## Gotchas
+
+**Showing errors on autocomplete and chiplist fields.** Their validators are on a hidden control, not on the visible input, so blurring the input never touches the validated control. Call `submitForm(page)` instead: it forces every control in the form to display its errors.
+
+**Why `submitForm` doesn't click.** crispr-forms submits through a hidden `display: none` button, which Playwright can't click. `submitForm` clicks it from inside the page with `page.evaluate`.
+
+**Select fields need a Tab after Escape.** Escape closes the panel but leaves the select focused. Errors appear on blur, so `touchSelect` also presses Tab.
+
+**`getError` targets the message, not the host.** The `tft-control-error` element is always in the DOM, even with no error, and autocomplete/chiplist fields render two of them. `getError` matches the inner `p.tft-control-error`, which only exists while a message is shown. That keeps Playwright's strict mode happy, and `toHaveCount(0)` reliably asserts "no error".
+
+**Slider labels and bounds.** Sliders aren't inside a `mat-form-field`, so their label is a plain `<label>` and `getLabel` won't find it; use `getMatFormField(page, id).locator('label')`. Read min and max from the native `min`/`max` attributes on `input[matSliderThumb]`, not from `aria-valuemin`/`aria-valuemax`.
+
+**Unit conversion `required` can't be tested.** The visible input is a separate control from the one that holds the validators, so a required error never shows on the field.

package/field-tests/autocomplete-chiplist.tests.d.ts

@@ -1,4 +1,4 @@
-import type { AutocompleteChiplistFieldConfig } from '@tft/crispr-forms/utils';
+import type { AutocompleteChiplistFieldConfig } from '@tft/crispr-forms';
 /**
  * Registers Playwright tests for an AUTOCOMPLETE_CHIPLIST field config.
  * Call inside a `test.describe` block that has already navigated to the page.

package/field-tests/autocomplete-chiplist.tests.js

@@ -1,5 +1,8 @@
-import { test, expect } from '@playwright/test';
-import { getLabel, getHint, getError, getMatFormField, submitForm } from '../helpers/form.helpers';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testAutocompleteChiplistField = testAutocompleteChiplistField;
+const test_1 = require("@playwright/test");
+const form_helpers_1 = require("../helpers/form.helpers");
 /**
  * Registers Playwright tests for an AUTOCOMPLETE_CHIPLIST field config.
  * Call inside a `test.describe` block that has already navigated to the page.
@@ -8,44 +11,44 @@ import { getLabel, getHint, getError, getMatFormField, submitForm } from '../hel
  * the hidden `[formControlName]` anchor is what holds validators. Blurring the
  * visible search input does not touch the hidden control.
  */
-export function testAutocompleteChiplistField(config) {
+function testAutocompleteChiplistField(config) {
     if (config.label) {
-        test('renders label', async ({ page }) => {
-            await expect(getLabel(page, config.controlName)).toHaveText(config.label);
+        (0, test_1.test)('renders label', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
         });
     }
     if (config.hint) {
-        test('shows hint when untouched', async ({ page }) => {
-            await expect(getHint(page, config.controlName)).toBeVisible();
+        (0, test_1.test)('shows hint when untouched', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
         });
     }
-    test('can type and see options', async ({ page }) => {
-        const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');
+    (0, test_1.test)('can type and see options', async ({ page }) => {
+        const searchInput = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('input[matInput]');
         await searchInput.fill('Option');
         const options = page.locator('mat-option');
-        await expect(options.first()).toBeVisible();
+        await (0, test_1.expect)(options.first()).toBeVisible();
     });
-    test('can add a chip by selecting an option', async ({ page }) => {
-        const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');
+    (0, test_1.test)('can add a chip by selecting an option', async ({ page }) => {
+        const searchInput = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('input[matInput]');
         await searchInput.fill('Option A');
         await page.locator('mat-option').filter({ hasText: 'Option A' }).click();
-        const chip = getMatFormField(page, config.controlName).locator('mat-chip-row').first();
-        await expect(chip).toContainText('Option A');
+        const chip = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('mat-chip-row').first();
+        await (0, test_1.expect)(chip).toContainText('Option A');
     });
-    test('can remove a chip', async ({ page }) => {
-        const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');
+    (0, test_1.test)('can remove a chip', async ({ page }) => {
+        const searchInput = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('input[matInput]');
         await searchInput.fill('Option A');
         await page.locator('mat-option').filter({ hasText: 'Option A' }).click();
-        const removeBtn = getMatFormField(page, config.controlName).locator('mat-chip-row mat-icon[matChipRemove]').first();
+        const removeBtn = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('mat-chip-row mat-icon[matChipRemove]').first();
         if (await removeBtn.isVisible()) {
             await removeBtn.click();
-            const chips = getMatFormField(page, config.controlName).locator('mat-chip-row');
-            await expect(chips).toHaveCount(0);
+            const chips = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('mat-chip-row');
+            await (0, test_1.expect)(chips).toHaveCount(0);
         }
     });
-    test('shows error when not enough chips selected', async ({ page }) => {
-        await submitForm(page);
-        await expect(getError(page, config.controlName, 'autocomplete-chiplist')).toBeVisible();
+    (0, test_1.test)('shows error when not enough chips selected', async ({ page }) => {
+        await (0, form_helpers_1.submitForm)(page);
+        await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'autocomplete-chiplist')).toBeVisible();
     });
 }
 //# sourceMappingURL=autocomplete-chiplist.tests.js.map

package/field-tests/autocomplete-chiplist.tests.js.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete-chiplist.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/autocomplete-chiplist.tests.ts"],"names":[],"mappings":"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","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { AutocompleteChiplistFieldConfig } from '@tft/crispr-forms/utils';\nimport { getLabel, getHint, getError, getMatFormField, submitForm } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for an AUTOCOMPLETE_CHIPLIST field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: like autocomplete, errors require `submitForm()` rather than blur because\n * the hidden `[formControlName]` anchor is what holds validators. Blurring the\n * visible search input does not touch the hidden control.\n */\nexport function testAutocompleteChiplistField(config: AutocompleteChiplistFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('can type and see options', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option');\n    const options = page.locator('mat-option');\n    await expect(options.first()).toBeVisible();\n  });\n\n  test('can add a chip by selecting an option', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    const chip = getMatFormField(page, config.controlName).locator('mat-chip-row').first();\n    await expect(chip).toContainText('Option A');\n  });\n\n  test('can remove a chip', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    const removeBtn = getMatFormField(page, config.controlName).locator('mat-chip-row mat-icon[matChipRemove]').first();\n    if (await removeBtn.isVisible()) {\n      await removeBtn.click();\n      const chips = getMatFormField(page, config.controlName).locator('mat-chip-row');\n      await expect(chips).toHaveCount(0);\n    }\n  });\n\n  test('shows error when not enough chips selected', async ({ page }) => {\n    await submitForm(page);\n    await expect(getError(page, config.controlName, 'autocomplete-chiplist')).toBeVisible();\n  });\n}\n"]}
+{"version":3,"file":"autocomplete-chiplist.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/autocomplete-chiplist.tests.ts"],"names":[],"mappings":"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","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { AutocompleteChiplistFieldConfig } from '@tft/crispr-forms';\nimport { getLabel, getHint, getError, getMatFormField, submitForm } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for an AUTOCOMPLETE_CHIPLIST field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: like autocomplete, errors require `submitForm()` rather than blur because\n * the hidden `[formControlName]` anchor is what holds validators. Blurring the\n * visible search input does not touch the hidden control.\n */\nexport function testAutocompleteChiplistField(config: AutocompleteChiplistFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('can type and see options', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option');\n    const options = page.locator('mat-option');\n    await expect(options.first()).toBeVisible();\n  });\n\n  test('can add a chip by selecting an option', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    const chip = getMatFormField(page, config.controlName).locator('mat-chip-row').first();\n    await expect(chip).toContainText('Option A');\n  });\n\n  test('can remove a chip', async ({ page }) => {\n    const searchInput = getMatFormField(page, config.controlName).locator('input[matInput]');\n    await searchInput.fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    const removeBtn = getMatFormField(page, config.controlName).locator('mat-chip-row mat-icon[matChipRemove]').first();\n    if (await removeBtn.isVisible()) {\n      await removeBtn.click();\n      const chips = getMatFormField(page, config.controlName).locator('mat-chip-row');\n      await expect(chips).toHaveCount(0);\n    }\n  });\n\n  test('shows error when not enough chips selected', async ({ page }) => {\n    await submitForm(page);\n    await expect(getError(page, config.controlName, 'autocomplete-chiplist')).toBeVisible();\n  });\n}\n"]}

package/field-tests/autocomplete.tests.d.ts

@@ -1,4 +1,4 @@
-import type { AutocompleteFieldConfig } from '@tft/crispr-forms/utils';
+import type { AutocompleteFieldConfig } from '@tft/crispr-forms';
 /**
  * Registers Playwright tests for an AUTOCOMPLETE field config.
  * Call inside a `test.describe` block that has already navigated to the page.

package/field-tests/autocomplete.tests.js

@@ -1,6 +1,9 @@
-import { test, expect } from '@playwright/test';
-import { Validators } from '@angular/forms';
-import { getLabel, getHint, getError, getAutocompleteInput, submitForm } from '../helpers/form.helpers';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testAutocompleteField = testAutocompleteField;
+const test_1 = require("@playwright/test");
+const forms_1 = require("@angular/forms");
+const form_helpers_1 = require("../helpers/form.helpers");
 /**
  * Registers Playwright tests for an AUTOCOMPLETE field config.
  * Call inside a `test.describe` block that has already navigated to the page.
@@ -10,32 +13,32 @@ import { getLabel, getHint, getError, getAutocompleteInput, submitForm } from '.
  * the visible input does not touch the hidden control. `submitForm()` fires
  * `ControlErrorsFormDirective.submit$` which forces all controls to show errors.
  */
-export function testAutocompleteField(config) {
+function testAutocompleteField(config) {
     if (config.label) {
-        test('renders label', async ({ page }) => {
-            await expect(getLabel(page, config.controlName)).toHaveText(config.label);
+        (0, test_1.test)('renders label', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
         });
     }
     if (config.hint) {
-        test('shows hint when untouched', async ({ page }) => {
-            await expect(getHint(page, config.controlName)).toBeVisible();
+        (0, test_1.test)('shows hint when untouched', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
         });
     }
-    test('shows dropdown options when typing', async ({ page }) => {
-        await getAutocompleteInput(page, config.controlName).fill('Option');
+    (0, test_1.test)('shows dropdown options when typing', async ({ page }) => {
+        await (0, form_helpers_1.getAutocompleteInput)(page, config.controlName).fill('Option');
         const options = page.locator('mat-option');
-        await expect(options.first()).toBeVisible();
+        await (0, test_1.expect)(options.first()).toBeVisible();
     });
-    test('can select an autocomplete option', async ({ page }) => {
-        await getAutocompleteInput(page, config.controlName).fill('Option A');
+    (0, test_1.test)('can select an autocomplete option', async ({ page }) => {
+        await (0, form_helpers_1.getAutocompleteInput)(page, config.controlName).fill('Option A');
         await page.locator('mat-option').filter({ hasText: 'Option A' }).click();
-        await expect(getAutocompleteInput(page, config.controlName)).toHaveValue('Option A');
+        await (0, test_1.expect)((0, form_helpers_1.getAutocompleteInput)(page, config.controlName)).toHaveValue('Option A');
     });
-    if (config.validators?.includes(Validators.required)) {
-        test('shows required error when form submitted empty', async ({ page }) => {
-            await getAutocompleteInput(page, config.controlName).fill('');
-            await submitForm(page);
-            await expect(getError(page, config.controlName, 'autocomplete')).toBeVisible();
+    if (config.validators?.includes(forms_1.Validators.required)) {
+        (0, test_1.test)('shows required error when form submitted empty', async ({ page }) => {
+            await (0, form_helpers_1.getAutocompleteInput)(page, config.controlName).fill('');
+            await (0, form_helpers_1.submitForm)(page);
+            await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'autocomplete')).toBeVisible();
         });
     }
 }

package/field-tests/autocomplete.tests.js.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/autocomplete.tests.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,oBAAoB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAExG;;;;;;;;GAQG;AACH,MAAM,UAAU,qBAAqB,CAAC,MAA+B;IACnE,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;QACjB,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvC,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5E,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,IAAI,EAAE,CAAC;QAChB,IAAI,CAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACnD,MAAM,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,CAAC,oCAAoC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC5D,MAAM,oBAAoB,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACpE,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAC3C,MAAM,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,mCAAmC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3D,MAAM,oBAAoB,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACtE,MAAM,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC;QACzE,MAAM,MAAM,CAAC,oBAAoB,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IACvF,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAI,CAAC,gDAAgD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACxE,MAAM,oBAAoB,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC9D,MAAM,UAAU,CAAC,IAAI,CAAC,CAAC;YACvB,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACjF,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { AutocompleteFieldConfig } from '@tft/crispr-forms/utils';\nimport { Validators } from '@angular/forms';\nimport { getLabel, getHint, getError, getAutocompleteInput, submitForm } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for an AUTOCOMPLETE field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: errors are triggered via `submitForm()` rather than blur because the\n * autocomplete uses a hidden `[formControlName]` anchor for validation — blurring\n * the visible input does not touch the hidden control. `submitForm()` fires\n * `ControlErrorsFormDirective.submit$` which forces all controls to show errors.\n */\nexport function testAutocompleteField(config: AutocompleteFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('shows dropdown options when typing', async ({ page }) => {\n    await getAutocompleteInput(page, config.controlName).fill('Option');\n    const options = page.locator('mat-option');\n    await expect(options.first()).toBeVisible();\n  });\n\n  test('can select an autocomplete option', async ({ page }) => {\n    await getAutocompleteInput(page, config.controlName).fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    await expect(getAutocompleteInput(page, config.controlName)).toHaveValue('Option A');\n  });\n\n  if (config.validators?.includes(Validators.required)) {\n    test('shows required error when form submitted empty', async ({ page }) => {\n      await getAutocompleteInput(page, config.controlName).fill('');\n      await submitForm(page);\n      await expect(getError(page, config.controlName, 'autocomplete')).toBeVisible();\n    });\n  }\n}\n"]}
+{"version":3,"file":"autocomplete.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/autocomplete.tests.ts"],"names":[],"mappings":";;AAcA,sDAgCC;AA9CD,2CAAgD;AAEhD,0CAA4C;AAC5C,0DAAwG;AAExG;;;;;;;;GAQG;AACH,SAAgB,qBAAqB,CAAC,MAA+B;IACnE,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;QACjB,IAAA,WAAI,EAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvC,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5E,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,IAAI,EAAE,CAAC;QAChB,IAAA,WAAI,EAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACnD,MAAM,IAAA,aAAM,EAAC,IAAA,sBAAO,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAA,WAAI,EAAC,oCAAoC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC5D,MAAM,IAAA,mCAAoB,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACpE,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAC3C,MAAM,IAAA,aAAM,EAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,IAAA,WAAI,EAAC,mCAAmC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3D,MAAM,IAAA,mCAAoB,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACtE,MAAM,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC;QACzE,MAAM,IAAA,aAAM,EAAC,IAAA,mCAAoB,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IACvF,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAA,WAAI,EAAC,gDAAgD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACxE,MAAM,IAAA,mCAAoB,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC9D,MAAM,IAAA,yBAAU,EAAC,IAAI,CAAC,CAAC;YACvB,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACjF,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { AutocompleteFieldConfig } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getLabel, getHint, getError, getAutocompleteInput, submitForm } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for an AUTOCOMPLETE field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: errors are triggered via `submitForm()` rather than blur because the\n * autocomplete uses a hidden `[formControlName]` anchor for validation — blurring\n * the visible input does not touch the hidden control. `submitForm()` fires\n * `ControlErrorsFormDirective.submit$` which forces all controls to show errors.\n */\nexport function testAutocompleteField(config: AutocompleteFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('shows dropdown options when typing', async ({ page }) => {\n    await getAutocompleteInput(page, config.controlName).fill('Option');\n    const options = page.locator('mat-option');\n    await expect(options.first()).toBeVisible();\n  });\n\n  test('can select an autocomplete option', async ({ page }) => {\n    await getAutocompleteInput(page, config.controlName).fill('Option A');\n    await page.locator('mat-option').filter({ hasText: 'Option A' }).click();\n    await expect(getAutocompleteInput(page, config.controlName)).toHaveValue('Option A');\n  });\n\n  if (config.validators?.includes(Validators.required)) {\n    test('shows required error when form submitted empty', async ({ page }) => {\n      await getAutocompleteInput(page, config.controlName).fill('');\n      await submitForm(page);\n      await expect(getError(page, config.controlName, 'autocomplete')).toBeVisible();\n    });\n  }\n}\n"]}

package/field-tests/checkbox.tests.d.ts

@@ -1,4 +1,4 @@
-import type { CheckboxFieldConfig } from '@tft/crispr-forms/utils';
+import type { CheckboxFieldConfig } from '@tft/crispr-forms';
 /**
  * Registers Playwright tests for a CHECKBOX field config.
  * Call inside a `test.describe` block that has already navigated to the page.

package/field-tests/checkbox.tests.js

@@ -1,26 +1,29 @@
-import { test, expect } from '@playwright/test';
-import { Validators } from '@angular/forms';
-import { getCheckbox, getError } from '../helpers/form.helpers';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testCheckboxField = testCheckboxField;
+const test_1 = require("@playwright/test");
+const forms_1 = require("@angular/forms");
+const form_helpers_1 = require("../helpers/form.helpers");
 /**
  * Registers Playwright tests for a CHECKBOX field config.
  * Call inside a `test.describe` block that has already navigated to the page.
  */
-export function testCheckboxField(config) {
-    test('renders label', async ({ page }) => {
-        const label = getCheckbox(page, config.controlName).locator('.mdc-label');
-        await expect(label).toContainText(config.label);
+function testCheckboxField(config) {
+    (0, test_1.test)('renders label', async ({ page }) => {
+        const label = (0, form_helpers_1.getCheckbox)(page, config.controlName).locator('.mdc-label');
+        await (0, test_1.expect)(label).toContainText(config.label);
     });
-    if (config.validators?.includes(Validators.requiredTrue)) {
-        test('shows error when unchecked and blurred', async ({ page }) => {
-            await getCheckbox(page, config.controlName).click();
-            await getCheckbox(page, config.controlName).click();
+    if (config.validators?.includes(forms_1.Validators.requiredTrue)) {
+        (0, test_1.test)('shows error when unchecked and blurred', async ({ page }) => {
+            await (0, form_helpers_1.getCheckbox)(page, config.controlName).click();
+            await (0, form_helpers_1.getCheckbox)(page, config.controlName).click();
             await page.keyboard.press('Tab');
-            await expect(getError(page, config.controlName, 'checkbox')).toBeVisible();
+            await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'checkbox')).toBeVisible();
         });
-        test('no error when checked', async ({ page }) => {
-            await getCheckbox(page, config.controlName).click();
+        (0, test_1.test)('no error when checked', async ({ page }) => {
+            await (0, form_helpers_1.getCheckbox)(page, config.controlName).click();
             await page.keyboard.press('Tab');
-            await expect(getError(page, config.controlName, 'checkbox')).not.toBeVisible();
+            await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'checkbox')).not.toBeVisible();
         });
     }
 }

package/field-tests/checkbox.tests.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/checkbox.tests.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEhE;;;GAGG;AACH,MAAM,UAAU,iBAAiB,CAAC,MAA2B;IAC3D,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QACvC,MAAM,KAAK,GAAG,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAC1E,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAClD,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE,CAAC;QACzD,IAAI,CAAC,wCAAwC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAChE,MAAM,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACjC,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAC7E,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,uBAAuB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC/C,MAAM,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACjC,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;QACjF,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { CheckboxFieldConfig } from '@tft/crispr-forms/utils';\nimport { Validators } from '@angular/forms';\nimport { getCheckbox, getError } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a CHECKBOX field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testCheckboxField(config: CheckboxFieldConfig) {\n  test('renders label', async ({ page }) => {\n    const label = getCheckbox(page, config.controlName).locator('.mdc-label');\n    await expect(label).toContainText(config.label);\n  });\n\n  if (config.validators?.includes(Validators.requiredTrue)) {\n    test('shows error when unchecked and blurred', async ({ page }) => {\n      await getCheckbox(page, config.controlName).click();\n      await getCheckbox(page, config.controlName).click();\n      await page.keyboard.press('Tab');\n      await expect(getError(page, config.controlName, 'checkbox')).toBeVisible();\n    });\n\n    test('no error when checked', async ({ page }) => {\n      await getCheckbox(page, config.controlName).click();\n      await page.keyboard.press('Tab');\n      await expect(getError(page, config.controlName, 'checkbox')).not.toBeVisible();\n    });\n  }\n}\n"]}
+{"version":3,"file":"checkbox.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/checkbox.tests.ts"],"names":[],"mappings":";;AASA,8CAoBC;AA7BD,2CAAgD;AAEhD,0CAA4C;AAC5C,0DAAgE;AAEhE;;;GAGG;AACH,SAAgB,iBAAiB,CAAC,MAA2B;IAC3D,IAAA,WAAI,EAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QACvC,MAAM,KAAK,GAAG,IAAA,0BAAW,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAC1E,MAAM,IAAA,aAAM,EAAC,KAAK,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAClD,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,YAAY,CAAC,EAAE,CAAC;QACzD,IAAA,WAAI,EAAC,wCAAwC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAChE,MAAM,IAAA,0BAAW,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,IAAA,0BAAW,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACjC,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAC7E,CAAC,CAAC,CAAC;QAEH,IAAA,WAAI,EAAC,uBAAuB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC/C,MAAM,IAAA,0BAAW,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,CAAC;YACpD,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACjC,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;QACjF,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { CheckboxFieldConfig } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getCheckbox, getError } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a CHECKBOX field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testCheckboxField(config: CheckboxFieldConfig) {\n  test('renders label', async ({ page }) => {\n    const label = getCheckbox(page, config.controlName).locator('.mdc-label');\n    await expect(label).toContainText(config.label);\n  });\n\n  if (config.validators?.includes(Validators.requiredTrue)) {\n    test('shows error when unchecked and blurred', async ({ page }) => {\n      await getCheckbox(page, config.controlName).click();\n      await getCheckbox(page, config.controlName).click();\n      await page.keyboard.press('Tab');\n      await expect(getError(page, config.controlName, 'checkbox')).toBeVisible();\n    });\n\n    test('no error when checked', async ({ page }) => {\n      await getCheckbox(page, config.controlName).click();\n      await page.keyboard.press('Tab');\n      await expect(getError(page, config.controlName, 'checkbox')).not.toBeVisible();\n    });\n  }\n}\n"]}

package/field-tests/datepicker.tests.d.ts

@@ -1,4 +1,4 @@
-import type { DatepickerFieldConfig } from '@tft/crispr-forms/utils';
+import type { DatepickerFieldConfig } from '@tft/crispr-forms';
 /**
  * Registers Playwright tests for a DATEPICKER field config.
  * Call inside a `test.describe` block that has already navigated to the page.

package/field-tests/datepicker.tests.js

@@ -1,29 +1,32 @@
-import { test, expect } from '@playwright/test';
-import { Validators } from '@angular/forms';
-import { getLabel, getHint, getError, getMatFormField, touchDatepicker } from '../helpers/form.helpers';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testDatepickerField = testDatepickerField;
+const test_1 = require("@playwright/test");
+const forms_1 = require("@angular/forms");
+const form_helpers_1 = require("../helpers/form.helpers");
 /**
  * Registers Playwright tests for a DATEPICKER field config.
  * Call inside a `test.describe` block that has already navigated to the page.
  */
-export function testDatepickerField(config) {
+function testDatepickerField(config) {
     if (config.label) {
-        test('renders label', async ({ page }) => {
-            await expect(getLabel(page, config.controlName)).toHaveText(config.label);
+        (0, test_1.test)('renders label', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
         });
     }
     if (config.hint) {
-        test('shows hint when untouched', async ({ page }) => {
-            await expect(getHint(page, config.controlName)).toBeVisible();
+        (0, test_1.test)('shows hint when untouched', async ({ page }) => {
+            await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
         });
     }
-    test('renders datepicker toggle button', async ({ page }) => {
-        const toggle = getMatFormField(page, config.controlName).locator('mat-datepicker-toggle');
-        await expect(toggle).toBeVisible();
+    (0, test_1.test)('renders datepicker toggle button', async ({ page }) => {
+        const toggle = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('mat-datepicker-toggle');
+        await (0, test_1.expect)(toggle).toBeVisible();
     });
-    if (config.validators?.includes(Validators.required)) {
-        test('shows required error when blurred without date', async ({ page }) => {
-            await touchDatepicker(page, config.controlName);
-            await expect(getError(page, config.controlName, 'datepicker')).toBeVisible();
+    if (config.validators?.includes(forms_1.Validators.required)) {
+        (0, test_1.test)('shows required error when blurred without date', async ({ page }) => {
+            await (0, form_helpers_1.touchDatepicker)(page, config.controlName);
+            await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'datepicker')).toBeVisible();
         });
     }
 }

package/field-tests/datepicker.tests.js.map

@@ -1 +1 @@
-{"version":3,"file":"datepicker.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/datepicker.tests.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAExG;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,MAA6B;IAC/D,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;QACjB,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvC,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5E,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,IAAI,EAAE,CAAC;QAChB,IAAI,CAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACnD,MAAM,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,CAAC,kCAAkC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC1D,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC;QAC1F,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAI,CAAC,gDAAgD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACxE,MAAM,eAAe,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;YAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAC/E,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { DatepickerFieldConfig } from '@tft/crispr-forms/utils';\nimport { Validators } from '@angular/forms';\nimport { getLabel, getHint, getError, getMatFormField, touchDatepicker } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a DATEPICKER field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testDatepickerField(config: DatepickerFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('renders datepicker toggle button', async ({ page }) => {\n    const toggle = getMatFormField(page, config.controlName).locator('mat-datepicker-toggle');\n    await expect(toggle).toBeVisible();\n  });\n\n  if (config.validators?.includes(Validators.required)) {\n    test('shows required error when blurred without date', async ({ page }) => {\n      await touchDatepicker(page, config.controlName);\n      await expect(getError(page, config.controlName, 'datepicker')).toBeVisible();\n    });\n  }\n}\n"]}
+{"version":3,"file":"datepicker.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/datepicker.tests.ts"],"names":[],"mappings":";;AASA,kDAwBC;AAjCD,2CAAgD;AAEhD,0CAA4C;AAC5C,0DAAwG;AAExG;;;GAGG;AACH,SAAgB,mBAAmB,CAAC,MAA6B;IAC/D,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;QACjB,IAAA,WAAI,EAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvC,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5E,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,IAAI,EAAE,CAAC;QAChB,IAAA,WAAI,EAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACnD,MAAM,IAAA,aAAM,EAAC,IAAA,sBAAO,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAA,WAAI,EAAC,kCAAkC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC1D,MAAM,MAAM,GAAG,IAAA,8BAAe,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC;QAC1F,MAAM,IAAA,aAAM,EAAC,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAA,WAAI,EAAC,gDAAgD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACxE,MAAM,IAAA,8BAAe,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;YAChD,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAC/E,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { DatepickerFieldConfig } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getLabel, getHint, getError, getMatFormField, touchDatepicker } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a DATEPICKER field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testDatepickerField(config: DatepickerFieldConfig) {\n  if (config.label) {\n    test('renders label', async ({ page }) => {\n      await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n    });\n  }\n\n  if (config.hint) {\n    test('shows hint when untouched', async ({ page }) => {\n      await expect(getHint(page, config.controlName)).toBeVisible();\n    });\n  }\n\n  test('renders datepicker toggle button', async ({ page }) => {\n    const toggle = getMatFormField(page, config.controlName).locator('mat-datepicker-toggle');\n    await expect(toggle).toBeVisible();\n  });\n\n  if (config.validators?.includes(Validators.required)) {\n    test('shows required error when blurred without date', async ({ page }) => {\n      await touchDatepicker(page, config.controlName);\n      await expect(getError(page, config.controlName, 'datepicker')).toBeVisible();\n    });\n  }\n}\n"]}

package/field-tests/field-test-factory.d.ts

@@ -1,4 +1,4 @@
-import type { FormConfig, AnyFieldConfig } from '@tft/crispr-forms/utils';
+import type { FormConfig, AnyFieldConfig } from '@tft/crispr-forms';
 /**
  * Registers a `test.describe` block for a field config, automatically selecting
  * the correct test suite based on `controlType`.

package/field-tests/field-test-factory.js

@@ -1,14 +1,18 @@
-import { test } from '@playwright/test';
-import { testInputField } from './input.tests';
-import { testTextareaField } from './textarea.tests';
-import { testCheckboxField } from './checkbox.tests';
-import { testSelectField } from './select.tests';
-import { testSliderField } from './slider.tests';
-import { testDatepickerField } from './datepicker.tests';
-import { testAutocompleteField } from './autocomplete.tests';
-import { testAutocompleteChiplistField } from './autocomplete-chiplist.tests';
-import { testFileUploadField } from './file-upload.tests';
-import { testUnitConversionField } from './unit-conversion.tests';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testField = testField;
+exports.testForm = testForm;
+const test_1 = require("@playwright/test");
+const input_tests_1 = require("./input.tests");
+const textarea_tests_1 = require("./textarea.tests");
+const checkbox_tests_1 = require("./checkbox.tests");
+const select_tests_1 = require("./select.tests");
+const slider_tests_1 = require("./slider.tests");
+const datepicker_tests_1 = require("./datepicker.tests");
+const autocomplete_tests_1 = require("./autocomplete.tests");
+const autocomplete_chiplist_tests_1 = require("./autocomplete-chiplist.tests");
+const file_upload_tests_1 = require("./file-upload.tests");
+const unit_conversion_tests_1 = require("./unit-conversion.tests");
 /**
  * Registers a `test.describe` block for a field config, automatically selecting
  * the correct test suite based on `controlType`.
@@ -28,40 +32,40 @@ import { testUnitConversionField } from './unit-conversion.tests';
  * });
  * ```
  */
-export function testField(config) {
+function testField(config) {
     if (!('controlName' in config))
         return;
-    test.describe(config.controlName, () => {
+    test_1.test.describe(config.controlName, () => {
         switch (config.controlType) {
             case 'input':
-                testInputField(config);
+                (0, input_tests_1.testInputField)(config);
                 break;
             case 'textarea':
-                testTextareaField(config);
+                (0, textarea_tests_1.testTextareaField)(config);
                 break;
             case 'checkbox':
-                testCheckboxField(config);
+                (0, checkbox_tests_1.testCheckboxField)(config);
                 break;
             case 'select':
-                testSelectField(config);
+                (0, select_tests_1.testSelectField)(config);
                 break;
             case 'slider':
-                testSliderField(config);
+                (0, slider_tests_1.testSliderField)(config);
                 break;
             case 'datepicker':
-                testDatepickerField(config);
+                (0, datepicker_tests_1.testDatepickerField)(config);
                 break;
             case 'autocomplete':
-                testAutocompleteField(config);
+                (0, autocomplete_tests_1.testAutocompleteField)(config);
                 break;
             case 'autocompleteChiplist':
-                testAutocompleteChiplistField(config);
+                (0, autocomplete_chiplist_tests_1.testAutocompleteChiplistField)(config);
                 break;
             case 'fileUpload':
-                testFileUploadField(config);
+                (0, file_upload_tests_1.testFileUploadField)(config);
                 break;
             case 'unitConversion':
-                testUnitConversionField(config);
+                (0, unit_conversion_tests_1.testUnitConversionField)(config);
                 break;
         }
     });
@@ -78,7 +82,7 @@ export function testField(config) {
  * });
  * ```
  */
-export function testForm(config) {
+function testForm(config) {
     for (const field of config.fields) {
         testField(field);
     }