sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Fix React hydration issues (#32958)

Browse Source 
* Add more playwright axe tests to settings dialogs

* Add utility to jest setupTests to detect React hydration errors

* Iterate jest utility

* Fix axe issue heading-order

* Fix div-in-p issues

* Fix setupTests.ts

* Fix heading order

* Make types happier

* Fix hydration issues of thead containing text nodes

* Update tests

* Fix form-in-form React hydration issues

* Fix li-in-li React hydration issues

* Fix checked in form without onChange React hydration issue

* Fix styling bleeding from _common.pcss

* Update snapshots

* Fix more remaining issues

* Remove _common.pcss h2 rule altogether

* Fix test

* Update snapshots

* Iterate

* Iterate

* Update snapshots

* Simplify diff

* Test

* Update screenshots

* Update screenshot
This commit is contained in:
Michael Telatynski
2026-04-16 13:35:40 +00:00
committed by GitHub
parent d7f5546294
commit 30f442208a
62 changed files with 2652 additions and 2579 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap
+90 -89
View File
@@ -378,114 +378,115 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
</svg>
</div>
</div>
<div
<ul
class="mx_SpaceHierarchy_subspace_children"
role="group"
/>
</li>
<li
aria-labelledby="_r_k_"
class="mx_SpaceHierarchy_roomTileWrapper"
role="treeitem"
>
<div
class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceHierarchy_roomTile_item"
<li
aria-labelledby="_r_k_"
class="mx_SpaceHierarchy_roomTileWrapper"
role="treeitem"
>
<div
class="mx_SpaceHierarchy_roomTile_avatar"
>
<span
class="_avatar_7h2br_8 mx_BaseAvatar _avatar-imageless_7h2br_55"
data-color="2"
data-testid="avatar-img"
data-type="round"
role="presentation"
style="--cpd-avatar-size: 20px;"
>
N
</span>
</div>
<div
class="mx_SpaceHierarchy_roomTile_name"
>
<span
id="_r_k_"
>
Nested room
</span>
</div>
<div
class="mx_SpaceHierarchy_roomTile_info"
>
3 members
</div>
</div>
<div
class="mx_SpaceHierarchy_actions"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
role="button"
tabindex="-1"
>
Join
</div>
<span
aria-labelledby="_r_l_"
tabindex="0"
>
<form
class="_root_19upo_16"
<div
class="mx_SpaceHierarchy_roomTile_item"
>
<div
class="_inline-field_19upo_32"
class="mx_SpaceHierarchy_roomTile_avatar"
>
<div
class="_inline-field-control_19upo_44"
<span
class="_avatar_7h2br_8 mx_BaseAvatar _avatar-imageless_7h2br_55"
data-color="2"
data-testid="avatar-img"
data-type="round"
role="presentation"
style="--cpd-avatar-size: 20px;"
>
N
</span>
</div>
<div
class="mx_SpaceHierarchy_roomTile_name"
>
<span
id="_r_k_"
>
Nested room
</span>
</div>
<div
class="mx_SpaceHierarchy_roomTile_info"
>
3 members
</div>
</div>
<div
class="mx_SpaceHierarchy_actions"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="-1"
>
Join
</div>
<span
aria-labelledby="_r_l_"
tabindex="0"
>
<form
class="_root_19upo_16"
>
<div
class="_container_153f2_10"
class="_inline-field_19upo_32"
>
<input
aria-labelledby="_r_k_"
class="_input_153f2_18"
disabled=""
id="checkbox_RD7nyrA2oh"
role="presentation"
tabindex="-1"
type="checkbox"
/>
<div
class="_ui_153f2_19"
class="_inline-field-control_19upo_44"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
<div
class="_container_153f2_10"
>
<path
d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
<input
aria-labelledby="_r_k_"
class="_input_153f2_18"
disabled=""
id="checkbox_RD7nyrA2oh"
role="presentation"
tabindex="-1"
type="checkbox"
/>
</svg>
<div
class="_ui_153f2_19"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
/>
</svg>
</div>
</div>
</div>
<div
class="_inline-field-body_19upo_38"
/>
</div>
</div>
<div
class="_inline-field-body_19upo_38"
/>
</div>
</form>
</span>
</div>
</div>
</form>
</span>
</div>
</div>
</li>
</ul>
</li>
<li
aria-labelledby="_r_t_"
@@ -967,7 +968,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> should not render cycles 1`] = `
</svg>
</div>
</div>
<div
<ul
class="mx_SpaceHierarchy_subspace_children"
role="group"
/>
apps/web/test/unit-tests/components/views/auth/__snapshots__/InteractiveAuthEntryComponents-test.tsx.snap
+2 -2
View File
@@ -19,14 +19,14 @@ exports[`<EmailIdentityAuthEntry/> should render 1`] = `
>
<span>
Did not receive it?
<div
<a
aria-label="Resend"
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Resend it
</div>
</a>
</span>
</p>
</div>
apps/web/test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap
+4 -4
View File
@@ -54,10 +54,10 @@ exports[`<BeaconListItem /> when a beacon is live and has locations renders beac
/>
</svg>
</a>
<div
<span
class="mx_CopyableText mx_ShareLatestLocation_copy"
>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -77,8 +77,8 @@ exports[`<BeaconListItem /> when a beacon is live and has locations renders beac
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</div>
</div>
<span
apps/web/test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap
+4 -4
View File
@@ -94,10 +94,10 @@ exports[`<DialogSidebar /> renders sidebar correctly with beacons 1`] = `
/>
</svg>
</a>
<div
<span
class="mx_CopyableText mx_ShareLatestLocation_copy"
>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -117,8 +117,8 @@ exports[`<DialogSidebar /> renders sidebar correctly with beacons 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</div>
</div>
<span
apps/web/test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap
+4 -4
View File
@@ -25,10 +25,10 @@ exports[`<ShareLatestLocation /> renders share buttons when there is a location
/>
</svg>
</a>
<div
<span
class="mx_CopyableText mx_ShareLatestLocation_copy"
>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -48,7 +48,7 @@ exports[`<ShareLatestLocation /> renders share buttons when there is a location
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</DocumentFragment>
`;
apps/web/test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
+4 -4
View File
@@ -29,11 +29,11 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
>
Toolbox
</div>
<div
<span
class="mx_CopyableText mx_DevTools_label_right"
>
Room ID: !id
<div
<button
aria-describedby="_r_2_"
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
@@ -54,8 +54,8 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
<div
class="mx_DevTools_label_bottom"
/>
apps/web/test/unit-tests/components/views/dialogs/devtools/__snapshots__/Crypto-test.tsx.snap
+28 -4
View File
@@ -5,7 +5,13 @@ exports[`<Crypto /> <CrossSigning /> should display when the cross-signing data
aria-label="Cross-signing"
>
<thead>
Cross-signing
<tr>
<th
colspan="2"
>
Cross-signing
</th>
</tr>
</thead>
<tbody>
<tr>
@@ -77,7 +83,13 @@ exports[`<Crypto /> <CrossSigning /> should display when the cross-signing data
aria-label="Cross-signing"
>
<thead>
Cross-signing
<tr>
<th
colspan="2"
>
Cross-signing
</th>
</tr>
</thead>
<tbody>
<tr>
@@ -149,7 +161,13 @@ exports[`<Crypto /> <KeyStorage /> should display when the key storage data are
aria-label="Key Storage"
>
<thead>
Key Storage
<tr>
<th
colspan="2"
>
Key Storage
</th>
</tr>
</thead>
<tbody>
<tr>
@@ -221,7 +239,13 @@ exports[`<Crypto /> <KeyStorage /> should display when the key storage data are
aria-label="Key Storage"
>
<thead>
Key Storage
<tr>
<th
colspan="2"
>
Key Storage
</th>
</tr>
</thead>
<tbody>
<tr>
apps/web/test/unit-tests/components/views/dialogs/devtools/__snapshots__/Users-test.tsx.snap
+52 -52
View File
@@ -7,11 +7,11 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
>
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
User ID: @alice:example.com
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -31,15 +31,15 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
Device ID: SIGNED
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -59,8 +59,8 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
Displayname:
@@ -95,11 +95,11 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
Device keys
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
ed25519: an_ed25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -119,15 +119,15 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
curve25519: a_curve25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -147,8 +147,8 @@ exports[`<Users /> should render a single device - signed by owner 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
</ul>
</li>
@@ -171,11 +171,11 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
>
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
User ID: @alice:example.com
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -195,15 +195,15 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
Device ID: UNSIGNED
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -223,8 +223,8 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
Displayname:
@@ -259,11 +259,11 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
Device keys
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
ed25519: an_ed25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -283,15 +283,15 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
curve25519: a_curve25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -311,8 +311,8 @@ exports[`<Users /> should render a single device - unsigned 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
</ul>
</li>
@@ -335,11 +335,11 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
>
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
User ID: @alice:example.com
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -359,15 +359,15 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
Device ID: VERIFIED
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -387,8 +387,8 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
Displayname:
@@ -425,11 +425,11 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
Device keys
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
ed25519: an_ed25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -449,15 +449,15 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
<div
<span
class="mx_CopyableText"
>
curve25519: a_curve25519_public_key
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -477,8 +477,8 @@ exports[`<Users /> should render a single device - verified by cross-signing 1`]
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
</ul>
</li>
@@ -501,11 +501,11 @@ exports[`<Users /> should render a single user 1`] = `
>
<ul>
<li>
<div
<span
class="mx_CopyableText"
>
User ID: @alice:example.com
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -525,8 +525,8 @@ exports[`<Users /> should render a single user 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</li>
<li>
Membership: join
apps/web/test/unit-tests/components/views/elements/__snapshots__/LearnMore-test.tsx.snap
+2 -2
View File
@@ -2,13 +2,13 @@
exports[`<LearnMore /> renders button 1`] = `
<div>
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
data-testid="testid"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</div>
`;
apps/web/test/unit-tests/components/views/messages/__snapshots__/TextualBody-test.tsx.snap
+6 -6
View File
@@ -59,7 +59,7 @@ exports[`<TextualBody /> renders formatted m.text correctly linkification is not
</code>
</div>
</pre>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_EventTile_button mx_EventTile_copyButton"
role="button"
@@ -79,7 +79,7 @@ exports[`<TextualBody /> renders formatted m.text correctly linkification is not
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</button>
</div>
@@ -278,7 +278,7 @@ exports[`<TextualBody /> renders formatted m.text correctly pills do not appear
</code>
</div>
</pre>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_EventTile_button mx_EventTile_copyButton"
role="button"
@@ -298,7 +298,7 @@ exports[`<TextualBody /> renders formatted m.text correctly pills do not appear
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</button>
</div>
@@ -482,7 +482,7 @@ num_sqrt = num **
/>
</svg>
</span>
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_EventTile_button mx_EventTile_copyButton mx_EventTile_buttonBottom"
role="button"
@@ -502,7 +502,7 @@ num_sqrt = num **
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</button>
</div>
apps/web/test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap
+8 -8
View File
@@ -99,11 +99,11 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
<p
class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 mx_UserInfo_profile_mxid"
>
<div
<span
class="mx_CopyableText"
>
customUserIdentifier
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -123,8 +123,8 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</p>
</div>
<div
@@ -401,11 +401,11 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
<p
class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 mx_UserInfo_profile_mxid"
>
<div
<span
class="mx_CopyableText"
>
customUserIdentifier
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -425,8 +425,8 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</p>
</div>
<div
apps/web/test/unit-tests/components/views/right_panel/user_info/__snapshots__/UserInfoHeaderView-test.tsx.snap
+4 -4
View File
@@ -48,11 +48,11 @@ exports[`<UserInfoHeaderView /> renders custom user identifiers in the header 1`
<p
class="_typography_6v6n8_153 _font-body-sm-semibold_6v6n8_36 mx_UserInfo_profile_mxid"
>
<div
<span
class="mx_CopyableText"
>
customUserIdentifier
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -72,8 +72,8 @@ exports[`<UserInfoHeaderView /> renders custom user identifiers in the header 1`
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</p>
</div>
<div
apps/web/test/unit-tests/components/views/settings/Notifications-test.tsx
+1 -7
View File
@@ -37,7 +37,6 @@ import {
import { mocked } from "jest-mock";
import userEvent from "@testing-library/user-event";
import { PushProcessor } from "matrix-js-sdk/src/pushprocessor";
import { Form } from "@vector-im/compound-web";
import Notifications from "../../../../../src/components/views/settings/Notifications";
import SettingsStore from "../../../../../src/settings/SettingsStore";
@@ -249,12 +248,7 @@ const pushRules: IPushRules = {
const flushPromises = async () => await new Promise((resolve) => window.setTimeout(resolve));
describe("<Notifications />", () => {
const getComponent = () =>
render(
<Form.Root>
<Notifications />
</Form.Root>,
);
const getComponent = () => render(<Notifications />);
// get component, wait for async data and force a render
const getComponentAndWait = async () => {
apps/web/test/unit-tests/components/views/settings/__snapshots__/Notifications-test.tsx.snap
+53 -53
View File
@@ -42,74 +42,74 @@ exports[`<Notifications /> main notification switches renders only enable notifi
</span>
</div>
</div>
<form
class="_root_19upo_16"
</form>
<form
class="_root_19upo_16"
>
<div
class="_inline-field_19upo_32"
>
<div
class="_inline-field_19upo_32"
class="_inline-field-control_19upo_44"
>
<div
class="_inline-field-control_19upo_44"
class="_container_udcm8_10"
>
<input
checked=""
class="_input_udcm8_24"
id="mx_SettingsFlag_testid_0"
role="switch"
type="checkbox"
/>
<div
class="_container_udcm8_10"
>
<input
checked=""
class="_input_udcm8_24"
id="mx_SettingsFlag_testid_0"
role="switch"
type="checkbox"
/>
<div
class="_ui_udcm8_34"
/>
</div>
</div>
<div
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="mx_SettingsFlag_testid_0"
>
Show all activity in the room list (dots or number of unread messages)
</label>
class="_ui_udcm8_34"
/>
</div>
</div>
<div
class="_inline-field_19upo_32"
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="mx_SettingsFlag_testid_0"
>
Show all activity in the room list (dots or number of unread messages)
</label>
</div>
</div>
<div
class="_inline-field_19upo_32"
>
<div
class="_inline-field-control_19upo_44"
>
<div
class="_inline-field-control_19upo_44"
class="_container_udcm8_10"
>
<input
checked=""
class="_input_udcm8_24"
id="mx_SettingsFlag_testid_1"
role="switch"
type="checkbox"
/>
<div
class="_container_udcm8_10"
>
<input
checked=""
class="_input_udcm8_24"
id="mx_SettingsFlag_testid_1"
role="switch"
type="checkbox"
/>
<div
class="_ui_udcm8_34"
/>
</div>
</div>
<div
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="mx_SettingsFlag_testid_1"
>
Only show notifications in the thread activity centre
</label>
class="_ui_udcm8_34"
/>
</div>
</div>
</form>
<div
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="mx_SettingsFlag_testid_1"
>
Only show notifications in the thread activity centre
</label>
</div>
</div>
</form>
</div>
`;
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap
+6 -6
View File
@@ -57,13 +57,13 @@ HTMLCollection [
class="mx_DeviceSecurityCard_description"
>
Verify your current session for enhanced secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -334,13 +334,13 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
class="mx_DeviceSecurityCard_description"
>
Verify your current session for enhanced secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -521,13 +521,13 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
class="mx_DeviceSecurityCard_description"
>
Verify your current session for enhanced secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceDetailHeading-test.tsx.snap
+2 -2
View File
@@ -37,13 +37,13 @@ exports[`<DeviceDetailHeading /> displays name edit form on rename button click
id="device-rename-description-123"
>
Please be aware that session names are also visible to people you communicate with.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</span>
</div>
<div
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceDetails-test.tsx.snap
+6 -6
View File
@@ -59,13 +59,13 @@ exports[`<DeviceDetails /> renders a verified device 1`] = `
class="mx_DeviceSecurityCard_description"
>
This session is ready for secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
@@ -175,13 +175,13 @@ exports[`<DeviceDetails /> renders device with metadata 1`] = `
class="mx_DeviceSecurityCard_description"
>
Verify or remove this session for best security and reliability.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
@@ -391,13 +391,13 @@ exports[`<DeviceDetails /> renders device without metadata 1`] = `
class="mx_DeviceSecurityCard_description"
>
Verify or remove this session for best security and reliability.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceVerificationStatusCard-test.tsx.snap
+6 -6
View File
@@ -34,13 +34,13 @@ exports[`<DeviceVerificationStatusCard /> renders a verified device 1`] = `
class="mx_DeviceSecurityCard_description"
>
This session is ready for secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
@@ -79,13 +79,13 @@ exports[`<DeviceVerificationStatusCard /> renders an unverifiable device 1`] = `
class="mx_DeviceSecurityCard_description"
>
This session doesn't support encryption and thus can't be verified.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
@@ -124,13 +124,13 @@ exports[`<DeviceVerificationStatusCard /> renders an unverified device 1`] = `
class="mx_DeviceSecurityCard_description"
>
Verify or remove this session for best security and reliability.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceList-test.tsx.snap
+6 -6
View File
@@ -39,13 +39,13 @@ HTMLCollection [
>
<span>
Consider removing old sessions (90 days or older) you don't use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</span>
</p>
</div>
@@ -90,13 +90,13 @@ HTMLCollection [
>
<span>
Verify your sessions for enhanced secure messaging or remove from those you don't recognize or use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</span>
</p>
</div>
@@ -143,13 +143,13 @@ HTMLCollection [
>
<span>
For best security, remove any session that you don't recognize or use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</span>
</p>
</div>
apps/web/test/unit-tests/components/views/settings/devices/__snapshots__/SecurityRecommendations-test.tsx.snap
+12 -12
View File
@@ -57,13 +57,13 @@ exports[`<SecurityRecommendations /> renders both cards when user has both unver
class="mx_DeviceSecurityCard_description"
>
Verify your sessions for enhanced secure messaging or remove from those you don't recognize or use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -105,13 +105,13 @@ exports[`<SecurityRecommendations /> renders both cards when user has both unver
class="mx_DeviceSecurityCard_description"
>
Consider removing old sessions (90 days or older) you don't use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -189,13 +189,13 @@ exports[`<SecurityRecommendations /> renders inactive devices section when user
class="mx_DeviceSecurityCard_description"
>
Verify your sessions for enhanced secure messaging or remove from those you don't recognize or use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -237,13 +237,13 @@ exports[`<SecurityRecommendations /> renders inactive devices section when user
class="mx_DeviceSecurityCard_description"
>
Consider removing old sessions (90 days or older) you don't use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -321,13 +321,13 @@ exports[`<SecurityRecommendations /> renders unverified devices section when use
class="mx_DeviceSecurityCard_description"
>
Verify your sessions for enhanced secure messaging or remove from those you don't recognize or use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
@@ -369,13 +369,13 @@ exports[`<SecurityRecommendations /> renders unverified devices section when use
class="mx_DeviceSecurityCard_description"
>
Consider removing old sessions (90 days or older) you don't use anymore.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
apps/web/test/unit-tests/components/views/settings/notifications/Notifications2-test.tsx
+20 -61
View File
@@ -18,7 +18,6 @@ import {
RuleId,
} from "matrix-js-sdk/src/matrix";
import React from "react";
import { Form } from "@vector-im/compound-web";
import NotificationSettings2 from "../../../../../../src/components/views/settings/notifications/NotificationSettings2";
import MatrixClientContext from "../../../../../../src/contexts/MatrixClientContext";
@@ -94,9 +93,7 @@ describe("<Notifications />", () => {
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -109,9 +106,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(async () => {
@@ -172,9 +167,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -190,9 +183,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -230,9 +221,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -267,9 +256,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -298,9 +285,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -325,9 +310,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -349,9 +332,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -379,9 +360,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -405,9 +384,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -429,9 +406,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -459,9 +434,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -485,9 +458,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -514,9 +485,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -535,9 +504,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -648,9 +615,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -709,9 +674,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const screen = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await act(waitForUpdate);
@@ -731,9 +694,7 @@ describe("<Notifications />", () => {
const { container } = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await waitForUpdate();
@@ -760,9 +721,7 @@ describe("<Notifications />", () => {
const user = userEvent.setup();
const { container } = render(
<MatrixClientContext.Provider value={cli}>
<Form.Root>
<NotificationSettings2 />
</Form.Root>
<NotificationSettings2 />
</MatrixClientContext.Provider>,
);
await waitForUpdate();
apps/web/test/unit-tests/components/views/settings/notifications/__snapshots__/Notifications2-test.tsx.snap
+1939 -1939
View File
File diff suppressed because it is too large Load Diff
apps/web/test/unit-tests/components/views/settings/tabs/room/__snapshots__/AdvancedRoomSettingsTab-test.tsx.snap
+4 -4
View File
@@ -38,11 +38,11 @@ exports[`AdvancedRoomSettingsTab should render as expected 1`] = `
<span>
Internal room ID
</span>
<div
<span
class="mx_CopyableText mx_CopyableText_border"
>
!room:example.com
<div
<button
aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button"
@@ -62,8 +62,8 @@ exports[`AdvancedRoomSettingsTab should render as expected 1`] = `
d="M8 10a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2zm2 0v9h9v-9z"
/>
</svg>
</div>
</div>
</button>
</span>
</div>
</div>
</div>
apps/web/test/unit-tests/components/views/settings/tabs/room/__snapshots__/SecurityRoomSettingsTab-test.tsx.snap
+2 -2
View File
@@ -186,7 +186,7 @@ exports[`<SecurityRoomSettingsTab /> join rule warns when trying to make an encr
<span>
To avoid these issues, create a
<div
<a
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
@@ -194,7 +194,7 @@ exports[`<SecurityRoomSettingsTab /> join rule warns when trying to make an encr
new public room
</div>
</a>
for the conversation you plan to have.
</span>
apps/web/test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap
+6 -6
View File
@@ -32,13 +32,13 @@ HTMLCollection [
class="mx_DeviceSecurityCard_description"
>
This session doesn't support encryption and thus can't be verified.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>,
@@ -238,13 +238,13 @@ exports[`<SessionManagerTab /> current session section renders current session s
class="mx_DeviceSecurityCard_description"
>
Your current session is ready for secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
</div>
</div>
@@ -411,13 +411,13 @@ exports[`<SessionManagerTab /> current session section renders current session s
class="mx_DeviceSecurityCard_description"
>
Verify your current session for enhanced secure messaging.
<div
<button
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</button>
</p>
<div
class="mx_DeviceSecurityCard_actions"
apps/web/test/unit-tests/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap
+115 -112
View File
@@ -167,75 +167,75 @@ exports[`<SpaceSettingsVisibilityTab /> for a public space renders addresses sec
</form>
</div>
</fieldset>
<form
class="_root_19upo_16"
<div
class="mx_SettingsSection"
>
<div
class="mx_SettingsSection"
<h3
class="mx_Heading_h4"
>
<h3
class="mx_Heading_h4"
Address
</h3>
<div
class="mx_SettingsSection_subSections"
>
<fieldset
class="mx_SettingsFieldset"
data-testid="published-address-fieldset"
>
Address
</h3>
<div
class="mx_SettingsSection_subSections"
>
<fieldset
class="mx_SettingsFieldset"
data-testid="published-address-fieldset"
<legend
class="mx_SettingsFieldset_legend"
>
Published Addresses
</legend>
<div
class="mx_SettingsFieldset_description"
>
<legend
class="mx_SettingsFieldset_legend"
>
Published Addresses
</legend>
<div
class="mx_SettingsFieldset_description"
class="mx_SettingsSubsection_text"
>
<div
class="mx_SettingsSubsection_text"
>
Published addresses can be used by anyone on any server to join your space. To publish an address, it needs to be set as a local address first.
</div>
Published addresses can be used by anyone on any server to join your space. To publish an address, it needs to be set as a local address first.
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<div
class="mx_SettingsFieldset_content"
class="mx_Field mx_Field_select"
>
<div
class="mx_Field mx_Field_select"
<select
disabled=""
id="canonicalAlias"
label="Main address"
placeholder="Main address"
type="text"
>
<select
disabled=""
id="canonicalAlias"
label="Main address"
placeholder="Main address"
type="text"
<option
value=""
>
<option
value=""
>
not specified
</option>
</select>
<label
for="canonicalAlias"
>
Main address
</label>
<svg
class="mx_Field_select_chevron"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 14.95q-.2 0-.375-.062a.9.9 0 0 1-.325-.213l-4.6-4.6a.95.95 0 0 1-.275-.7q0-.425.275-.7a.95.95 0 0 1 .7-.275q.425 0 .7.275l3.9 3.9 3.9-3.9a.95.95 0 0 1 .7-.275q.425 0 .7.275a.95.95 0 0 1 .275.7.95.95 0 0 1-.275.7l-4.6 4.6q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
/>
</svg>
</div>
not specified
</option>
</select>
<label
for="canonicalAlias"
>
Main address
</label>
<svg
class="mx_Field_select_chevron"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 14.95q-.2 0-.375-.062a.9.9 0 0 1-.325-.213l-4.6-4.6a.95.95 0 0 1-.275-.7q0-.425.275-.7a.95.95 0 0 1 .7-.275q.425 0 .7.275l3.9 3.9 3.9-3.9a.95.95 0 0 1 .7-.275q.425 0 .7.275a.95.95 0 0 1 .275.7.95.95 0 0 1-.275.7l-4.6 4.6q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
/>
</svg>
</div>
<form
class="_root_19upo_16"
>
<div
class="_inline-field_19upo_32"
>
@@ -274,59 +274,65 @@ exports[`<SpaceSettingsVisibilityTab /> for a public space renders addresses sec
</span>
</div>
</div>
<datalist
id="mx_AliasSettings_altRecommendations"
/>
</form>
<datalist
id="mx_AliasSettings_altRecommendations"
/>
<div
class="mx_EditableItemList"
id="roomAltAliases"
>
<div
class="mx_EditableItemList_label"
>
No other published addresses yet, add one below
</div>
<ul />
<div />
</div>
</div>
</fieldset>
<fieldset
class="mx_SettingsFieldset"
data-testid="local-address-fieldset"
>
<legend
class="mx_SettingsFieldset_legend"
>
Local Addresses
</legend>
<div
class="mx_SettingsFieldset_description"
>
<div
class="mx_SettingsSubsection_text"
>
Set addresses for this space so users can find this space through your homeserver (matrix.org)
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<details>
<summary
class="mx_AliasSettings_localAddresses"
>
Show more
</summary>
<div
class="mx_EditableItemList"
id="roomAltAliases"
id="roomAliases"
>
<div
class="mx_EditableItemList_label"
>
No other published addresses yet, add one below
This space has no local addresses
</div>
<ul />
<div />
</div>
</div>
</fieldset>
<fieldset
class="mx_SettingsFieldset"
data-testid="local-address-fieldset"
>
<legend
class="mx_SettingsFieldset_legend"
>
Local Addresses
</legend>
<div
class="mx_SettingsFieldset_description"
>
<div
class="mx_SettingsSubsection_text"
>
Set addresses for this space so users can find this space through your homeserver (matrix.org)
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<details>
<summary
class="mx_AliasSettings_localAddresses"
<form
autocomplete="off"
class="mx_EditableItemList_newItem"
novalidate=""
>
Show more
</summary>
<div
class="mx_EditableItemList"
id="roomAliases"
>
<div
class="mx_EditableItemList_label"
>
This space has no local addresses
</div>
<div
class="mx_Field mx_Field_input mx_RoomAliasField mx_Field_labelAlwaysTopLeft"
>
@@ -368,13 +374,13 @@ exports[`<SpaceSettingsVisibilityTab /> for a public space renders addresses sec
>
Add
</div>
</div>
</details>
</div>
</fieldset>
</div>
</form>
</div>
</details>
</div>
</fieldset>
</div>
</form>
</div>
</div>
</div>
</div>
@@ -528,9 +534,6 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
</form>
</div>
</fieldset>
<form
class="_root_19upo_16"
/>
</div>
</div>
</div>