Stabilise React useId values in DOM snapshots in element-web (#33579)

* Stabilise React useId values in DOM snapshots - app/web

* Stabilise React useId values in DOM snapshots - shared components

* Update additional snapshots

* Added comments and changed replace pattern to 'react-use-id-N'
This commit is contained in:
rbondesson
2026-05-21 13:30:05 +01:00
committed by GitHub
parent 7ce368537b
commit 80024991aa
95 changed files with 1247 additions and 1173 deletions
@@ -42,7 +42,7 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
>
<input
class="_input_udcm8_24"
id="_r_b_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -56,13 +56,13 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
>
<label
class="_label_19upo_59"
for="_r_b_"
for="react-use-id-1"
>
Ignore user
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_d_"
id="radix-react-use-id-2"
>
You will not see any messages or room invites from this user.
</span>
@@ -79,7 +79,7 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
>
<input
class="_input_udcm8_24"
id="_r_e_"
id="react-use-id-3"
role="switch"
type="checkbox"
/>
@@ -93,13 +93,13 @@ exports[`ConfirmRejectInviteDialog can reject with options selected 1`] = `
>
<label
class="_label_19upo_59"
for="_r_e_"
for="react-use-id-3"
>
Report room
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_g_"
id="radix-react-use-id-4"
>
Report this room to your account provider.
</span>
@@ -127,7 +127,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
<input
checked=""
class="_input_udcm8_24"
id="_r_72_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -141,13 +141,13 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
>
<label
class="_label_19upo_59"
for="_r_72_"
for="react-use-id-1"
>
Enable end-to-end encryption
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_74_"
id="radix-react-use-id-2"
>
You can't disable this later. Bridges & most bots won't work yet.
</span>
@@ -172,7 +172,7 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
>
<input
class="_input_udcm8_24"
id="_r_75_"
id="react-use-id-3"
role="switch"
type="checkbox"
/>
@@ -186,13 +186,13 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
>
<label
class="_label_19upo_59"
for="_r_75_"
for="react-use-id-3"
>
Block anyone not part of server.org from ever joining this room.
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_77_"
id="radix-react-use-id-4"
>
You might enable this if the room will only be used for collaborating with internal teams on your homeserver. This cannot be changed later.
</span>
@@ -376,7 +376,7 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
<input
checked=""
class="_input_udcm8_24"
id="_r_7k_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -390,13 +390,13 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
>
<label
class="_label_19upo_59"
for="_r_7k_"
for="react-use-id-1"
>
Enable end-to-end encryption
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_7m_"
id="radix-react-use-id-2"
>
You can't disable this later. Bridges & most bots won't work yet.
</span>
@@ -413,7 +413,7 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
>
<input
class="_input_udcm8_24"
id="_r_7n_"
id="react-use-id-3"
role="switch"
type="checkbox"
/>
@@ -427,13 +427,13 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
>
<label
class="_label_19upo_59"
for="_r_7n_"
for="react-use-id-3"
>
Encrypt state events
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_7p_"
id="radix-react-use-id-4"
>
Enables experimental support for encrypting state events, which hides metadata such as room names and topics from the server. This metadata will also be hidden from people joining rooms later, and people whose clients do not support MSC4362.
</span>
@@ -618,7 +618,7 @@ exports[`<CreateRoomDialog /> for a private room when the state encryption labs
<input
checked=""
class="_input_udcm8_24"
id="_r_86_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -632,13 +632,13 @@ exports[`<CreateRoomDialog /> for a private room when the state encryption labs
>
<label
class="_label_19upo_59"
for="_r_86_"
for="react-use-id-1"
>
Enable end-to-end encryption
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_88_"
id="radix-react-use-id-2"
>
You can't disable this later. Bridges & most bots won't work yet.
</span>
@@ -655,7 +655,7 @@ exports[`<CreateRoomDialog /> for a private room when the state encryption labs
>
<input
class="_input_udcm8_24"
id="_r_89_"
id="react-use-id-3"
role="switch"
type="checkbox"
/>
@@ -669,13 +669,13 @@ exports[`<CreateRoomDialog /> for a private room when the state encryption labs
>
<label
class="_label_19upo_59"
for="_r_89_"
for="react-use-id-3"
>
Encrypt state events
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_8b_"
id="radix-react-use-id-4"
>
Enables experimental support for encrypting state events, which hides metadata such as room names and topics from the server. This metadata will also be hidden from people joining rooms later, and people whose clients do not support MSC4362.
</span>
@@ -41,14 +41,14 @@ exports[`CreateSectionDialog renders the dialog 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_0_"
for="radix-react-use-id-1"
>
Section name
</label>
<input
class="_control_d83jn_10"
id="radix-_r_0_"
id="radix-react-use-id-1"
name="sectionName"
required=""
title=""
@@ -34,7 +34,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
>
Room ID: !id
<button
aria-describedby="_r_2_"
aria-describedby="react-use-id-1"
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -268,7 +268,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_c_"
id="radix-react-use-id-2"
>
<span>
<span
@@ -290,7 +290,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_d_"
for="radix-react-use-id-3"
>
Element Call URL
</label>
@@ -299,7 +299,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
>
<input
class="_control_d83jn_10"
id="radix-_r_d_"
id="radix-react-use-id-3"
name="input"
title=""
value=""
@@ -74,7 +74,7 @@ exports[`LogoutDialog Prompts user to go to settings if there is a backup on the
</details>
</div>
<div
aria-describedby="_r_q_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -175,7 +175,7 @@ exports[`LogoutDialog Prompts user to go to settings if there is no backup on th
</details>
</div>
<div
aria-describedby="_r_10_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -88,7 +88,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
class="_container_153f2_10"
>
<input
aria-describedby="_r_5_"
aria-describedby="react-use-id-1"
class="_input_153f2_18"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
@@ -138,7 +138,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="_r_5_"
id="react-use-id-1"
>
0 members
</span>
@@ -113,7 +113,7 @@ exports[`<MessageEditHistory /> should match the snapshot 1`] = `
</div>
</div>
<div
aria-describedby="_r_2_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -366,7 +366,7 @@ exports[`<MessageEditHistory /> should support events with 1`] = `
</div>
</div>
<div
aria-describedby="_r_c_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -44,7 +44,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
/>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_9_"
id="radix-react-use-id-1"
>
Report this room to your account provider. If the messages are encrypted, your admin will not be able to read them.
</span>
@@ -76,7 +76,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
>
<input
class="_input_udcm8_24"
id="_r_a_"
id="react-use-id-2"
role="switch"
type="checkbox"
/>
@@ -90,7 +90,7 @@ exports[`ReportRoomDialog displays admin message 1`] = `
>
<label
class="_label_19upo_59"
for="_r_a_"
for="react-use-id-2"
>
Leave room
</label>
@@ -51,7 +51,7 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
class="mx_StyledRadioButton_content"
>
<span
aria-labelledby="_r_0_"
aria-labelledby="react-use-id-1"
class="mx_Login_underlinedServerName"
tabindex="0"
>
@@ -126,7 +126,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="_r_6_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -56,7 +56,7 @@ exports[`WidgetOpenIDPermissionsDialog should render 1`] = `
>
<input
class="_input_udcm8_24"
id="_r_0_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -70,7 +70,7 @@ exports[`WidgetOpenIDPermissionsDialog should render 1`] = `
>
<label
class="_label_19upo_59"
for="_r_0_"
for="react-use-id-1"
>
Remember this
</label>
@@ -704,7 +704,7 @@ exports[`<Users /> should render a user list 1`] = `
<input
checked=""
class="_input_udcm8_24"
id="_r_4_"
id="react-use-id-1"
role="switch"
type="checkbox"
/>
@@ -718,7 +718,7 @@ exports[`<Users /> should render a user list 1`] = `
>
<label
class="_label_19upo_59"
for="_r_4_"
for="react-use-id-1"
>
Only joined users
</label>
@@ -310,7 +310,7 @@ exports[`<RestoreKeyBackupDialog /> should render 1`] = `
</div>
</div>
<div
aria-describedby="_r_2_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -545,7 +545,7 @@ exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is ca
</div>
</div>
<div
aria-describedby="_r_k_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
@@ -624,7 +624,7 @@ exports[`<RestoreKeyBackupDialog /> should restore key backup when the key is in
</div>
</div>
<div
aria-describedby="_r_q_"
aria-describedby="react-use-id-1"
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"