diff --git a/package.json b/package.json
index 1b6e22ef48..4b5456f4ec 100644
--- a/package.json
+++ b/package.json
@@ -68,10 +68,10 @@
         "postinstall": "patch-package"
     },
     "resolutions": {
-        "**/pretty-format/react-is": "19.1.1",
+        "**/pretty-format/react-is": "19.2.0",
         "@playwright/test": "1.56.0",
-        "@types/react": "19.1.14",
-        "@types/react-dom": "19.1.9",
+        "@types/react": "19.2.2",
+        "@types/react-dom": "19.2.1",
         "oidc-client-ts": "3.3.0",
         "jwt-decode": "4.0.0",
         "caniuse-lite": "1.0.30001750",
@@ -214,9 +214,9 @@
         "@types/node-fetch": "^2.6.2",
         "@types/pako": "^2.0.0",
         "@types/qrcode": "^1.3.5",
-        "@types/react": "19.1.14",
+        "@types/react": "19.2.2",
         "@types/react-beautiful-dnd": "^13.0.0",
-        "@types/react-dom": "19.1.9",
+        "@types/react-dom": "19.2.1",
         "@types/react-transition-group": "^4.4.0",
         "@types/sanitize-html": "2.16.0",
         "@types/sdp-transform": "^2.4.10",
diff --git a/packages/shared-components/src/audio/AudioPlayerView/__snapshots__/AudioPlayerView.test.tsx.snap b/packages/shared-components/src/audio/AudioPlayerView/__snapshots__/AudioPlayerView.test.tsx.snap
index 790ab16870..0687ea44a8 100644
--- a/packages/shared-components/src/audio/AudioPlayerView/__snapshots__/AudioPlayerView.test.tsx.snap
+++ b/packages/shared-components/src/audio/AudioPlayerView/__snapshots__/AudioPlayerView.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`AudioPlayerView renders the audio player in default state 1`] = `
       <button
         aria-disabled="false"
         aria-label="Play"
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8 button"
         data-kind="primary"
         role="button"
@@ -106,7 +106,7 @@ exports[`AudioPlayerView renders the audio player in error state 1`] = `
       <button
         aria-disabled="false"
         aria-label="Play"
-        aria-labelledby="«ri»"
+        aria-labelledby="_r_i_"
         class="_icon-button_1pz9o_8 button"
         data-kind="primary"
         role="button"
@@ -202,7 +202,7 @@ exports[`AudioPlayerView renders the audio player without media name 1`] = `
       <button
         aria-disabled="false"
         aria-label="Play"
-        aria-labelledby="«r6»"
+        aria-labelledby="_r_6_"
         class="_icon-button_1pz9o_8 button"
         data-kind="primary"
         role="button"
@@ -293,7 +293,7 @@ exports[`AudioPlayerView renders the audio player without size 1`] = `
       <button
         aria-disabled="false"
         aria-label="Play"
-        aria-labelledby="«rc»"
+        aria-labelledby="_r_c_"
         class="_icon-button_1pz9o_8 button"
         data-kind="primary"
         role="button"
diff --git a/packages/shared-components/src/audio/PlayPauseButton/__snapshots__/PlayPauseButton.test.tsx.snap b/packages/shared-components/src/audio/PlayPauseButton/__snapshots__/PlayPauseButton.test.tsx.snap
index 3c60aeae11..503b5ac498 100644
--- a/packages/shared-components/src/audio/PlayPauseButton/__snapshots__/PlayPauseButton.test.tsx.snap
+++ b/packages/shared-components/src/audio/PlayPauseButton/__snapshots__/PlayPauseButton.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`PlayPauseButton renders the button in default state 1`] = `
   <button
     aria-disabled="false"
     aria-label="Play"
-    aria-labelledby="«r0»"
+    aria-labelledby="_r_0_"
     class="_icon-button_1pz9o_8 button"
     data-kind="primary"
     role="button"
@@ -37,7 +37,7 @@ exports[`PlayPauseButton renders the button in playing state 1`] = `
   <button
     aria-disabled="false"
     aria-label="Pause"
-    aria-labelledby="«r6»"
+    aria-labelledby="_r_6_"
     class="_icon-button_1pz9o_8 button"
     data-kind="primary"
     role="button"
diff --git a/packages/shared-components/src/pill-input/Pill/__snapshots__/Pill.test.tsx.snap b/packages/shared-components/src/pill-input/Pill/__snapshots__/Pill.test.tsx.snap
index ce81390347..e467ec9ab7 100644
--- a/packages/shared-components/src/pill-input/Pill/__snapshots__/Pill.test.tsx.snap
+++ b/packages/shared-components/src/pill-input/Pill/__snapshots__/Pill.test.tsx.snap
@@ -11,12 +11,12 @@ exports[`Pill renders the pill 1`] = `
     />
     <span
       class="label"
-      id="«r0»"
+      id="_r_0_"
     >
       Pill
     </span>
     <button
-      aria-describedby="«r0»"
+      aria-describedby="_r_0_"
       aria-label="Delete"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
@@ -57,7 +57,7 @@ exports[`Pill renders the pill without close button 1`] = `
     />
     <span
       class="label"
-      id="«r1»"
+      id="_r_1_"
     >
       Pill
     </span>
diff --git a/packages/shared-components/src/rich-list/RichList/__snapshots__/RichList.test.tsx.snap b/packages/shared-components/src/rich-list/RichList/__snapshots__/RichList.test.tsx.snap
index 818984a786..5569c63a9c 100644
--- a/packages/shared-components/src/rich-list/RichList/__snapshots__/RichList.test.tsx.snap
+++ b/packages/shared-components/src/rich-list/RichList/__snapshots__/RichList.test.tsx.snap
@@ -11,12 +11,12 @@ exports[`RichItem renders the list 1`] = `
     >
       <span
         class="title"
-        id="«r0»"
+        id="_r_0_"
       >
         Rich List Title
       </span>
       <ul
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="content"
         role="listbox"
         tabindex="0"
@@ -174,7 +174,7 @@ exports[`RichItem renders the list with isEmpty=true 1`] = `
     >
       <span
         class="title"
-        id="«r1»"
+        id="_r_1_"
       >
         Rich List Title
       </span>
diff --git a/test/unit-tests/components/structures/__snapshots__/FilePanel-test.tsx.snap b/test/unit-tests/components/structures/__snapshots__/FilePanel-test.tsx.snap
index 069b4a704a..1307a47d06 100644
--- a/test/unit-tests/components/structures/__snapshots__/FilePanel-test.tsx.snap
+++ b/test/unit-tests/components/structures/__snapshots__/FilePanel-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`FilePanel renders empty state 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
diff --git a/test/unit-tests/components/structures/__snapshots__/RoomView-test.tsx.snap b/test/unit-tests/components/structures/__snapshots__/RoomView-test.tsx.snap
index 350f3d9b60..7f5eeceba6 100644
--- a/test/unit-tests/components/structures/__snapshots__/RoomView-test.tsx.snap
+++ b/test/unit-tests/components/structures/__snapshots__/RoomView-test.tsx.snap
@@ -47,7 +47,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
       </button>
       <button
         aria-label="Threads"
-        aria-labelledby="«rg1»"
+        aria-labelledby="_r_g1_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -74,7 +74,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
       </button>
       <button
         aria-label="Room info"
-        aria-labelledby="«rg6»"
+        aria-labelledby="_r_g6_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -104,7 +104,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
       >
         <div
           aria-label="2 members"
-          aria-labelledby="«rgb»"
+          aria-labelledby="_r_gb_"
           class="mx_AccessibleButton mx_FacePile"
           role="button"
           tabindex="0"
@@ -212,7 +212,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
       </button>
       <button
         aria-label="Threads"
-        aria-labelledby="«rgj»"
+        aria-labelledby="_r_gj_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -239,7 +239,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
       </button>
       <button
         aria-label="Room info"
-        aria-labelledby="«rgo»"
+        aria-labelledby="_r_go_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -269,7 +269,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
       >
         <div
           aria-label="2 members"
-          aria-labelledby="«rgt»"
+          aria-labelledby="_r_gt_"
           class="mx_AccessibleButton mx_FacePile"
           role="button"
           tabindex="0"
@@ -463,7 +463,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
       </button>
       <button
         aria-label="Threads"
-        aria-labelledby="«rc1»"
+        aria-labelledby="_r_c1_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -490,7 +490,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
       </button>
       <button
         aria-label="Room info"
-        aria-labelledby="«rc6»"
+        aria-labelledby="_r_c6_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -520,7 +520,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
       >
         <div
           aria-label="2 members"
-          aria-labelledby="«rcb»"
+          aria-labelledby="_r_cb_"
           class="mx_AccessibleButton mx_FacePile"
           role="button"
           tabindex="0"
@@ -639,7 +639,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
             >
               <svg
                 aria-label="Messages in this room are not end-to-end encrypted"
-                aria-labelledby="«rck»"
+                aria-labelledby="_r_ck_"
                 class="mx_E2EIcon mx_MessageComposer_e2eIcon"
                 color="var(--cpd-color-icon-info-primary)"
                 fill="currentColor"
@@ -810,7 +810,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
       </button>
       <button
         aria-label="Threads"
-        aria-labelledby="«re1»"
+        aria-labelledby="_r_e1_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -837,7 +837,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
       </button>
       <button
         aria-label="Room info"
-        aria-labelledby="«re6»"
+        aria-labelledby="_r_e6_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         role="button"
@@ -867,7 +867,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
       >
         <div
           aria-label="2 members"
-          aria-labelledby="«reb»"
+          aria-labelledby="_r_eb_"
           class="mx_AccessibleButton mx_FacePile"
           role="button"
           tabindex="0"
@@ -1231,7 +1231,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
               style="--cpd-icon-button-size: 100%;"
             >
               <svg
-                aria-labelledby="«r2j»"
+                aria-labelledby="_r_2j_"
                 fill="currentColor"
                 height="1em"
                 viewBox="0 0 24 24"
@@ -1247,7 +1247,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           <button
             aria-disabled="false"
             aria-label="Voice call"
-            aria-labelledby="«r2o»"
+            aria-labelledby="_r_2o_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1273,7 +1273,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           </button>
           <button
             aria-label="Threads"
-            aria-labelledby="«r2t»"
+            aria-labelledby="_r_2t_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1300,7 +1300,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           </button>
           <button
             aria-label="Room info"
-            aria-labelledby="«r32»"
+            aria-labelledby="_r_32_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1330,7 +1330,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           >
             <div
               aria-label="0 members"
-              aria-labelledby="«r37»"
+              aria-labelledby="_r_37_"
               class="mx_AccessibleButton mx_FacePile"
               role="button"
               tabindex="0"
@@ -1443,7 +1443,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
               style="--cpd-icon-button-size: 100%;"
             >
               <svg
-                aria-labelledby="«r2j»"
+                aria-labelledby="_r_2j_"
                 fill="currentColor"
                 height="1em"
                 viewBox="0 0 24 24"
@@ -1459,7 +1459,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           <button
             aria-disabled="false"
             aria-label="Voice call"
-            aria-labelledby="«r2o»"
+            aria-labelledby="_r_2o_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1485,7 +1485,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           </button>
           <button
             aria-label="Threads"
-            aria-labelledby="«r2t»"
+            aria-labelledby="_r_2t_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1512,7 +1512,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           </button>
           <button
             aria-label="Room info"
-            aria-labelledby="«r32»"
+            aria-labelledby="_r_32_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1542,7 +1542,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
           >
             <div
               aria-label="0 members"
-              aria-labelledby="«r37»"
+              aria-labelledby="_r_37_"
               class="mx_AccessibleButton mx_FacePile"
               role="button"
               tabindex="0"
@@ -1610,7 +1610,7 @@ exports[`RoomView should not display the timeline when the room encryption is lo
                   tabindex="0"
                 >
                   <div
-                    aria-labelledby="«r3m»"
+                    aria-labelledby="_r_3m_"
                     class="mx_E2EIcon mx_E2EIcon_verified mx_MessageComposer_e2eIcon"
                     data-testid="e2e-icon"
                   >
@@ -1821,7 +1821,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
           </button>
           <button
             aria-label="Chat"
-            aria-labelledby="«r7l»"
+            aria-labelledby="_r_7l_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1848,7 +1848,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
           </button>
           <button
             aria-label="Threads"
-            aria-labelledby="«r7q»"
+            aria-labelledby="_r_7q_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1875,7 +1875,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
           </button>
           <button
             aria-label="Room info"
-            aria-labelledby="«r7v»"
+            aria-labelledby="_r_7v_"
             class="_icon-button_1pz9o_8"
             data-kind="primary"
             role="button"
@@ -1905,7 +1905,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
           >
             <div
               aria-label="0 members"
-              aria-labelledby="«r84»"
+              aria-labelledby="_r_84_"
               class="mx_AccessibleButton mx_FacePile"
               role="button"
               tabindex="0"
@@ -1981,7 +1981,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
                 </p>
               </div>
               <button
-                aria-labelledby="«r8d»"
+                aria-labelledby="_r_8d_"
                 class="_icon-button_1pz9o_8"
                 data-kind="secondary"
                 data-testid="base-card-close-button"
@@ -2041,7 +2041,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
                   >
                     <svg
                       aria-label="Messages in this room are not end-to-end encrypted"
-                      aria-labelledby="«r8m»"
+                      aria-labelledby="_r_8m_"
                       class="mx_E2EIcon mx_MessageComposer_e2eIcon"
                       color="var(--cpd-color-icon-info-primary)"
                       fill="currentColor"
diff --git a/test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap b/test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap
index c75b79aee4..e97a0cf7e1 100644
--- a/test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap
+++ b/test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
 <DocumentFragment>
@@ -58,7 +58,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
     role="tree"
   >
     <li
-      aria-labelledby="«r8»"
+      aria-labelledby="_r_8_"
       class="mx_SpaceHierarchy_roomTileWrapper"
       role="treeitem"
     >
