@tft/crispr-forms-testing 21.0.14 → 21.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/field-tests/autocomplete-chiplist.tests.d.ts +1 -1
- package/field-tests/autocomplete-chiplist.tests.js +25 -22
- package/field-tests/autocomplete-chiplist.tests.js.map +1 -1
- package/field-tests/autocomplete.tests.d.ts +1 -1
- package/field-tests/autocomplete.tests.js +22 -19
- package/field-tests/autocomplete.tests.js.map +1 -1
- package/field-tests/checkbox.tests.d.ts +1 -1
- package/field-tests/checkbox.tests.js +18 -15
- package/field-tests/checkbox.tests.js.map +1 -1
- package/field-tests/datepicker.tests.d.ts +1 -1
- package/field-tests/datepicker.tests.js +18 -15
- package/field-tests/datepicker.tests.js.map +1 -1
- package/field-tests/field-test-factory.d.ts +1 -1
- package/field-tests/field-test-factory.js +28 -24
- package/field-tests/field-test-factory.js.map +1 -1
- package/field-tests/file-upload.tests.d.ts +1 -1
- package/field-tests/file-upload.tests.js +15 -12
- package/field-tests/file-upload.tests.js.map +1 -1
- package/field-tests/input.tests.d.ts +1 -1
- package/field-tests/input.tests.js +39 -36
- package/field-tests/input.tests.js.map +1 -1
- package/field-tests/select.tests.d.ts +1 -1
- package/field-tests/select.tests.js +21 -18
- package/field-tests/select.tests.js.map +1 -1
- package/field-tests/slider.tests.d.ts +1 -1
- package/field-tests/slider.tests.js +13 -10
- package/field-tests/slider.tests.js.map +1 -1
- package/field-tests/textarea.tests.d.ts +1 -1
- package/field-tests/textarea.tests.js +15 -12
- package/field-tests/textarea.tests.js.map +1 -1
- package/field-tests/unit-conversion.tests.d.ts +1 -1
- package/field-tests/unit-conversion.tests.js +13 -10
- package/field-tests/unit-conversion.tests.js.map +1 -1
- package/helpers/form.helpers.js +34 -16
- package/helpers/form.helpers.js.map +1 -1
- package/index.js +30 -14
- package/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.testInputField = testInputField;
|
|
4
|
+
const test_1 = require("@playwright/test");
|
|
5
|
+
const forms_1 = require("@angular/forms");
|
|
6
|
+
const form_helpers_1 = require("../helpers/form.helpers");
|
|
4
7
|
/**
|
|
5
8
|
* Registers Playwright tests for an INPUT field config.
|
|
6
9
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
@@ -14,59 +17,59 @@ import { getInput, getError, getLabel, getHint, touchInput } from '../helpers/fo
|
|
|
14
17
|
* - If `max`: validates max boundary
|
|
15
18
|
* - If `maxLength`: enforces maxLength attribute
|
|
16
19
|
*/
|
|
17
|
-
|
|
18
|
-
test('renders label', async ({ page }) => {
|
|
19
|
-
await expect(getLabel(page, config.controlName)).toHaveText(config.label);
|
|
20
|
+
function testInputField(config) {
|
|
21
|
+
(0, test_1.test)('renders label', async ({ page }) => {
|
|
22
|
+
await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
|
|
20
23
|
});
|
|
21
|
-
test(`has input type "${config.inputType ?? 'text'}"`, async ({ page }) => {
|
|
22
|
-
await expect(getInput(page, config.controlName)).toHaveAttribute('type', config.inputType ?? 'text');
|
|
24
|
+
(0, test_1.test)(`has input type "${config.inputType ?? 'text'}"`, async ({ page }) => {
|
|
25
|
+
await (0, test_1.expect)((0, form_helpers_1.getInput)(page, config.controlName)).toHaveAttribute('type', config.inputType ?? 'text');
|
|
23
26
|
});
|
|
24
27
|
if (config.placeholder) {
|
|
25
|
-
test('renders placeholder', async ({ page }) => {
|
|
26
|
-
await expect(getInput(page, config.controlName)).toHaveAttribute('placeholder', config.placeholder);
|
|
28
|
+
(0, test_1.test)('renders placeholder', async ({ page }) => {
|
|
29
|
+
await (0, test_1.expect)((0, form_helpers_1.getInput)(page, config.controlName)).toHaveAttribute('placeholder', config.placeholder);
|
|
27
30
|
});
|
|
28
31
|
}
|
|
29
32
|
if (config.hint) {
|
|
30
|
-
test('shows hint when untouched', async ({ page }) => {
|
|
31
|
-
await expect(getHint(page, config.controlName)).toBeVisible();
|
|
33
|
+
(0, test_1.test)('shows hint when untouched', async ({ page }) => {
|
|
34
|
+
await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
|
|
32
35
|
});
|
|
33
36
|
}
|
|
34
|
-
if (config.validators?.includes(Validators.required)) {
|
|
35
|
-
test('shows required error when blurred empty', async ({ page }) => {
|
|
36
|
-
await touchInput(page, config.controlName);
|
|
37
|
-
await expect(getError(page, config.controlName)).toBeVisible();
|
|
37
|
+
if (config.validators?.includes(forms_1.Validators.required)) {
|
|
38
|
+
(0, test_1.test)('shows required error when blurred empty', async ({ page }) => {
|
|
39
|
+
await (0, form_helpers_1.touchInput)(page, config.controlName);
|
|
40
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName)).toBeVisible();
|
|
38
41
|
});
|
|
39
42
|
}
|
|
40
43
|
if (config.min !== undefined) {
|
|
41
|
-
test(`shows error when value is below min (${config.min})`, async ({ page }) => {
|
|
42
|
-
await getInput(page, config.controlName).fill(String(config.min - 1));
|
|
43
|
-
await touchInput(page, config.controlName);
|
|
44
|
-
await expect(getError(page, config.controlName)).toBeVisible();
|
|
44
|
+
(0, test_1.test)(`shows error when value is below min (${config.min})`, async ({ page }) => {
|
|
45
|
+
await (0, form_helpers_1.getInput)(page, config.controlName).fill(String(config.min - 1));
|
|
46
|
+
await (0, form_helpers_1.touchInput)(page, config.controlName);
|
|
47
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName)).toBeVisible();
|
|
45
48
|
});
|
|
46
|
-
test(`accepts value at min boundary (${config.min})`, async ({ page }) => {
|
|
47
|
-
await getInput(page, config.controlName).fill(String(config.min));
|
|
48
|
-
await touchInput(page, config.controlName);
|
|
49
|
-
await expect(getError(page, config.controlName)).not.toBeVisible();
|
|
49
|
+
(0, test_1.test)(`accepts value at min boundary (${config.min})`, async ({ page }) => {
|
|
50
|
+
await (0, form_helpers_1.getInput)(page, config.controlName).fill(String(config.min));
|
|
51
|
+
await (0, form_helpers_1.touchInput)(page, config.controlName);
|
|
52
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName)).not.toBeVisible();
|
|
50
53
|
});
|
|
51
54
|
}
|
|
52
55
|
if (config.max !== undefined) {
|
|
53
|
-
test(`shows error when value exceeds max (${config.max})`, async ({ page }) => {
|
|
54
|
-
await getInput(page, config.controlName).fill(String(config.max + 1));
|
|
55
|
-
await touchInput(page, config.controlName);
|
|
56
|
-
await expect(getError(page, config.controlName)).toBeVisible();
|
|
56
|
+
(0, test_1.test)(`shows error when value exceeds max (${config.max})`, async ({ page }) => {
|
|
57
|
+
await (0, form_helpers_1.getInput)(page, config.controlName).fill(String(config.max + 1));
|
|
58
|
+
await (0, form_helpers_1.touchInput)(page, config.controlName);
|
|
59
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName)).toBeVisible();
|
|
57
60
|
});
|
|
58
|
-
test(`accepts value at max boundary (${config.max})`, async ({ page }) => {
|
|
59
|
-
await getInput(page, config.controlName).fill(String(config.max));
|
|
60
|
-
await touchInput(page, config.controlName);
|
|
61
|
-
await expect(getError(page, config.controlName)).not.toBeVisible();
|
|
61
|
+
(0, test_1.test)(`accepts value at max boundary (${config.max})`, async ({ page }) => {
|
|
62
|
+
await (0, form_helpers_1.getInput)(page, config.controlName).fill(String(config.max));
|
|
63
|
+
await (0, form_helpers_1.touchInput)(page, config.controlName);
|
|
64
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName)).not.toBeVisible();
|
|
62
65
|
});
|
|
63
66
|
}
|
|
64
67
|
if (config.maxLength !== undefined) {
|
|
65
|
-
test(`enforces maxLength of ${config.maxLength}`, async ({ page }) => {
|
|
68
|
+
(0, test_1.test)(`enforces maxLength of ${config.maxLength}`, async ({ page }) => {
|
|
66
69
|
const overLimit = 'a'.repeat(config.maxLength + 1);
|
|
67
|
-
await getInput(page, config.controlName).fill(overLimit);
|
|
68
|
-
const value = await getInput(page, config.controlName).inputValue();
|
|
69
|
-
expect(value.length).toBeLessThanOrEqual(config.maxLength);
|
|
70
|
+
await (0, form_helpers_1.getInput)(page, config.controlName).fill(overLimit);
|
|
71
|
+
const value = await (0, form_helpers_1.getInput)(page, config.controlName).inputValue();
|
|
72
|
+
(0, test_1.expect)(value.length).toBeLessThanOrEqual(config.maxLength);
|
|
70
73
|
});
|
|
71
74
|
}
|
|
72
75
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/input.tests.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"input.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/input.tests.ts"],"names":[],"mappings":"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","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { InputFieldConfig } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getInput, getError, getLabel, getHint, touchInput } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for an INPUT field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Tests generated based on config:\n * - Always: renders label, has correct input type\n * - If `placeholder`: renders placeholder attribute\n * - If `hint`: shows hint when untouched\n * - If `Validators.required`: shows required error on blur\n * - If `min`: validates min boundary\n * - If `max`: validates max boundary\n * - If `maxLength`: enforces maxLength attribute\n */\nexport function testInputField(config: InputFieldConfig) {\n test('renders label', async ({ page }) => {\n await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n });\n\n test(`has input type \"${config.inputType ?? 'text'}\"`, async ({ page }) => {\n await expect(getInput(page, config.controlName)).toHaveAttribute('type', config.inputType ?? 'text');\n });\n\n if (config.placeholder) {\n test('renders placeholder', async ({ page }) => {\n await expect(getInput(page, config.controlName)).toHaveAttribute('placeholder', config.placeholder);\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 if (config.validators?.includes(Validators.required)) {\n test('shows required error when blurred empty', async ({ page }) => {\n await touchInput(page, config.controlName);\n await expect(getError(page, config.controlName)).toBeVisible();\n });\n }\n\n if (config.min !== undefined) {\n test(`shows error when value is below min (${config.min})`, async ({ page }) => {\n await getInput(page, config.controlName).fill(String(config.min - 1));\n await touchInput(page, config.controlName);\n await expect(getError(page, config.controlName)).toBeVisible();\n });\n\n test(`accepts value at min boundary (${config.min})`, async ({ page }) => {\n await getInput(page, config.controlName).fill(String(config.min));\n await touchInput(page, config.controlName);\n await expect(getError(page, config.controlName)).not.toBeVisible();\n });\n }\n\n if (config.max !== undefined) {\n test(`shows error when value exceeds max (${config.max})`, async ({ page }) => {\n await getInput(page, config.controlName).fill(String(config.max + 1));\n await touchInput(page, config.controlName);\n await expect(getError(page, config.controlName)).toBeVisible();\n });\n\n test(`accepts value at max boundary (${config.max})`, async ({ page }) => {\n await getInput(page, config.controlName).fill(String(config.max));\n await touchInput(page, config.controlName);\n await expect(getError(page, config.controlName)).not.toBeVisible();\n });\n }\n\n if (config.maxLength !== undefined) {\n test(`enforces maxLength of ${config.maxLength}`, async ({ page }) => {\n const overLimit = 'a'.repeat(config.maxLength + 1);\n await getInput(page, config.controlName).fill(overLimit);\n const value = await getInput(page, config.controlName).inputValue();\n expect(value.length).toBeLessThanOrEqual(config.maxLength);\n });\n }\n}\n"]}
|
|
@@ -1,38 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.testSelectField = testSelectField;
|
|
4
|
+
const test_1 = require("@playwright/test");
|
|
5
|
+
const forms_1 = require("@angular/forms");
|
|
6
|
+
const form_helpers_1 = require("../helpers/form.helpers");
|
|
4
7
|
/**
|
|
5
8
|
* Registers Playwright tests for a SELECT field config.
|
|
6
9
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
7
10
|
*/
|
|
8
|
-
|
|
11
|
+
function testSelectField(config) {
|
|
9
12
|
if (config.label) {
|
|
10
|
-
test('renders label', async ({ page }) => {
|
|
11
|
-
await expect(getLabel(page, config.controlName)).toHaveText(config.label);
|
|
13
|
+
(0, test_1.test)('renders label', async ({ page }) => {
|
|
14
|
+
await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
|
|
12
15
|
});
|
|
13
16
|
}
|
|
14
17
|
if (config.hint) {
|
|
15
|
-
test('shows hint when untouched', async ({ page }) => {
|
|
16
|
-
await expect(getHint(page, config.controlName)).toBeVisible();
|
|
18
|
+
(0, test_1.test)('shows hint when untouched', async ({ page }) => {
|
|
19
|
+
await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
|
|
17
20
|
});
|
|
18
21
|
}
|
|
19
22
|
if (Array.isArray(config.options)) {
|
|
20
|
-
test('shows all options when opened', async ({ page }) => {
|
|
21
|
-
await openSelect(page, config.controlName);
|
|
23
|
+
(0, test_1.test)('shows all options when opened', async ({ page }) => {
|
|
24
|
+
await (0, form_helpers_1.openSelect)(page, config.controlName);
|
|
22
25
|
const options = page.locator('mat-option');
|
|
23
|
-
await expect(options).toHaveCount(config.options.length);
|
|
26
|
+
await (0, test_1.expect)(options).toHaveCount(config.options.length);
|
|
24
27
|
await page.keyboard.press('Escape');
|
|
25
28
|
});
|
|
26
|
-
test('can select an option', async ({ page }) => {
|
|
29
|
+
(0, test_1.test)('can select an option', async ({ page }) => {
|
|
27
30
|
const firstOption = config.options[0];
|
|
28
|
-
await selectOption(page, config.controlName, firstOption.label);
|
|
29
|
-
await expect(getMatSelect(page, config.controlName)).toContainText(firstOption.label);
|
|
31
|
+
await (0, form_helpers_1.selectOption)(page, config.controlName, firstOption.label);
|
|
32
|
+
await (0, test_1.expect)((0, form_helpers_1.getMatSelect)(page, config.controlName)).toContainText(firstOption.label);
|
|
30
33
|
});
|
|
31
34
|
}
|
|
32
|
-
if (config.validators?.includes(Validators.required)) {
|
|
33
|
-
test('shows required error when blurred without selection', async ({ page }) => {
|
|
34
|
-
await touchSelect(page, config.controlName);
|
|
35
|
-
await expect(getError(page, config.controlName, 'select')).toBeVisible();
|
|
35
|
+
if (config.validators?.includes(forms_1.Validators.required)) {
|
|
36
|
+
(0, test_1.test)('shows required error when blurred without selection', async ({ page }) => {
|
|
37
|
+
await (0, form_helpers_1.touchSelect)(page, config.controlName);
|
|
38
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'select')).toBeVisible();
|
|
36
39
|
});
|
|
37
40
|
}
|
|
38
41
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/select.tests.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"select.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/select.tests.ts"],"names":[],"mappings":";;AASA,0CAkCC;AA3CD,2CAAgD;AAEhD,0CAA4C;AAC5C,0DAA2H;AAE3H;;;GAGG;AACH,SAAgB,eAAe,CAAC,MAAyB;IACvD,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,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC;QAClC,IAAA,WAAI,EAAC,+BAA+B,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvD,MAAM,IAAA,yBAAU,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;YAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;YAC3C,MAAM,IAAA,aAAM,EAAC,OAAO,CAAC,CAAC,WAAW,CAAE,MAAM,CAAC,OAA0B,CAAC,MAAM,CAAC,CAAC;YAC7E,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACtC,CAAC,CAAC,CAAC;QAEH,IAAA,WAAI,EAAC,sBAAsB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC9C,MAAM,WAAW,GAAI,MAAM,CAAC,OAAoD,CAAC,CAAC,CAAC,CAAC;YACpF,MAAM,IAAA,2BAAY,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;YAChE,MAAM,IAAA,aAAM,EAAC,IAAA,2BAAY,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACxF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAA,WAAI,EAAC,qDAAqD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC7E,MAAM,IAAA,0BAAW,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;YAC5C,MAAM,IAAA,aAAM,EAAC,IAAA,uBAAQ,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAC3E,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { SelectFieldConfig, SelectOption } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getLabel, getHint, getError, getMatSelect, openSelect, selectOption, touchSelect } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a SELECT field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testSelectField(config: SelectFieldConfig) {\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 if (Array.isArray(config.options)) {\n test('shows all options when opened', async ({ page }) => {\n await openSelect(page, config.controlName);\n const options = page.locator('mat-option');\n await expect(options).toHaveCount((config.options as SelectOption[]).length);\n await page.keyboard.press('Escape');\n });\n\n test('can select an option', async ({ page }) => {\n const firstOption = (config.options as Array<{ label: string; value: unknown }>)[0];\n await selectOption(page, config.controlName, firstOption.label);\n await expect(getMatSelect(page, config.controlName)).toContainText(firstOption.label);\n });\n }\n\n if (config.validators?.includes(Validators.required)) {\n test('shows required error when blurred without selection', async ({ page }) => {\n await touchSelect(page, config.controlName);\n await expect(getError(page, config.controlName, 'select')).toBeVisible();\n });\n }\n}\n"]}
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.testSliderField = testSliderField;
|
|
4
|
+
const test_1 = require("@playwright/test");
|
|
2
5
|
/**
|
|
3
6
|
* Registers Playwright tests for a SLIDER field config.
|
|
4
7
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
@@ -10,27 +13,27 @@ import { test, expect } from '@playwright/test';
|
|
|
10
13
|
* Note: `min`/`max` are read from the native HTML attributes on `input[matSliderThumb]`,
|
|
11
14
|
* not from `aria-valuemin`/`aria-valuemax`.
|
|
12
15
|
*/
|
|
13
|
-
|
|
14
|
-
test('renders slider', async ({ page }) => {
|
|
16
|
+
function testSliderField(config) {
|
|
17
|
+
(0, test_1.test)('renders slider', async ({ page }) => {
|
|
15
18
|
const slider = page.locator(`[data-testid="${config.controlName}"]`);
|
|
16
|
-
await expect(slider).toBeVisible();
|
|
19
|
+
await (0, test_1.expect)(slider).toBeVisible();
|
|
17
20
|
});
|
|
18
21
|
if (config.label) {
|
|
19
|
-
test('renders label', async ({ page }) => {
|
|
22
|
+
(0, test_1.test)('renders label', async ({ page }) => {
|
|
20
23
|
const sliderHost = page.locator(`crispr-slider-field:has([data-testid="${config.controlName}"])`);
|
|
21
|
-
await expect(sliderHost.locator('label')).toContainText(config.label);
|
|
24
|
+
await (0, test_1.expect)(sliderHost.locator('label')).toContainText(config.label);
|
|
22
25
|
});
|
|
23
26
|
}
|
|
24
27
|
if (config.min !== undefined) {
|
|
25
|
-
test(`has correct min value (${config.min})`, async ({ page }) => {
|
|
28
|
+
(0, test_1.test)(`has correct min value (${config.min})`, async ({ page }) => {
|
|
26
29
|
const thumb = page.locator(`[data-testid="${config.controlName}"] input`);
|
|
27
|
-
await expect(thumb).toHaveAttribute('min', String(config.min));
|
|
30
|
+
await (0, test_1.expect)(thumb).toHaveAttribute('min', String(config.min));
|
|
28
31
|
});
|
|
29
32
|
}
|
|
30
33
|
if (config.max !== undefined) {
|
|
31
|
-
test(`has correct max value (${config.max})`, async ({ page }) => {
|
|
34
|
+
(0, test_1.test)(`has correct max value (${config.max})`, async ({ page }) => {
|
|
32
35
|
const thumb = page.locator(`[data-testid="${config.controlName}"] input`);
|
|
33
|
-
await expect(thumb).toHaveAttribute('max', String(config.max));
|
|
36
|
+
await (0, test_1.expect)(thumb).toHaveAttribute('max', String(config.max));
|
|
34
37
|
});
|
|
35
38
|
}
|
|
36
39
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/slider.tests.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"slider.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/slider.tests.ts"],"names":[],"mappings":";;AAcA,0CA0BC;AAxCD,2CAAgD;AAGhD;;;;;;;;;;GAUG;AACH,SAAgB,eAAe,CAAC,MAAyB;IACvD,IAAA,WAAI,EAAC,gBAAgB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QACxC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,iBAAiB,MAAM,CAAC,WAAW,IAAI,CAAC,CAAC;QACrE,MAAM,IAAA,aAAM,EAAC,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;QACjB,IAAA,WAAI,EAAC,eAAe,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvC,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,yCAAyC,MAAM,CAAC,WAAW,KAAK,CAAC,CAAC;YAClG,MAAM,IAAA,aAAM,EAAC,UAAU,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACxE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,EAAE,CAAC;QAC7B,IAAA,WAAI,EAAC,0BAA0B,MAAM,CAAC,GAAG,GAAG,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC/D,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,iBAAiB,MAAM,CAAC,WAAW,UAAU,CAAC,CAAC;YAC1E,MAAM,IAAA,aAAM,EAAC,KAAK,CAAC,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,EAAE,CAAC;QAC7B,IAAA,WAAI,EAAC,0BAA0B,MAAM,CAAC,GAAG,GAAG,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YAC/D,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,iBAAiB,MAAM,CAAC,WAAW,UAAU,CAAC,CAAC;YAC1E,MAAM,IAAA,aAAM,EAAC,KAAK,CAAC,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { SliderFieldConfig } from '@tft/crispr-forms';\n\n/**\n * Registers Playwright tests for a SLIDER field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: slider uses a plain `<label>` (not `<mat-label>`) because it is not\n * rendered inside a `mat-form-field`. The `data-testid` is on the `<mat-slider>`\n * element itself.\n *\n * Note: `min`/`max` are read from the native HTML attributes on `input[matSliderThumb]`,\n * not from `aria-valuemin`/`aria-valuemax`.\n */\nexport function testSliderField(config: SliderFieldConfig) {\n test('renders slider', async ({ page }) => {\n const slider = page.locator(`[data-testid=\"${config.controlName}\"]`);\n await expect(slider).toBeVisible();\n });\n\n if (config.label) {\n test('renders label', async ({ page }) => {\n const sliderHost = page.locator(`crispr-slider-field:has([data-testid=\"${config.controlName}\"])`);\n await expect(sliderHost.locator('label')).toContainText(config.label);\n });\n }\n\n if (config.min !== undefined) {\n test(`has correct min value (${config.min})`, async ({ page }) => {\n const thumb = page.locator(`[data-testid=\"${config.controlName}\"] input`);\n await expect(thumb).toHaveAttribute('min', String(config.min));\n });\n }\n\n if (config.max !== undefined) {\n test(`has correct max value (${config.max})`, async ({ page }) => {\n const thumb = page.locator(`[data-testid=\"${config.controlName}\"] input`);\n await expect(thumb).toHaveAttribute('max', String(config.max));\n });\n }\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { TextareaFieldConfig } from '@tft/crispr-forms
|
|
1
|
+
import type { TextareaFieldConfig } from '@tft/crispr-forms';
|
|
2
2
|
/**
|
|
3
3
|
* Registers Playwright tests for a TEXTAREA field config.
|
|
4
4
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
@@ -1,27 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.testTextareaField = testTextareaField;
|
|
4
|
+
const test_1 = require("@playwright/test");
|
|
5
|
+
const forms_1 = require("@angular/forms");
|
|
6
|
+
const form_helpers_1 = require("../helpers/form.helpers");
|
|
4
7
|
/**
|
|
5
8
|
* Registers Playwright tests for a TEXTAREA field config.
|
|
6
9
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
7
10
|
*/
|
|
8
|
-
|
|
11
|
+
function testTextareaField(config) {
|
|
9
12
|
if (config.label) {
|
|
10
|
-
test('renders label', async ({ page }) => {
|
|
11
|
-
await expect(getLabel(page, config.controlName)).toHaveText(config.label);
|
|
13
|
+
(0, test_1.test)('renders label', async ({ page }) => {
|
|
14
|
+
await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
|
|
12
15
|
});
|
|
13
16
|
}
|
|
14
17
|
if (config.hint) {
|
|
15
|
-
test('shows hint when untouched', async ({ page }) => {
|
|
16
|
-
await expect(getHint(page, config.controlName)).toBeVisible();
|
|
18
|
+
(0, test_1.test)('shows hint when untouched', async ({ page }) => {
|
|
19
|
+
await (0, test_1.expect)((0, form_helpers_1.getHint)(page, config.controlName)).toBeVisible();
|
|
17
20
|
});
|
|
18
21
|
}
|
|
19
|
-
if (config.validators?.includes(Validators.required)) {
|
|
20
|
-
test('shows required error when blurred empty', async ({ page }) => {
|
|
21
|
-
const textarea = getMatFormField(page, config.controlName).locator('textarea');
|
|
22
|
+
if (config.validators?.includes(forms_1.Validators.required)) {
|
|
23
|
+
(0, test_1.test)('shows required error when blurred empty', async ({ page }) => {
|
|
24
|
+
const textarea = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('textarea');
|
|
22
25
|
await textarea.click();
|
|
23
26
|
await page.keyboard.press('Tab');
|
|
24
|
-
await expect(getError(page, config.controlName, 'textarea')).toBeVisible();
|
|
27
|
+
await (0, test_1.expect)((0, form_helpers_1.getError)(page, config.controlName, 'textarea')).toBeVisible();
|
|
25
28
|
});
|
|
26
29
|
}
|
|
27
30
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/textarea.tests.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"textarea.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/textarea.tests.ts"],"names":[],"mappings":";;AASA,8CAqBC;AA9BD,2CAAgD;AAEhD,0CAA4C;AAC5C,0DAAuF;AAEvF;;;GAGG;AACH,SAAgB,iBAAiB,CAAC,MAA2B;IAC3D,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,IAAI,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,kBAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QACrD,IAAA,WAAI,EAAC,yCAAyC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACjE,MAAM,QAAQ,GAAG,IAAA,8BAAe,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YAC/E,MAAM,QAAQ,CAAC,KAAK,EAAE,CAAC;YACvB,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;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { TextareaFieldConfig } from '@tft/crispr-forms';\nimport { Validators } from '@angular/forms';\nimport { getMatFormField, getError, getLabel, getHint } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a TEXTAREA field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n */\nexport function testTextareaField(config: TextareaFieldConfig) {\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 if (config.validators?.includes(Validators.required)) {\n test('shows required error when blurred empty', async ({ page }) => {\n const textarea = getMatFormField(page, config.controlName).locator('textarea');\n await textarea.click();\n await page.keyboard.press('Tab');\n await expect(getError(page, config.controlName, 'textarea')).toBeVisible();\n });\n }\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { UnitConversionFieldConfig } from '@tft/crispr-forms
|
|
1
|
+
import type { UnitConversionFieldConfig } from '@tft/crispr-forms';
|
|
2
2
|
/**
|
|
3
3
|
* Registers Playwright tests for a UNIT_CONVERSION field config.
|
|
4
4
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.testUnitConversionField = testUnitConversionField;
|
|
4
|
+
const test_1 = require("@playwright/test");
|
|
5
|
+
const form_helpers_1 = require("../helpers/form.helpers");
|
|
3
6
|
/**
|
|
4
7
|
* Registers Playwright tests for a UNIT_CONVERSION field config.
|
|
5
8
|
* Call inside a `test.describe` block that has already navigated to the page.
|
|
@@ -9,20 +12,20 @@ import { getLabel, getMatFormField } from '../helpers/form.helpers';
|
|
|
9
12
|
* `[formControlName]` that holds validators, so validation errors are never
|
|
10
13
|
* wired to the visible input.
|
|
11
14
|
*/
|
|
12
|
-
|
|
15
|
+
function testUnitConversionField(config) {
|
|
13
16
|
if (config.label) {
|
|
14
|
-
test('renders label', async ({ page }) => {
|
|
15
|
-
await expect(getLabel(page, config.controlName)).toHaveText(config.label);
|
|
17
|
+
(0, test_1.test)('renders label', async ({ page }) => {
|
|
18
|
+
await (0, test_1.expect)((0, form_helpers_1.getLabel)(page, config.controlName)).toHaveText(config.label);
|
|
16
19
|
});
|
|
17
20
|
}
|
|
18
|
-
test('renders number input', async ({ page }) => {
|
|
19
|
-
const numberInput = getMatFormField(page, config.controlName).locator('input[type="number"]');
|
|
20
|
-
await expect(numberInput).toBeVisible();
|
|
21
|
+
(0, test_1.test)('renders number input', async ({ page }) => {
|
|
22
|
+
const numberInput = (0, form_helpers_1.getMatFormField)(page, config.controlName).locator('input[type="number"]');
|
|
23
|
+
await (0, test_1.expect)(numberInput).toBeVisible();
|
|
21
24
|
});
|
|
22
25
|
if (config.showUnitSelect) {
|
|
23
|
-
test('renders unit select when showUnitSelect is true', async ({ page }) => {
|
|
26
|
+
(0, test_1.test)('renders unit select when showUnitSelect is true', async ({ page }) => {
|
|
24
27
|
const unitSelect = page.locator(`crispr-unit-conversion-field:has([data-testid="${config.controlName}"]) .unit-field mat-select`);
|
|
25
|
-
await expect(unitSelect).toBeVisible();
|
|
28
|
+
await (0, test_1.expect)(unitSelect).toBeVisible();
|
|
26
29
|
});
|
|
27
30
|
}
|
|
28
31
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"unit-conversion.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/unit-conversion.tests.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"unit-conversion.tests.js","sourceRoot":"","sources":["../../../../libs/crispr-forms-testing/src/field-tests/unit-conversion.tests.ts"],"names":[],"mappings":";;AAaA,0DAkBC;AA/BD,2CAAgD;AAEhD,0DAAoE;AAEpE;;;;;;;;GAQG;AACH,SAAgB,uBAAuB,CAAC,MAAiC;IACvE,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,IAAA,WAAI,EAAC,sBAAsB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC9C,MAAM,WAAW,GAAG,IAAA,8BAAe,EAAC,IAAI,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;QAC9F,MAAM,IAAA,aAAM,EAAC,WAAW,CAAC,CAAC,WAAW,EAAE,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,cAAc,EAAE,CAAC;QAC1B,IAAA,WAAI,EAAC,iDAAiD,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACzE,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,kDAAkD,MAAM,CAAC,WAAW,4BAA4B,CAAC,CAAC;YAClI,MAAM,IAAA,aAAM,EAAC,UAAU,CAAC,CAAC,WAAW,EAAE,CAAC;QACzC,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\nimport type { UnitConversionFieldConfig } from '@tft/crispr-forms';\nimport { getLabel, getMatFormField } from '../helpers/form.helpers';\n\n/**\n * Registers Playwright tests for a UNIT_CONVERSION field config.\n * Call inside a `test.describe` block that has already navigated to the page.\n *\n * Note: required error display is not testable for this field type. The\n * `displayValueControl` (what the user types into) is separate from the\n * `[formControlName]` that holds validators, so validation errors are never\n * wired to the visible input.\n */\nexport function testUnitConversionField(config: UnitConversionFieldConfig) {\n if (config.label) {\n test('renders label', async ({ page }) => {\n await expect(getLabel(page, config.controlName)).toHaveText(config.label);\n });\n }\n\n test('renders number input', async ({ page }) => {\n const numberInput = getMatFormField(page, config.controlName).locator('input[type=\"number\"]');\n await expect(numberInput).toBeVisible();\n });\n\n if (config.showUnitSelect) {\n test('renders unit select when showUnitSelect is true', async ({ page }) => {\n const unitSelect = page.locator(`crispr-unit-conversion-field:has([data-testid=\"${config.controlName}\"]) .unit-field mat-select`);\n await expect(unitSelect).toBeVisible();\n });\n }\n}\n"]}
|
package/helpers/form.helpers.js
CHANGED
|
@@ -1,3 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getMatFormField = getMatFormField;
|
|
4
|
+
exports.getInput = getInput;
|
|
5
|
+
exports.getError = getError;
|
|
6
|
+
exports.getLabel = getLabel;
|
|
7
|
+
exports.getHint = getHint;
|
|
8
|
+
exports.touchInput = touchInput;
|
|
9
|
+
exports.getMatSelect = getMatSelect;
|
|
10
|
+
exports.openSelect = openSelect;
|
|
11
|
+
exports.selectOption = selectOption;
|
|
12
|
+
exports.touchSelect = touchSelect;
|
|
13
|
+
exports.getCheckbox = getCheckbox;
|
|
14
|
+
exports.touchCheckbox = touchCheckbox;
|
|
15
|
+
exports.getAutocompleteInput = getAutocompleteInput;
|
|
16
|
+
exports.touchAutocomplete = touchAutocomplete;
|
|
17
|
+
exports.submitForm = submitForm;
|
|
18
|
+
exports.touchDatepicker = touchDatepicker;
|
|
1
19
|
/**
|
|
2
20
|
* Returns the locator for a field's root element (the element with `data-testid`).
|
|
3
21
|
* For most fields this is a `mat-form-field`; for checkbox/slider it is the control element.
|
|
@@ -6,14 +24,14 @@
|
|
|
6
24
|
* - subGroup child: `'address.city'`
|
|
7
25
|
* - formGroupList item child: `'contacts[0].email'`
|
|
8
26
|
*/
|
|
9
|
-
|
|
27
|
+
function getMatFormField(page, testId) {
|
|
10
28
|
return page.locator(`[data-testid="${testId}"]`);
|
|
11
29
|
}
|
|
12
30
|
/**
|
|
13
31
|
* Returns the `<input>` inside a field. Works for INPUT, DATEPICKER, and other fields
|
|
14
32
|
* that render a single native input.
|
|
15
33
|
*/
|
|
16
|
-
|
|
34
|
+
function getInput(page, testId) {
|
|
17
35
|
return getMatFormField(page, testId).locator('input');
|
|
18
36
|
}
|
|
19
37
|
/**
|
|
@@ -27,39 +45,39 @@ export function getInput(page, testId) {
|
|
|
27
45
|
* e.g. `'input'`, `'select'`, `'autocomplete'`, `'autocomplete-chiplist'`,
|
|
28
46
|
* `'checkbox'`, `'datepicker'`, `'textarea'`, `'slider'`. Defaults to `'input'`.
|
|
29
47
|
*/
|
|
30
|
-
|
|
48
|
+
function getError(page, testId, fieldType = 'input') {
|
|
31
49
|
return page.locator(`crispr-${fieldType}-field:has([data-testid="${testId}"]) p.tft-control-error`);
|
|
32
50
|
}
|
|
33
51
|
/**
|
|
34
52
|
* Returns the `<mat-label>` element inside a field's form field.
|
|
35
53
|
*/
|
|
36
|
-
|
|
54
|
+
function getLabel(page, testId) {
|
|
37
55
|
return getMatFormField(page, testId).locator('mat-label');
|
|
38
56
|
}
|
|
39
57
|
/**
|
|
40
58
|
* Returns the `<mat-hint>` element inside a field's form field.
|
|
41
59
|
*/
|
|
42
|
-
|
|
60
|
+
function getHint(page, testId) {
|
|
43
61
|
return getMatFormField(page, testId).locator('mat-hint');
|
|
44
62
|
}
|
|
45
63
|
/**
|
|
46
64
|
* Clicks an input and presses Tab to trigger a real blur event.
|
|
47
65
|
* Angular's touched state is driven by blur, not just focus-out.
|
|
48
66
|
*/
|
|
49
|
-
|
|
67
|
+
async function touchInput(page, testId) {
|
|
50
68
|
await getInput(page, testId).click();
|
|
51
69
|
await page.keyboard.press('Tab');
|
|
52
70
|
}
|
|
53
71
|
/** Returns the `<mat-select>` element inside a select field. */
|
|
54
|
-
|
|
72
|
+
function getMatSelect(page, testId) {
|
|
55
73
|
return getMatFormField(page, testId).locator('mat-select');
|
|
56
74
|
}
|
|
57
75
|
/** Opens a `mat-select` dropdown. */
|
|
58
|
-
|
|
76
|
+
async function openSelect(page, testId) {
|
|
59
77
|
await getMatSelect(page, testId).click();
|
|
60
78
|
}
|
|
61
79
|
/** Opens a `mat-select`, clicks the option with the given label, and waits for it to close. */
|
|
62
|
-
|
|
80
|
+
async function selectOption(page, testId, optionLabel) {
|
|
63
81
|
await openSelect(page, testId);
|
|
64
82
|
await page.locator('mat-option').filter({ hasText: optionLabel }).click();
|
|
65
83
|
}
|
|
@@ -68,20 +86,20 @@ export async function selectOption(page, testId, optionLabel) {
|
|
|
68
86
|
* The extra Tab is required — Escape alone dismisses the panel but does not blur
|
|
69
87
|
* the trigger element, so `ControlErrorsDirective` never sees a blur event.
|
|
70
88
|
*/
|
|
71
|
-
|
|
89
|
+
async function touchSelect(page, testId) {
|
|
72
90
|
await openSelect(page, testId);
|
|
73
91
|
await page.keyboard.press('Escape');
|
|
74
92
|
await page.keyboard.press('Tab');
|
|
75
93
|
}
|
|
76
94
|
/** Returns the `<mat-checkbox>` element for a checkbox field. */
|
|
77
|
-
|
|
95
|
+
function getCheckbox(page, testId) {
|
|
78
96
|
return page.locator(`[data-testid="${testId}"]`);
|
|
79
97
|
}
|
|
80
98
|
/**
|
|
81
99
|
* Clicks a checkbox twice (check then uncheck) and presses Tab to blur,
|
|
82
100
|
* leaving it unchecked and touched — useful for triggering `requiredTrue` errors.
|
|
83
101
|
*/
|
|
84
|
-
|
|
102
|
+
async function touchCheckbox(page, testId) {
|
|
85
103
|
await getCheckbox(page, testId).click();
|
|
86
104
|
await getCheckbox(page, testId).click();
|
|
87
105
|
await page.keyboard.press('Tab');
|
|
@@ -90,11 +108,11 @@ export async function touchCheckbox(page, testId) {
|
|
|
90
108
|
* Returns the visible search input for an autocomplete field.
|
|
91
109
|
* Note: this is the `role="textbox"` input, NOT the hidden `[formControlName]` anchor.
|
|
92
110
|
*/
|
|
93
|
-
|
|
111
|
+
function getAutocompleteInput(page, testId) {
|
|
94
112
|
return getMatFormField(page, testId).locator('input[type="textbox"]');
|
|
95
113
|
}
|
|
96
114
|
/** Clicks the autocomplete input and presses Tab to blur. */
|
|
97
|
-
|
|
115
|
+
async function touchAutocomplete(page, testId) {
|
|
98
116
|
await getAutocompleteInput(page, testId).click();
|
|
99
117
|
await page.keyboard.press('Tab');
|
|
100
118
|
}
|
|
@@ -109,14 +127,14 @@ export async function touchAutocomplete(page, testId) {
|
|
|
109
127
|
*
|
|
110
128
|
* @param nth - Zero-based index of the form on the page. Defaults to `0`.
|
|
111
129
|
*/
|
|
112
|
-
|
|
130
|
+
async function submitForm(page, nth = 0) {
|
|
113
131
|
await page.evaluate((n) => {
|
|
114
132
|
const triggers = document.querySelectorAll('[data-testid="submit-trigger"]');
|
|
115
133
|
triggers[n]?.click();
|
|
116
134
|
}, nth);
|
|
117
135
|
}
|
|
118
136
|
/** Clicks the datepicker input and presses Tab to blur. */
|
|
119
|
-
|
|
137
|
+
async function touchDatepicker(page, testId) {
|
|
120
138
|
await getMatFormField(page, testId).locator('input').click();
|
|
121
139
|
await page.keyboard.press('Tab');
|
|
122
140
|
}
|