Device manager - updated dropdown style in filtered device list (PSG-689) (#9226)
* add FilterDropdown wrapper on Dropdown for filter styles * test and fix strict errors * fix comment
This commit is contained in:
parent
825a0af4a9
commit
50f6986f6c
10 changed files with 389 additions and 20 deletions
|
@ -0,0 +1,137 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`<FilterDropdown /> renders dropdown options in menu 1`] = `
|
||||
<div
|
||||
class="mx_Dropdown_menu"
|
||||
id="test_listbox"
|
||||
role="listbox"
|
||||
>
|
||||
<div
|
||||
aria-selected="false"
|
||||
class="mx_Dropdown_option"
|
||||
id="test__one"
|
||||
role="option"
|
||||
>
|
||||
<div
|
||||
class="mx_FilterDropdown_option"
|
||||
data-testid="filter-option-one"
|
||||
>
|
||||
<div
|
||||
class="mx_FilterDropdown_optionSelectedIcon"
|
||||
/>
|
||||
<span
|
||||
class="mx_FilterDropdown_optionLabel"
|
||||
>
|
||||
Option one
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
aria-selected="false"
|
||||
class="mx_Dropdown_option"
|
||||
id="test__two"
|
||||
role="option"
|
||||
>
|
||||
<div
|
||||
class="mx_FilterDropdown_option"
|
||||
data-testid="filter-option-two"
|
||||
>
|
||||
<span
|
||||
class="mx_FilterDropdown_optionLabel"
|
||||
>
|
||||
Option two
|
||||
</span>
|
||||
<span
|
||||
class="mx_FilterDropdown_optionDescription"
|
||||
>
|
||||
with description
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`<FilterDropdown /> renders selected option 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="mx_Dropdown mx_FilterDropdown test"
|
||||
>
|
||||
<div
|
||||
aria-describedby="test_value"
|
||||
aria-expanded="false"
|
||||
aria-haspopup="listbox"
|
||||
aria-label="test label"
|
||||
aria-owns="test_input"
|
||||
class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="mx_Dropdown_option"
|
||||
id="test_value"
|
||||
>
|
||||
Option one
|
||||
</div>
|
||||
<span
|
||||
class="mx_Dropdown_arrow"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`<FilterDropdown /> renders selected option with selectedLabel 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="mx_Dropdown mx_FilterDropdown test"
|
||||
>
|
||||
<div
|
||||
aria-describedby="test_value"
|
||||
aria-expanded="false"
|
||||
aria-haspopup="listbox"
|
||||
aria-label="test label"
|
||||
aria-owns="test_input"
|
||||
class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="mx_Dropdown_option"
|
||||
id="test_value"
|
||||
>
|
||||
Show: Option one
|
||||
</div>
|
||||
<span
|
||||
class="mx_Dropdown_arrow"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`<FilterDropdown /> renders when selected option is not in options 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="mx_Dropdown mx_FilterDropdown test"
|
||||
>
|
||||
<div
|
||||
aria-describedby="test_value"
|
||||
aria-expanded="false"
|
||||
aria-haspopup="listbox"
|
||||
aria-label="test label"
|
||||
aria-owns="test_input"
|
||||
class="mx_AccessibleButton mx_Dropdown_input mx_no_textinput"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="mx_Dropdown_option"
|
||||
id="test_value"
|
||||
/>
|
||||
<span
|
||||
class="mx_Dropdown_arrow"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
Loading…
Add table
Add a link
Reference in a new issue