mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web.git synced 2024-12-12 01:45:19 +03:00
Code Issues Projects Releases Packages Wiki Activity
element-web/test/components/views/rooms/__snapshots__/DecryptionFailureBar-test.tsx.snap

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

574 lines
14 KiB
Text
Raw Normal View History

Improve decryption error UI by consolidating error messages and providing instructions when possible (#9544) * Improve decryption error UI by consolidating error messages and providing instructions when possible * Fix TS strict errors * Rename .scss to .pcss * Avoid accessing clipboard, Cypress doesn't like it * Display DecryptionFailureBar alongside other AuxPanel bars * Add comments * Add small margin off-screen for visible decryption failures * Fix some more TS strict errors * Add unit tests for DecryptionFailureBar * Add button to resend key requests manually * Remove references to matrix-js-sdk crypto internals * Add hysteresis to visible decryption failures * Add comment Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> * Add comment Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> * Don't create empty div if we're not showing resend requests button * cancel updateSessions on unmount * Update unit tests * Fix lint and implicit any * Simplify visible event bounds checking * Adjust cypress test descriptions * Add percy snapshots * Update src/components/structures/TimelinePanel.tsx Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> * Add comments on TimelinePanel IState * comment * Add names to percy snapshots * Show Resend Key Requests button when there are sessions that haven't already been requested via this bar * We no longer request keys from senders * update i18n * update expected text in cypress test * don't download keys ourselves, update device info in response to updates from client * fix ts strict errors * visibledecryptionfailures undefined handling * Fix implicitAny errors Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2022-12-15 20:24:33 +03:00
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<DecryptionFailureBar /> Displays a general error message if there are no other verified devices 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Some messages could not be decrypted
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
Unfortunately, there are no other verified devices to request decryption keys from. Signing in and verifying other devices may help avoid this situation in the future.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
/>
</div>
`;
exports[`<DecryptionFailureBar /> Displays a loading spinner 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_Spinner"
>
<div
aria-label="Loading..."
class="mx_Spinner_icon"
data-testid="spinner"
role="progressbar"
style="width: 32px; height: 32px;"
/>
</div>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Decrypting messages...
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
Please wait as we try to decrypt your messages. This may take a few moments.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
/>
</div>
`;
exports[`<DecryptionFailureBar /> Displays button to resend key requests if we are verified 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Resend key requests
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Displays button to resend key requests if we are verified 2`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Displays the button to resend key requests only if there are sessions we haven't already requested 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Resend key requests
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Displays the button to resend key requests only if there are sessions we haven't already requested 2`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Displays the button to resend key requests only if there are sessions we haven't already requested 3`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Resend key requests
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Displays the button to resend key requests only if there are sessions we haven't already requested 4`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Does not display a button to send key requests if we are unverified 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Verify this device to access all messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device was unable to decrypt some messages because it has not been verified yet.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Handles device updates 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Verify this device to access all messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device was unable to decrypt some messages because it has not been verified yet.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Handles device updates 2`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Resend key requests
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Prompts the user to reset if they have no other verified devices and no backups 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Reset your keys to prevent future decryption errors
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
You will not be able to access old undecryptable messages, but resetting your keys will allow you to receive new messages.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Reset
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Prompts the user to verify if they have backups 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Verify this device to access all messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device was unable to decrypt some messages because it has not been verified yet.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Prompts the user to verify if they have other devices 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Verify this device to access all messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device was unable to decrypt some messages because it has not been verified yet.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
</div>
</div>
`;
exports[`<DecryptionFailureBar /> Recommends opening other devices if there are other verified devices 1`] = `
<div
class="mx_DecryptionFailureBar"
>
<div
class="mx_DecryptionFailureBar_icon"
/>
<div
class="mx_DecryptionFailureBar_message"
>
<div
class="mx_DecryptionFailureBar_message_headline"
>
Open another device to load encrypted messages
</div>
<div
class="mx_DecryptionFailureBar_message_body"
>
This device is requesting decryption keys from your other devices. Opening one of your other devices may speed this up.
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
View your device list
</div>
</div>
<div
class="mx_DecryptionFailureBar_button"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Resend key requests
</div>
</div>
</div>
`;
Reference in a new issue Copy permalink