Cleanup code and tests

tests/storybook/Checkbox.storybook.test.js

@@ -81,7 +81,7 @@ test.describe("Checkbox Storybook Tests", () => {
     await expect(page.locator('[data-testid="control-mode"]')).toBeVisible();
     await expect(page.locator('[data-testid="control-state"]')).toBeVisible();
     await expect(
-      page.locator('[data-testid="control-disabled"]')
+      page.locator('[data-testid="control-disabled"]'),
     ).toBeVisible();
     await expect(page.locator('[data-testid="control-label"]')).toBeVisible();
   });

tests/storybook/RadioButton.storybook.test.js

@@ -3,7 +3,7 @@ import { test, expect } from "@playwright/test";
 test.describe("RadioButton Storybook Tests", () => {
   test.beforeEach(async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiobutton--default"
+      "http://localhost:6006/iframe.html?id=forms-radiobutton--default",
     );
   });
 
@@ -15,7 +15,7 @@ test.describe("RadioButton Storybook Tests", () => {
 
   test("renders checked story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiobutton--checked"
+      "http://localhost:6006/iframe.html?id=forms-radiobutton--checked",
     );
 
     const radioButton = page.locator('[role="radio"]');
@@ -25,7 +25,7 @@ test.describe("RadioButton Storybook Tests", () => {
 
   test("renders standard story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiobutton--standard"
+      "http://localhost:6006/iframe.html?id=forms-radiobutton--standard",
     );
 
     const radioButtons = page.locator('[role="radio"]');
@@ -39,7 +39,7 @@ test.describe("RadioButton Storybook Tests", () => {
 
   test("renders inverse story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiobutton--inverse"
+      "http://localhost:6006/iframe.html?id=forms-radiobutton--inverse",
     );
 
     const radioButtons = page.locator('[role="radio"]');
@@ -66,12 +66,12 @@ test.describe("RadioButton Storybook Tests", () => {
     await page.selectOption('[data-testid="mode-control"]', "inverse");
     const radioButton = page.locator('[role="radio"]');
     await expect(radioButton).toHaveClass(
-      /outline-\[var\(--color-border-inverse-primary\)\]/
+      /outline-\[var\(--color-border-inverse-primary\)\]/,
     );
 
     await page.selectOption('[data-testid="mode-control"]', "standard");
     await expect(radioButton).toHaveClass(
-      /outline-\[var\(--color-border-default-tertiary\)\]/
+      /outline-\[var\(--color-border-default-tertiary\)\]/,
     );
   });
 
@@ -156,13 +156,13 @@ test.describe("RadioButton Storybook Tests", () => {
     await page.selectOption('[data-testid="mode-control"]', "standard");
     const radioButton = page.locator('[role="radio"]');
     await expect(radioButton).toHaveClass(
-      /outline-\[var\(--color-border-default-tertiary\)\]/
+      /outline-\[var\(--color-border-default-tertiary\)\]/,
     );
 
     // Test inverse mode
     await page.selectOption('[data-testid="mode-control"]', "inverse");
     await expect(radioButton).toHaveClass(
-      /outline-\[var\(--color-border-inverse-primary\)\]/
+      /outline-\[var\(--color-border-inverse-primary\)\]/,
     );
   });
 

tests/storybook/RadioGroup.interactions.test.js

@@ -173,7 +173,7 @@ export const FormIntegration = {
 
     // All should have the same name
     const names = await Promise.all(
-      hiddenInputs.map((input) => input.getAttribute("name"))
+      hiddenInputs.map((input) => input.getAttribute("name")),
     );
     expect(names.every((name) => name === names[0])).toBe(true);
 

tests/storybook/RadioGroup.storybook.test.js

@@ -3,7 +3,7 @@ import { test, expect } from "@playwright/test";
 test.describe("RadioGroup Storybook Tests", () => {
   test.beforeEach(async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiogroup--default"
+      "http://localhost:6006/iframe.html?id=forms-radiogroup--default",
     );
   });
 
@@ -17,7 +17,7 @@ test.describe("RadioGroup Storybook Tests", () => {
 
   test("renders standard story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiogroup--standard"
+      "http://localhost:6006/iframe.html?id=forms-radiogroup--standard",
     );
 
     const radioGroup = page.locator('[role="radiogroup"]');
@@ -32,7 +32,7 @@ test.describe("RadioGroup Storybook Tests", () => {
 
   test("renders inverse story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiogroup--inverse"
+      "http://localhost:6006/iframe.html?id=forms-radiogroup--inverse",
     );
 
     const radioGroup = page.locator('[role="radiogroup"]');
@@ -47,7 +47,7 @@ test.describe("RadioGroup Storybook Tests", () => {
 
   test("renders interactive story", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiogroup--interactive"
+      "http://localhost:6006/iframe.html?id=forms-radiogroup--interactive",
     );
 
     const radioGroup = page.locator('[role="radiogroup"]');
@@ -69,14 +69,14 @@ test.describe("RadioGroup Storybook Tests", () => {
     // All radio buttons should have inverse styling
     for (let i = 0; i < (await radioButtons.count()); i++) {
       await expect(radioButtons.nth(i)).toHaveClass(
-        /outline-\[var\(--color-border-inverse-primary\)\]/
+        /outline-\[var\(--color-border-inverse-primary\)\]/,
       );
     }
 
     await page.selectOption('[data-testid="mode-control"]', "standard");
     for (let i = 0; i < (await radioButtons.count()); i++) {
       await expect(radioButtons.nth(i)).toHaveClass(
-        /outline-\[var\(--color-border-default-tertiary\)\]/
+        /outline-\[var\(--color-border-default-tertiary\)\]/,
       );
     }
   });
@@ -180,7 +180,7 @@ test.describe("RadioGroup Storybook Tests", () => {
 
     // All should have the same name
     const names = await hiddenInputs.evaluateAll((inputs) =>
-      inputs.map((input) => input.getAttribute("name"))
+      inputs.map((input) => input.getAttribute("name")),
     );
     expect(names.every((name) => name === names[0])).toBe(true);
   });
@@ -193,7 +193,7 @@ test.describe("RadioGroup Storybook Tests", () => {
     await expect(firstDot).toHaveClass(
       /w-\[16px\]/,
       /h-\[16px\]/,
-      /rounded-full/
+      /rounded-full/,
     );
 
     // Click second option
@@ -204,13 +204,13 @@ test.describe("RadioGroup Storybook Tests", () => {
     await expect(secondDot).toHaveClass(
       /w-\[16px\]/,
       /h-\[16px\]/,
-      /rounded-full/
+      /rounded-full/,
     );
   });
 
   test("handles interactive story state changes", async ({ page }) => {
     await page.goto(
-      "http://localhost:6006/iframe.html?id=forms-radiogroup--interactive"
+      "http://localhost:6006/iframe.html?id=forms-radiogroup--interactive",
     );
 
     // Should show initial state