Skip to content

Commit

Permalink
Update tests to demonstrate broken behaviour
Browse files Browse the repository at this point in the history
  • Loading branch information
@richvdh
richvdh committed May 24, 2023
1 parent 269a348 commit e6d41f6
Show file tree
Hide file tree
Showing 3 changed files with 180 additions and 50 deletions.
64 changes: 44 additions & 20 deletions test/components/views/settings/DevicesPanel-test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,18 +25,40 @@ import MatrixClientContext from "../../../../src/contexts/MatrixClientContext";

describe("<DevicesPanel />", () => {
const userId = "@alice:server.org";
const device1 = { device_id: "device_1" };
const device2 = { device_id: "device_2" };
const device3 = { device_id: "device_3" };

// the local device
const ownDevice = { device_id: "device_1" };

// a device which we have verified via cross-signing
const verifiedDevice = { device_id: "device_2" };

// a device which we have *not* verified via cross-signing
const unverifiedDevice = { device_id: "device_3" };

// a device which is returned by `getDevices` but getDeviceVerificationStatus returns `null` for
// (as it would for a device with no E2E keys).
const nonCryptoDevice = { device_id: "non_crypto" };

const mockCrypto = {
getDeviceVerificationStatus: jest.fn().mockResolvedValue({
crossSigningVerified: false,
getDeviceVerificationStatus: jest.fn().mockImplementation((_userId, deviceId) => {
if (_userId !== userId) {
throw new Error(`bad user id ${_userId}`);
}
if (deviceId === ownDevice.device_id || deviceId === verifiedDevice.device_id) {
return { crossSigningVerified: true };
} else if (deviceId === unverifiedDevice.device_id) {
return {
crossSigningVerified: false,
};
} else {
return null;
}
}),
};
const mockClient = getMockClientWithEventEmitter({
...mockClientMethodsUser(userId),
getDevices: jest.fn(),
getDeviceId: jest.fn().mockReturnValue(device1.device_id),
getDeviceId: jest.fn().mockReturnValue(ownDevice.device_id),
deleteMultipleDevices: jest.fn(),
getStoredDevice: jest.fn().mockReturnValue(new DeviceInfo("id")),
generateClientSecret: jest.fn(),
Expand All @@ -54,12 +76,14 @@ describe("<DevicesPanel />", () => {
beforeEach(() => {
jest.clearAllMocks();

mockClient.getDevices.mockReset().mockResolvedValue({ devices: [device1, device2, device3] });
mockClient.getDevices
.mockReset()
.mockResolvedValue({ devices: [ownDevice, verifiedDevice, unverifiedDevice, nonCryptoDevice] });

mockClient.getPushers.mockReset().mockResolvedValue({
pushers: [
mkPusher({
[PUSHER_DEVICE_ID.name]: device1.device_id,
[PUSHER_DEVICE_ID.name]: ownDevice.device_id,
[PUSHER_ENABLED.name]: true,
}),
],
Expand Down Expand Up @@ -88,16 +112,16 @@ describe("<DevicesPanel />", () => {
it("deletes selected devices when interactive auth is not required", async () => {
mockClient.deleteMultipleDevices.mockResolvedValue({});
mockClient.getDevices
.mockResolvedValueOnce({ devices: [device1, device2, device3] })
.mockResolvedValueOnce({ devices: [ownDevice, verifiedDevice, unverifiedDevice] })
// pretend it was really deleted on refresh
.mockResolvedValueOnce({ devices: [device1, device3] });
.mockResolvedValueOnce({ devices: [ownDevice, unverifiedDevice] });

const { container, getByTestId } = render(getComponent());
await flushPromises();

expect(container.getElementsByClassName("mx_DevicesPanel_device").length).toEqual(3);

toggleDeviceSelection(container, device2.device_id);
toggleDeviceSelection(container, verifiedDevice.device_id);

mockClient.getDevices.mockClear();

Expand All @@ -106,7 +130,7 @@ describe("<DevicesPanel />", () => {
});

expect(container.getElementsByClassName("mx_Spinner").length).toBeTruthy();
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([device2.device_id], undefined);
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([verifiedDevice.device_id], undefined);

await flushPromises();

Expand All @@ -124,9 +148,9 @@ describe("<DevicesPanel />", () => {
.mockResolvedValueOnce({});

mockClient.getDevices
.mockResolvedValueOnce({ devices: [device1, device2, device3] })
.mockResolvedValueOnce({ devices: [ownDevice, verifiedDevice, unverifiedDevice] })
// pretend it was really deleted on refresh
.mockResolvedValueOnce({ devices: [device1, device3] });
.mockResolvedValueOnce({ devices: [ownDevice, unverifiedDevice] });

const { container, getByTestId, getByLabelText } = render(getComponent());

Expand All @@ -135,7 +159,7 @@ describe("<DevicesPanel />", () => {
// reset mock count after initial load
mockClient.getDevices.mockClear();

toggleDeviceSelection(container, device2.device_id);
toggleDeviceSelection(container, verifiedDevice.device_id);

act(() => {
fireEvent.click(getByTestId("sign-out-devices-btn"));
Expand All @@ -145,7 +169,7 @@ describe("<DevicesPanel />", () => {
// modal rendering has some weird sleeps
await sleep(100);

expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([device2.device_id], undefined);
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([verifiedDevice.device_id], undefined);

const modal = document.getElementsByClassName("mx_Dialog");
expect(modal).toMatchSnapshot();
Expand All @@ -159,7 +183,7 @@ describe("<DevicesPanel />", () => {
await flushPromises();

// called again with auth
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([device2.device_id], {
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([verifiedDevice.device_id], {
identifier: {
type: "m.id.user",
user: userId,
Expand All @@ -182,9 +206,9 @@ describe("<DevicesPanel />", () => {
.mockResolvedValueOnce({});

mockClient.getDevices
.mockResolvedValueOnce({ devices: [device1, device2, device3] })
.mockResolvedValueOnce({ devices: [ownDevice, verifiedDevice, unverifiedDevice] })
// pretend it was really deleted on refresh
.mockResolvedValueOnce({ devices: [device1, device3] });
.mockResolvedValueOnce({ devices: [ownDevice, unverifiedDevice] });

const { container, getByTestId } = render(getComponent());

Expand All @@ -193,7 +217,7 @@ describe("<DevicesPanel />", () => {
// reset mock count after initial load
mockClient.getDevices.mockClear();

toggleDeviceSelection(container, device2.device_id);
toggleDeviceSelection(container, verifiedDevice.device_id);

act(() => {
fireEvent.click(getByTestId("sign-out-devices-btn"));
Expand Down
161 changes: 134 additions & 27 deletions test/components/views/settings/__snapshots__/DevicesPanel-test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
class="mx_DevicesPanel_deviceTrust"
>
<span
class="mx_DevicesPanel_icon mx_E2EIcon mx_E2EIcon_warning"
class="mx_DevicesPanel_icon mx_E2EIcon mx_E2EIcon_verified"
/>
</div>
<div
Expand All @@ -124,8 +124,8 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
/>
</div>
<div
aria-label="Unverified"
class="mx_DeviceTypeIcon_verificationIcon unverified"
aria-label="Verified"
class="mx_DeviceTypeIcon_verificationIcon verified"
role="img"
/>
</div>
Expand All @@ -143,7 +143,7 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
<span
data-testid="device-metadata-isVerified"
>
Unverified
Verified
</span>
·
<span
Expand All @@ -163,13 +163,6 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
>
Sign Out
</div>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
Expand All @@ -188,24 +181,13 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
class="mx_DevicesPanel_header_trust"
>
<span
class="mx_DevicesPanel_header_icon mx_E2EIcon mx_E2EIcon_warning"
class="mx_DevicesPanel_header_icon mx_E2EIcon mx_E2EIcon_verified"
/>
</div>
<div
class="mx_DevicesPanel_header_title"
>
Unverified devices
</div>
<div
class="mx_DevicesPanel_header_button"
>
<div
class="mx_AccessibleButton mx_DevicesPanel_selectButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_secondary"
role="button"
tabindex="0"
>
Select all
</div>
Verified devices
</div>
</div>
<div
Expand Down Expand Up @@ -250,8 +232,8 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
/>
</div>
<div
aria-label="Unverified"
class="mx_DeviceTypeIcon_verificationIcon unverified"
aria-label="Verified"
class="mx_DeviceTypeIcon_verificationIcon verified"
role="img"
/>
</div>
Expand All @@ -269,7 +251,7 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
<span
data-testid="device-metadata-isVerified"
>
Unverified
Verified
</span>
·
<span
Expand All @@ -296,6 +278,23 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
</span>
</div>
</div>
<hr />
<div
class="mx_DevicesPanel_header"
>
<div
class="mx_DevicesPanel_header_trust"
>
<span
class="mx_DevicesPanel_header_icon mx_E2EIcon mx_E2EIcon_warning"
/>
</div>
<div
class="mx_DevicesPanel_header_title"
>
Unverified devices
</div>
</div>
<div
class="mx_DevicesPanel_device"
>
Expand Down Expand Up @@ -367,6 +366,114 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
</span>
</div>
</div>
<div
class="mx_DeviceTile_actions"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Verify
</div>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="0"
>
Rename
</div>
</div>
</div>
</div>
</label>
</span>
</div>
</div>
<hr />
<div
class="mx_DevicesPanel_header"
>
<div
class="mx_DevicesPanel_header_trust"
/>
<div
class="mx_DevicesPanel_header_title"
>
Devices without encryption support
</div>
</div>
<div
class="mx_DevicesPanel_device"
>
<div
class="mx_SelectableDeviceTile"
>
<span
class="mx_Checkbox mx_SelectableDeviceTile_checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
data-testid="device-tile-checkbox-non_crypto"
id="device-tile-checkbox-non_crypto"
type="checkbox"
/>
<label
for="device-tile-checkbox-non_crypto"
>
<div
class="mx_Checkbox_background"
>
<div
class="mx_Checkbox_checkmark"
/>
</div>
<div>
<div
class="mx_DeviceTile"
data-testid="device-tile-non_crypto"
>
<div
class="mx_DeviceTypeIcon"
>
<div
class="mx_DeviceTypeIcon_deviceIconWrapper"
>
<div
aria-label="Unknown session type"
class="mx_DeviceTypeIcon_deviceIcon"
role="img"
/>
</div>
<div
aria-label="Unverified"
class="mx_DeviceTypeIcon_verificationIcon unverified"
role="img"
/>
</div>
<div
class="mx_DeviceTile_info"
>
<h4
class="mx_Heading_h4"
>
non_crypto
</h4>
<div
class="mx_DeviceTile_metadata"
>
<span
data-testid="device-metadata-isVerified"
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
non_crypto
</span>
</div>
</div>
<div
class="mx_DeviceTile_actions"
>
Expand Down
Loading

0 comments on commit e6d41f6

Please sign in to comment.