diff --git a/__snapshots__/input/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 4be05a3dd30..2f04a8c36ae 100644
--- a/__snapshots__/input/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: db" / " Label
   - textbox "Label"
diff --git a/__snapshots__/input/showcase/chromium/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/chromium/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 4be05a3dd30..2f04a8c36ae 100644
--- a/__snapshots__/input/showcase/chromium/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/chromium/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: db" / " Label
   - textbox "Label"
diff --git a/__snapshots__/input/showcase/firefox/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/firefox/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 2e883b9a98f..36d9b392c9c 100644
--- a/__snapshots__/input/showcase/firefox/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/firefox/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: Label
   - textbox "Label"
diff --git a/__snapshots__/input/showcase/mobile-chrome/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/mobile-chrome/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 4be05a3dd30..2f04a8c36ae 100644
--- a/__snapshots__/input/showcase/mobile-chrome/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/mobile-chrome/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: db" / " Label
   - textbox "Label"
diff --git a/__snapshots__/input/showcase/mobile-safari/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/mobile-safari/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 4be05a3dd30..2f04a8c36ae 100644
--- a/__snapshots__/input/showcase/mobile-safari/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/mobile-safari/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: db" / " Label
   - textbox "Label"
diff --git a/__snapshots__/input/showcase/webkit/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml b/__snapshots__/input/showcase/webkit/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
index 4be05a3dd30..2f04a8c36ae 100644
--- a/__snapshots__/input/showcase/webkit/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/input/showcase/webkit/should-have-same-aria-snapshot/DBInput-should-have-same-aria-snapshot.yaml
@@ -59,7 +59,7 @@
   - textbox "Label": (Default) Text
   - status
   - text: Number
-  - spinbutton "Number": 123456
+  - spinbutton "Number": "123456"
   - status
   - text: db" / " Label
   - textbox "Label"
diff --git a/__snapshots__/tab-item/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index cf8083ec8da..da17eec927d 100644
--- a/__snapshots__/tab-item/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,50 +2,50 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Text - Icon (Leading)": on
+    - tab "db\" / \" Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing) db\" / \"": on
+    - tab "Text - Icon (Trailing) db\" / \"": "on"
     - text: Text - Icon (Trailing) db" / "
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Icon": on
+    - tab "db\" / \" Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tab-item/showcase/chromium/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/chromium/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index cf8083ec8da..da17eec927d 100644
--- a/__snapshots__/tab-item/showcase/chromium/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/chromium/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,50 +2,50 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Text - Icon (Leading)": on
+    - tab "db\" / \" Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing) db\" / \"": on
+    - tab "Text - Icon (Trailing) db\" / \"": "on"
     - text: Text - Icon (Trailing) db" / "
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Icon": on
+    - tab "db\" / \" Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tab-item/showcase/firefox/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/firefox/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index f4cc1ceff38..504a96f4922 100644
--- a/__snapshots__/tab-item/showcase/firefox/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/firefox/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,48 +2,48 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
-    - tab "Text - Icon (Leading)": on
+    - tab "Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing)": on
+    - tab "Text - Icon (Trailing)": "on"
     - text: Text - Icon (Trailing)
   - tablist:
-    - tab "Icon": on
+    - tab "Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tab-item/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index cf8083ec8da..da17eec927d 100644
--- a/__snapshots__/tab-item/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,50 +2,50 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Text - Icon (Leading)": on
+    - tab "db\" / \" Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing) db\" / \"": on
+    - tab "Text - Icon (Trailing) db\" / \"": "on"
     - text: Text - Icon (Trailing) db" / "
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Icon": on
+    - tab "db\" / \" Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tab-item/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index cf8083ec8da..da17eec927d 100644
--- a/__snapshots__/tab-item/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,50 +2,50 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Text - Icon (Leading)": on
+    - tab "db\" / \" Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing) db\" / \"": on
+    - tab "Text - Icon (Trailing) db\" / \"": "on"
     - text: Text - Icon (Trailing) db" / "
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Icon": on
+    - tab "db\" / \" Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tab-item/showcase/webkit/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml b/__snapshots__/tab-item/showcase/webkit/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
index cf8083ec8da..da17eec927d 100644
--- a/__snapshots__/tab-item/showcase/webkit/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tab-item/showcase/webkit/should-have-same-aria-snapshot/DBTabItem-should-have-same-aria-snapshot.yaml
@@ -2,50 +2,50 @@
   - heading "DBTabItem" [level=1]
   - link "Density arrow_up_right\" / \""
   - tablist:
