created:3/5/2021
updated:3/5/2021
loc
43
comments
30%
passed
16
coverage
50%

Sidebar

avatar of atanasster

Collapsible side bar component

Overview

  • item 1
  • item 2
  • item 3

Test data

select
#
collapsible
1
2
3
4
5
5 data rows

Controls

Name
Description
Default
Controls
collapsible

Whether the sidebar can be collapsed

boolean
-

Tests results

Status
Full name
Title
Time(ms)
Sidebar.test.ts(16 tests)
passed
Sidebar > overview > 1
snapshot
131
passed
Sidebar > overview > 1
accessibility
283
passed
Sidebar > overview > 2
snapshot
50
passed
Sidebar > overview > 2
accessibility
173
passed
Sidebar > overview > 3
snapshot
44
passed
Sidebar > overview > 3
accessibility
114
passed
Sidebar > overview > 4
snapshot
53
passed
Sidebar > overview > 4
accessibility
189
passed
Sidebar > overview > 5
snapshot
63
total 16 tests

Tests coverage

Kind
Total
Covered
Skipped
%
Sidebar.tsx
lines
13
12
0
92.3%
functions
2
1
0
50%
statements
14
13
0
92.85%
branches
12
8
0
66.66%

A11y tests

  • item 1
  • item 2
  • item 3
 
id
description
aria-allowed-attr

Ensures ARIA attributes are allowed for an element's role...

aria-allowed-role

Ensures role attribute has an appropriate value for the element...

aria-hidden-focus

Ensures aria-hidden elements do not contain focusable elements...

aria-valid-attr-value

Ensures all ARIA attributes have valid values...

aria-valid-attr

Ensures attributes that begin with aria- are valid ARIA attributes...

button-name

Ensures buttons have discernible text...

color-contrast

Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds...

list

Ensures that lists are structured correctly...

listitem

Ensures <li> elements are used semantically...

nested-interactive

Ensure controls are not nested as they are not announced by screen readers...

Viewport

  • item 1
  • item 2
  • item 3
320px
  • item 1
  • item 2
  • item 3
375px
  • item 1
  • item 2
  • item 3
768px
  • item 1
  • item 2
  • item 3
1024px