imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Crypto: fix display of device key (#86)

Browse source 
* CryptographyPanel: fix display of device key

* CryptographPanel: Fix HTML nesting

you're not supposed to put <tr> directly inside <table>; doing so causes
warnings.

* Update tests
This commit is contained in:
Richard van der Hoff 2024-09-24 16:48:37 +01:00 • committed by GitHub
parent a1bdceed3e
commit 2e895da39f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 129 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

36
test/components/views/settings/CryptographyPanel-test.tsx
View file

@ -9,13 +9,15 @@ Please see LICENSE files in the repository root for full details.
import React from "react";
import { render } from "@testing-library/react";
import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { mocked } from "jest-mock";
import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
import * as TestUtils from "../../../test-utils";
import CryptographyPanel from "../../../../src/components/views/settings/CryptographyPanel";
import { flushPromises } from "../../../test-utils";
describe("CryptographyPanel", () => {
it("shows the session ID and key", () => {
it("shows the session ID and key", async () => {
const sessionId = "ABCDEFGHIJ";
const sessionKey = "AbCDeFghIJK7L/m4nOPqRSTUVW4xyzaBCDef6gHIJkl";
const sessionKeyFormatted = "<b>AbCD eFgh IJK7 L/m4 nOPq RSTU VW4x yzaB CDef 6gHI Jkl</b>";
@ -23,7 +25,8 @@ describe("CryptographyPanel", () => {
TestUtils.stubClient();
const client: MatrixClient = MatrixClientPeg.safeGet();
client.deviceId = sessionId;
client.getDeviceEd25519Key = () => sessionKey;
mocked(client.getCrypto()!.getOwnDeviceKeys).mockResolvedValue({ ed25519: sessionKey, curve25519: "1234" });
// When we render the CryptographyPanel
const rendered = render(<CryptographyPanel />);
@ -32,6 +35,35 @@ describe("CryptographyPanel", () => {
const codes = rendered.container.querySelectorAll("code");
expect(codes.length).toEqual(2);
expect(codes[0].innerHTML).toEqual(sessionId);
// Initially a placeholder
expect(codes[1].innerHTML).toEqual("<b>...</b>");
// Then the actual key
await flushPromises();
expect(codes[1].innerHTML).toEqual(sessionKeyFormatted);
});
it("handles errors fetching session key", async () => {
const sessionId = "ABCDEFGHIJ";
TestUtils.stubClient();
const client: MatrixClient = MatrixClientPeg.safeGet();
client.deviceId = sessionId;
mocked(client.getCrypto()!.getOwnDeviceKeys).mockRejectedValue(new Error("bleh"));
// When we render the CryptographyPanel
const rendered = render(<CryptographyPanel />);
// Then it displays info about the user's session
const codes = rendered.container.querySelectorAll("code");
// Initially a placeholder
expect(codes[1].innerHTML).toEqual("<b>...</b>");
// Then "not supported key
await flushPromises();
expect(codes[1].innerHTML).toEqual("<b>&lt;not supported&gt;</b>");
});
});

68
test/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
View file

@ -314,32 +314,52 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
<table
class="mx_CryptographyPanel_sessionInfo"
>
<tr>
<th
scope="row"
>
Session ID:
</th>
<td>
<code />
</td>
</tr>
<tr>
<th
scope="row"
>
Session key:
</th>
<td>
<code>
<b>
&lt;not supported&gt;
</b>
</code>
</td>
</tr>
<tbody>
<tr>
<th
scope="row"
>
Session ID:
</th>
<td>
<code />
</td>
</tr>
<tr>
<th
scope="row"
>
Session key:
</th>
<td>
<code>
<b>
...
</b>
</code>
</td>
</tr>
</tbody>
</table>
</div>
<div
class="mx_CryptographyPanel_importExportButtons"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
Export E2E room keys
</div>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
Import E2E room keys
</div>
</div>
<div
class="mx_SettingsFlag"
>