npm - wcs-core - Versions diffs - 7.5.1 → 7.6.0 - Mend

wcs-core 7.5.1 → 7.6.0

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.

Files changed (481) hide show

package/dist/collection/components/radio-group/radio-group.e2e.playwright.js CHANGED Viewed

@@ -2,6 +2,18 @@ import { setWcsContent } from "../../utils/playwright/test";
 import { test } from "@stencil/playwright";
 import { expect } from "@playwright/test";
 test.describe('Radio Group', () => {
+    test('should not render an interactive radio descendant inside wcs-radio', async ({ page }) => {
+        // Given
+        await setWcsContent(page, `
+            <wcs-radio-group>
+                <wcs-radio id="radio-1" label="SNCF" value="1"></wcs-radio>
+            </wcs-radio-group>
+        `);
+        const radio = page.locator('#radio-1');
+        // Then
+        await expect(radio).toHaveAttribute('role', 'radio');
+        await expect(radio.locator('input[type="radio"]')).toHaveCount(0);
+    });
     test('should navigate to the first not disabled radio when pressing tab key', async ({ page }) => {
         // Given
         await setWcsContent(page, `
@@ -57,8 +69,7 @@ test.describe('Radio Group', () => {
         await page.keyboard.press('Space');
         // Then
         await expect(firstRadio).toBeFocused(); // Ensure focus is on the first radio
-        const firstRadioNativeInput = page.locator('#radio-1 input');
-        await expect(firstRadioNativeInput).toHaveAttribute('aria-checked', 'true');
+        await expect(firstRadio).toHaveAttribute('aria-checked', 'true');
     });
     test('should navigate to the checked radio when pressing tab key', async ({ page }) => {
         // Given
@@ -90,13 +101,12 @@ test.describe('Radio Group', () => {
             `);
             const firstRadio = page.locator('#radio-1');
             await firstRadio.focus();
-            const thirdRadioNativeInput = page.locator('#radio-3 input');
             const thirdRadio = page.locator('#radio-3');
             // When
             await page.keyboard.press('ArrowDown');
             // Then
             await expect(thirdRadio).toBeFocused(); // Ensure focus is on the third radio
-            await expect(thirdRadioNativeInput).toHaveAttribute('aria-checked', 'true');
+            await expect(thirdRadio).toHaveAttribute('aria-checked', 'true');
         });
         test('should checked the first not disabled radio when we are on the last radio', async ({ page }) => {
             // Given
@@ -113,7 +123,7 @@ test.describe('Radio Group', () => {
             await lastRadio.focus();
             await expect(lastRadio).toBeFocused();
             const secondRadio = page.locator('#radio-2');
-            const secondRadioNativeInputInput = page.locator('#radio-2 input');
+            const secondRadioNativeInputInput = page.locator('#radio-2');
             // When
             await page.keyboard.press('ArrowDown');
             // Then
@@ -139,6 +149,26 @@ test.describe('Radio Group', () => {
             // Then
             expect(radioClickSpy).toHaveReceivedEventTimes(1);
         });
+        test('should keep only the last clicked radio checked in the same group', async ({ page }) => {
+            // Given
+            await setWcsContent(page, `
+                <wcs-radio-group>
+                    <wcs-radio id="radio-1" value="1"></wcs-radio>
+                    <wcs-radio id="radio-2" value="2"></wcs-radio>
+                    <wcs-radio id="radio-3" value="3"></wcs-radio>
+                </wcs-radio-group>
+            `);
+            const radio1 = page.locator('#radio-1');
+            const radio2 = page.locator('#radio-2');
+            // When
+            await radio1.click();
+            await page.waitForChanges();
+            await radio2.click();
+            await page.waitForChanges();
+            // Then
+            await expect(radio1).toHaveAttribute('aria-checked', 'false');
+            await expect(radio2).toHaveAttribute('aria-checked', 'true');
+        });
         test('should fire wcsChange when we click or move to an unchecked radio', async ({ page }) => {
             // Given
             await setWcsContent(page, `
@@ -164,6 +194,30 @@ test.describe('Radio Group', () => {
             await expect(radio3).toBeFocused(); // Ensure focus is on the third radio (next radio after radio2)
             expect(changeSpy).toHaveReceivedEventTimes(2);
         });
+        test('should keep only the last keyboard-selected radio checked in the same group', async ({ page }) => {
+            // Given
+            await setWcsContent(page, `
+                <wcs-radio-group>
+                    <wcs-radio id="radio-1" value="1"></wcs-radio>
+                    <wcs-radio id="radio-2" value="2"></wcs-radio>
+                    <wcs-radio id="radio-3" value="3"></wcs-radio>
+                </wcs-radio-group>
+            `);
+            const radio1 = page.locator('#radio-1');
+            const radio2 = page.locator('#radio-2');
+            const radio3 = page.locator('#radio-3');
+            // When
+            await radio1.focus();
+            await page.keyboard.press('Space');
+            await page.waitForChanges();
+            await page.keyboard.press('ArrowDown');
+            await page.waitForChanges();
+            // Then
+            await expect(radio2).toBeFocused();
+            await expect(radio1).toHaveAttribute('aria-checked', 'false');
+            await expect(radio2).toHaveAttribute('aria-checked', 'true');
+            await expect(radio3).toHaveAttribute('aria-checked', 'false');
+        });
         test('should fire wcsBlur and wcsFocus from the radios', async ({ page }) => {
             // Given
             await setWcsContent(page, `
@@ -206,7 +260,7 @@ test.describe('Radio Group', () => {
             // When
             await page.keyboard.press('ArrowUp');
             // Then
-            const secondRadioInput = page.locator('#radio-2 input');
+            const secondRadioInput = page.locator('#radio-2');
             await expect(secondRadioInput).toHaveAttribute('aria-checked', 'true');
         });
         test('should checked the last radio when we are on the first radio', async ({ page }) => {
@@ -223,9 +277,40 @@ test.describe('Radio Group', () => {
             // When
             await page.keyboard.press('ArrowUp');
             // Then
-            const lastRadioInput = page.locator('#radio-3 input');
+            const lastRadioInput = page.locator('#radio-3');
             await expect(lastRadioInput).toHaveAttribute('aria-checked', 'true');
         });
     });
+    test.describe('Behavior in window with scroll', () => {
+        [
+            { mode: 'radio' },
+            { mode: 'horizontal' },
+            { mode: 'option' }
+        ].forEach(({ mode }) => {
+            test(`should preserve the window scroll position when clicking a radio inside a scrollable container - mode: ${mode}`, async ({ page }) => {
+                // Given
+                await setWcsContent(page, `
+                    <div id="scroll-container" style="height: 100vh; overflow-y: auto;">
+                        <div style="margin-top: 150vh;">
+                            <wcs-radio-group mode="${mode}">
+                                <wcs-radio id="radio-1" value="1">Radio 1</wcs-radio>
+                                <wcs-radio id="radio-2" value="2">Radio 2</wcs-radio>
+                                <wcs-radio id="radio-3" value="3">Radio 3</wcs-radio>
+                            </wcs-radio-group>
+                        </div>
+                        <div style="margin-top: 200vh;">Other content</div>
+                    </div>
+            `);
+                const body = page.locator('body');
+                const radio2 = page.locator('#radio-2');
+                await radio2.scrollIntoViewIfNeeded();
+                // When
+                await radio2.click();
+                // Then
+                const scrollY = await body.evaluate(() => window.scrollY);
+                expect(scrollY).toBe(0);
+            });
+        });
+    });
 });
 //# sourceMappingURL=radio-group.e2e.playwright.js.map

package/dist/collection/components/radio-group/radio-group.e2e.playwright.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-group.e2e.playwright.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.e2e.playwright.ts"],"names":[],"mappings":"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","sourcesContent":["import { setWcsContent } from '../../utils/playwright/test';\nimport { test, E2EPage } from \"@stencil/playwright\";\n\nimport { expect } from \"@playwright/test\";\n\ntest.describe('Radio Group', () => {\n test('should navigate to the first not disabled radio when pressing tab key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const secondRadio = page.locator('#radio-2');\n\n // When\n await page.keyboard.press('Tab');\n\n // Then\n await expect(secondRadio).toBeFocused();\n });\n\n test('should not make unselected radios focusable when a radio is clicked', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const input = page.locator('wcs-input');\n const radio3 = page.locator('#radio-3');\n\n // When\n await radio3.click();\n await input.focus();\n\n // Then\n await page.keyboard.press('Tab');\n await expect(radio3).toBeFocused();\n });\n\n test('should checked the first radio when pressing space key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const firstRadio = page.locator('#radio-1');\n await page.keyboard.press('Tab');\n\n // When\n await page.keyboard.press('Space');\n\n // Then\n await expect(firstRadio).toBeFocused(); // Ensure focus is on the first radio\n const firstRadioNativeInput = page.locator('#radio-1 input');\n await expect(firstRadioNativeInput).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should navigate to the checked radio when pressing tab key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group value=\"3\">\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const thirdRadio = page.locator('#radio-3');\n\n // When\n await page.keyboard.press('Tab');\n\n // Then\n await expect(thirdRadio).toBeFocused();\n });\n\n test.describe('When pressing arrow down key', () => {\n test('should checked the next radio not disabled when we are on the first radio and next radio is here', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio disabled id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstRadio = page.locator('#radio-1');\n await firstRadio.focus();\n const thirdRadioNativeInput = page.locator('#radio-3 input');\n const thirdRadio = page.locator('#radio-3');\n\n // When\n await page.keyboard.press('ArrowDown');\n\n // Then\n await expect(thirdRadio).toBeFocused(); // Ensure focus is on the third radio\n await expect(thirdRadioNativeInput).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should checked the first not disabled radio when we are on the last radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const lastRadio = page.locator('#radio-3');\n // Click to select, then focus explicitly for WebKit compatibility\n await lastRadio.click();\n await lastRadio.focus();\n await expect(lastRadio).toBeFocused();\n const secondRadio = page.locator('#radio-2');\n const secondRadioNativeInputInput = page.locator('#radio-2 input');\n\n // When\n await page.keyboard.press('ArrowDown');\n\n // Then\n await expect(secondRadio).toBeFocused(); // Ensure focus is on the second radio\n await expect(secondRadioNativeInputInput).toHaveAttribute('aria-checked', 'true');\n });\n });\n\n test.describe('Events handling', () => {\n test('should fire wcsRadioClick when we click on an unchecked radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const radioClickSpy = await page.spyOnEvent('wcsRadioClick');\n\n const radio2 = page.locator('#radio-2');\n\n // When\n await radio2.click();\n await page.waitForChanges();\n\n // Then\n expect(radioClickSpy).toHaveReceivedEventTimes(1);\n });\n\n test('should fire wcsChange when we click or move to an unchecked radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const changeSpy = await page.spyOnEvent('wcsChange');\n\n const radio2 = page.locator('#radio-2');\n\n // When: Clicking on an unchecked radio\n await radio2.click();\n await page.waitForChanges();\n\n // Then\n expect(changeSpy).toHaveReceivedEventTimes(1);\n\n // When: Moving focus to another unchecked radio with keyboard\n await radio2.focus();\n await page.keyboard.press('ArrowDown'); // Move to the next radio\n await page.waitForChanges();\n\n // Then\n const radio3 = page.locator('#radio-3');\n await expect(radio3).toBeFocused(); // Ensure focus is on the third radio (next radio after radio2)\n expect(changeSpy).toHaveReceivedEventTimes(2);\n });\n\n test('should fire wcsBlur and wcsFocus from the radios', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const blurSpy = await page.spyOnEvent('wcsBlur');\n const focusSpy = await page.spyOnEvent('wcsFocus');\n\n const radio = page.locator('#radio-1');\n\n // When: Focusing on the first radio\n await radio.focus();\n await page.waitForChanges();\n\n // Then: Expect wcsFocus to be fired\n expect(focusSpy).toHaveReceivedEventTimes(1);\n\n // When: Moving to the next radio\n await page.keyboard.press('ArrowDown');\n await page.waitForChanges();\n\n // When: Moving focus to another radio\n await page.keyboard.press('Tab');\n\n // Then\n expect(blurSpy).toHaveReceivedEvent();\n expect(focusSpy).toHaveReceivedEventTimes(2);\n });\n });\n\n test.describe('When pressing arrow up key', () => {\n test('should checked the previous radio when we are on the last radio and previous radio is here', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const lastRadio = page.locator('#radio-3');\n await lastRadio.focus();\n\n // When\n await page.keyboard.press('ArrowUp');\n\n // Then\n const secondRadioInput = page.locator('#radio-2 input');\n await expect(secondRadioInput).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should checked the last radio when we are on the first radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstRadio = page.locator('#radio-1');\n await firstRadio.focus();\n\n // When\n await page.keyboard.press('ArrowUp');\n\n // Then\n const lastRadioInput = page.locator('#radio-3 input');\n await expect(lastRadioInput).toHaveAttribute('aria-checked', 'true');\n });\n });\n});\n"]}
1	+ {"version":3,"file":"radio-group.e2e.playwright.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.e2e.playwright.ts"],"names":[],"mappings":"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","sourcesContent":["import { setWcsContent } from '../../utils/playwright/test';\nimport { test, E2EPage } from \"@stencil/playwright\";\n\nimport { expect } from \"@playwright/test\";\n\ntest.describe('Radio Group', () => {\n test('should not render an interactive radio descendant inside wcs-radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" label=\"SNCF\" value=\"1\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const radio = page.locator('#radio-1');\n\n // Then\n await expect(radio).toHaveAttribute('role', 'radio');\n await expect(radio.locator('input[type=\"radio\"]')).toHaveCount(0);\n });\n\n test('should navigate to the first not disabled radio when pressing tab key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const secondRadio = page.locator('#radio-2');\n\n // When\n await page.keyboard.press('Tab');\n\n // Then\n await expect(secondRadio).toBeFocused();\n });\n\n test('should not make unselected radios focusable when a radio is clicked', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const input = page.locator('wcs-input');\n const radio3 = page.locator('#radio-3');\n\n // When\n await radio3.click();\n await input.focus();\n\n // Then\n await page.keyboard.press('Tab');\n await expect(radio3).toBeFocused();\n });\n\n test('should checked the first radio when pressing space key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const firstRadio = page.locator('#radio-1');\n await page.keyboard.press('Tab');\n\n // When\n await page.keyboard.press('Space');\n\n // Then\n await expect(firstRadio).toBeFocused(); // Ensure focus is on the first radio\n await expect(firstRadio).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should navigate to the checked radio when pressing tab key', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-input></wcs-input>\n <wcs-radio-group value=\"3\">\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstTabbableItem = page.locator('wcs-input');\n await firstTabbableItem.focus();\n const thirdRadio = page.locator('#radio-3');\n\n // When\n await page.keyboard.press('Tab');\n\n // Then\n await expect(thirdRadio).toBeFocused();\n });\n\n test.describe('When pressing arrow down key', () => {\n test('should checked the next radio not disabled when we are on the first radio and next radio is here', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio disabled id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstRadio = page.locator('#radio-1');\n await firstRadio.focus();\n const thirdRadio = page.locator('#radio-3');\n\n // When\n await page.keyboard.press('ArrowDown');\n\n // Then\n await expect(thirdRadio).toBeFocused(); // Ensure focus is on the third radio\n await expect(thirdRadio).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should checked the first not disabled radio when we are on the last radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio disabled id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const lastRadio = page.locator('#radio-3');\n // Click to select, then focus explicitly for WebKit compatibility\n await lastRadio.click();\n await lastRadio.focus();\n await expect(lastRadio).toBeFocused();\n const secondRadio = page.locator('#radio-2');\n const secondRadioNativeInputInput = page.locator('#radio-2');\n\n // When\n await page.keyboard.press('ArrowDown');\n\n // Then\n await expect(secondRadio).toBeFocused(); // Ensure focus is on the second radio\n await expect(secondRadioNativeInputInput).toHaveAttribute('aria-checked', 'true');\n });\n });\n\n test.describe('Events handling', () => {\n test('should fire wcsRadioClick when we click on an unchecked radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const radioClickSpy = await page.spyOnEvent('wcsRadioClick');\n\n const radio2 = page.locator('#radio-2');\n\n // When\n await radio2.click();\n await page.waitForChanges();\n\n // Then\n expect(radioClickSpy).toHaveReceivedEventTimes(1);\n });\n\n test('should keep only the last clicked radio checked in the same group', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const radio1 = page.locator('#radio-1');\n const radio2 = page.locator('#radio-2');\n\n // When\n await radio1.click();\n await page.waitForChanges();\n await radio2.click();\n await page.waitForChanges();\n\n // Then\n await expect(radio1).toHaveAttribute('aria-checked', 'false');\n await expect(radio2).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should fire wcsChange when we click or move to an unchecked radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const changeSpy = await page.spyOnEvent('wcsChange');\n\n const radio2 = page.locator('#radio-2');\n\n // When: Clicking on an unchecked radio\n await radio2.click();\n await page.waitForChanges();\n\n // Then\n expect(changeSpy).toHaveReceivedEventTimes(1);\n\n // When: Moving focus to another unchecked radio with keyboard\n await radio2.focus();\n await page.keyboard.press('ArrowDown'); // Move to the next radio\n await page.waitForChanges();\n\n // Then\n const radio3 = page.locator('#radio-3');\n await expect(radio3).toBeFocused(); // Ensure focus is on the third radio (next radio after radio2)\n expect(changeSpy).toHaveReceivedEventTimes(2);\n });\n\n test('should keep only the last keyboard-selected radio checked in the same group', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const radio1 = page.locator('#radio-1');\n const radio2 = page.locator('#radio-2');\n const radio3 = page.locator('#radio-3');\n\n // When\n await radio1.focus();\n await page.keyboard.press('Space');\n await page.waitForChanges();\n await page.keyboard.press('ArrowDown');\n await page.waitForChanges();\n\n // Then\n await expect(radio2).toBeFocused();\n await expect(radio1).toHaveAttribute('aria-checked', 'false');\n await expect(radio2).toHaveAttribute('aria-checked', 'true');\n await expect(radio3).toHaveAttribute('aria-checked', 'false');\n });\n\n test('should fire wcsBlur and wcsFocus from the radios', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const blurSpy = await page.spyOnEvent('wcsBlur');\n const focusSpy = await page.spyOnEvent('wcsFocus');\n\n const radio = page.locator('#radio-1');\n\n // When: Focusing on the first radio\n await radio.focus();\n await page.waitForChanges();\n\n // Then: Expect wcsFocus to be fired\n expect(focusSpy).toHaveReceivedEventTimes(1);\n\n // When: Moving to the next radio\n await page.keyboard.press('ArrowDown');\n await page.waitForChanges();\n\n // When: Moving focus to another radio\n await page.keyboard.press('Tab');\n\n // Then\n expect(blurSpy).toHaveReceivedEvent();\n expect(focusSpy).toHaveReceivedEventTimes(2);\n });\n });\n\n test.describe('When pressing arrow up key', () => {\n test('should checked the previous radio when we are on the last radio and previous radio is here', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const lastRadio = page.locator('#radio-3');\n await lastRadio.focus();\n\n // When\n await page.keyboard.press('ArrowUp');\n\n // Then\n const secondRadioInput = page.locator('#radio-2');\n await expect(secondRadioInput).toHaveAttribute('aria-checked', 'true');\n });\n\n test('should checked the last radio when we are on the first radio', async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <wcs-radio-group>\n <wcs-radio id=\"radio-1\" value=\"1\"></wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\"></wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\"></wcs-radio>\n </wcs-radio-group>\n `);\n\n const firstRadio = page.locator('#radio-1');\n await firstRadio.focus();\n\n // When\n await page.keyboard.press('ArrowUp');\n\n // Then\n const lastRadioInput = page.locator('#radio-3');\n await expect(lastRadioInput).toHaveAttribute('aria-checked', 'true');\n });\n });\n\n test.describe('Behavior in window with scroll', () => {\n [\n { mode: 'radio' },\n { mode: 'horizontal' },\n { mode: 'option' }\n ].forEach(({ mode }) => {\n test(`should preserve the window scroll position when clicking a radio inside a scrollable container - mode: ${mode}`, async ({ page }: { page: E2EPage }) => {\n // Given\n await setWcsContent(page, `\n <div id=\"scroll-container\" style=\"height: 100vh; overflow-y: auto;\">\n <div style=\"margin-top: 150vh;\">\n <wcs-radio-group mode=\"${mode}\">\n <wcs-radio id=\"radio-1\" value=\"1\">Radio 1</wcs-radio>\n <wcs-radio id=\"radio-2\" value=\"2\">Radio 2</wcs-radio>\n <wcs-radio id=\"radio-3\" value=\"3\">Radio 3</wcs-radio>\n </wcs-radio-group>\n </div>\n <div style=\"margin-top: 200vh;\">Other content</div>\n </div>\n `);\n const body = page.locator('body');\n const radio2 = page.locator('#radio-2');\n await radio2.scrollIntoViewIfNeeded();\n\n // When\n await radio2.click();\n\n // Then\n const scrollY = await body.evaluate(() => window.scrollY);\n expect(scrollY).toBe(0);\n });\n });\n });\n});\n"]}

package/dist/collection/components/radio-group/radio-group.js CHANGED Viewed

@@ -104,7 +104,7 @@ export class RadioGroup {
         }
     }
     render() {
-        return (h(Host, { key: '3179704d2f1ed56f940941c1777b90a49ecd0ffa', role: "radiogroup" }, h("slot", { key: 'f01213b0c89bc04622601447005e24df07fea376', name: "option", onSlotchange: this.onSlotChange.bind(this) })));
+        return (h(Host, { key: '9e945b3bd3935232dbfd859e6a53f49523d6f49b', role: "radiogroup" }, h("slot", { key: '7c6a9ae33e2dbc25c1c696ee2d9957cc882d5eba', name: "option", onSlotchange: this.onSlotChange.bind(this) })));
     }
     static get is() { return "wcs-radio-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/select-interface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-interface.js","sourceRoot":"","sources":["../../../src/components/select/select-interface.ts"],"names":[],"mappings":"~~AAYA~~;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAsB,CAAC,QAAQ,EAAE,MAAM,EAAW,EAAE;IACrF,OAAO,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;AAC/E,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,GAAG,CAAU,CAAC,CAAC,iGAAiG;AAIxJ,MAAM,UAAU,eAAe,CAAC,IAAY;IACxC,0EAA0E;IAC1E,OAAO,kBAAkB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC7C,CAAC","sourcesContent":["import { WcsSize } from \"../../shared-types\";\n\nexport interface SelectChangeEventDetail {\n value: any \| any[] \| undefined \| null;\n}\n\nexport interface SelectFilterChangeEventDetail {\n value: string \| number \| undefined \| null;\n}\n\nexport type WcsSelectFilterFn = (optionEl: HTMLWcsSelectOptionElement, filter: string) => boolean;\n\n/*\n Default filtering function. Compares the string start of wcs-select-option element's text content\n * with your filter input.\n * @param optionEl - wcs-select-option element\n * @param filter - input filter field value\n * @constructor\n */\nexport const WcsDefaultSelectFilterFn: WcsSelectFilterFn = (optionEl, filter): boolean => {\n return optionEl.textContent.toLowerCase().startsWith(filter.toLowerCase());\n}\n\nexport const WcsSelectSizeValue = ['m', 'l'] as const; // as const keyword is used to infer and preserve the exact literal values of an array or object.\n\nexport type WcsSelectSize = Extract<WcsSize, typeof WcsSelectSizeValue[number]>;\n\nexport function isWcsSelectSize(size: string): size is WcsSelectSize {\n // @ts-ignore : ignore size type, as it is checked with WcsInputSizeValues\n return WcsSelectSizeValue.includes(size);\n}\n"]}
1	+ {"version":3,"file":"select-interface.js","sourceRoot":"","sources":["../../../src/components/select/select-interface.ts"],"names":[],"mappings":"AAgBA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAsB,CAAC,QAAQ,EAAE,MAAM,EAAW,EAAE;IACrF,OAAO,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;AAC/E,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,GAAG,CAAU,CAAC,CAAC,iGAAiG;AAIxJ,MAAM,UAAU,eAAe,CAAC,IAAY;IACxC,0EAA0E;IAC1E,OAAO,kBAAkB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC7C,CAAC","sourcesContent":["import { WcsSize } from \"../../shared-types\";\n\nexport interface SelectChangeEventDetail {\n value: any \| any[] \| undefined \| null;\n /*\n Could be undefined if the wcs-select is in server mode, as the selected options are not rendered in the DOM\n /\n selectedOptions: HTMLWcsSelectOptionElement[] \| undefined;\n}\n\nexport interface SelectFilterChangeEventDetail {\n value: string \| number \| undefined \| null;\n}\n\nexport type WcsSelectFilterFn = (optionEl: HTMLWcsSelectOptionElement, filter: string) => boolean;\n\n/\n Default filtering function. Compares the string start of wcs-select-option element's text content\n * with your filter input.\n * @param optionEl - wcs-select-option element\n * @param filter - input filter field value\n * @constructor\n */\nexport const WcsDefaultSelectFilterFn: WcsSelectFilterFn = (optionEl, filter): boolean => {\n return optionEl.textContent.toLowerCase().startsWith(filter.toLowerCase());\n}\n\nexport const WcsSelectSizeValue = ['m', 'l'] as const; // as const keyword is used to infer and preserve the exact literal values of an array or object.\n\nexport type WcsSelectSize = Extract<WcsSize, typeof WcsSelectSizeValue[number]>;\n\nexport function isWcsSelectSize(size: string): size is WcsSelectSize {\n // @ts-ignore : ignore size type, as it is checked with WcsInputSizeValues\n return WcsSelectSizeValue.includes(size);\n}\n"]}

package/dist/collection/components/select/select.e2e.playwright.js CHANGED Viewed

@@ -106,7 +106,7 @@ test.describe('Select component', () => {
         await page.waitForChanges();
         // Then
         expect(changeSpy).toHaveReceivedEventTimes(1);
-        expect(changeSpy).toHaveReceivedEventDetail({ value: '1' });
+        expect(changeSpy.lastEvent.detail.value).toBe('1');
         // Vérifier le label dans le shadow DOM
         const label = select.locator('label').first();
         await expect(label).toHaveText('One');
@@ -242,7 +242,7 @@ test.describe('Select component', () => {
             await page.waitForChanges();
             // Then
             expect(changeSpy).toHaveReceivedEventTimes(2);
-            expect(changeSpy).toHaveNthReceivedEventDetail(1, { value: ['1', '2'] });
+            expect(changeSpy.events[1].detail.value).toEqual(['1', '2']);
         });
         test('Allows to unselect a value', async ({ page }) => {
             // Given
@@ -267,7 +267,7 @@ test.describe('Select component', () => {
             await page.waitForChanges();
             // Then
             expect(changeSpy).toHaveReceivedEventTimes(3);
-            expect(changeSpy).toHaveNthReceivedEventDetail(2, { value: ['2'] });
+            expect(changeSpy.events[2].detail.value).toEqual(['2']);
         });
         test('Displays all values separated by a comma', async ({ page }) => {
             // Given
@@ -321,7 +321,7 @@ test.describe('Select component', () => {
             await page.waitForChanges();
             // Then
             expect(changeSpy).toHaveReceivedEventTimes(2);
-            expect(changeSpy).toHaveNthReceivedEventDetail(1, { value: ['1', '2'] });
+            expect(changeSpy.events[1].detail.value).toEqual(['1', '2']);
         });
     });
     test.describe('Keyboard navigation when select is closed and not multiple', () => {
@@ -344,7 +344,7 @@ test.describe('Select component', () => {
             const label = select.locator('label').first();
             await expect(label).toHaveText('Option 2');
             expect(changeSpy).toHaveReceivedEventTimes(1);
-            expect(changeSpy).toHaveFirstReceivedEventDetail({ value: 'option2' });
+            expect(changeSpy.firstEvent.detail.value).toBe('option2');
         });
         test('select value of last option enabled on PageDown key pressed', async ({ page }) => {
             // Given
@@ -365,7 +365,7 @@ test.describe('Select component', () => {
             const label = select.locator('label').first();
             await expect(label).toHaveText('Option 3');
             expect(changeSpy).toHaveReceivedEventTimes(1);
-            expect(changeSpy).toHaveFirstReceivedEventDetail({ value: 'option3' });
+            expect(changeSpy.firstEvent.detail.value).toBe('option3');
         });
         test('select value of first option enabled on PageUp key pressed', async ({ page }) => {
             // Given
@@ -386,7 +386,7 @@ test.describe('Select component', () => {
             const label = select.locator('label').first();
             await expect(label).toHaveText('Option 2');
             expect(changeSpy).toHaveReceivedEventTimes(1);
-            expect(changeSpy).toHaveFirstReceivedEventDetail({ value: 'option2' });
+            expect(changeSpy.firstEvent.detail.value).toBe('option2');
         });
         test('open the overlay on Enter key press', async ({ page }) => {
             // Given
@@ -547,7 +547,7 @@ test.describe('Select component', () => {
             const label = select.locator('label').first();
             await expect(label).toHaveText('Option 2');
             expect(changeSpy).toHaveReceivedEventTimes(1);
-            expect(changeSpy).toHaveFirstReceivedEventDetail({ value: 'option2' });
+            expect(changeSpy.firstEvent.detail.value).toBe('option2');
         });
         test('move focus to next option on Down Arrow key down', async ({ page }) => {
             // Given
@@ -732,7 +732,7 @@ test.describe('Select component', () => {
         await page.waitForChanges();
         // Then
         expect(changeSpy).toHaveReceivedEventTimes(1);
-        expect(changeSpy).toHaveFirstReceivedEventDetail({ value: '1' });
+        expect(changeSpy.firstEvent.detail.value).toBe('1');
     });
     test.describe('Focus management', () => {
         test('after selection, focus is on the correct element', async ({ page }) => {