-    - tab "Functional": on
+    - tab "Functional": "on"
     - text: Functional
   - tablist:
-    - tab "(Default) Regular": on
+    - tab "(Default) Regular": "on"
     - text: (Default) Regular
   - tablist:
-    - tab "Expressive": on
+    - tab "Expressive": "on"
     - text: Expressive
   - link "States arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Enabled": on
+    - tab "(Default) Enabled": "on"
     - text: (Default) Enabled
   - tablist:
-    - tab "active" [selected]: on
+    - tab "active" [selected]: "on"
     - text: active
   - tablist:
-    - tab "disabled" [disabled]: on
+    - tab "disabled" [disabled]: "on"
     - text: disabled
   - link "Content arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Text": on
+    - tab "(Default) Text": "on"
     - text: (Default) Text
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Text - Icon (Leading)": on
+    - tab "db\" / \" Text - Icon (Leading)": "on"
     - text: Text - Icon (Leading)
   - tablist:
-    - tab "Text - Icon (Trailing) db\" / \"": on
+    - tab "Text - Icon (Trailing) db\" / \"": "on"
     - text: Text - Icon (Trailing) db" / "
   - tablist:
     - text: db" / "
-    - tab "db\" / \" Icon": on
+    - tab "db\" / \" Icon": "on"
     - text: Icon
   - link "Behaviour arrow_up_right\" / \""
   - tablist:
-    - tab "(Default) Auto Width": on
+    - tab "(Default) Auto Width": "on"
     - text: (Default) Auto Width
   - tablist:
-    - tab "Width full": on
+    - tab "Width full": "on"
     - text: Width full
   - link "Content Alignment Full Width arrow_up_right\" / \""
   - tablist:
-    - tab "Left": on
+    - tab "Left": "on"
     - text: Left
   - tablist:
-    - tab "Centered": on
+    - tab "Centered": "on"
     - text: Centered
\ No newline at end of file
diff --git a/__snapshots__/tabs/component/chromium/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/component/chromium/DBTabs-should-have-same-aria-snapshot.yaml
index a4bad058920..cf799d3ff4e 100644
--- a/__snapshots__/tabs/component/chromium/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/component/chromium/DBTabs-should-have-same-aria-snapshot.yaml
@@ -1,8 +1,8 @@
 - tablist:
-  - tab "Test 1" [selected]: on
+  - tab "Test 1" [selected]: "on"
   - text: Test 1
-  - tab "Test 2": on
+  - tab "Test 2": "on"
   - text: Test 2
-  - tab "Test 3": on
+  - tab "Test 3": "on"
   - text: Test 3
 - tabpanel "Test 1": TestPanel 1
\ No newline at end of file
diff --git a/__snapshots__/tabs/component/firefox/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/component/firefox/DBTabs-should-have-same-aria-snapshot.yaml
index a4bad058920..cf799d3ff4e 100644
--- a/__snapshots__/tabs/component/firefox/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/component/firefox/DBTabs-should-have-same-aria-snapshot.yaml
@@ -1,8 +1,8 @@
 - tablist:
-  - tab "Test 1" [selected]: on
+  - tab "Test 1" [selected]: "on"
   - text: Test 1
-  - tab "Test 2": on
+  - tab "Test 2": "on"
   - text: Test 2
-  - tab "Test 3": on
+  - tab "Test 3": "on"
   - text: Test 3
 - tabpanel "Test 1": TestPanel 1