@@ -88,7 +88,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             class="mx_SpaceHierarchy_roomTile_name"
           >
             <span
-              id="«r8»"
+              id="_r_8_"
             >
               Unnamed Room
             </span>
@@ -122,7 +122,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
                   class="_container_1hel1_10"
                 >
                   <input
-                    aria-labelledby="«r8»"
+                    aria-labelledby="_r_8_"
                     class="_input_1hel1_18"
                     id="checkbox_MwbPDmfGtm"
                     role="presentation"
@@ -156,7 +156,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
       </div>
     </li>
     <li
-      aria-labelledby="«rc»"
+      aria-labelledby="_r_c_"
       class="mx_SpaceHierarchy_roomTileWrapper"
       role="treeitem"
     >
@@ -186,7 +186,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             class="mx_SpaceHierarchy_roomTile_name"
           >
             <span
-              id="«rc»"
+              id="_r_c_"
             >
               Unnamed Room
             </span>
@@ -220,7 +220,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
                   class="_container_1hel1_10"
                 >
                   <input
-                    aria-labelledby="«rc»"
+                    aria-labelledby="_r_c_"
                     class="_input_1hel1_18"
                     id="checkbox_GQvdMWe954"
                     role="presentation"
@@ -254,7 +254,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
       </div>
     </li>
     <li
-      aria-labelledby="«rg»"
+      aria-labelledby="_r_g_"
       class="mx_SpaceHierarchy_roomTileWrapper"
       role="treeitem"
     >
@@ -284,7 +284,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             class="mx_SpaceHierarchy_roomTile_name"
           >
             <span
-              id="«rg»"
+              id="_r_g_"
             >
               Knock room
             </span>
@@ -318,7 +318,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
                   class="_container_1hel1_10"
                 >
                   <input
-                    aria-labelledby="«rg»"
+                    aria-labelledby="_r_g_"
                     class="_input_1hel1_18"
                     id="checkbox_DVIAu5CsiH"
                     role="presentation"
@@ -353,7 +353,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
     </li>
     <li
       aria-expanded="true"
-      aria-labelledby="«rk»"
+      aria-labelledby="_r_k_"
       class="mx_SpaceHierarchy_roomTileWrapper"
       role="treeitem"
     >
@@ -383,7 +383,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             class="mx_SpaceHierarchy_roomTile_name"
           >
             <span
-              id="«rk»"
+              id="_r_k_"
             >
               Nested space
             </span>
@@ -417,7 +417,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
                   class="_container_1hel1_10"
                 >
                   <input
-                    aria-labelledby="«rk»"
+                    aria-labelledby="_r_k_"
                     class="_input_1hel1_18"
                     id="checkbox_RD7nyrA2oh"
                     role="presentation"
@@ -458,7 +458,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
       />
     </li>
     <li
-      aria-labelledby="«ro»"
+      aria-labelledby="_r_o_"
       class="mx_SpaceHierarchy_roomTileWrapper"
       role="treeitem"
     >
@@ -488,7 +488,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             class="mx_SpaceHierarchy_roomTile_name"
           >
             <span
-              id="«ro»"
+              id="_r_o_"
             >
               Nested room
             </span>
@@ -510,7 +510,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
             Join
           </div>
           <span
-            aria-labelledby="«rp»"
+            aria-labelledby="_r_p_"
             tabindex="0"
           >
             <form
@@ -526,7 +526,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
                     class="_container_1hel1_10"
                   >
                     <input
-                      aria-labelledby="«ro»"
+                      aria-labelledby="_r_o_"
                       class="_input_1hel1_18"
                       disabled=""
                       id="checkbox_jWVJIPauy1"
diff --git a/test/unit-tests/components/structures/__snapshots__/ThreadPanel-test.tsx.snap b/test/unit-tests/components/structures/__snapshots__/ThreadPanel-test.tsx.snap
index e30c3e5618..3abc036124 100644
--- a/test/unit-tests/components/structures/__snapshots__/ThreadPanel-test.tsx.snap
+++ b/test/unit-tests/components/structures/__snapshots__/ThreadPanel-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ThreadPanel Header expect that All filter for ThreadPanelHeader properly renders Show: All threads 1`] = `
 <DocumentFragment>
