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

Device manager - display client information in device details (PSG-682) (#9315)

Browse source 
* record device client inforamtion events on app start

* matrix-client-information -> matrix_client_information

* fix types

* remove another unused export

* add docs link

* display device client information in device details

* update snapshots

* integration-ish test client information in metadata

* tests

* fix tests

* export helper

* DeviceClientInformation type
This commit is contained in:
Kerry 2022-10-04 15:12:23 +02:00 • committed by GitHub
parent c7a3209b84
commit 16c3efead5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 210 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

1
test/components/views/settings/devices/DeviceDetails-test.tsx
View file

@ -58,6 +58,7 @@ describe('<DeviceDetails />', () => {
display_name: 'My Device',
last_seen_ip: '123.456.789',
last_seen_ts: now - 60000000,
clientName: 'Element Web',
};
const { container } = render(getComponent({ device }));
expect(container).toMatchSnapshot();

34
test/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap
View file

@ -76,6 +76,7 @@ HTMLCollection [
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
@ -90,39 +91,6 @@ HTMLCollection [
alices_device
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Last activity
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
<table
class="mx_DeviceDetails_metadataTable"
>
<thead>
<tr>
<th>
Device
</th>
</tr>
</thead>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
IP address
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
</section>

96
test/components/views/settings/devices/__snapshots__/DeviceDetails-test.tsx.snap
View file

@ -64,6 +64,7 @@ exports[`<DeviceDetails /> renders a verified device 1`] = `
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
@ -78,39 +79,6 @@ exports[`<DeviceDetails /> renders a verified device 1`] = `
my-device
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Last activity
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
<table
class="mx_DeviceDetails_metadataTable"
>
<thead>
<tr>
<th>
Device
</th>
</tr>
</thead>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
IP address
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
</section>
@ -198,6 +166,7 @@ exports[`<DeviceDetails /> renders device with metadata 1`] = `
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
@ -228,6 +197,33 @@ exports[`<DeviceDetails /> renders device with metadata 1`] = `
</table>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-application"
>
<thead>
<tr>
<th>
Application
</th>
</tr>
</thead>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Name
</td>
<td
class="mxDeviceDetails_metadataValue"
>
Element Web
</td>
</tr>
</tbody>
</table>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-device"
>
<thead>
<tr>
@ -336,6 +332,7 @@ exports[`<DeviceDetails /> renders device without metadata 1`] = `
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
@ -350,39 +347,6 @@ exports[`<DeviceDetails /> renders device without metadata 1`] = `
my-device
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Last activity
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
<table
class="mx_DeviceDetails_metadataTable"
>
<thead>
<tr>
<th>
Device
</th>
</tr>
</thead>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
IP address
</td>
<td
class="mxDeviceDetails_metadataValue"
/>
</tr>
</tbody>
</table>
</section>

44
test/components/views/settings/tabs/user/SessionManagerTab-test.tsx
View file

@ -87,10 +87,10 @@ describe('<SessionManagerTab />', () => {
deleteMultipleDevices: jest.fn(),
generateClientSecret: jest.fn(),
setDeviceDetails: jest.fn(),
getAccountData: jest.fn(),
doesServerSupportUnstableFeature: jest.fn().mockResolvedValue(true),
getPushers: jest.fn(),
setPusher: jest.fn(),
getAccountData: jest.fn(),
setLocalNotificationSettings: jest.fn(),
});
@ -243,6 +243,48 @@ describe('<SessionManagerTab />', () => {
expect(getByTestId(`device-tile-${alicesDevice.device_id}`)).toMatchSnapshot();
});
it('extends device with client information when available', async () => {
mockClient.getDevices.mockResolvedValue({ devices: [alicesDevice, alicesMobileDevice] });
mockClient.getAccountData.mockImplementation((eventType: string) => {
const content = {
name: 'Element Web',
version: '1.2.3',
url: 'test.com',
};
return new MatrixEvent({
type: eventType,
content,
});
});
const { getByTestId } = render(getComponent());
await act(async () => {
await flushPromisesWithFakeTimers();
});
// twice for each device
expect(mockClient.getAccountData).toHaveBeenCalledTimes(4);
toggleDeviceDetails(getByTestId, alicesDevice.device_id);
// application metadata section rendered
expect(getByTestId('device-detail-metadata-application')).toBeTruthy();
});
it('renders devices without available client information without error', async () => {
mockClient.getDevices.mockResolvedValue({ devices: [alicesDevice, alicesMobileDevice] });
const { getByTestId, queryByTestId } = render(getComponent());
await act(async () => {
await flushPromisesWithFakeTimers();
});
toggleDeviceDetails(getByTestId, alicesDevice.device_id);
// application metadata section not rendered
expect(queryByTestId('device-detail-metadata-application')).toBeFalsy();
});
it('renders current session section with an unverified session', async () => {
mockClient.getDevices.mockResolvedValue({ devices: [alicesDevice, alicesMobileDevice] });
const { getByTestId } = render(getComponent());