Files
element-web/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap
Michael Telatynski 5869c519ed Tweak rendering of icons for accessibility (#31346)
* Tweak rendering of icons in dropdowns

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in composer format bar

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in jump to bottom button

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in quick settings button

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in left panel search

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix margin

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in security user settings tab

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in space hierarchy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Simplify

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tidy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-11-27 16:03:19 +00:00

325 lines
10 KiB
Plaintext

// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
exports[`<SpacePanel /> should show all activated MetaSpaces in the correct order 1`] = `
<DocumentFragment>
<nav
aria-controls="_r_2_"
aria-describedby="_r_2_"
aria-haspopup="dialog"
aria-label="Spaces"
class="mx_SpacePanel collapsed newUi"
data-floating-ui-inert=""
>
<div
class="mx_UserMenu"
>
<div
aria-expanded="false"
aria-haspopup="true"
aria-label="User menu"
class="mx_AccessibleButton mx_UserMenu_contextMenuButton"
role="button"
tabindex="0"
>
<div
class="mx_UserMenu_userAvatar"
>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar mx_UserMenu_userAvatar_BaseAvatar _avatar-imageless_1qbcf_52"
data-color="5"
data-testid="avatar-img"
data-type="round"
role="presentation"
style="--cpd-avatar-size: 32px;"
>
t
</span>
</div>
</div>
<div
aria-label="Expand"
class="mx_AccessibleButton mx_SpacePanel_toggleCollapse"
role="button"
tabindex="0"
/>
</div>
<ul
aria-label="Spaces"
class="mx_AutoHideScrollbar mx_SpaceTreeLevel"
data-rbd-droppable-context-id="0"
data-rbd-droppable-id="top-level-spaces"
role="tree"
tabindex="-1"
>
<li
aria-selected="false"
class="mx_SpaceItem collapsed"
role="treeitem"
>
<div
aria-label="Home"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_home mx_SpaceButton_narrow"
role="button"
tabindex="0"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
<div
aria-expanded="false"
aria-haspopup="true"
aria-label="Options"
class="mx_AccessibleButton mx_SpaceButton_menuButton"
role="button"
tabindex="0"
/>
</div>
</div>
</li>
<li
aria-selected="false"
class="mx_SpaceItem collapsed"
role="treeitem"
>
<div
aria-label="Favourites"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_favourites mx_SpaceButton_narrow"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
</div>
</div>
</li>
<li
aria-selected="false"
class="mx_SpaceItem collapsed"
role="treeitem"
>
<div
aria-label="People"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_people mx_SpaceButton_narrow"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
</div>
</div>
</li>
<li
aria-selected="false"
class="mx_SpaceItem collapsed"
role="treeitem"
>
<div
aria-label="Other rooms"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_orphans mx_SpaceButton_narrow"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
</div>
</div>
</li>
<li
aria-selected="false"
class="mx_SpaceItem collapsed"
role="treeitem"
>
<div
aria-label="Conferences"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_videoRooms mx_SpaceButton_narrow"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
</div>
</div>
</li>
<li
aria-selected="false"
class="mx_SpaceItem mx_SpaceItem_new collapsed"
role="treeitem"
>
<div
aria-label="Create a space"
class="mx_AccessibleButton mx_SpaceButton mx_SpaceButton_new mx_SpaceButton_narrow"
data-testid="create-space-button"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceButton_selectionWrapper"
>
<div
class="mx_SpaceButton_avatarWrapper"
>
<div
class="mx_SpaceButton_avatarPlaceholder"
>
<div
class="mx_SpaceButton_icon"
/>
</div>
</div>
</div>
</div>
</li>
</ul>
<div
class="mx_ThreadsActivityCentre_container"
>
<button
aria-disabled="false"
aria-expanded="false"
aria-haspopup="menu"
aria-label="Threads"
aria-labelledby="_r_16_"
class="_icon-button_1pz9o_8 mx_ThreadsActivityCentreButton"
data-kind="primary"
data-state="closed"
id="radix-_r_14_"
role="button"
style="--cpd-icon-button-size: 32px;"
tabindex="0"
type="button"
>
<div
class="_indicator-icon_zr2a0_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
class="mx_ThreadsActivityCentreButton_Icon"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M4 3h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6l-2.293 2.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2m3 7h10q.424 0 .712-.287A.97.97 0 0 0 18 9a.97.97 0 0 0-.288-.713A.97.97 0 0 0 17 8H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 9q0 .424.287.713Q6.576 10 7 10m0 4h6q.424 0 .713-.287A.97.97 0 0 0 14 13a.97.97 0 0 0-.287-.713A.97.97 0 0 0 13 12H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 13q0 .424.287.713Q6.576 14 7 14"
/>
</svg>
</div>
</button>
</div>
<button
aria-expanded="false"
aria-label="Quick settings"
aria-labelledby="_r_1f_"
class="_icon-button_1pz9o_8 mx_QuickSettingsButton"
data-kind="primary"
role="button"
style="--cpd-icon-button-size: 32px;"
tabindex="0"
title="Quick settings"
>
<div
class="_indicator-icon_zr2a0_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.731 2C13.432 2 14 2.568 14 3.269c0 .578.396 1.074.935 1.286q.128.052.253.106c.531.23 1.162.16 1.572-.25a1.27 1.27 0 0 1 1.794 0l1.034 1.035a1.27 1.27 0 0 1 0 1.794c-.41.41-.48 1.04-.248 1.572l.105.253c.212.539.708.935 1.286.935.701 0 1.269.568 1.269 1.269v1.462c0 .701-.568 1.269-1.269 1.269-.578 0-1.074.396-1.287.935q-.05.128-.104.253c-.232.531-.161 1.162.248 1.572a1.27 1.27 0 0 1 0 1.794l-1.034 1.034a1.27 1.27 0 0 1-1.794 0c-.41-.41-1.04-.48-1.572-.248a8 8 0 0 1-.253.105c-.539.212-.935.708-.935 1.286 0 .701-.568 1.269-1.269 1.269H11.27c-.702 0-1.27-.568-1.27-1.269 0-.578-.396-1.074-.935-1.287a8 8 0 0 1-.253-.104c-.531-.232-1.162-.161-1.572.248a1.27 1.27 0 0 1-1.794 0l-1.034-1.034a1.27 1.27 0 0 1 0-1.794c.41-.41.48-1.04.249-1.572a8 8 0 0 1-.106-.253C4.343 14.396 3.847 14 3.27 14 2.568 14 2 13.432 2 12.731V11.27c0-.702.568-1.27 1.269-1.27.578 0 1.074-.396 1.286-.935q.052-.128.106-.253c.23-.531.16-1.162-.25-1.572a1.27 1.27 0 0 1 0-1.794l1.035-1.034a1.27 1.27 0 0 1 1.794 0c.41.41 1.04.48 1.572.249a8 8 0 0 1 .253-.106c.539-.212.935-.708.935-1.286C10 2.568 10.568 2 11.269 2zM12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8"
/>
</svg>
</div>
</button>
</nav>
<span
aria-hidden="true"
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;"
tabindex="-1"
/>
<span
data-floating-ui-focus-guard=""
data-type="outside"
role="button"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
tabindex="0"
/>
<span
aria-owns="_r_1k_"
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;"
/>
<span
data-floating-ui-focus-guard=""
data-type="outside"
role="button"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
tabindex="0"
/>
</DocumentFragment>
`;