* Allow the Login screen to use the dark theme There is a whole bunch of code dedicated to attempting to force a "light" theme onto the login view, even if the deployment is configured to prioritise the dark theme. Apparently this was done because, in the old days, the login view looked rubbish with the dark theme, but now it looks fine. Fixes https://github.com/element-hq/element-web/issues/31292 * Fix up background colour of auth screen in dark theme In dark theme, the background of the login/register/welcome box needs to be translucent black rather than translucent white. To make this work, I've moved the style from inline to CSS, and used a PostCSS variable to define the colour. * Fix up Welcome page colours in dark theme Make the text and image white, not black, in short. * Fix incorrect merge that will teach me to use the Github UI to address merge conflicts.
501 lines
12 KiB
Plaintext
501 lines
12 KiB
Plaintext
// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout shows the lockout page when a second tab opens after a session is restored 1`] = `
|
|
<div>
|
|
<main
|
|
class="mx_SessionLockStolenView mx_SplashPage"
|
|
>
|
|
<h1>
|
|
Test is connected in another tab
|
|
</h1>
|
|
<h2>
|
|
Switch to the other tab to connect to Test. This tab can now be closed.
|
|
</h2>
|
|
</main>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout shows the lockout page when a second tab opens during crypto init 1`] = `
|
|
<body
|
|
style="--emoji-font-family: Twemoji;"
|
|
>
|
|
<div>
|
|
<main
|
|
class="mx_SessionLockStolenView mx_SplashPage"
|
|
>
|
|
<h1>
|
|
Test is connected in another tab
|
|
</h1>
|
|
<h2>
|
|
Switch to the other tab to connect to Test. This tab can now be closed.
|
|
</h2>
|
|
</main>
|
|
</div>
|
|
</body>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout shows the lockout page when a second tab opens while we are checking the sync store 1`] = `
|
|
<div>
|
|
<main
|
|
class="mx_SessionLockStolenView mx_SplashPage"
|
|
>
|
|
<h1>
|
|
Test is connected in another tab
|
|
</h1>
|
|
<h2>
|
|
Switch to the other tab to connect to Test. This tab can now be closed.
|
|
</h2>
|
|
</main>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout shows the lockout page when a second tab opens while we were waiting for the lock ourselves 1`] = `
|
|
<div>
|
|
<main
|
|
class="mx_SessionLockStolenView mx_SplashPage"
|
|
>
|
|
<h1>
|
|
Test is connected in another tab
|
|
</h1>
|
|
<h2>
|
|
Switch to the other tab to connect to Test. This tab can now be closed.
|
|
</h2>
|
|
</main>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout waits for other tab to stop during startup 1`] = `
|
|
<div>
|
|
<div
|
|
class="mx_ConfirmSessionLockTheftView"
|
|
>
|
|
<div
|
|
class="mx_ConfirmSessionLockTheftView_body"
|
|
>
|
|
<p>
|
|
Test is open in another window. Click "Continue" to use Test here and disconnect the other window.
|
|
</p>
|
|
<div
|
|
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
Continue
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout waits for other tab to stop during startup 2`] = `
|
|
<div>
|
|
<div
|
|
class="mx_MatrixChat_splash"
|
|
>
|
|
<div
|
|
class="mx_Spinner"
|
|
>
|
|
<div
|
|
aria-label="Loading…"
|
|
class="mx_Spinner_icon"
|
|
data-testid="spinner"
|
|
role="progressbar"
|
|
style="width: 32px; height: 32px;"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> Multi-tab lockout waits for other tab to stop during startup 3`] = `
|
|
<div>
|
|
<div
|
|
class="mx_AuthPage"
|
|
>
|
|
<div
|
|
class="mx_AuthPage_modal mx_AuthPage_modal_withBlur"
|
|
style="position: relative;"
|
|
>
|
|
<div
|
|
class="mx_AuthPage_modalBlur"
|
|
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; filter: blur(40px);"
|
|
/>
|
|
<main
|
|
aria-live="polite"
|
|
class="mx_AuthPage_modalContent"
|
|
style="display: flex; z-index: 1; border-radius: inherit;"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_Welcome"
|
|
data-testid="mx_welcome_screen"
|
|
>
|
|
<div
|
|
class="mx_WelcomePage mx_WelcomePage_loggedIn"
|
|
>
|
|
<div
|
|
class="mx_WelcomePage_body"
|
|
>
|
|
<h1>
|
|
Hello
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="mx_Dropdown mx_LanguageDropdown mx_AuthBody_language"
|
|
>
|
|
<div
|
|
aria-describedby="mx_LanguageDropdown_value"
|
|
aria-expanded="false"
|
|
aria-haspopup="listbox"
|
|
aria-label="Language Dropdown"
|
|
aria-owns="mx_LanguageDropdown_input"
|
|
class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
<div
|
|
class="mx_Dropdown_option"
|
|
id="mx_LanguageDropdown_value"
|
|
>
|
|
<div>
|
|
English
|
|
</div>
|
|
</div>
|
|
<span
|
|
class="mx_Dropdown_arrow"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<footer
|
|
class="mx_AuthFooter"
|
|
role="contentinfo"
|
|
>
|
|
<a
|
|
href="https://element.io/blog"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Blog
|
|
</a>
|
|
<a
|
|
href="https://mastodon.matrix.org/@Element"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Mastodon
|
|
</a>
|
|
<a
|
|
href="https://github.com/element-hq/element-web"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
GitHub
|
|
</a>
|
|
<a
|
|
href="https://matrix.org"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Powered by Matrix
|
|
</a>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> should render spinner while app is loading 1`] = `
|
|
<div>
|
|
<div
|
|
class="mx_MatrixChat_splash"
|
|
>
|
|
<div
|
|
class="mx_Spinner"
|
|
>
|
|
<div
|
|
aria-label="Loading…"
|
|
class="mx_Spinner_icon"
|
|
data-testid="spinner"
|
|
role="progressbar"
|
|
style="width: 32px; height: 32px;"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> with a soft-logged-out session should show the soft-logout page 1`] = `
|
|
<div>
|
|
<div
|
|
class="mx_AuthPage"
|
|
>
|
|
<div
|
|
class="mx_AuthPage_modal mx_AuthPage_modal_withBlur"
|
|
style="position: relative;"
|
|
>
|
|
<div
|
|
class="mx_AuthPage_modalBlur"
|
|
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; filter: blur(40px);"
|
|
/>
|
|
<main
|
|
aria-live="polite"
|
|
class="mx_AuthPage_modalContent"
|
|
style="display: flex; z-index: 1; border-radius: inherit;"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_AuthHeader"
|
|
>
|
|
<aside
|
|
class="mx_AuthHeaderLogo"
|
|
>
|
|
<img
|
|
alt="Element"
|
|
src="themes/element/img/logos/element-logo.svg"
|
|
/>
|
|
</aside>
|
|
<div
|
|
class="mx_Dropdown mx_LanguageDropdown mx_AuthBody_language"
|
|
>
|
|
<div
|
|
aria-describedby="mx_LanguageDropdown_value"
|
|
aria-expanded="false"
|
|
aria-haspopup="listbox"
|
|
aria-label="Language Dropdown"
|
|
aria-owns="mx_LanguageDropdown_input"
|
|
class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
<div
|
|
class="mx_Dropdown_option"
|
|
id="mx_LanguageDropdown_value"
|
|
>
|
|
<div>
|
|
English
|
|
</div>
|
|
</div>
|
|
<span
|
|
class="mx_Dropdown_arrow"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="mx_AuthBody"
|
|
>
|
|
<h1>
|
|
You're signed out
|
|
</h1>
|
|
<h2>
|
|
Sign in
|
|
</h2>
|
|
<div>
|
|
<form>
|
|
<p>
|
|
Enter your password to sign in and regain access to your account.
|
|
</p>
|
|
<div
|
|
class="mx_Field mx_Field_input"
|
|
>
|
|
<input
|
|
id="mx_Field_1"
|
|
label="Password"
|
|
placeholder="Password"
|
|
type="password"
|
|
value=""
|
|
/>
|
|
<label
|
|
for="mx_Field_1"
|
|
>
|
|
Password
|
|
</label>
|
|
</div>
|
|
<div
|
|
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
Sign in
|
|
</div>
|
|
<div
|
|
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
Forgotten your password?
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<h2>
|
|
Clear personal data
|
|
</h2>
|
|
<p>
|
|
Warning: your personal data (including encryption keys) is still stored in this session. Clear it if you're finished using this session, or want to sign in to another account.
|
|
</p>
|
|
<div>
|
|
<div
|
|
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
Clear all data
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<footer
|
|
class="mx_AuthFooter"
|
|
role="contentinfo"
|
|
>
|
|
<a
|
|
href="https://element.io/blog"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Blog
|
|
</a>
|
|
<a
|
|
href="https://mastodon.matrix.org/@Element"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Mastodon
|
|
</a>
|
|
<a
|
|
href="https://github.com/element-hq/element-web"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
GitHub
|
|
</a>
|
|
<a
|
|
href="https://matrix.org"
|
|
rel="noreferrer noopener"
|
|
target="_blank"
|
|
>
|
|
Powered by Matrix
|
|
</a>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> with an existing session onAction() room actions leave_room for a room should launch a confirmation modal 1`] = `
|
|
<div
|
|
aria-describedby="mx_Dialog_content"
|
|
aria-labelledby="mx_BaseDialog_title"
|
|
class="mx_QuestionDialog mx_Dialog_fixedWidth"
|
|
data-focus-lock-disabled="false"
|
|
role="dialog"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_Dialog_header"
|
|
>
|
|
<h1
|
|
class="mx_Heading_h3 mx_Dialog_title"
|
|
id="mx_BaseDialog_title"
|
|
>
|
|
Leave room
|
|
</h1>
|
|
</div>
|
|
<div
|
|
class="mx_Dialog_content"
|
|
id="mx_Dialog_content"
|
|
>
|
|
<span>
|
|
Are you sure you want to leave the room '!room:server.org'?
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_Dialog_buttons"
|
|
>
|
|
<span
|
|
class="mx_Dialog_buttons_row"
|
|
>
|
|
<button
|
|
data-testid="dialog-cancel-button"
|
|
type="button"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
class="mx_Dialog_primary"
|
|
data-testid="dialog-primary-button"
|
|
type="button"
|
|
>
|
|
Leave
|
|
</button>
|
|
</span>
|
|
</div>
|
|
<div
|
|
aria-label="Close dialog"
|
|
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
|
role="button"
|
|
tabindex="0"
|
|
/>
|
|
</div>
|
|
`;
|
|
|
|
exports[`<MatrixChat /> with an existing session onAction() room actions leave_room for a space should launch a confirmation modal 1`] = `
|
|
<div
|
|
aria-describedby="mx_Dialog_content"
|
|
aria-labelledby="mx_BaseDialog_title"
|
|
class="mx_QuestionDialog mx_Dialog_fixedWidth"
|
|
data-focus-lock-disabled="false"
|
|
role="dialog"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_Dialog_header"
|
|
>
|
|
<h1
|
|
class="mx_Heading_h3 mx_Dialog_title"
|
|
id="mx_BaseDialog_title"
|
|
>
|
|
Leave space
|
|
</h1>
|
|
</div>
|
|
<div
|
|
class="mx_Dialog_content"
|
|
id="mx_Dialog_content"
|
|
>
|
|
<span>
|
|
Are you sure you want to leave the space '!spaceRoom:server.org'?
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_Dialog_buttons"
|
|
>
|
|
<span
|
|
class="mx_Dialog_buttons_row"
|
|
>
|
|
<button
|
|
data-testid="dialog-cancel-button"
|
|
type="button"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
class="mx_Dialog_primary"
|
|
data-testid="dialog-primary-button"
|
|
type="button"
|
|
>
|
|
Leave
|
|
</button>
|
|
</span>
|
|
</div>
|
|
<div
|
|
aria-label="Close dialog"
|
|
class="mx_AccessibleButton mx_Dialog_cancelButton"
|
|
role="button"
|
|
tabindex="0"
|
|
/>
|
|
</div>
|
|
`;
|