@@ -6,7 +6,7 @@ exports[`ThreadPanel Header expect that All filter for ThreadPanelHeader properl
     class="mx_ThreadPanelHeader"
   >
     <button
-      aria-labelledby="«r0»"
+      aria-labelledby="_r_0_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       role="button"
@@ -45,7 +45,7 @@ exports[`ThreadPanel Header expect that My filter for ThreadPanelHeader properly
     class="mx_ThreadPanelHeader"
   >
     <button
-      aria-labelledby="«r6»"
+      aria-labelledby="_r_6_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       role="button"
diff --git a/test/unit-tests/components/views/avatars/__snapshots__/DecoratedRoomAvatar-test.tsx.snap b/test/unit-tests/components/views/avatars/__snapshots__/DecoratedRoomAvatar-test.tsx.snap
index 5250682916..c4f197b915 100644
--- a/test/unit-tests/components/views/avatars/__snapshots__/DecoratedRoomAvatar-test.tsx.snap
+++ b/test/unit-tests/components/views/avatars/__snapshots__/DecoratedRoomAvatar-test.tsx.snap
@@ -16,7 +16,7 @@ exports[`DecoratedRoomAvatar shows an avatar with globe icon and tooltip for pub
       r
     </span>
     <div
-      aria-labelledby="«r0»"
+      aria-labelledby="_r_0_"
       class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_globe"
       tabindex="0"
     />
@@ -40,7 +40,7 @@ exports[`DecoratedRoomAvatar shows the presence indicator in a DM room that also
       r
     </span>
     <div
-      aria-labelledby="«r6»"
+      aria-labelledby="_r_6_"
       class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_online"
       tabindex="0"
     />
diff --git a/test/unit-tests/components/views/avatars/__snapshots__/RoomAvatarView-test.tsx.snap b/test/unit-tests/components/views/avatars/__snapshots__/RoomAvatarView-test.tsx.snap
index a1b74d4654..62cdef22ac 100644
--- a/test/unit-tests/components/views/avatars/__snapshots__/RoomAvatarView-test.tsx.snap
+++ b/test/unit-tests/components/views/avatars/__snapshots__/RoomAvatarView-test.tsx.snap
@@ -50,7 +50,7 @@ exports[`<RoomAvatarView /> should render a low priority room decoration 1`] = `
     </span>
     <svg
       aria-label="This is a low priority room"
-      aria-labelledby="«r0»"
+      aria-labelledby="_r_0_"
       class="mx_RoomAvatarView_icon"
       color="var(--cpd-color-icon-tertiary)"
       fill="currentColor"
@@ -93,7 +93,7 @@ exports[`<RoomAvatarView /> should render a public room decoration 1`] = `
     </span>
     <svg
       aria-label="This room is public"
-      aria-labelledby="«rc»"
+      aria-labelledby="_r_c_"
       class="mx_RoomAvatarView_icon"
       color="var(--cpd-color-icon-info-primary)"
       fill="currentColor"
@@ -136,7 +136,7 @@ exports[`<RoomAvatarView /> should render a video room decoration 1`] = `
     </span>
     <svg
       aria-label="This room is a video room"
-      aria-labelledby="«r6»"
+      aria-labelledby="_r_6_"
       class="mx_RoomAvatarView_icon"
       color="var(--cpd-color-icon-tertiary)"
       fill="currentColor"
@@ -179,7 +179,7 @@ exports[`<RoomAvatarView /> should render the AWAY presence 1`] = `
     </span>
     <svg
       aria-label="Away"
-      aria-labelledby="«r14»"
+      aria-labelledby="_r_14_"
       class="mx_RoomAvatarView_PresenceDecoration"
       color="var(--cpd-color-icon-quaternary)"
       fill="currentColor"
@@ -235,7 +235,7 @@ exports[`<RoomAvatarView /> should render the BUSY presence 1`] = `
     </span>
     <svg
       aria-label="Busy"
-      aria-labelledby="«ru»"
+      aria-labelledby="_r_u_"
       class="mx_RoomAvatarView_PresenceDecoration"
       color="var(--cpd-color-icon-tertiary)"
       fill="currentColor"
@@ -293,7 +293,7 @@ exports[`<RoomAvatarView /> should render the OFFLINE presence 1`] = `
     </span>
     <svg
       aria-label="Offline"
-      aria-labelledby="«ro»"
+      aria-labelledby="_r_o_"
       class="mx_RoomAvatarView_PresenceDecoration"
       color="var(--cpd-color-icon-tertiary)"
       fill="currentColor"
@@ -351,7 +351,7 @@ exports[`<RoomAvatarView /> should render the ONLINE presence 1`] = `
     </span>
     <svg
       aria-label="Online"
-      aria-labelledby="«ri»"
+      aria-labelledby="_r_i_"
       class="mx_RoomAvatarView_PresenceDecoration"
       color="var(--cpd-color-icon-accent-primary)"
       fill="currentColor"
diff --git a/test/unit-tests/components/views/avatars/__snapshots__/WithPresenceIndicator-test.tsx.snap b/test/unit-tests/components/views/avatars/__snapshots__/WithPresenceIndicator-test.tsx.snap
index 07f947d6d6..1cc2b8ce18 100644
--- a/test/unit-tests/components/views/avatars/__snapshots__/WithPresenceIndicator-test.tsx.snap
+++ b/test/unit-tests/components/views/avatars/__snapshots__/WithPresenceIndicator-test.tsx.snap
@@ -7,7 +7,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
   >
     <span />
     <div
-      aria-labelledby="«r0»"
+      aria-labelledby="_r_0_"
       class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_online"
       style="width: 32px; height: 32px;"
       tabindex="0"
@@ -23,7 +23,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
   >
     <span />
     <div
-      aria-labelledby="«r6»"
+      aria-labelledby="_r_6_"
       class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_offline"
       style="width: 32px; height: 32px;"
       tabindex="0"
@@ -39,7 +39,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
   >
     <span />
     <div
-      aria-labelledby="«rc»"
+      aria-labelledby="_r_c_"
       class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_away"
       style="width: 32px; height: 32px;"
       tabindex="0"
diff --git a/test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap b/test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap
index 234b32911d..7d18989a03 100644
--- a/test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap
+++ b/test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap
@@ -32,7 +32,7 @@ exports[`<BeaconListItem /> when a beacon is live and has locations renders beac
           class="mx_BeaconListItem_interactions"
         >
           <a
-            aria-labelledby="«r0»"
+            aria-labelledby="_r_0_"
             data-testid="open-location-in-osm"
             href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41"
             rel="noreferrer noopener"
diff --git a/test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap b/test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap
index b9364bb6db..259b1da2f2 100644
--- a/test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap
+++ b/test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap
@@ -72,7 +72,7 @@ exports[`<DialogSidebar /> renders sidebar correctly with beacons 1`] = `
               class="mx_BeaconListItem_interactions"
             >
               <a
-                aria-labelledby="«r8»"
+                aria-labelledby="_r_8_"
                 data-testid="open-location-in-osm"
                 href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41"
                 rel="noreferrer noopener"
diff --git a/test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap b/test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap
index 09500389af..dbbe748b07 100644
--- a/test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap
+++ b/test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`<ShareLatestLocation /> renders share buttons when there is a location 1`] = `
 <DocumentFragment>
   <a
-    aria-labelledby="«r0»"
+    aria-labelledby="_r_0_"
     data-testid="open-location-in-osm"
     href="https://www.openstreetmap.org/?mlat=51&mlon=42#map=16/51/42"
     rel="noreferrer noopener"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/ConfirmRejectInviteDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/ConfirmRejectInviteDialog-test.tsx.snap
index d6adf24458..ae45bdbfff 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/ConfirmRejectInviteDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/ConfirmRejectInviteDialog-test.tsx.snap
@@ -38,22 +38,22 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
           class="mx_SettingsFlag_label"
         >
           <div
-            id="mx_LabelledToggleSwitch_«r7»"
+            id="mx_LabelledToggleSwitch__r_7_"
           >
             Ignore user
           </div>
           <span
             class="mx_Caption"
-            id="mx_LabelledToggleSwitch_«r7»_caption"
+            id="mx_LabelledToggleSwitch__r_7__caption"
           >
             You will not see any messages or room invites from this user.
           </span>
         </span>
         <div
           aria-checked="true"
-          aria-describedby="mx_LabelledToggleSwitch_«r7»_caption"
+          aria-describedby="mx_LabelledToggleSwitch__r_7__caption"
           aria-disabled="false"
-          aria-labelledby="mx_LabelledToggleSwitch_«r7»"
+          aria-labelledby="mx_LabelledToggleSwitch__r_7_"
           class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
           role="switch"
           tabindex="0"
@@ -70,22 +70,22 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
           class="mx_SettingsFlag_label"
         >
           <div
-            id="mx_LabelledToggleSwitch_«r8»"
+            id="mx_LabelledToggleSwitch__r_8_"
           >
             Report room
           </div>
           <span
             class="mx_Caption"
-            id="mx_LabelledToggleSwitch_«r8»_caption"
+            id="mx_LabelledToggleSwitch__r_8__caption"
           >
             Report this room to your account provider.
           </span>
         </span>
         <div
           aria-checked="true"
-          aria-describedby="mx_LabelledToggleSwitch_«r8»_caption"
+          aria-describedby="mx_LabelledToggleSwitch__r_8__caption"
           aria-disabled="false"
-          aria-labelledby="mx_LabelledToggleSwitch_«r8»"
+          aria-labelledby="mx_LabelledToggleSwitch__r_8_"
           class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
           role="switch"
           tabindex="0"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/CreateRoomDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/CreateRoomDialog-test.tsx.snap
index d4789c9b93..1873ac6e8f 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/CreateRoomDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/CreateRoomDialog-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<CreateRoomDialog /> for a private room should create a private room 1`] = `
 <DocumentFragment>
@@ -98,7 +98,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
             class="mx_SettingsFlag_label"
           >
             <div
-              id="mx_LabelledToggleSwitch_«r4m»"
+              id="mx_LabelledToggleSwitch__r_4m_"
             >
               Enable end-to-end encryption
             </div>
@@ -106,7 +106,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
           <div
             aria-checked="true"
             aria-disabled="false"
-            aria-labelledby="mx_LabelledToggleSwitch_«r4m»"
+            aria-labelledby="mx_LabelledToggleSwitch__r_4m_"
             class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
             role="switch"
             tabindex="0"
@@ -134,7 +134,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r4n»"
+                id="mx_LabelledToggleSwitch__r_4n_"
               >
                 Block anyone not part of server.org from ever joining this room.
               </div>
@@ -142,7 +142,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
             <div
               aria-checked="false"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r4n»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_4n_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -292,7 +292,7 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
             class="mx_SettingsFlag_label"
           >
             <div
-              id="mx_LabelledToggleSwitch_«r54»"
+              id="mx_LabelledToggleSwitch__r_54_"
             >
               Enable end-to-end encryption
             </div>
@@ -300,7 +300,7 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
           <div
             aria-checked="true"
             aria-disabled="false"
-            aria-labelledby="mx_LabelledToggleSwitch_«r54»"
+            aria-labelledby="mx_LabelledToggleSwitch__r_54_"
             class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
             role="switch"
             tabindex="0"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
index 9913c2cd87..8f30d6a2fa 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
@@ -34,7 +34,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
     >
       Room ID: !id
       <div
-        aria-describedby="«r2»"
+        aria-describedby="_r_2_"
         aria-label="Copy"
         class="mx_AccessibleButton mx_CopyableText_copyButton"
         role="button"
@@ -206,7 +206,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r4»"
+              for="radix-_r_4_"
             >
               Element Call URL
             </label>
@@ -215,7 +215,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
             >
               <input
                 class="_control_sqdq4_10"
-                id="radix-«r4»"
+                id="radix-_r_4_"
                 name="input"
                 title=""
                 value=""
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap
index b84bbf187e..522fcf7c9b 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap
@@ -74,7 +74,7 @@ exports[`LogoutDialog Prompts user to go to settings if there is a backup on the
       </details>
     </div>
     <div
-      aria-describedby="«rq»"
+      aria-describedby="_r_q_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
@@ -163,7 +163,7 @@ exports[`LogoutDialog Prompts user to go to settings if there is no backup on th
       </details>
     </div>
     <div
-      aria-describedby="«r10»"
+      aria-describedby="_r_10_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap
index 20664312a8..6d69dfa708 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap
@@ -76,7 +76,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
                   class="_container_1hel1_10"
                 >
                   <input
-                    aria-describedby="«r5»"
+                    aria-describedby="_r_5_"
                     class="_input_1hel1_18"
                     id="checkbox_vY7Q4uEh9K"
                     type="checkbox"
@@ -126,7 +126,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
                 </label>
                 <span
                   class="_message_19upo_85 _help-message_19upo_91"
-                  id="«r5»"
+                  id="_r_5_"
                 >
                   0 members
                 </span>
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap
index 1c876fb6c6..0696271b94 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap
@@ -103,7 +103,7 @@ exports[`<MessageEditHistory /> should match the snapshot 1`] = `
       </div>
     </div>
     <div
-      aria-describedby="«r2»"
+      aria-describedby="_r_2_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
@@ -318,7 +318,7 @@ exports[`<MessageEditHistory /> should support events with 1`] = `
       </div>
     </div>
     <div
-      aria-describedby="«r8»"
+      aria-describedby="_r_8_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/ReportRoomDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/ReportRoomDialog-test.tsx.snap
index d0f67b023b..ff4f3aeb4b 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/ReportRoomDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/ReportRoomDialog-test.tsx.snap
@@ -44,7 +44,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
         />
         <span
           class="_message_19upo_85 _help-message_19upo_91"
-          id="radix-«r8»"
+          id="radix-_r_8_"
         >
           Report this room to your account provider. If the messages are encrypted, your admin will not be able to read them.
         </span>
@@ -72,7 +72,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
           class="mx_SettingsFlag_label"
         >
           <div
-            id="mx_LabelledToggleSwitch_«r9»"
+            id="mx_LabelledToggleSwitch__r_9_"
           >
             Leave room
           </div>
@@ -80,7 +80,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
         <div
           aria-checked="false"
           aria-disabled="false"
-          aria-labelledby="mx_LabelledToggleSwitch_«r9»"
+          aria-labelledby="mx_LabelledToggleSwitch__r_9_"
           class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
           role="switch"
           tabindex="0"
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap
index ac9b7446a7..e0128dbab9 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap
@@ -51,7 +51,7 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
           class="mx_StyledRadioButton_content"
         >
           <span
-            aria-labelledby="«r0»"
+            aria-labelledby="_r_0_"
             class="mx_Login_underlinedServerName"
             tabindex="0"
           >
diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/VerificationRequestDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/VerificationRequestDialog-test.tsx.snap
index cec0876831..2dc48de40e 100644
--- a/test/unit-tests/components/views/dialogs/__snapshots__/VerificationRequestDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/__snapshots__/VerificationRequestDialog-test.tsx.snap
@@ -103,7 +103,7 @@ exports[`VerificationRequestDialog After we started verification here, says we a
       Once accepted you'll be able to continue with the verification.
     </div>
     <div
-      aria-describedby="«r6»"
+      aria-describedby="_r_6_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
diff --git a/test/unit-tests/components/views/dialogs/security/__snapshots__/RestoreKeyBackupDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/security/__snapshots__/RestoreKeyBackupDialog-test.tsx.snap
index bc60a23671..8f4045d9ce 100644
--- a/test/unit-tests/components/views/dialogs/security/__snapshots__/RestoreKeyBackupDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/dialogs/security/__snapshots__/RestoreKeyBackupDialog-test.tsx.snap
@@ -286,7 +286,7 @@ exports[`<RestoreKeyBackupDialog /> should render 1`] = `
       </div>
     </div>
     <div
-      aria-describedby="«r2»"
+      aria-describedby="_r_2_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
@@ -485,7 +485,7 @@ exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is ca
       </div>
     </div>
     <div
-      aria-describedby="«rk»"
+      aria-describedby="_r_k_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
@@ -552,7 +552,7 @@ exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is in
       </div>
     </div>
     <div
-      aria-describedby="«rq»"
+      aria-describedby="_r_q_"
       aria-label="Close dialog"
       class="mx_AccessibleButton mx_Dialog_cancelButton"
       role="button"
diff --git a/test/unit-tests/components/views/elements/__snapshots__/AppTile-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/AppTile-test.tsx.snap
index a3feeea45b..cbb182c1ca 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/AppTile-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/AppTile-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`AppTile destroys non-persisted right panel widget on room change 1`] = `
 <DocumentFragment>
@@ -33,7 +33,7 @@ exports[`AppTile destroys non-persisted right panel widget on room change 1`] =
           />
         </div>
         <button
-          aria-labelledby="«r0»"
+          aria-labelledby="_r_0_"
           class="_icon-button_1pz9o_8"
           data-kind="secondary"
           data-testid="base-card-close-button"
@@ -342,8 +342,8 @@ exports[`AppTile for a pinned widget should render permission request 1`] = `
             <span>
               Using this widget may share data 
               <div
-                aria-describedby="«r2n»"
-                aria-labelledby="«r2m»"
+                aria-describedby="_r_2n_"
+                aria-labelledby="_r_2m_"
                 class="mx_TextWithTooltip_target mx_TextWithTooltip_target--helpIcon"
               >
                 <svg
diff --git a/test/unit-tests/components/views/elements/__snapshots__/FacePile-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/FacePile-test.tsx.snap
index 62187854c3..117681b5be 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/FacePile-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/FacePile-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`<FacePile /> renders with a tooltip 1`] = `
 <DocumentFragment>
   <div
-    aria-labelledby="«r0»"
+    aria-labelledby="_r_0_"
     class="mx_AccessibleButton mx_FacePile"
     role="button"
     tabindex="0"
diff --git a/test/unit-tests/components/views/elements/__snapshots__/ImageView-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/ImageView-test.tsx.snap
index 4781d89e56..edf5dc4adf 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/ImageView-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/ImageView-test.tsx.snap
@@ -21,7 +21,7 @@ exports[`<ImageView /> renders correctly 1`] = `
         class="mx_ImageView_toolbar"
       >
         <div
-          aria-describedby="«r2»"
+          aria-describedby="_r_2_"
           aria-label="Zoom out"
           class="mx_AccessibleButton mx_ImageView_button mx_ImageView_button_zoomOut"
           role="button"
diff --git a/test/unit-tests/components/views/elements/__snapshots__/InfoTooltip-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/InfoTooltip-test.tsx.snap
index 438d3f0ecc..88b0534d05 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/InfoTooltip-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/InfoTooltip-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`InfoTooltip should show tooltip on hover 1`] = `
 <DocumentFragment>
   <div
-    aria-describedby="«r2»"
+    aria-describedby="_r_2_"
     class="mx_InfoTooltip"
     tabindex="0"
   >
diff --git a/test/unit-tests/components/views/elements/__snapshots__/LabelledCheckbox-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/LabelledCheckbox-test.tsx.snap
index 944cb23513..493b701416 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/LabelledCheckbox-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/LabelledCheckbox-test.tsx.snap
@@ -18,7 +18,7 @@ exports[`<LabelledCheckbox /> should render with byline of "this is a byline" 1`
             class="_container_1hel1_10"
           >
             <input
-              aria-describedby="«r4»"
+              aria-describedby="_r_4_"
               checked=""
               class="_input_1hel1_18"
               id="checkbox_vY7Q4uEh9K"
@@ -57,7 +57,7 @@ exports[`<LabelledCheckbox /> should render with byline of "this is a byline" 1`
           </label>
           <span
             class="_message_19upo_85 _help-message_19upo_91"
-            id="«r4»"
+            id="_r_4_"
           >
             this is a byline
           </span>
diff --git a/test/unit-tests/components/views/elements/__snapshots__/RoomFacePile-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/RoomFacePile-test.tsx.snap
index 4b396abded..9d2017cc22 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/RoomFacePile-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/RoomFacePile-test.tsx.snap
@@ -3,8 +3,8 @@
 exports[`<RoomFacePile /> renders 1`] = `
 <DocumentFragment>
   <div
-    aria-describedby="«r1»"
-    aria-labelledby="«r0»"
+    aria-describedby="_r_1_"
+    aria-labelledby="_r_0_"
     class="mx_AccessibleButton mx_FacePile"
     role="button"
     tabindex="0"
diff --git a/test/unit-tests/components/views/elements/__snapshots__/SettingsDropdown-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/SettingsDropdown-test.tsx.snap
index 98c6b8b63e..bf354d8ced 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/SettingsDropdown-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/SettingsDropdown-test.tsx.snap
@@ -7,7 +7,7 @@ exports[`<SettingsDropdown /> should render a disabled setting 1`] = `
   >
     <label
       class="mx_SettingsDropdown_label"
-      for="«r0»"
+      for="_r_0_"
     >
       <span
         class="mx_SettingsDropdown_labelText"
@@ -19,12 +19,12 @@ exports[`<SettingsDropdown /> should render a disabled setting 1`] = `
       class="mx_Dropdown mx_Dropdown_disabled"
     >
       <div
-        aria-describedby="«r0»_value"
+        aria-describedby="_r_0__value"
         aria-disabled="true"
         aria-expanded="false"
         aria-haspopup="listbox"
         aria-label="Open %(brand)s when you log in to your computer"
-        aria-owns="«r0»_input"
+        aria-owns="_r_0__input"
         class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput mx_AccessibleButton_disabled"
         disabled=""
         role="button"
@@ -32,7 +32,7 @@ exports[`<SettingsDropdown /> should render a disabled setting 1`] = `
       >
         <div
           class="mx_Dropdown_option"
-          id="«r0»_value"
+          id="_r_0__value"
         >
           <div>
             No
diff --git a/test/unit-tests/components/views/elements/__snapshots__/SettingsField-test.tsx.snap b/test/unit-tests/components/views/elements/__snapshots__/SettingsField-test.tsx.snap
index 3103159bce..3b5a8cc685 100644
--- a/test/unit-tests/components/views/elements/__snapshots__/SettingsField-test.tsx.snap
+++ b/test/unit-tests/components/views/elements/__snapshots__/SettingsField-test.tsx.snap
@@ -10,7 +10,7 @@ exports[`<SettingsField /> should render with the default label 1`] = `
     >
       <label
         class="_label_19upo_59"
-        for="radix-«r0»"
+        for="radix-_r_0_"
       >
         Element Call URL
       </label>
@@ -19,7 +19,7 @@ exports[`<SettingsField /> should render with the default label 1`] = `
       >
         <input
           class="_control_sqdq4_10"
-          id="radix-«r0»"
+          id="radix-_r_0_"
           name="input"
           title=""
           value=""
diff --git a/test/unit-tests/components/views/location/__snapshots__/LocationShareMenu-test.tsx.snap b/test/unit-tests/components/views/location/__snapshots__/LocationShareMenu-test.tsx.snap
index 15b0bb7a9e..24213fb293 100644
--- a/test/unit-tests/components/views/location/__snapshots__/LocationShareMenu-test.tsx.snap
+++ b/test/unit-tests/components/views/location/__snapshots__/LocationShareMenu-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<LocationShareMenu /> with live location disabled goes to labs flag screen after live options is clicked 1`] = `
 <div
@@ -26,7 +26,7 @@ exports[`<LocationShareMenu /> with live location disabled goes to labs flag scr
       class="mx_SettingsFlag_label"
     >
       <div
