You've already forked matrix-react-sdk
mirror of
https://github.com/matrix-org/matrix-react-sdk.git
synced 2025-08-09 08:42:50 +03:00
Element-R: Populate device list for right-panel (#10671)
* Use `getUserDeviceInfo` instead of `downloadKeys` and `getStoredDevicesForUser` * Use new `getUserDeviceInfo` api in `UserInfo.tsx` and `UserInfo-test.tsx` * Fix missing fields * Use `getUserDeviceInfo` instead of `downloadKeys` * Move `ManualDeviceKeyVerificationDialog.tsx` from class to functional component and add tests * Fix strict errors * Update snapshot * Add snapshot test to `UserInfo-test.tsx` * Add test for <BasicUserInfo /> * Remove useless TODO comment * Add test for ambiguous device * Rework `<BasicUserInfo />` test
This commit is contained in:
@@ -30,7 +30,7 @@ import {
|
||||
} from "matrix-js-sdk/src/matrix";
|
||||
import { Phase, VerificationRequest } from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest";
|
||||
import { UserTrustLevel } from "matrix-js-sdk/src/crypto/CrossSigning";
|
||||
import { DeviceInfo } from "matrix-js-sdk/src/crypto/deviceinfo";
|
||||
import { Device } from "matrix-js-sdk/src/models/device";
|
||||
import { defer } from "matrix-js-sdk/src/utils";
|
||||
|
||||
import UserInfo, {
|
||||
@@ -127,6 +127,7 @@ beforeEach(() => {
|
||||
|
||||
mockCrypto = mocked({
|
||||
getDeviceVerificationStatus: jest.fn(),
|
||||
getUserDeviceInfo: jest.fn(),
|
||||
} as unknown as CryptoApi);
|
||||
|
||||
mockClient = mocked({
|
||||
@@ -155,6 +156,7 @@ beforeEach(() => {
|
||||
downloadKeys: jest.fn(),
|
||||
getStoredDevicesForUser: jest.fn(),
|
||||
getCrypto: jest.fn().mockReturnValue(mockCrypto),
|
||||
getStoredCrossSigningForUser: jest.fn(),
|
||||
} as unknown as MatrixClient);
|
||||
|
||||
jest.spyOn(MatrixClientPeg, "get").mockReturnValue(mockClient);
|
||||
@@ -265,14 +267,18 @@ describe("<UserInfo />", () => {
|
||||
beforeEach(() => {
|
||||
mockClient.isCryptoEnabled.mockReturnValue(true);
|
||||
mockClient.checkUserTrust.mockReturnValue(new UserTrustLevel(false, false, false));
|
||||
mockClient.doesServerSupportUnstableFeature.mockResolvedValue(true);
|
||||
|
||||
const device1 = DeviceInfo.fromStorage(
|
||||
{
|
||||
unsigned: { device_display_name: "my device" },
|
||||
},
|
||||
"d1",
|
||||
);
|
||||
mockClient.getStoredDevicesForUser.mockReturnValue([device1]);
|
||||
const device = new Device({
|
||||
deviceId: "d1",
|
||||
userId: defaultUserId,
|
||||
displayName: "my device",
|
||||
algorithms: [],
|
||||
keys: new Map(),
|
||||
});
|
||||
const devicesMap = new Map<string, Device>([[device.deviceId, device]]);
|
||||
const userDeviceMap = new Map<string, Map<string, Device>>([[defaultUserId, devicesMap]]);
|
||||
mockCrypto.getUserDeviceInfo.mockResolvedValue(userDeviceMap);
|
||||
});
|
||||
|
||||
it("renders a device list which can be expanded", async () => {
|
||||
@@ -291,6 +297,18 @@ describe("<UserInfo />", () => {
|
||||
// ... which should contain the device name
|
||||
expect(within(deviceButton).getByText("my device")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("renders <BasicUserInfo />", async () => {
|
||||
const { container } = renderComponent({
|
||||
phase: RightPanelPhases.SpaceMemberInfo,
|
||||
verificationRequest,
|
||||
room: mockRoom,
|
||||
});
|
||||
await act(flushPromises);
|
||||
|
||||
await waitFor(() => expect(screen.getByRole("button", { name: "Verify" })).toBeInTheDocument());
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
describe("with an encrypted room", () => {
|
||||
@@ -363,7 +381,7 @@ describe("<UserInfoHeader />", () => {
|
||||
});
|
||||
|
||||
describe("<DeviceItem />", () => {
|
||||
const device = { deviceId: "deviceId", getDisplayName: () => "deviceName" } as DeviceInfo;
|
||||
const device = { deviceId: "deviceId", displayName: "deviceName" } as Device;
|
||||
const defaultProps = {
|
||||
userId: defaultUserId,
|
||||
device,
|
||||
@@ -410,7 +428,7 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
expect(screen.getByRole("button", { name: device.getDisplayName()! })).toBeInTheDocument;
|
||||
expect(screen.getByRole("button", { name: device.displayName! })).toBeInTheDocument();
|
||||
expect(screen.queryByText(/trusted/i)).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
@@ -419,7 +437,7 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
expect(screen.getByRole("button", { name: `${device.getDisplayName()} Not trusted` })).toBeInTheDocument;
|
||||
expect(screen.getByRole("button", { name: `${device.displayName} Not trusted` })).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("with verified device only, displays no button without a label", async () => {
|
||||
@@ -427,7 +445,7 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
expect(screen.getByText(device.getDisplayName()!)).toBeInTheDocument();
|
||||
expect(screen.getByText(device.displayName!)).toBeInTheDocument();
|
||||
expect(screen.queryByText(/trusted/)).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
@@ -441,8 +459,9 @@ describe("<DeviceItem />", () => {
|
||||
setMockDeviceTrust(false, true);
|
||||
|
||||
// expect to see no button in this case
|
||||
// TODO `toBeInTheDocument` is not called, if called the test is failing
|
||||
expect(screen.queryByRole("button")).not.toBeInTheDocument;
|
||||
expect(screen.getByText(device.getDisplayName()!)).toBeInTheDocument();
|
||||
expect(screen.getByText(device.displayName!)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("with verified user and device, displays no button and a 'Trusted' label", async () => {
|
||||
@@ -451,8 +470,8 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
expect(screen.queryByRole("button")).not.toBeInTheDocument;
|
||||
expect(screen.getByText(device.getDisplayName()!)).toBeInTheDocument();
|
||||
expect(screen.queryByRole("button")).not.toBeInTheDocument();
|
||||
expect(screen.getByText(device.displayName!)).toBeInTheDocument();
|
||||
expect(screen.getByText("Trusted")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
@@ -461,8 +480,8 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
const button = screen.getByRole("button", { name: device.getDisplayName()! });
|
||||
expect(button).toBeInTheDocument;
|
||||
const button = screen.getByRole("button", { name: device.displayName! });
|
||||
expect(button).toBeInTheDocument();
|
||||
await userEvent.click(button);
|
||||
|
||||
expect(mockVerifyDevice).not.toHaveBeenCalled();
|
||||
@@ -476,13 +495,36 @@ describe("<DeviceItem />", () => {
|
||||
renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
const button = screen.getByRole("button", { name: device.getDisplayName()! });
|
||||
expect(button).toBeInTheDocument;
|
||||
const button = screen.getByRole("button", { name: device.displayName! });
|
||||
expect(button).toBeInTheDocument();
|
||||
await userEvent.click(button);
|
||||
|
||||
expect(mockVerifyDevice).toHaveBeenCalledTimes(1);
|
||||
expect(mockVerifyDevice).toHaveBeenCalledWith(defaultUser, device);
|
||||
});
|
||||
|
||||
it("with display name", async () => {
|
||||
const { container } = renderComponent();
|
||||
await act(flushPromises);
|
||||
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("without display name", async () => {
|
||||
const device = { deviceId: "deviceId" } as Device;
|
||||
const { container } = renderComponent({ device, userId: defaultUserId });
|
||||
await act(flushPromises);
|
||||
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("ambiguous display name", async () => {
|
||||
const device = { deviceId: "deviceId", ambiguous: true, displayName: "my display name" };
|
||||
const { container } = renderComponent({ device, userId: defaultUserId });
|
||||
await act(flushPromises);
|
||||
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
describe("<UserOptionsSection />", () => {
|
||||
@@ -1099,9 +1141,9 @@ describe("<RoomAdminToolsContainer />", () => {
|
||||
describe("disambiguateDevices", () => {
|
||||
it("does not add ambiguous key to unique names", () => {
|
||||
const initialDevices = [
|
||||
{ deviceId: "id1", getDisplayName: () => "name1" } as DeviceInfo,
|
||||
{ deviceId: "id2", getDisplayName: () => "name2" } as DeviceInfo,
|
||||
{ deviceId: "id3", getDisplayName: () => "name3" } as DeviceInfo,
|
||||
{ deviceId: "id1", displayName: "name1" } as Device,
|
||||
{ deviceId: "id2", displayName: "name2" } as Device,
|
||||
{ deviceId: "id3", displayName: "name3" } as Device,
|
||||
];
|
||||
disambiguateDevices(initialDevices);
|
||||
|
||||
@@ -1113,14 +1155,14 @@ describe("disambiguateDevices", () => {
|
||||
|
||||
it("adds ambiguous key to all ids with non-unique names", () => {
|
||||
const uniqueNameDevices = [
|
||||
{ deviceId: "id3", getDisplayName: () => "name3" } as DeviceInfo,
|
||||
{ deviceId: "id4", getDisplayName: () => "name4" } as DeviceInfo,
|
||||
{ deviceId: "id6", getDisplayName: () => "name6" } as DeviceInfo,
|
||||
{ deviceId: "id3", displayName: "name3" } as Device,
|
||||
{ deviceId: "id4", displayName: "name4" } as Device,
|
||||
{ deviceId: "id6", displayName: "name6" } as Device,
|
||||
];
|
||||
const nonUniqueNameDevices = [
|
||||
{ deviceId: "id1", getDisplayName: () => "nonUnique" } as DeviceInfo,
|
||||
{ deviceId: "id2", getDisplayName: () => "nonUnique" } as DeviceInfo,
|
||||
{ deviceId: "id5", getDisplayName: () => "nonUnique" } as DeviceInfo,
|
||||
{ deviceId: "id1", displayName: "nonUnique" } as Device,
|
||||
{ deviceId: "id2", displayName: "nonUnique" } as Device,
|
||||
{ deviceId: "id5", displayName: "nonUnique" } as Device,
|
||||
];
|
||||
const initialDevices = [...uniqueNameDevices, ...nonUniqueNameDevices];
|
||||
disambiguateDevices(initialDevices);
|
||||
|
Reference in New Issue
Block a user