element-web-Github/test/components/views/settings/devices/__snapshots__/DeviceDetails-test.tsx.snap
Kerry 0485b74acb
Device manager - design tweaks (#9768)
* hover style on dropdown

* hover states

* device details spacing

* device details h3 -> h4

* missing fullstops

* update snapshots for new copy

* device details expand icon bigger

* hide current session security card when details expanded

* filter dropdown padding and hover state

* update cypress selector for device detail heading
2022-12-20 01:17:05 +00:00

429 lines
10 KiB
Plaintext

// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<DeviceDetails /> renders a verified device 1`] = `
<div>
<div
class="mx_DeviceDetails"
data-testid="device-detail-my-device"
>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_DeviceDetailHeading"
data-testid="device-detail-heading"
>
<h4
class="mx_Heading_h4"
>
my-device
</h4>
<div
class="mx_AccessibleButton mx_DeviceDetailHeading_renameCta mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
data-testid="device-heading-rename-cta"
role="button"
tabindex="0"
>
Rename
</div>
</div>
<div
class="mx_DeviceSecurityCard"
>
<div
class="mx_DeviceSecurityCard_icon Verified"
>
<div
height="16"
width="16"
/>
</div>
<div
class="mx_DeviceSecurityCard_content"
>
<p
class="mx_DeviceSecurityCard_heading"
>
Verified session
</p>
<p
class="mx_DeviceSecurityCard_description"
>
This session is ready for secure messaging.
<div
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</p>
</div>
</div>
</section>
<section
class="mx_DeviceDetails_section"
>
<p
class="mx_DeviceDetails_sectionHeading"
>
Session details
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Session ID
</td>
<td
class="mxDeviceDetails_metadataValue"
>
my-device
</td>
</tr>
</tbody>
</table>
</section>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger_inline"
data-testid="device-detail-sign-out-cta"
role="button"
tabindex="0"
>
<span
class="mx_DeviceDetails_signOutButtonContent"
>
Sign out of this session
</span>
</div>
</section>
</div>
</div>
`;
exports[`<DeviceDetails /> renders device with metadata 1`] = `
<div>
<div
class="mx_DeviceDetails"
data-testid="device-detail-my-device"
>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_DeviceDetailHeading"
data-testid="device-detail-heading"
>
<h4
class="mx_Heading_h4"
>
My Device
</h4>
<div
class="mx_AccessibleButton mx_DeviceDetailHeading_renameCta mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
data-testid="device-heading-rename-cta"
role="button"
tabindex="0"
>
Rename
</div>
</div>
<div
class="mx_DeviceSecurityCard"
>
<div
class="mx_DeviceSecurityCard_icon Unverified"
>
<div
height="16"
width="16"
/>
</div>
<div
class="mx_DeviceSecurityCard_content"
>
<p
class="mx_DeviceSecurityCard_heading"
>
Unverified session
</p>
<p
class="mx_DeviceSecurityCard_description"
>
Verify or sign out from this session for best security and reliability.
<div
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</p>
</div>
</div>
</section>
<section
class="mx_DeviceDetails_section"
>
<p
class="mx_DeviceDetails_sectionHeading"
>
Session details
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Session ID
</td>
<td
class="mxDeviceDetails_metadataValue"
>
my-device
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Last activity
</td>
<td
class="mxDeviceDetails_metadataValue"
>
Sun 22:34
</td>
</tr>
</tbody>
</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>
<th>
Device
</th>
</tr>
</thead>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Model
</td>
<td
class="mxDeviceDetails_metadataValue"
>
Iphone X
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Operating system
</td>
<td
class="mxDeviceDetails_metadataValue"
>
Windows 95
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Browser
</td>
<td
class="mxDeviceDetails_metadataValue"
>
Firefox 100
</td>
</tr>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
IP address
</td>
<td
class="mxDeviceDetails_metadataValue"
>
123.456.789
</td>
</tr>
</tbody>
</table>
</section>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger_inline"
data-testid="device-detail-sign-out-cta"
role="button"
tabindex="0"
>
<span
class="mx_DeviceDetails_signOutButtonContent"
>
Sign out of this session
</span>
</div>
</section>
</div>
</div>
`;
exports[`<DeviceDetails /> renders device without metadata 1`] = `
<div>
<div
class="mx_DeviceDetails"
data-testid="device-detail-my-device"
>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_DeviceDetailHeading"
data-testid="device-detail-heading"
>
<h4
class="mx_Heading_h4"
>
my-device
</h4>
<div
class="mx_AccessibleButton mx_DeviceDetailHeading_renameCta mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
data-testid="device-heading-rename-cta"
role="button"
tabindex="0"
>
Rename
</div>
</div>
<div
class="mx_DeviceSecurityCard"
>
<div
class="mx_DeviceSecurityCard_icon Unverified"
>
<div
height="16"
width="16"
/>
</div>
<div
class="mx_DeviceSecurityCard_content"
>
<p
class="mx_DeviceSecurityCard_heading"
>
Unverified session
</p>
<p
class="mx_DeviceSecurityCard_description"
>
Verify or sign out from this session for best security and reliability.
<div
class="mx_AccessibleButton mx_LearnMore_button mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link_inline"
role="button"
tabindex="0"
>
Learn more
</div>
</p>
</div>
</div>
</section>
<section
class="mx_DeviceDetails_section"
>
<p
class="mx_DeviceDetails_sectionHeading"
>
Session details
</p>
<table
class="mx_DeviceDetails_metadataTable"
data-testid="device-detail-metadata-session"
>
<tbody>
<tr>
<td
class="mxDeviceDetails_metadataLabel"
>
Session ID
</td>
<td
class="mxDeviceDetails_metadataValue"
>
my-device
</td>
</tr>
</tbody>
</table>
</section>
<section
class="mx_DeviceDetails_section"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger_inline"
data-testid="device-detail-sign-out-cta"
role="button"
tabindex="0"
>
<span
class="mx_DeviceDetails_signOutButtonContent"
>
Sign out of this session
</span>
</div>
</section>
</div>
</div>
`;