-        id="mx_LabelledToggleSwitch_«r0»"
+        id="mx_LabelledToggleSwitch__r_0_"
       >
         Enable live location sharing
       </div>
@@ -34,7 +34,7 @@ exports[`<LocationShareMenu /> with live location disabled goes to labs flag scr
     <div
       aria-checked="false"
       aria-disabled="false"
-      aria-labelledby="mx_LabelledToggleSwitch_«r0»"
+      aria-labelledby="mx_LabelledToggleSwitch__r_0_"
       class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
       role="switch"
       tabindex="0"
diff --git a/test/unit-tests/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap b/test/unit-tests/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap
index 1d4bbd5f49..1fb235633b 100644
--- a/test/unit-tests/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap
+++ b/test/unit-tests/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap
@@ -32,7 +32,7 @@ exports[`<LocationViewDialog /> renders map correctly 1`] = `
     class="mx_ZoomButtons"
   >
     <div
-      aria-describedby="«r6»"
+      aria-describedby="_r_6_"
       aria-label="Zoom in"
       class="mx_AccessibleButton mx_ZoomButtons_button"
       data-testid="map-zoom-in-button"
diff --git a/test/unit-tests/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap b/test/unit-tests/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap
index 6470175c3c..a810d2a79c 100644
--- a/test/unit-tests/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap
+++ b/test/unit-tests/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap
@@ -34,7 +34,7 @@ exports[`MLocationBody <MLocationBody> without error renders map correctly 1`] =
     class="mx_MLocationBody"
   >
     <div
-      aria-labelledby="«ri»"
+      aria-labelledby="_r_i_"
       class="mx_MLocationBody_map"
     >
       <div
@@ -76,7 +76,7 @@ exports[`MLocationBody <MLocationBody> without error renders marker correctly fo
     class="mx_MLocationBody"
   >
     <div
-      aria-labelledby="«ru»"
+      aria-labelledby="_r_u_"
       class="mx_MLocationBody_map"
     >
       <div
diff --git a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollHistory-test.tsx.snap b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollHistory-test.tsx.snap
index 10da3b1b27..267f197c35 100644
--- a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollHistory-test.tsx.snap
+++ b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollHistory-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<PollHistory /> Poll detail displays poll detail on active poll list item click 1`] = `
 <h2
@@ -91,7 +91,7 @@ exports[`<PollHistory /> renders a list of active polls when there are polls in
             tabindex="0"
           >
             <div
-              aria-labelledby="«ra»"
+              aria-labelledby="_r_a_"
               class="mx_PollListItem_content"
             >
               <span>
@@ -116,7 +116,7 @@ exports[`<PollHistory /> renders a list of active polls when there are polls in
             tabindex="0"
           >
             <div
-              aria-labelledby="«rf»"
+              aria-labelledby="_r_f_"
               class="mx_PollListItem_content"
             >
               <span>
diff --git a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItem-test.tsx.snap b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItem-test.tsx.snap
index 3319ae3856..e2dcc8e286 100644
--- a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItem-test.tsx.snap
+++ b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItem-test.tsx.snap
@@ -10,7 +10,7 @@ exports[`<PollListItem /> renders a poll 1`] = `
       tabindex="0"
     >
       <div
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="mx_PollListItem_content"
       >
         <span>
diff --git a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItemEnded-test.tsx.snap b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItemEnded-test.tsx.snap
index 1ae7a6b9d7..3c75be80a0 100644
--- a/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItemEnded-test.tsx.snap
+++ b/test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItemEnded-test.tsx.snap
@@ -10,7 +10,7 @@ exports[`<PollListItemEnded /> renders a poll with no responses 1`] = `
       tabindex="0"
     >
       <div
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="mx_PollListItemEnded_content"
       >
         <div
diff --git a/test/unit-tests/components/views/right_panel/__snapshots__/BaseCard-test.tsx.snap b/test/unit-tests/components/views/right_panel/__snapshots__/BaseCard-test.tsx.snap
index 425f5942dd..94e105d38c 100644
--- a/test/unit-tests/components/views/right_panel/__snapshots__/BaseCard-test.tsx.snap
+++ b/test/unit-tests/components/views/right_panel/__snapshots__/BaseCard-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`<BaseCard /> should close when clicking X button 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
diff --git a/test/unit-tests/components/views/right_panel/__snapshots__/ExtensionsCard-test.tsx.snap b/test/unit-tests/components/views/right_panel/__snapshots__/ExtensionsCard-test.tsx.snap
index 0b232a5ec7..fc1fd7e081 100644
--- a/test/unit-tests/components/views/right_panel/__snapshots__/ExtensionsCard-test.tsx.snap
+++ b/test/unit-tests/components/views/right_panel/__snapshots__/ExtensionsCard-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`<ExtensionsCard /> should render empty state 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -120,7 +120,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r6»"
+        aria-labelledby="_r_6_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
diff --git a/test/unit-tests/components/views/right_panel/__snapshots__/PinnedMessagesCard-test.tsx.snap b/test/unit-tests/components/views/right_panel/__snapshots__/PinnedMessagesCard-test.tsx.snap
index 7d46d21211..1b81425d6e 100644
--- a/test/unit-tests/components/views/right_panel/__snapshots__/PinnedMessagesCard-test.tsx.snap
+++ b/test/unit-tests/components/views/right_panel/__snapshots__/PinnedMessagesCard-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<PinnedMessagesCard /> should show the empty state when there are no pins 1`] = `
 <DocumentFragment>
@@ -19,7 +19,7 @@ exports[`<PinnedMessagesCard /> should show the empty state when there are no pi
         </p>
       </div>
       <button
-        aria-labelledby="«rf»"
+        aria-labelledby="_r_f_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -101,7 +101,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«rl»"
+        aria-labelledby="_r_l_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -159,13 +159,13 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
               class="mx_PinnedEventTile_top"
             >
               <span
-                aria-labelledby="«rs»"
+                aria-labelledby="_r_s_"
                 class="mx_PinnedEventTile_sender mx_Username_color3"
               >
                 @alice:example.org
               </span>
               <button
-                aria-describedby="«rr»"
+                aria-describedby="_r_r_"
                 aria-disabled="false"
                 aria-expanded="false"
                 aria-haspopup="menu"
@@ -173,7 +173,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
                 class="_icon-button_1pz9o_8"
                 data-kind="primary"
                 data-state="closed"
-                id="radix-«r11»"
+                id="radix-_r_11_"
                 role="button"
                 style="--cpd-icon-button-size: 24px;"
                 tabindex="0"
@@ -199,7 +199,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
             </div>
             <div
               class="mx_MTextBody mx_EventTile_content"
-              id="«rr»"
+              id="_r_r_"
             >
               <div
                 class="mx_EventTile_body translate"
@@ -240,13 +240,13 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
               class="mx_PinnedEventTile_top"
             >
               <span
-                aria-labelledby="«r14»"
+                aria-labelledby="_r_14_"
                 class="mx_PinnedEventTile_sender mx_Username_color3"
               >
                 @alice:example.org
               </span>
               <button
-                aria-describedby="«r13»"
+                aria-describedby="_r_13_"
                 aria-disabled="false"
                 aria-expanded="false"
                 aria-haspopup="menu"
@@ -254,7 +254,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
                 class="_icon-button_1pz9o_8"
                 data-kind="primary"
                 data-state="closed"
-                id="radix-«r19»"
+                id="radix-_r_19_"
                 role="button"
                 style="--cpd-icon-button-size: 24px;"
                 tabindex="0"
@@ -280,7 +280,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
             </div>
             <div
               class="mx_MTextBody mx_EventTile_content"
-              id="«r13»"
+              id="_r_13_"
             >
               <div
                 class="mx_EventTile_body translate"
@@ -329,7 +329,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r10f»"
+        aria-labelledby="_r_10f_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -387,13 +387,13 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
               class="mx_PinnedEventTile_top"
             >
               <span
-                aria-labelledby="«r10m»"
+                aria-labelledby="_r_10m_"
                 class="mx_PinnedEventTile_sender mx_Username_color3"
               >
                 @alice:example.org
               </span>
               <button
-                aria-describedby="«r10l»"
+                aria-describedby="_r_10l_"
                 aria-disabled="false"
                 aria-expanded="false"
                 aria-haspopup="menu"
@@ -401,7 +401,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
                 class="_icon-button_1pz9o_8"
                 data-kind="primary"
                 data-state="closed"
-                id="radix-«r10r»"
+                id="radix-_r_10r_"
                 role="button"
                 style="--cpd-icon-button-size: 24px;"
                 tabindex="0"
@@ -427,7 +427,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
             </div>
             <div
               class="mx_MTextBody mx_EventTile_content"
-              id="«r10l»"
+              id="_r_10l_"
             >
               <div
                 class="mx_EventTile_body translate"
@@ -468,13 +468,13 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
               class="mx_PinnedEventTile_top"
             >
               <span
-                aria-labelledby="«r10u»"
+                aria-labelledby="_r_10u_"
                 class="mx_PinnedEventTile_sender mx_Username_color3"
               >
                 @alice:example.org
               </span>
               <button
-                aria-describedby="«r10t»"
+                aria-describedby="_r_10t_"
                 aria-disabled="false"
                 aria-expanded="false"
                 aria-haspopup="menu"
@@ -482,7 +482,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
                 class="_icon-button_1pz9o_8"
                 data-kind="primary"
                 data-state="closed"
-                id="radix-«r113»"
+                id="radix-_r_113_"
                 role="button"
                 style="--cpd-icon-button-size: 24px;"
                 tabindex="0"
@@ -508,7 +508,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
             </div>
             <div
               class="mx_MTextBody mx_EventTile_content"
-              id="«r10t»"
+              id="_r_10t_"
             >
               <div
                 class="mx_EventTile_body translate"
diff --git a/test/unit-tests/components/views/right_panel/__snapshots__/RoomSummaryCardView-test.tsx.snap b/test/unit-tests/components/views/right_panel/__snapshots__/RoomSummaryCardView-test.tsx.snap
index 14c0710999..1c6672e832 100644
--- a/test/unit-tests/components/views/right_panel/__snapshots__/RoomSummaryCardView-test.tsx.snap
+++ b/test/unit-tests/components/views/right_panel/__snapshots__/RoomSummaryCardView-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
 <div>
@@ -15,7 +15,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
         class="mx_BaseCard_header_spacer"
       />
       <button
-        aria-labelledby="«re»"
+        aria-labelledby="_r_e_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -210,7 +210,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
             <input
               aria-hidden="true"
               class="_input_19o42_24"
-              id="«rj»"
+              id="_r_j_"
               role="switch"
               type="checkbox"
             />
@@ -728,7 +728,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
         class="mx_BaseCard_header_spacer"
       />
       <button
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -885,7 +885,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
             <input
               aria-hidden="true"
               class="_input_19o42_24"
-              id="«r5»"
+              id="_r_5_"
               role="switch"
               type="checkbox"
             />
@@ -1403,7 +1403,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
         class="mx_BaseCard_header_spacer"
       />
       <button
-        aria-labelledby="«r7»"
+        aria-labelledby="_r_7_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -1598,7 +1598,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
             <input
               aria-hidden="true"
               class="_input_19o42_24"
-              id="«rc»"
+              id="_r_c_"
               role="switch"
               type="checkbox"
             />
diff --git a/test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap b/test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap
index 7a8ace1bc3..0ed3d7b130 100644
--- a/test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap
+++ b/test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r7c»"
+        aria-labelledby="_r_7c_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -306,7 +306,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
         </p>
       </div>
       <button
-        aria-labelledby="«r7m»"
+        aria-labelledby="_r_7m_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
diff --git a/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/RoomHeader-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/RoomHeader-test.tsx.snap
index 22449950e2..ea58935769 100644
--- a/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/RoomHeader-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/RoomHeader-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
 <DocumentFragment>
@@ -56,7 +56,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
         style="--cpd-icon-button-size: 100%;"
       >
         <svg
-          aria-labelledby="«r14k»"
+          aria-labelledby="_r_14k_"
           fill="currentColor"
           height="1em"
           viewBox="0 0 24 24"
@@ -72,7 +72,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
     <button
       aria-disabled="false"
       aria-label="Voice call"
-      aria-labelledby="«r14p»"
+      aria-labelledby="_r_14p_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       role="button"
@@ -98,7 +98,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
     </button>
     <button
       aria-label="Threads"
-      aria-labelledby="«r14u»"
+      aria-labelledby="_r_14u_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       role="button"
@@ -125,7 +125,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
     </button>
     <button
       aria-label="Room info"
-      aria-labelledby="«r153»"
+      aria-labelledby="_r_153_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       role="button"
diff --git a/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap
index a2cef17138..7c1f3a5a9b 100644
--- a/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`<VideoRoomChatButton /> renders button with an unread marker when room is unread 1`] = `
 <button
   aria-label="Chat"
-  aria-labelledby="«r6»"
+  aria-labelledby="_r_6_"
   class="_icon-button_1pz9o_8"
   data-indicator="default"
   data-kind="primary"
diff --git a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListHeaderView-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListHeaderView-test.tsx.snap
index d571cbe144..3ad2588b74 100644
--- a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListHeaderView-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListHeaderView-test.tsx.snap
@@ -25,7 +25,7 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
         class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
         data-kind="primary"
         data-state="closed"
-        id="radix-«rk»"
+        id="radix-_r_k_"
         role="button"
         style="--cpd-icon-button-size: 20px;"
         tabindex="0"
@@ -63,11 +63,11 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
           aria-expanded="false"
           aria-haspopup="menu"
           aria-label="Room Options"
-          aria-labelledby="«rs»"
+          aria-labelledby="_r_s_"
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«rq»"
+          id="radix-_r_q_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -104,7 +104,7 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r15»"
+          id="radix-_r_15_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -164,7 +164,7 @@ exports[`<RoomListHeaderView /> compose menu should not display the compose menu
         class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
         data-kind="primary"
         data-state="closed"