\ No newline at end of file
diff --git a/__snapshots__/tabs/component/mobile-chrome/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/component/mobile-chrome/DBTabs-should-have-same-aria-snapshot.yaml
index a4bad058920..cf799d3ff4e 100644
--- a/__snapshots__/tabs/component/mobile-chrome/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/component/mobile-chrome/DBTabs-should-have-same-aria-snapshot.yaml
@@ -1,8 +1,8 @@
 - tablist:
-  - tab "Test 1" [selected]: on
+  - tab "Test 1" [selected]: "on"
   - text: Test 1
-  - tab "Test 2": on
+  - tab "Test 2": "on"
   - text: Test 2
-  - tab "Test 3": on
+  - tab "Test 3": "on"
   - text: Test 3
 - tabpanel "Test 1": TestPanel 1
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 34e7d6bd18e..012626ac5ee 100644
--- a/__snapshots__/tabs/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "chevron_right\" / \" Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/chromium/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/chromium/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 34e7d6bd18e..012626ac5ee 100644
--- a/__snapshots__/tabs/showcase/chromium/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/chromium/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "chevron_right\" / \" Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/firefox/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/firefox/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 750ceb2c2af..86c33f57f14 100644
--- a/__snapshots__/tabs/showcase/firefox/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/firefox/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 34e7d6bd18e..012626ac5ee 100644
--- a/__snapshots__/tabs/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "chevron_right\" / \" Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 34e7d6bd18e..012626ac5ee 100644
--- a/__snapshots__/tabs/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/mobile-safari/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "chevron_right\" / \" Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tabs/showcase/webkit/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml b/__snapshots__/tabs/showcase/webkit/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
index 34e7d6bd18e..012626ac5ee 100644
--- a/__snapshots__/tabs/showcase/webkit/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tabs/showcase/webkit/should-have-same-aria-snapshot/DBTabs-should-have-same-aria-snapshot.yaml
@@ -3,130 +3,130 @@
   - link "Density arrow_up_right\" / \""
   - text: "Functional:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "(Default) Regular:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "Expressive:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Orientation arrow_up_right\" / \""
   - text: "horizontal:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "vertical:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Width arrow_up_right\" / \""
   - text: "auto:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: start:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "full - alignment: center:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - link "Overflow arrow_up_right\" / \""
   - text: "no overflow:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: arrows:"
   - button "chevron_right\" / \" Scroll right"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - text: "with overflow - behaviour: scrollbar:"
   - tablist:
-    - tab "Test 1" [selected]: on
+    - tab "Test 1" [selected]: "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
-    - tab "Test 4": on
+    - tab "Test 4": "on"
     - text: Test 4
-    - tab "Test 5": on
+    - tab "Test 5": "on"
     - text: Test 5
   - tabpanel "Test 1": Tab Panel 1
   - link "Examples arrow_up_right\" / \""
   - text: "2 tab selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2" [selected]: on
+    - tab "Test 2" [selected]: "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
   - tabpanel "Test 2": Tab Panel 2
   - text: "nothing selected:"
   - tablist:
-    - tab "Test 1": on
+    - tab "Test 1": "on"
     - text: Test 1
-    - tab "Test 2": on
+    - tab "Test 2": "on"
     - text: Test 2
