0485b74acb
* 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
428 lines
10 KiB
Text
428 lines
10 KiB
Text
// 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>
|
|
`;
|