-        id="radix-«r18»"
+        id="radix-_r_18_"
         role="button"
         style="--cpd-icon-button-size: 20px;"
         tabindex="0"
@@ -202,11 +202,11 @@ exports[`<RoomListHeaderView /> compose menu should not display the compose menu
           aria-expanded="false"
           aria-haspopup="menu"
           aria-label="Room Options"
-          aria-labelledby="«r1g»"
+          aria-labelledby="_r_1g_"
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r1e»"
+          id="radix-_r_1e_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -297,7 +297,7 @@ exports[`<RoomListHeaderView /> should render 'room options' button 1`] = `
         class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
         data-kind="primary"
         data-state="closed"
-        id="radix-«r0»"
+        id="radix-_r_0_"
         role="button"
         style="--cpd-icon-button-size: 20px;"
         tabindex="0"
@@ -335,11 +335,11 @@ exports[`<RoomListHeaderView /> should render 'room options' button 1`] = `
           aria-expanded="false"
           aria-haspopup="menu"
           aria-label="Room Options"
-          aria-labelledby="«r8»"
+          aria-labelledby="_r_8_"
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r6»"
+          id="radix-_r_6_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -376,7 +376,7 @@ exports[`<RoomListHeaderView /> should render 'room options' button 1`] = `
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«rh»"
+          id="radix-_r_h_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -436,7 +436,7 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
         class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
         data-kind="primary"
         data-state="closed"
-        id="radix-«r3g»"
+        id="radix-_r_3g_"
         role="button"
         style="--cpd-icon-button-size: 20px;"
         tabindex="0"
@@ -474,11 +474,11 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
           aria-expanded="false"
           aria-haspopup="menu"
           aria-label="Room Options"
-          aria-labelledby="«r3o»"
+          aria-labelledby="_r_3o_"
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r3m»"
+          id="radix-_r_3m_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -515,7 +515,7 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r41»"
+          id="radix-_r_41_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -581,11 +581,11 @@ exports[`<RoomListHeaderView /> space menu should not display the space menu 1`]
           aria-expanded="false"
           aria-haspopup="menu"
           aria-label="Room Options"
-          aria-labelledby="«r4a»"
+          aria-labelledby="_r_4a_"
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r48»"
+          id="radix-_r_48_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
@@ -622,7 +622,7 @@ exports[`<RoomListHeaderView /> space menu should not display the space menu 1`]
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r4j»"
+          id="radix-_r_4j_"
           role="button"
           style="--cpd-icon-button-size: 32px;"
           tabindex="0"
diff --git a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListItemMenuView-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListItemMenuView-test.tsx.snap
index 4fae31120b..a32298aa53 100644
--- a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListItemMenuView-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListItemMenuView-test.tsx.snap
@@ -11,11 +11,11 @@ exports[`<RoomListItemMenuView /> should render the more options menu 1`] = `
       aria-expanded="false"
       aria-haspopup="menu"
       aria-label="More Options"
-      aria-labelledby="«r2»"
+      aria-labelledby="_r_2_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       data-state="closed"
-      id="radix-«r0»"
+      id="radix-_r_0_"
       role="button"
       style="--cpd-icon-button-size: 24px;"
       tabindex="0"
@@ -44,11 +44,11 @@ exports[`<RoomListItemMenuView /> should render the more options menu 1`] = `
         aria-expanded="false"
         aria-haspopup="menu"
         aria-label="Notification options"
-        aria-labelledby="«r9»"
+        aria-labelledby="_r_9_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         data-state="closed"
-        id="radix-«r7»"
+        id="radix-_r_7_"
         role="button"
         style="--cpd-icon-button-size: 24px;"
         tabindex="0"
@@ -90,11 +90,11 @@ exports[`<RoomListItemMenuView /> should render the notification options menu 1`
       aria-expanded="false"
       aria-haspopup="menu"
       aria-label="More Options"
-      aria-labelledby="«ri»"
+      aria-labelledby="_r_i_"
       class="_icon-button_1pz9o_8"
       data-kind="primary"
       data-state="closed"
-      id="radix-«rg»"
+      id="radix-_r_g_"
       role="button"
       style="--cpd-icon-button-size: 24px;"
       tabindex="0"
@@ -123,11 +123,11 @@ exports[`<RoomListItemMenuView /> should render the notification options menu 1`
         aria-expanded="false"
         aria-haspopup="menu"
         aria-label="Notification options"
-        aria-labelledby="«rp»"
+        aria-labelledby="_r_p_"
         class="_icon-button_1pz9o_8"
         data-kind="primary"
         data-state="closed"
-        id="radix-«rn»"
+        id="radix-_r_n_"
         role="button"
         style="--cpd-icon-button-size: 24px;"
         tabindex="0"
diff --git a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListOptionsMenu-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListOptionsMenu-test.tsx.snap
index 26f4df265f..cad8e89c1a 100644
--- a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListOptionsMenu-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListOptionsMenu-test.tsx.snap
@@ -7,11 +7,11 @@ exports[`<RoomListOptionsMenu /> should match snapshot 1`] = `
     aria-expanded="false"
     aria-haspopup="menu"
     aria-label="Room Options"
-    aria-labelledby="«r2»"
+    aria-labelledby="_r_2_"
     class="_icon-button_1pz9o_8"
     data-kind="primary"
     data-state="closed"
-    id="radix-«r0»"
+    id="radix-_r_0_"
     role="button"
     style="--cpd-icon-button-size: 32px;"
     tabindex="0"
diff --git a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListPrimaryFilters-test.tsx.snap b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListPrimaryFilters-test.tsx.snap
index 2fefd96f43..5865d33b00 100644
--- a/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListPrimaryFilters-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListPrimaryFilters-test.tsx.snap
@@ -10,7 +10,7 @@ exports[`<RoomListPrimaryFilters /> should renders all filters correctly 1`] = `
     <div
       aria-label="Room list filters"
       class="flex mx_RoomListPrimaryFilters_list"
-      id="«r0»"
+      id="_r_0_"
       role="listbox"
       style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
     >
diff --git a/test/unit-tests/components/views/rooms/__snapshots__/PinnedEventTile-test.tsx.snap b/test/unit-tests/components/views/rooms/__snapshots__/PinnedEventTile-test.tsx.snap
index 0486496986..40c4e487de 100644
--- a/test/unit-tests/components/views/rooms/__snapshots__/PinnedEventTile-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/__snapshots__/PinnedEventTile-test.tsx.snap
@@ -25,13 +25,13 @@ exports[`<PinnedEventTile /> should render pinned event 1`] = `
         class="mx_PinnedEventTile_top"
       >
         <span
-          aria-labelledby="«r1»"
+          aria-labelledby="_r_1_"
           class="mx_PinnedEventTile_sender mx_Username_color2"
         >
           @alice:server.org
         </span>
         <button
-          aria-describedby="«r0»"
+          aria-describedby="_r_0_"
           aria-disabled="false"
           aria-expanded="false"
           aria-haspopup="menu"
@@ -39,7 +39,7 @@ exports[`<PinnedEventTile /> should render pinned event 1`] = `
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«r6»"
+          id="radix-_r_6_"
           role="button"
           style="--cpd-icon-button-size: 24px;"
           tabindex="0"
@@ -65,7 +65,7 @@ exports[`<PinnedEventTile /> should render pinned event 1`] = `
       </div>
       <div
         class="mx_MTextBody mx_EventTile_content"
-        id="«r0»"
+        id="_r_0_"
       >
         <div
           class="mx_EventTile_body translate"
@@ -104,13 +104,13 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
         class="mx_PinnedEventTile_top"
       >
         <span
-          aria-labelledby="«ra»"
+          aria-labelledby="_r_a_"
           class="mx_PinnedEventTile_sender mx_Username_color2"
         >
           @alice:server.org
         </span>
         <button
-          aria-describedby="«r9»"
+          aria-describedby="_r_9_"
           aria-disabled="false"
           aria-expanded="false"
           aria-haspopup="menu"
@@ -118,7 +118,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
           class="_icon-button_1pz9o_8"
           data-kind="primary"
           data-state="closed"
-          id="radix-«rf»"
+          id="radix-_r_f_"
           role="button"
           style="--cpd-icon-button-size: 24px;"
           tabindex="0"
@@ -144,7 +144,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
       </div>
       <div
         class="mx_MTextBody mx_EventTile_content"
-        id="«r9»"
+        id="_r_9_"
       >
         <div
           class="mx_EventTile_body translate"
@@ -187,7 +187,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
 exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
 <div
   aria-label="Open menu"
-  aria-labelledby="radix-«r14»"
+  aria-labelledby="radix-_r_14_"
   aria-orientation="vertical"
   class="_menu_1glhz_8"
   data-align="start"
@@ -196,7 +196,7 @@ exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
   data-side="right"
   data-state="open"
   dir="ltr"
-  id="radix-«r15»"
+  id="radix-_r_15_"
   role="menu"
   style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
   tabindex="-1"
@@ -378,7 +378,7 @@ exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
 exports[`<PinnedEventTile /> should render the menu without unpin and delete 1`] = `
 <div
   aria-label="Open menu"
-  aria-labelledby="radix-«ro»"
+  aria-labelledby="radix-_r_o_"
   aria-orientation="vertical"
   class="_menu_1glhz_8"
   data-align="start"
@@ -387,7 +387,7 @@ exports[`<PinnedEventTile /> should render the menu without unpin and delete 1`]
   data-side="right"
   data-state="open"
   dir="ltr"
-  id="radix-«rp»"
+  id="radix-_r_p_"
   role="menu"
   style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
   tabindex="-1"
diff --git a/test/unit-tests/components/views/rooms/__snapshots__/PinnedMessageBanner-test.tsx.snap b/test/unit-tests/components/views/rooms/__snapshots__/PinnedMessageBanner-test.tsx.snap
index 75f82b5f6d..76732c6c34 100644
--- a/test/unit-tests/components/views/rooms/__snapshots__/PinnedMessageBanner-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/__snapshots__/PinnedMessageBanner-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<PinnedMessageBanner /> should display display a poll event 1`] = `
 <DocumentFragment>
@@ -10,14 +10,14 @@ exports[`<PinnedMessageBanner /> should display display a poll event 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«ra»"
+      aria-describedby="_r_a_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«ra»"
+        id="_r_a_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -68,14 +68,14 @@ exports[`<PinnedMessageBanner /> should display the last message when the pinned
     role="region"
   >
     <button
-      aria-describedby="«r4»"
+      aria-describedby="_r_4_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r4»"
+        id="_r_4_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -150,14 +150,14 @@ exports[`<PinnedMessageBanner /> should display the m.audio event type 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r7»"
+      aria-describedby="_r_7_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r7»"
+        id="_r_7_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -208,14 +208,14 @@ exports[`<PinnedMessageBanner /> should display the m.file event type 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r6»"
+      aria-describedby="_r_6_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r6»"
+        id="_r_6_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -266,14 +266,14 @@ exports[`<PinnedMessageBanner /> should display the m.image event type 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r9»"
+      aria-describedby="_r_9_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r9»"
+        id="_r_9_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -324,14 +324,14 @@ exports[`<PinnedMessageBanner /> should display the m.video event type 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r8»"
+      aria-describedby="_r_8_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r8»"
+        id="_r_8_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -382,14 +382,14 @@ exports[`<PinnedMessageBanner /> should render 2 pinned event 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r2»"
+      aria-describedby="_r_2_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r2»"
+        id="_r_2_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -460,14 +460,14 @@ exports[`<PinnedMessageBanner /> should render 4 pinned event 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r3»"
+      aria-describedby="_r_3_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r3»"
+        id="_r_3_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
@@ -542,14 +542,14 @@ exports[`<PinnedMessageBanner /> should render a single pinned event 1`] = `
     role="region"
   >
     <button
-      aria-describedby="«r1»"
+      aria-describedby="_r_1_"
       aria-label="View the pinned message in the timeline and the newest pinned message here"
       class="mx_PinnedMessageBanner_main"
       type="button"
     >
       <div
         class="mx_PinnedMessageBanner_content"
-        id="«r1»"
+        id="_r_1_"
       >
         <div
           class="mx_PinnedMessageBanner_Indicators"
diff --git a/test/unit-tests/components/views/rooms/__snapshots__/ReadReceiptGroup-test.tsx.snap b/test/unit-tests/components/views/rooms/__snapshots__/ReadReceiptGroup-test.tsx.snap
index 1778426866..6540cb658c 100644
--- a/test/unit-tests/components/views/rooms/__snapshots__/ReadReceiptGroup-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/__snapshots__/ReadReceiptGroup-test.tsx.snap
@@ -4,7 +4,7 @@ exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
 <div
   class="_tooltip_6ode6_8"
   data-floating-ui-focusable=""
-  id="«r6»"
+  id="_r_6_"
   role="tooltip"
   style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);"
   tabindex="-1"
@@ -22,7 +22,7 @@ exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
       stroke="none"
     />
     <clippath
-      id="«r9»"
+      id="_r_9_"
     >
       <rect
         height="10"
@@ -33,13 +33,13 @@ exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
     </clippath>
   </svg>
   <span
-    id="«r4»"
+    id="_r_4_"
   >
     Alice
   </span>
   <span
     class="_caption_6ode6_28 cpd-theme-dark"
-    id="«r5»"
+    id="_r_5_"
   >
     @alice:example.org
   </span>
diff --git a/test/unit-tests/components/views/rooms/__snapshots__/ThirdPartyMemberInfo-test.tsx.snap b/test/unit-tests/components/views/rooms/__snapshots__/ThirdPartyMemberInfo-test.tsx.snap
index 4ad44d6c57..7ad6bd0fe2 100644
--- a/test/unit-tests/components/views/rooms/__snapshots__/ThirdPartyMemberInfo-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/__snapshots__/ThirdPartyMemberInfo-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`<ThirdPartyMemberInfo /> should render invite 1`] = `
         </p>
       </div>
       <button
-        aria-labelledby="«r0»"
+        aria-labelledby="_r_0_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
@@ -94,7 +94,7 @@ exports[`<ThirdPartyMemberInfo /> should render invite when room in not availabl
         </p>
       </div>
       <button
-        aria-labelledby="«r6»"
+        aria-labelledby="_r_6_"
         class="_icon-button_1pz9o_8"
         data-kind="secondary"
         data-testid="base-card-close-button"
diff --git a/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap b/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap
index fd01c58842..cfc5ca536f 100644
--- a/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap
+++ b/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap
@@ -52,7 +52,7 @@ exports[`MemberTileView RoomMemberTileView should display an verified E2EIcon wh
         class="mx_MemberTileView_right"
       >
         <div
-          aria-labelledby="«r6»"
+          aria-labelledby="_r_6_"
           class="mx_E2EIconView"
         >
           <svg
@@ -126,7 +126,7 @@ exports[`MemberTileView RoomMemberTileView should display an warning E2EIcon whe
         class="mx_MemberTileView_right"
       >
         <div
-          aria-labelledby="«r0»"
+          aria-labelledby="_r_0_"
           class="mx_E2EIconView"
         >
           <svg
diff --git a/test/unit-tests/components/views/settings/__snapshots__/LayoutSwitcher-test.tsx.snap b/test/unit-tests/components/views/settings/__snapshots__/LayoutSwitcher-test.tsx.snap
index 6be2307377..28883a52a8 100644
--- a/test/unit-tests/components/views/settings/__snapshots__/LayoutSwitcher-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/__snapshots__/LayoutSwitcher-test.tsx.snap
@@ -27,7 +27,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
           <label
             aria-label="Modern"
             class="_label_19upo_59"
-            for="radix-«r0»"
+            for="radix-_r_0_"
           >
             <div
               class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -38,7 +38,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
                 <input
                   checked=""
                   class="_input_1e0uz_18"
-                  id="radix-«r0»"
+                  id="radix-_r_0_"
                   name="layout"
                   title=""
                   type="radio"
@@ -155,7 +155,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
           <label
             aria-label="Message bubbles"
             class="_label_19upo_59"
-            for="radix-«r9»"
+            for="radix-_r_9_"
           >
             <div
               class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -165,7 +165,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
               >
                 <input
                   class="_input_1e0uz_18"
-                  id="radix-«r9»"
+                  id="radix-_r_9_"
                   name="layout"
                   title=""
                   type="radio"
@@ -282,7 +282,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
           <label
             aria-label="IRC (experimental)"
             class="_label_19upo_59"
-            for="radix-«ri»"
+            for="radix-_r_i_"
           >
             <div
               class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -292,7 +292,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
               >
                 <input
                   class="_input_1e0uz_18"
-                  id="radix-«ri»"
+                  id="radix-_r_i_"
                   name="layout"
                   title=""
                   type="radio"
@@ -417,9 +417,9 @@ exports[`<LayoutSwitcher /> should render 1`] = `
               class="_container_19o42_10"
             >
               <input
-                aria-describedby="radix-«rs»"
+                aria-describedby="radix-_r_s_"
                 class="_input_19o42_24"
-                id="radix-«rr»"
+                id="radix-_r_r_"
                 name="compactLayout"
                 role="switch"
                 title=""
@@ -435,13 +435,13 @@ exports[`<LayoutSwitcher /> should render 1`] = `
           >
             <label
               class="_label_19upo_59"
-              for="radix-«rr»"
+              for="radix-_r_r_"
             >
               Show compact text and messages
             </label>
             <span
               class="_message_19upo_85 _help-message_19upo_91"
-              id="radix-«rs»"
+              id="radix-_r_s_"
             >
               Modern layout must be selected to use this feature.
             </span>
diff --git a/test/unit-tests/components/views/settings/__snapshots__/Notifications-test.tsx.snap b/test/unit-tests/components/views/settings/__snapshots__/Notifications-test.tsx.snap
index f89ada25cb..f25f1625d4 100644
--- a/test/unit-tests/components/views/settings/__snapshots__/Notifications-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/__snapshots__/Notifications-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<Notifications /> main notification switches renders only enable notifications switch when notifications are disabled 1`] = `
 <div>
@@ -10,22 +10,22 @@ exports[`<Notifications /> main notification switches renders only enable notifi
       class="mx_SettingsFlag_label"
     >
       <div
-        id="mx_LabelledToggleSwitch_«r0»"
+        id="mx_LabelledToggleSwitch__r_0_"
       >
         Enable notifications for this account
       </div>
       <span
         class="mx_Caption"
-        id="mx_LabelledToggleSwitch_«r0»_caption"
+        id="mx_LabelledToggleSwitch__r_0__caption"
       >
         Turn off to disable notifications on all your devices and sessions
       </span>
     </span>
     <div
       aria-checked="false"
-      aria-describedby="mx_LabelledToggleSwitch_«r0»_caption"
+      aria-describedby="mx_LabelledToggleSwitch__r_0__caption"
       aria-disabled="false"
-      aria-labelledby="mx_LabelledToggleSwitch_«r0»"
+      aria-labelledby="mx_LabelledToggleSwitch__r_0_"
       class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
       role="switch"
       tabindex="0"
diff --git a/test/unit-tests/components/views/settings/__snapshots__/SetIdServer-test.tsx.snap b/test/unit-tests/components/views/settings/__snapshots__/SetIdServer-test.tsx.snap
index 3a6dfcd5d6..65305a5df4 100644
--- a/test/unit-tests/components/views/settings/__snapshots__/SetIdServer-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/__snapshots__/SetIdServer-test.tsx.snap
@@ -30,7 +30,7 @@ exports[`<SetIdServer /> renders expected fields 1`] = `
         >
           <label
             class="_label_19upo_59"
-            for="radix-«r0»"
+            for="radix-_r_0_"
           >
             Enter a new identity server
           </label>
@@ -39,7 +39,7 @@ exports[`<SetIdServer /> renders expected fields 1`] = `
           >
             <input
               class="_control_sqdq4_10"
-              id="radix-«r0»"
+              id="radix-_r_0_"
               name="input"
               placeholder=""
               title=""
diff --git a/test/unit-tests/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap b/test/unit-tests/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap
index 01f5b8b097..6290e0ed59 100644
--- a/test/unit-tests/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap
@@ -32,7 +32,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             >
               <input
                 class="_input_19o42_24"
-                id="radix-«r28»"
+                id="radix-_r_28_"
                 name="systemTheme"
                 role="switch"
                 title=""
@@ -48,7 +48,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r28»"
+              for="radix-_r_28_"
             >
               Match system theme
             </label>
@@ -70,7 +70,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
               <input
                 checked=""
                 class="_input_1e0uz_18"
-                id="radix-«r29»"
+                id="radix-_r_29_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -86,7 +86,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r29»"
+              for="radix-_r_29_"
             >
               Light
             </label>
@@ -103,7 +103,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r2a»"
+                id="radix-_r_2a_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -119,7 +119,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r2a»"
+              for="radix-_r_2a_"
             >
               Dark
             </label>
@@ -136,7 +136,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r2b»"
+                id="radix-_r_2b_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -152,7 +152,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r2b»"
+              for="radix-_r_2b_"
             >
               High contrast
             </label>
@@ -169,7 +169,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r2c»"
+                id="radix-_r_2c_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -185,7 +185,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r2c»"
+              for="radix-_r_2c_"
             >
               Alice theme
             </label>
@@ -203,7 +203,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r2d»"
+              for="radix-_r_2d_"
             >
               Add custom theme
             </label>
@@ -211,9 +211,9 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
               class="_controls_17lij_8"
             >
               <input
-                aria-describedby="radix-«r2e»"
+                aria-describedby="radix-_r_2e_"
                 class="_control_sqdq4_10"
-                id="radix-«r2d»"
+                id="radix-_r_2d_"
                 name="input"
                 title=""
                 value=""
@@ -221,7 +221,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             </div>
             <span
               class="_message_19upo_85 _help-message_19upo_91"
-              id="radix-«r2e»"
+              id="radix-_r_2e_"
             >
               Enter the URL of a custom theme you want to apply.
             </span>
@@ -241,7 +241,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
             </span>
             <button
               aria-label="Delete"
-              aria-labelledby="«r2f»"
+              aria-labelledby="_r_2f_"
               class="_icon-button_1pz9o_8 _destructive_1pz9o_95"
               data-kind="primary"
               role="button"
@@ -311,7 +311,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             >
               <input
                 class="_input_19o42_24"
-                id="radix-«r10»"
+                id="radix-_r_10_"
                 name="systemTheme"
                 role="switch"
                 title=""
@@ -327,7 +327,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r10»"
+              for="radix-_r_10_"
             >
               Match system theme
             </label>
@@ -349,7 +349,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
               <input
                 checked=""
                 class="_input_1e0uz_18"
-                id="radix-«r11»"
+                id="radix-_r_11_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -365,7 +365,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r11»"
+              for="radix-_r_11_"
             >
               Light
             </label>
@@ -382,7 +382,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r12»"
+                id="radix-_r_12_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -398,7 +398,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r12»"
+              for="radix-_r_12_"
             >
               Dark
             </label>
@@ -415,7 +415,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r13»"
+                id="radix-_r_13_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -431,7 +431,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r13»"
+              for="radix-_r_13_"
             >
               High contrast
             </label>
@@ -448,7 +448,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r14»"
+                id="radix-_r_14_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -464,7 +464,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r14»"
+              for="radix-_r_14_"
             >
               Alice theme
             </label>
@@ -482,7 +482,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r15»"
+              for="radix-_r_15_"
             >
               Add custom theme
             </label>
@@ -490,9 +490,9 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
               class="_controls_17lij_8"
             >
               <input
-                aria-describedby="radix-«r16»"
+                aria-describedby="radix-_r_16_"
                 class="_control_sqdq4_10"
-                id="radix-«r15»"
+                id="radix-_r_15_"
                 name="input"
                 title=""
                 value=""
@@ -500,7 +500,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             </div>
             <span
               class="_message_19upo_85 _help-message_19upo_91"
-              id="radix-«r16»"
+              id="radix-_r_16_"
             >
               Enter the URL of a custom theme you want to apply.
             </span>
@@ -520,7 +520,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
             </span>
             <button
               aria-label="Delete"
-              aria-labelledby="«r17»"
+              aria-labelledby="_r_17_"
               class="_icon-button_1pz9o_8 _destructive_1pz9o_95"
               data-kind="primary"
               role="button"
@@ -590,7 +590,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
             >
               <input
                 class="_input_19o42_24"
-                id="radix-«r0»"
+                id="radix-_r_0_"
                 name="systemTheme"
                 role="switch"
                 title=""
@@ -606,7 +606,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
           >
             <label
               class="_label_19upo_59"
-              for="radix-«r0»"
+              for="radix-_r_0_"
             >
               Match system theme
             </label>
@@ -628,7 +628,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
               <input
                 checked=""
                 class="_input_1e0uz_18"
-                id="radix-«r1»"
+                id="radix-_r_1_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -644,7 +644,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r1»"
+              for="radix-_r_1_"
             >
               Light
             </label>
@@ -661,7 +661,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r2»"
+                id="radix-_r_2_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -677,7 +677,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r2»"
+              for="radix-_r_2_"
             >
               Dark
             </label>
@@ -694,7 +694,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
             >
               <input
                 class="_input_1e0uz_18"
-                id="radix-«r3»"
+                id="radix-_r_3_"
                 name="themeSelector"
                 title=""
                 type="radio"
@@ -710,7 +710,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
           >
             <label
               class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-              for="radix-«r3»"
+              for="radix-_r_3_"
             >
               High contrast
             </label>
diff --git a/test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceListHeader-test.tsx.snap b/test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceListHeader-test.tsx.snap
index 5d99112dd5..37e3663eb0 100644
--- a/test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceListHeader-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceListHeader-test.tsx.snap
@@ -23,7 +23,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when all devices are sel
             >
               <input
                 aria-label="Deselect all"
-                aria-labelledby="«r9»"
+                aria-labelledby="_r_9_"
                 checked=""
                 class="_input_1hel1_18"
                 data-testid="device-select-all-checkbox"
@@ -89,7 +89,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when no devices are sele
             >
               <input
                 aria-label="Select all"
-                aria-labelledby="«r0»"
+                aria-labelledby="_r_0_"
                 class="_input_1hel1_18"
                 data-testid="device-select-all-checkbox"
                 id="device-select-all-checkbox"
diff --git a/test/unit-tests/components/views/settings/encryption/__snapshots__/AdvancedPanel-test.tsx.snap b/test/unit-tests/components/views/settings/encryption/__snapshots__/AdvancedPanel-test.tsx.snap
index 712f22f760..60bb86e19f 100644
--- a/test/unit-tests/components/views/settings/encryption/__snapshots__/AdvancedPanel-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/encryption/__snapshots__/AdvancedPanel-test.tsx.snap
@@ -219,10 +219,10 @@ exports[`<AdvancedPanel /> <OtherSettings /> should display the blacklist of unv
         class="_container_19o42_10"
       >
         <input
-          aria-describedby="radix-«r7»"
+          aria-describedby="radix-_r_7_"
           checked=""
           class="_input_19o42_24"
-          id="radix-«r6»"
+          id="radix-_r_6_"
           name="neverSendEncrypted"
           role="switch"
           title=""
@@ -238,13 +238,13 @@ exports[`<AdvancedPanel /> <OtherSettings /> should display the blacklist of unv
     >
       <label
         class="_label_19upo_59"
-        for="radix-«r6»"
+        for="radix-_r_6_"
       >
         In encrypted rooms, only send messages to verified users
       </label>
       <span
         class="_message_19upo_85 _help-message_19upo_91"
-        id="radix-«r7»"
+        id="radix-_r_7_"
       >
         Warning: users who have not explicitly verified with you (e.g. using emoji) will not receive your encrypted messages. Also, unverified devices of verified users will not receive your encrypted messages.
       </span>
diff --git a/test/unit-tests/components/views/settings/encryption/__snapshots__/ChangeRecoveryKey-test.tsx.snap b/test/unit-tests/components/views/settings/encryption/__snapshots__/ChangeRecoveryKey-test.tsx.snap
index f732184548..13b2e86cab 100644
--- a/test/unit-tests/components/views/settings/encryption/__snapshots__/ChangeRecoveryKey-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/encryption/__snapshots__/ChangeRecoveryKey-test.tsx.snap
@@ -256,25 +256,25 @@ exports[`<ChangeRecoveryKey /> flow to set up a recovery key should ask the user
       >
         <label
           class="_label_19upo_59"
-          for="radix-«r0»"
+          for="radix-_r_0_"
         >
           Enter recovery key
         </label>
         <div
           class="_container_1s836_8 mx_KeyForm_password mx_no_textinput"
-          id="«r1»"
+          id="_r_1_"
         >
           <input
             class="_control_sqdq4_10 _control_1s836_13"
-            id="radix-«r0»"
+            id="radix-_r_0_"
             name="recoveryKey"
             required=""
             title="Enter recovery key"
             type="password"
           />
           <button
-            aria-controls="«r1»"
-            aria-labelledby="«r2»"
+            aria-controls="_r_1_"
+            aria-labelledby="_r_2_"
             class="_action_1s836_24"
             type="button"
           >
@@ -417,28 +417,28 @@ exports[`<ChangeRecoveryKey /> flow to set up a recovery key should ask the user
         <label
           class="_label_19upo_59"
           data-invalid="true"
-          for="radix-«r0»"
+          for="radix-_r_0_"
         >
           Enter recovery key
         </label>
         <div
           class="_container_1s836_8 mx_KeyForm_password mx_no_textinput"
-          id="«r1»"
+          id="_r_1_"
         >
           <input
-            aria-describedby="radix-«r8»"
+            aria-describedby="radix-_r_8_"
             aria-invalid="true"
             class="_control_sqdq4_10 _control_1s836_13"
             data-invalid="true"
-            id="radix-«r0»"
+            id="radix-_r_0_"
             name="recoveryKey"
             required=""
             title="Enter recovery key"
             type="password"
           />
           <button
-            aria-controls="«r1»"
-            aria-labelledby="«r2»"
+            aria-controls="_r_1_"
+            aria-labelledby="_r_2_"
             class="_action_1s836_24"
             type="button"
           >
@@ -458,7 +458,7 @@ exports[`<ChangeRecoveryKey /> flow to set up a recovery key should ask the user
         </div>
         <span
           class="_message_19upo_85 _error-message_19upo_95"
-          id="radix-«r8»"
+          id="radix-_r_8_"
         >
           <svg
             fill="currentColor"
diff --git a/test/unit-tests/components/views/settings/notifications/__snapshots__/Notifications2-test.tsx.snap b/test/unit-tests/components/views/settings/notifications/__snapshots__/Notifications2-test.tsx.snap
index dd13f0068d..60564c9290 100644
--- a/test/unit-tests/components/views/settings/notifications/__snapshots__/Notifications2-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/notifications/__snapshots__/Notifications2-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
 <div>
@@ -21,7 +21,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r17»"
+                id="mx_LabelledToggleSwitch__r_17_"
               >
                 Enable notifications for this account
               </div>
@@ -29,7 +29,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
             <div
               aria-checked="true"
               aria-disabled="true"
-              aria-labelledby="mx_LabelledToggleSwitch_«r17»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_17_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on"
               role="switch"
               tabindex="0"
@@ -46,7 +46,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r18»"
+                id="mx_LabelledToggleSwitch__r_18_"
               >
                 Enable desktop notifications for this session
               </div>
@@ -54,7 +54,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
             <div
               aria-checked="false"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r18»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_18_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -71,7 +71,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r19»"
+                id="mx_LabelledToggleSwitch__r_19_"
               >
                 Show message preview in desktop notification
               </div>
@@ -79,7 +79,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
             <div
               aria-checked="false"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r19»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_19_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -96,7 +96,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r1a»"
+                id="mx_LabelledToggleSwitch__r_1a_"
               >
                 Enable audible notifications for this session
               </div>
@@ -104,7 +104,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
             <div
               aria-checked="true"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r1a»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_1a_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -758,7 +758,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«r24»"
+                        aria-describedby="_r_24_"
                         checked=""
                         class="_input_1hel1_18"
                         disabled=""
@@ -798,7 +798,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«r24»"
+                      id="_r_24_"
                     >
                       Enter keywords here, or use for spelling variations or nicknames
                     </span>
@@ -998,7 +998,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r0»"
+                id="mx_LabelledToggleSwitch__r_0_"
               >
                 Enable notifications for this account
               </div>
@@ -1006,7 +1006,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
             <div
               aria-checked="true"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r0»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_0_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -1023,7 +1023,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r1»"
+                id="mx_LabelledToggleSwitch__r_1_"
               >
                 Enable desktop notifications for this session
               </div>
@@ -1031,7 +1031,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
             <div
               aria-checked="false"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r1»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_1_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -1048,7 +1048,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r2»"
+                id="mx_LabelledToggleSwitch__r_2_"
               >
                 Show message preview in desktop notification
               </div>
@@ -1056,7 +1056,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
             <div
               aria-checked="false"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r2»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_2_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -1073,7 +1073,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
               class="mx_SettingsFlag_label"
             >
               <div
-                id="mx_LabelledToggleSwitch_«r3»"
+                id="mx_LabelledToggleSwitch__r_3_"
               >
                 Enable audible notifications for this session
               </div>
@@ -1081,7 +1081,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
             <div
               aria-checked="true"
               aria-disabled="false"
-              aria-labelledby="mx_LabelledToggleSwitch_«r3»"
+              aria-labelledby="mx_LabelledToggleSwitch__r_3_"
               class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
               role="switch"
               tabindex="0"
@@ -1724,7 +1724,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rt»"
+                        aria-describedby="_r_t_"
                         checked=""
                         class="_input_1hel1_18"
                         id="checkbox_kBerF1ejc4"
@@ -1763,7 +1763,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rt»"
+                      id="_r_t_"
                     >
                       Enter keywords here, or use for spelling variations or nicknames
                     </span>
diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap
index 3fb77c7205..96984b5565 100644
--- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap
@@ -46,7 +46,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       <input
                         class="_input_1e0uz_18"
                         disabled=""
-                        id="radix-«r0»"
+                        id="radix-_r_0_"
                         name="themeSelector"
                         title=""
                         type="radio"
@@ -62,7 +62,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   >
                     <label
                       class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-                      for="radix-«r0»"
+                      for="radix-_r_0_"
                     >
                       Light
                     </label>
@@ -80,7 +80,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       <input
                         class="_input_1e0uz_18"
                         disabled=""
-                        id="radix-«r1»"
+                        id="radix-_r_1_"
                         name="themeSelector"
                         title=""
                         type="radio"
@@ -96,7 +96,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   >
                     <label
                       class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-                      for="radix-«r1»"
+                      for="radix-_r_1_"
                     >
                       Dark
                     </label>
@@ -114,7 +114,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       <input
                         class="_input_1e0uz_18"
                         disabled=""
-                        id="radix-«r2»"
+                        id="radix-_r_2_"
                         name="themeSelector"
                         title=""
                         type="radio"
@@ -130,7 +130,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   >
                     <label
                       class="_label_19upo_59 mx_ThemeChoicePanel_themeSelector_Label"
-                      for="radix-«r2»"
+                      for="radix-_r_2_"
                     >
                       High contrast
                     </label>
@@ -170,7 +170,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   <label
                     aria-label="Modern"
                     class="_label_19upo_59"
-                    for="radix-«r3»"
+                    for="radix-_r_3_"
                   >
                     <div
                       class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -181,7 +181,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                         <input
                           checked=""
                           class="_input_1e0uz_18"
-                          id="radix-«r3»"
+                          id="radix-_r_3_"
                           name="layout"
                           title=""
                           type="radio"
@@ -298,7 +298,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   <label
                     aria-label="Message bubbles"
                     class="_label_19upo_59"
-                    for="radix-«rc»"
+                    for="radix-_r_c_"
                   >
                     <div
                       class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -308,7 +308,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       >
                         <input
                           class="_input_1e0uz_18"
-                          id="radix-«rc»"
+                          id="radix-_r_c_"
                           name="layout"
                           title=""
                           type="radio"
@@ -425,7 +425,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   <label
                     aria-label="IRC (experimental)"
                     class="_label_19upo_59"
-                    for="radix-«rl»"
+                    for="radix-_r_l_"
                   >
                     <div
                       class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@@ -435,7 +435,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       >
                         <input
                           class="_input_1e0uz_18"
-                          id="radix-«rl»"
+                          id="radix-_r_l_"
                           name="layout"
                           title=""
                           type="radio"
@@ -560,9 +560,9 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                       class="_container_19o42_10"
                     >
                       <input
-                        aria-describedby="radix-«rv»"
+                        aria-describedby="radix-_r_v_"
                         class="_input_19o42_24"
-                        id="radix-«ru»"
+                        id="radix-_r_u_"
                         name="compactLayout"
                         role="switch"
                         title=""
@@ -578,13 +578,13 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
                   >
                     <label
                       class="_label_19upo_59"
-                      for="radix-«ru»"
+                      for="radix-_r_u_"
                     >
                       Show compact text and messages
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="radix-«rv»"
+                      id="radix-_r_v_"
                     >
                       Modern layout must be selected to use this feature.
                     </span>
diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap
index 654b04efeb..76693b7154 100644
--- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap
@@ -1168,7 +1168,7 @@ exports[`PreferencesUserSettingsTab should render 1`] = `
                     class="mx_SettingsFlag_label"
                   >
                     <div
-                      id="mx_LabelledToggleSwitch_«r8»"
+                      id="mx_LabelledToggleSwitch__r_8_"
                     >
                       Hide avatars of room and inviter
                     </div>
@@ -1176,7 +1176,7 @@ exports[`PreferencesUserSettingsTab should render 1`] = `
                   <div
                     aria-checked="false"
                     aria-disabled="false"
-                    aria-labelledby="mx_LabelledToggleSwitch_«r8»"
+                    aria-labelledby="mx_LabelledToggleSwitch__r_8_"
                     class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
                     role="switch"
                     tabindex="0"
@@ -1194,13 +1194,13 @@ exports[`PreferencesUserSettingsTab should render 1`] = `
                 >
                   <label
                     class="_label_19upo_59"
-                    for="radix-«r9»"
+                    for="radix-_r_9_"
                   >
                     Show media in timeline
                   </label>
                   <span
                     class="_message_19upo_85 _help-message_19upo_91 mx_MediaPreviewAccountSetting_RadioHelp"
-                    id="radix-«ra»"
+                    id="radix-_r_a_"
                   >
                     A hidden media can always be shown by tapping on it
                   </span>
@@ -1307,7 +1307,7 @@ exports[`PreferencesUserSettingsTab should render 1`] = `
                     class="mx_SettingsFlag_label"
                   >
                     <div
-                      id="mx_LabelledToggleSwitch_«re»"
+                      id="mx_LabelledToggleSwitch__r_e_"
                     >
                       Allow users to invite you to rooms
                     </div>
@@ -1316,7 +1316,7 @@ exports[`PreferencesUserSettingsTab should render 1`] = `
                     aria-checked="true"
                     aria-disabled="true"
                     aria-label="Your server does not implement this feature."
-                    aria-labelledby="mx_LabelledToggleSwitch_«re»"
+                    aria-labelledby="mx_LabelledToggleSwitch__r_e_"
                     class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on"
                     role="switch"
                     tabindex="0"
diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
index 50931681f5..b341d797ca 100644
--- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
@@ -213,7 +213,7 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
                     >
                       <label
                         class="_label_19upo_59"
-                        for="radix-«r1»"
+                        for="radix-_r_1_"
                       >
                         Enter a new identity server
                       </label>
@@ -222,7 +222,7 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
                       >
                         <input
                           class="_control_sqdq4_10"
-                          id="radix-«r1»"
+                          id="radix-_r_1_"
                           name="input"
                           placeholder=""
                           title=""
diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap
index 5fbeb9d2f4..d967e18df7 100644
--- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<SessionManagerTab /> Device verification does not allow device verification on session that do not support encryption 1`] = `
 HTMLCollection [
@@ -397,7 +397,7 @@ exports[`<SessionManagerTab /> goes to filtered list from security recommendatio
           >
             <input
               aria-label="Select all"
-              aria-labelledby="«r4q»"
+              aria-labelledby="_r_4q_"
               class="_input_1hel1_18"
               data-testid="device-select-all-checkbox"
               id="device-select-all-checkbox"
diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SidebarUserSettingsTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SidebarUserSettingsTab-test.tsx.snap
index 0da3d42ccc..a8f15ced40 100644
--- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SidebarUserSettingsTab-test.tsx.snap
+++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SidebarUserSettingsTab-test.tsx.snap
@@ -51,7 +51,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«r1»"
+                        aria-describedby="_r_1_"
                         checked=""
                         class="_input_1hel1_18"
                         disabled=""
@@ -99,7 +99,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«r1»"
+                      id="_r_1_"
                     >
                       Home is useful for getting an overview of everything.
                     </span>
@@ -119,7 +119,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«r5»"
+                        aria-describedby="_r_5_"
                         class="_input_1hel1_18"
                         data-testid="mx_SidebarUserSettingsTab_homeAllRoomsCheckbox"
                         id="checkbox_38QgU2Pomx"
@@ -154,7 +154,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«r5»"
+                      id="_r_5_"
                     >
                       Show all your rooms in Home, even if they're in a space.
                     </span>
@@ -174,7 +174,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«r9»"
+                        aria-describedby="_r_9_"
                         class="_input_1hel1_18"
                         id="checkbox_wKpa6hpi3Y"
                         type="checkbox"
@@ -208,7 +208,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«r9»"
+                      id="_r_9_"
                     >
                       Group all your rooms that aren't part of a space in one place.
                     </span>
@@ -228,7 +228,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rd»"
+                        aria-describedby="_r_d_"
                         class="_input_1hel1_18"
                         id="checkbox_EetmBG4yVC"
                         type="checkbox"
@@ -274,7 +274,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings with guest spa url
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rd»"
+                      id="_r_d_"
                     >
                       Group all private video rooms and conferences. In conferences you can invite people outside of matrix.
                     </span>
@@ -341,7 +341,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rh»"
+                        aria-describedby="_r_h_"
                         checked=""
                         class="_input_1hel1_18"
                         disabled=""
@@ -389,7 +389,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rh»"
+                      id="_r_h_"
                     >
                       Home is useful for getting an overview of everything.
                     </span>
@@ -409,7 +409,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rl»"
+                        aria-describedby="_r_l_"
                         class="_input_1hel1_18"
                         data-testid="mx_SidebarUserSettingsTab_homeAllRoomsCheckbox"
                         id="checkbox_38QgU2Pomx"
@@ -444,7 +444,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rl»"
+                      id="_r_l_"
                     >
                       Show all your rooms in Home, even if they're in a space.
                     </span>
@@ -464,7 +464,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rp»"
+                        aria-describedby="_r_p_"
                         class="_input_1hel1_18"
                         id="checkbox_wKpa6hpi3Y"
                         type="checkbox"
@@ -498,7 +498,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rp»"
+                      id="_r_p_"
                     >
                       Group all your rooms that aren't part of a space in one place.
                     </span>
@@ -518,7 +518,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                       class="_container_1hel1_10"
                     >
                       <input
-                        aria-describedby="«rt»"
+                        aria-describedby="_r_t_"
                         class="_input_1hel1_18"
                         id="checkbox_EetmBG4yVC"
                         type="checkbox"
@@ -564,7 +564,7 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings without guest spa u
                     </label>
                     <span
                       class="_message_19upo_85 _help-message_19upo_91"
-                      id="«rt»"
+                      id="_r_t_"
                     >
                       Group all private video rooms and conferences.
                     </span>
diff --git a/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap b/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap
index c5260609d8..197472b248 100644
--- a/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap
+++ b/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap
@@ -3,8 +3,8 @@
 exports[`<SpacePanel /> should show all activated MetaSpaces in the correct order 1`] = `
 <DocumentFragment>
   <nav
-    aria-controls="«r2»"
-    aria-describedby="«r2»"
+    aria-controls="_r_2_"
+    aria-describedby="_r_2_"
     aria-haspopup="dialog"
     aria-label="Spaces"
     class="mx_SpacePanel collapsed newUi"
@@ -237,11 +237,11 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
         aria-expanded="false"
         aria-haspopup="menu"
         aria-label="Threads"
-        aria-labelledby="«r16»"
+        aria-labelledby="_r_16_"
         class="_icon-button_1pz9o_8 mx_ThreadsActivityCentreButton"
         data-kind="primary"
         data-state="closed"
-        id="radix-«r14»"
+        id="radix-_r_14_"
         role="button"
         style="--cpd-icon-button-size: 32px;"
         tabindex="0"
@@ -289,7 +289,7 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
     tabindex="0"
   />
   <span
-    aria-owns="«r1j»"
+    aria-owns="_r_1j_"
     data-floating-ui-inert=""
     style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
   />
diff --git a/test/unit-tests/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap b/test/unit-tests/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap
index 9e9ab218bc..006cc91a5d 100644
--- a/test/unit-tests/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap
+++ b/test/unit-tests/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap
@@ -4,7 +4,7 @@ exports[`<SpaceSettingsVisibilityTab /> for a public space Access renders guest
 <div
   aria-checked="true"
   aria-disabled="false"
-  aria-labelledby="mx_LabelledToggleSwitch_«rb»"
+  aria-labelledby="mx_LabelledToggleSwitch__r_b_"
   class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
   role="switch"
   tabindex="0"
@@ -122,7 +122,7 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
                     class="mx_SettingsFlag_label"
                   >
                     <div
-                      id="mx_LabelledToggleSwitch_«r0»"
+                      id="mx_LabelledToggleSwitch__r_0_"
                     >
                       Preview Space
                     </div>
@@ -130,7 +130,7 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
                   <div
                     aria-checked="true"
                     aria-disabled="false"
-                    aria-labelledby="mx_LabelledToggleSwitch_«r0»"
+                    aria-labelledby="mx_LabelledToggleSwitch__r_0_"
                     class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
                     role="switch"
                     tabindex="0"
diff --git a/test/unit-tests/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap b/test/unit-tests/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
index c0a64d5589..c79e960608 100644
--- a/test/unit-tests/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
+++ b/test/unit-tests/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] = `
 <div
-  aria-labelledby="radix-«r1m»"
+  aria-labelledby="radix-_r_1m_"
   aria-orientation="vertical"
   class="_menu_1glhz_8"
   data-align="start"
@@ -11,14 +11,14 @@ exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] =
   data-side="top"
   data-state="open"
   dir="ltr"
-  id="radix-«r1n»"
+  id="radix-_r_1n_"
   role="menu"
   style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
   tabindex="-1"
 >
   <h3
     class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 _menu-title_1sgvx_8 _title_1glhz_74"
-    id="«r1u»"
+    id="_r_1u_"
   >
     Threads activity
   </h3>
@@ -127,7 +127,7 @@ exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] =
 
 exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
 <div
-  aria-labelledby="radix-«r2a»"
+  aria-labelledby="radix-_r_2a_"
   aria-orientation="vertical"
   class="_menu_1glhz_8"
   data-align="start"
@@ -136,14 +136,14 @@ exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
   data-side="top"
   data-state="open"
   dir="ltr"
-  id="radix-«r2b»"
+  id="radix-_r_2b_"
   role="menu"
   style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
   tabindex="-1"
 >
   <h3
     class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 _menu-title_1sgvx_8 _title_1glhz_74"
-    id="«r2i»"
+    id="_r_2i_"
   >
     Threads activity
   </h3>
@@ -161,7 +161,7 @@ exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
 
 exports[`ThreadsActivityCentre should order the room with the same notification level by most recent 1`] = `
 <div
-  aria-labelledby="radix-«r2j»"
+  aria-labelledby="radix-_r_2j_"
   aria-orientation="vertical"
   class="_menu_1glhz_8"
   data-align="start"
@@ -170,14 +170,14 @@ exports[`ThreadsActivityCentre should order the room with the same notification
   data-side="top"
   data-state="open"
   dir="ltr"
-  id="radix-«r2k»"
+  id="radix-_r_2k_"
   role="menu"
   style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
   tabindex="-1"
 >
   <h3
     class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 _menu-title_1sgvx_8 _title_1glhz_74"
-    id="«r2r»"
+    id="_r_2r_"
   >
     Threads activity
   </h3>
diff --git a/test/unit-tests/renderer/__snapshots__/link-tooltip-test.tsx.snap b/test/unit-tests/renderer/__snapshots__/link-tooltip-test.tsx.snap
index 9abf48919c..ae6b805d8f 100644
--- a/test/unit-tests/renderer/__snapshots__/link-tooltip-test.tsx.snap
+++ b/test/unit-tests/renderer/__snapshots__/link-tooltip-test.tsx.snap
@@ -14,7 +14,7 @@ exports[`link-tooltip wraps single anchor 1`] = `
     
                 
     <span
-      aria-labelledby="«r0»"
+      aria-labelledby="_r_0_"
       tabindex="0"
     >
       <a
diff --git a/yarn.lock b/yarn.lock
index 3e7a41a306..aea018e1b7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3705,10 +3705,10 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react-dom@19.1.9":
-  version "19.1.9"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-19.1.9.tgz#5ab695fce1e804184767932365ae6569c11b4b4b"
-  integrity sha512-qXRuZaOsAdXKFyOhRBg6Lqqc0yay13vN7KrIg4L7N4aaHN68ma9OK3NE1BoDFgFOTfM7zg+3/8+2n8rLUH3OKQ==
+"@types/react-dom@19.2.1":
+  version "19.2.1"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-19.2.1.tgz#2a16d84466e5cbaab97809f3e6f3bded6b5dbac7"
+  integrity sha512-/EEvYBdT3BflCWvTMO7YkYBHVE9Ci6XdqZciZANQgKpaiDRGOLIlRo91jbTNRQjgPFWVaRxcYc0luVNFitz57A==
 
 "@types/react-redux@^7.1.20":
   version "7.1.34"
@@ -3725,10 +3725,10 @@
   resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.12.tgz#b5d76568485b02a307238270bfe96cb51ee2a044"
   integrity sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==
 
-"@types/react@*", "@types/react@19.1.14":
-  version "19.1.14"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-19.1.14.tgz#154e157c014cb02b90201250b009ecad28fbad9f"
-  integrity sha512-ukd93VGzaNPMAUPy0gRDSC57UuQbnH9Kussp7HBjM06YFi9uZTFhOvMSO2OKqXm1rSgzOE+pVx1k1PYHGwlc8Q==
+"@types/react@*", "@types/react@19.2.2":
+  version "19.2.2"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-19.2.2.tgz#ba123a75d4c2a51158697160a4ea2ff70aa6bf36"
+  integrity sha512-6mDvHUFSjyT2B2yeNx2nUgMxh9LtOWvkhIU3uePn2I2oyNymUAX1NIsdgviM4CH+JSrp2D2hsMvJOkxY+0wNRA==
   dependencies:
     csstype "^3.0.2"
 
@@ -11481,11 +11481,11 @@ react-docgen@^8.0.0:
     strip-indent "^4.0.0"
 
 react-dom@^19.0.0:
-  version "19.1.1"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-19.1.1.tgz#2daa9ff7f3ae384aeb30e76d5ee38c046dc89893"
-  integrity sha512-Dlq/5LAZgF0Gaz6yiqZCf6VCcZs1ghAJyrsu84Q/GT0gV+mCxbfmKNoGRKBYMJ8IEdGPqu49YWXD02GCknEDkw==
+  version "19.2.0"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-19.2.0.tgz#00ed1e959c365e9a9d48f8918377465466ec3af8"
+  integrity sha512-UlbRu4cAiGaIewkPyiRGJk0imDN2T3JjieT6spoL2UeSf5od4n5LB/mQ4ejmxhCFT1tYe8IvaFulzynWovsEFQ==
   dependencies:
-    scheduler "^0.26.0"
+    scheduler "^0.27.0"
 
 react-focus-lock@^2.5.1:
   version "2.13.6"
@@ -11499,10 +11499,10 @@ react-focus-lock@^2.5.1:
     use-callback-ref "^1.3.3"
     use-sidecar "^1.1.3"
 
-react-is@19.1.1, react-is@^17.0.1, react-is@^18.0.0:
-  version "19.1.1"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-19.1.1.tgz#038ebe313cf18e1fd1235d51c87360eb87f7c36a"
-  integrity sha512-tr41fA15Vn8p4X9ntI+yCyeGSf1TlYaY5vlTZfQmeLBrFo3psOPX6HhTDnFNL9uj3EhP0KAQ80cugCl4b4BERA==
+react-is@19.2.0, react-is@^17.0.1, react-is@^18.0.0:
+  version "19.2.0"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-19.2.0.tgz#ddc3b4a4e0f3336c3847f18b806506388d7b9973"
+  integrity sha512-x3Ax3kNSMIIkyVYhWPyO09bu0uttcAIoecO/um/rKGQ4EltYWVYtyiGkS/3xMynrbVQdS69Jhlv8FXUEZehlzA==
 
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
@@ -11584,9 +11584,9 @@ react-virtuoso@^4.14.0:
   integrity sha512-NRUF1ak8lY+Tvc6WN9cce59gU+lilzVtOozP+pm9J7iHshLGGjsiAB4rB2qlBPHjFbcXOQpT+7womNHGDUql8w==
 
 react@^19.0.0:
-  version "19.1.1"
-  resolved "https://registry.yarnpkg.com/react/-/react-19.1.1.tgz#06d9149ec5e083a67f9a1e39ce97b06a03b644af"
-  integrity sha512-w8nqGImo45dmMIfljjMwOGtbmC/mk4CMYhWIicdSflH91J9TyCyczcPFXJzrZ/ZXcgGRFeP6BU0BEJTw6tZdfQ==
+  version "19.2.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-19.2.0.tgz#d33dd1721698f4376ae57a54098cb47fc75d93a5"
+  integrity sha512-tmbWg6W31tQLeB5cdIBOicJDJRR2KzXsV7uSK9iNfLWQ5bIZfxuPEHp7M8wiHyHnn0DD1i7w3Zmin0FtkrwoCQ==
 
 read-cache@^1.0.0:
   version "1.0.0"
@@ -12027,10 +12027,10 @@ saxes@^6.0.0:
   dependencies:
     xmlchars "^2.2.0"
 
-scheduler@^0.26.0:
-  version "0.26.0"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.26.0.tgz#4ce8a8c2a2095f13ea11bf9a445be50c555d6337"
-  integrity sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA==
+scheduler@^0.27.0:
+  version "0.27.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.27.0.tgz#0c4ef82d67d1e5c1e359e8fc76d3a87f045fe5bd"
+  integrity sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==
 
 schema-utils@^3.0.0:
   version "3.3.0"