-    - tab "Test 3": on
+    - tab "Test 3": "on"
     - text: Test 3
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e688cb0bcf..77a3f0cec30 100644
--- a/__snapshots__/tag/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/chromium-highContrast/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "cross\" / \" Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text person" / " Icon person" / " Icon & Text
@@ -37,9 +37,9 @@
     - text: person" / "
     - link "Interactive Strong Link with Icon"
     - text: person" / "
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon person" / "
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon person" / "
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/chromium/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/chromium/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e688cb0bcf..77a3f0cec30 100644
--- a/__snapshots__/tag/showcase/chromium/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/chromium/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "cross\" / \" Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text person" / " Icon person" / " Icon & Text
@@ -37,9 +37,9 @@
     - text: person" / "
     - link "Interactive Strong Link with Icon"
     - text: person" / "
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon person" / "
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon person" / "
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/firefox/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/firefox/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e9397b490a..70745b065ba 100644
--- a/__snapshots__/tag/showcase/firefox/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/firefox/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text Icon Icon & Text
@@ -34,9 +34,9 @@
   - group "Example":
     - button "Interactive Strong Button with Icon"
     - link "Interactive Strong Link with Icon"
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e688cb0bcf..77a3f0cec30 100644
--- a/__snapshots__/tag/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/mobile-chrome/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "cross\" / \" Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text person" / " Icon person" / " Icon & Text
@@ -37,9 +37,9 @@
     - text: person" / "
     - link "Interactive Strong Link with Icon"
     - text: person" / "
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon person" / "
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon person" / "
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/mobile-safari/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/mobile-safari/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e688cb0bcf..77a3f0cec30 100644
--- a/__snapshots__/tag/showcase/mobile-safari/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/mobile-safari/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "cross\" / \" Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text person" / " Icon person" / " Icon & Text
@@ -37,9 +37,9 @@
     - text: person" / "
     - link "Interactive Strong Link with Icon"
     - text: person" / "
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon person" / "
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon person" / "
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/__snapshots__/tag/showcase/webkit/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml b/__snapshots__/tag/showcase/webkit/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
index 4e688cb0bcf..77a3f0cec30 100644
--- a/__snapshots__/tag/showcase/webkit/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
+++ b/__snapshots__/tag/showcase/webkit/should-have-same-aria-snapshot/DBTag-should-have-same-aria-snapshot.yaml
@@ -11,20 +11,20 @@
     - text: (Default) Static
     - button "Interactive Button"
     - link "Interactive Link"
-    - checkbox "Interactive Checkbox": on
+    - checkbox "Interactive Checkbox": "on"
     - text: Interactive Checkbox
-    - radio "Interactive Radio 1": on
+    - radio "Interactive Radio 1": "on"
     - text: Interactive Radio 1
-    - radio "Interactive Radio 2": on
+    - radio "Interactive Radio 2": "on"
     - text: Interactive Radio 2 Removeable
     - button "cross\" / \" Remove tag"
   - link "State arrow_up_right\" / \""
   - group "State":
-    - checkbox "(Default) Unchecked": on
+    - checkbox "(Default) Unchecked": "on"
     - text: (Default) Unchecked
-    - checkbox "Checked" [checked]: on
+    - checkbox "Checked" [checked]: "on"
     - text: Checked
-    - checkbox "Disabled" [checked] [disabled]: on
+    - checkbox "Disabled" [checked] [disabled]: "on"
     - text: Disabled
   - link "Content arrow_up_right\" / \""
   - text: (Default) Text person" / " Icon person" / " Icon & Text
@@ -37,9 +37,9 @@
     - text: person" / "
     - link "Interactive Strong Link with Icon"
     - text: person" / "
-    - checkbox "Interactive Strong Checkbox with Icon": on
+    - checkbox "Interactive Strong Checkbox with Icon": "on"
     - text: Interactive Strong Checkbox with Icon person" / "
-    - radio "Interactive Strong Radio 1 with Icon": on
+    - radio "Interactive Strong Radio 1 with Icon": "on"
     - text: Interactive Strong Radio 1 with Icon person" / "
-    - radio "Interactive Strong Radio 2 with Icon": on
+    - radio "Interactive Strong Radio 2 with Icon": "on"
     - text: Interactive Strong Radio 2 with Icon
\ No newline at end of file
diff --git a/e2e/package.json b/e2e/package.json
index dd275e15160..086fa7133ad 100644
--- a/e2e/package.json
+++ b/e2e/package.json
@@ -23,7 +23,7 @@
     "test:vue-showcase": "npm run test:e2e --workspace=vue-showcase"
   },
   "devDependencies": {
-    "@playwright/test": "1.49.0",
+    "@playwright/test": "1.49.1",
     "cpr": "3.0.1",
     "cross-env": "^7.0.3",
     "dotenv": "^16.4.7",
diff --git a/output/react/package.json b/output/react/package.json
index 0a8cafb120c..fcccbe5c239 100644
--- a/output/react/package.json
+++ b/output/react/package.json
@@ -26,7 +26,7 @@
     "tsc": "tsc -p . --sourceMap false"
   },
   "devDependencies": {
-    "@playwright/experimental-ct-react": "1.49.0",
+    "@playwright/experimental-ct-react": "1.49.1",
     "@types/react": "^18.3.13",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
diff --git a/output/vue/package.json b/output/vue/package.json
index 3536c49dceb..b486c9e96b3 100644
--- a/output/vue/package.json
+++ b/output/vue/package.json
@@ -38,7 +38,7 @@
     "test:components": "playwright test -c playwright.config.ts"
   },
   "devDependencies": {
-    "@playwright/experimental-ct-vue": "1.49.0",
+    "@playwright/experimental-ct-vue": "1.49.1",
     "@vitejs/plugin-vue": "^5.2.0",
     "replace-in-file": "^8.2.0",
     "tsx": "^4.19.2",
diff --git a/package-lock.json b/package-lock.json
index 8e33360bbf6..eddc6b5db51 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -24,7 +24,7 @@
         "@guidepup/guidepup": "0.24.0",
         "@guidepup/playwright": "^0.14.2",
         "@guidepup/record": "^0.1.0",
-        "@playwright/test": "1.49.0",
+        "@playwright/test": "1.49.1",
         "@types/fs-extra": "^11.0.4",
         "accessibility-checker": "^3.1.78",
         "adm-zip": "0.5.16",
@@ -73,7 +73,7 @@
         "output/*"
       ],
       "devDependencies": {
-        "@playwright/test": "1.49.0",
+        "@playwright/test": "1.49.1",
         "cpr": "3.0.1",
         "cross-env": "^7.0.3",
         "dotenv": "^16.4.7",
@@ -9601,13 +9601,13 @@
       }
     },
     "node_modules/@playwright/experimental-ct-core": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-core/-/experimental-ct-core-1.49.0.tgz",
-      "integrity": "sha512-Tl/JekIQOyHIctFvzmHaSB8SuBTbOYcIdrb5HMwMc70i86XbPnQfDp65zgzAuvUiDN1u1k+aIpygJ8ZqnRYgVw==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-core/-/experimental-ct-core-1.49.1.tgz",
+      "integrity": "sha512-MZ0by8hLo/2qGHoo3SSbdxTNwKXrw06rqqA64TEiwOBjzpbYAaCuA3+BemXpMFfa0nU6ivO4h/sFdA8Zv9ns+g==",
       "dev": true,
       "dependencies": {
-        "playwright": "1.49.0",
-        "playwright-core": "1.49.0",
+        "playwright": "1.49.1",
+        "playwright-core": "1.49.1",
         "vite": "^5.2.8"
       },
       "engines": {
@@ -9622,7 +9622,6 @@
         "ppc64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "aix"
@@ -9639,7 +9638,6 @@
         "arm"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "android"
@@ -9656,7 +9654,6 @@
         "arm64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "android"
@@ -9673,7 +9670,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "android"
@@ -9690,7 +9686,6 @@
         "arm64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -9707,7 +9702,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -9724,7 +9718,6 @@
         "arm64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "freebsd"
@@ -9741,7 +9734,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "freebsd"
@@ -9758,7 +9750,6 @@
         "arm"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9775,7 +9766,6 @@
         "arm64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9792,7 +9782,6 @@
         "ia32"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9809,7 +9798,6 @@
         "loong64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9826,7 +9814,6 @@
         "mips64el"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9843,7 +9830,6 @@
         "ppc64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9860,7 +9846,6 @@
         "riscv64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9877,7 +9862,6 @@
         "s390x"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9894,7 +9878,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
@@ -9911,7 +9894,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "netbsd"
@@ -9928,7 +9910,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "openbsd"
@@ -9945,7 +9926,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "sunos"
@@ -9962,7 +9942,6 @@
         "arm64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -9979,7 +9958,6 @@
         "ia32"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -9996,7 +9974,6 @@
         "x64"
       ],
       "dev": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
@@ -10011,7 +9988,6 @@
       "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "MIT",
       "bin": {
         "esbuild": "bin/esbuild"
       },
@@ -10050,7 +10026,6 @@
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -10064,7 +10039,6 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.11.tgz",
       "integrity": "sha512-c7jFQRklXua0mTzneGW9QVyxFjUgwcihC4bXEtujIo2ouWCe1Ajt/amn2PCxYnhYfd5k09JX3SB7OYWFKYqj8Q==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "esbuild": "^0.21.3",
         "postcss": "^8.4.43",
@@ -10120,12 +10094,12 @@
       }
     },
     "node_modules/@playwright/experimental-ct-react": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-react/-/experimental-ct-react-1.49.0.tgz",
-      "integrity": "sha512-zkCKItOwMHJsyqXagYmpv/iVCjnjpT+NWvLS8HFec1HuU28kI3AhzcIhKJvZbQLiJV+fL99wFhcJnOjHZm5VAA==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-react/-/experimental-ct-react-1.49.1.tgz",
+      "integrity": "sha512-kQTSzVkFd05x1kY8Q/XaF3xg3dd3AH31976N0zCVVQ3pw/qpa3jtdjoj7/30eblU5eVlg0ELMV7pjL5lUjJzzw==",
       "dev": true,
       "dependencies": {
-        "@playwright/experimental-ct-core": "1.49.0",
+        "@playwright/experimental-ct-core": "1.49.1",
         "@vitejs/plugin-react": "^4.2.1"
       },
       "bin": {
@@ -10136,12 +10110,12 @@
       }
     },
     "node_modules/@playwright/experimental-ct-vue": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-vue/-/experimental-ct-vue-1.49.0.tgz",
-      "integrity": "sha512-tbyk7YU1IQYTb/p0ZEdF6u/ffOVCYC4Y04vX1pVvHvfbB8OkbUmxhd4bFW+Iu7pcMO4Zkz4G4qiiTKU1+qU6AA==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/@playwright/experimental-ct-vue/-/experimental-ct-vue-1.49.1.tgz",
+      "integrity": "sha512-JkmzslZ0JrOWszf8SF4DslhRj1bKS0LRCGfDGKYQQAZ7y9eIJzqUAZJKO+Nxs80rWRkM4UU1FZ3jaJ/dp2tswA==",
       "dev": true,
       "dependencies": {
-        "@playwright/experimental-ct-core": "1.49.0",
+        "@playwright/experimental-ct-core": "1.49.1",
         "@vitejs/plugin-vue": "^4.2.1"
       },
       "bin": {
@@ -10696,12 +10670,12 @@
       }
     },
     "node_modules/@playwright/test": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.49.0.tgz",
-      "integrity": "sha512-DMulbwQURa8rNIQrf94+jPJQ4FmOVdpE5ZppRNvWVjvhC+6sOeo28r8MgIpQRYouXRtt/FCCXU7zn20jnHR4Qw==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.49.1.tgz",
+      "integrity": "sha512-Ky+BVzPz8pL6PQxHqNRW1k3mIyv933LML7HktS8uik0bUXNCdPhoS/kLihiO1tMf/egaJb4IutXd7UywvXEW+g==",
       "devOptional": true,
       "dependencies": {
-        "playwright": "1.49.0"
+        "playwright": "1.49.1"
       },
       "bin": {
         "playwright": "cli.js"
@@ -30688,12 +30662,12 @@
       }
     },
     "node_modules/playwright": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.49.0.tgz",
-      "integrity": "sha512-eKpmys0UFDnfNb3vfsf8Vx2LEOtflgRebl0Im2eQQnYMA4Aqd+Zw8bEOB+7ZKvN76901mRnqdsiOGKxzVTbi7A==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.49.1.tgz",
+      "integrity": "sha512-VYL8zLoNTBxVOrJBbDuRgDWa3i+mfQgDTrL8Ah9QXZ7ax4Dsj0MSq5bYgytRnDVVe+njoKnfsYkH3HzqVj5UZA==",
       "devOptional": true,
       "dependencies": {
-        "playwright-core": "1.49.0"
+        "playwright-core": "1.49.1"
       },
       "bin": {
         "playwright": "cli.js"
@@ -30706,9 +30680,9 @@
       }
     },
     "node_modules/playwright-core": {
-      "version": "1.49.0",
-      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.49.0.tgz",
-      "integrity": "sha512-R+3KKTQF3npy5GTiKH/T+kdhoJfJojjHESR1YEWhYuEKRVfVaxH3+4+GvXE5xyCngCxhxnykk0Vlah9v8fs3jA==",
+      "version": "1.49.1",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.49.1.tgz",
+      "integrity": "sha512-BzmpVcs4kE2CH15rWfzpjzVGhWERJfmnXmniSyKeRZUs9Ws65m+RGIi7mjJK/euCegfn3i7jvqWeWyHe9y3Vgg==",
       "devOptional": true,
       "bin": {
         "playwright-core": "cli.js"
@@ -40992,7 +40966,7 @@
       "version": "0.0.0",
       "license": "Apache-2.0",
       "devDependencies": {
-        "@playwright/experimental-ct-react": "1.49.0",
+        "@playwright/experimental-ct-react": "1.49.1",
         "@types/react": "^18.3.13",
         "react": "^18.3.1",
         "react-dom": "^18.3.1"
@@ -41016,7 +40990,7 @@
       "version": "0.0.0",
       "license": "Apache-2.0",
       "devDependencies": {
-        "@playwright/experimental-ct-vue": "1.49.0",
+        "@playwright/experimental-ct-vue": "1.49.1",
         "@vitejs/plugin-vue": "^5.2.0",
         "replace-in-file": "^8.2.0",
         "tsx": "^4.19.2",
diff --git a/package.json b/package.json
index 7df03fdbbdc..9be9055f5dd 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,7 @@
     "@guidepup/guidepup": "0.24.0",
     "@guidepup/playwright": "^0.14.2",
     "@guidepup/record": "^0.1.0",
-    "@playwright/test": "1.49.0",
+    "@playwright/test": "1.49.1",
     "@types/fs-extra": "^11.0.4",
     "accessibility-checker": "^3.1.78",
     "adm-zip": "0.5.16",
diff --git a/packages/components/src/components/checkbox/checkbox.spec.tsx b/packages/components/src/components/checkbox/checkbox.spec.tsx
index c0c1993293c..4ed1db11dc2 100644
--- a/packages/components/src/components/checkbox/checkbox.spec.tsx
+++ b/packages/components/src/components/checkbox/checkbox.spec.tsx
@@ -23,7 +23,7 @@ const testA11y = () => {
 		const component = await mount(comp);
 		const snapshot = await component.ariaSnapshot();
 		// Some wired issue with react and playwright ariaSnapshot in this case
-		const playwrightReactIssueFix = snapshot.replace(': on', '');
+		const playwrightReactIssueFix = snapshot.replace(': "on"', '');
 		expect(playwrightReactIssueFix).toMatchSnapshot(
 			`${testInfo.testId}.yaml`
 		);
diff --git a/packages/components/src/components/radio/radio.spec.tsx b/packages/components/src/components/radio/radio.spec.tsx
index 54ad437ec68..073a8e5e6e9 100644
--- a/packages/components/src/components/radio/radio.spec.tsx
+++ b/packages/components/src/components/radio/radio.spec.tsx
@@ -23,7 +23,7 @@ const testA11y = () => {
 		const component = await mount(comp);
 		const snapshot = await component.ariaSnapshot();
 		// Some wired issue with react and playwright ariaSnapshot in this case
-		const playwrightReactIssueFix = snapshot.replace(': on', '');
+		const playwrightReactIssueFix = snapshot.replace(': "on"', '');
 		expect(playwrightReactIssueFix).toMatchSnapshot(
 			`${testInfo.testId}.yaml`
 		);