UIORGS-436 Settings > Organizations > Banking information is not prop… #751
GitHub Actions / Jest Unit Test Results
failed
Jul 1, 2024 in 0s
5 fail, 267 pass in 3m 25s
Annotations
github-actions / Jest Unit Test Results
OrganizationContactInfoForm should render correct structure with defined contacts (OrganizationContactInfoForm should render correct structure with defined contacts) failed
artifacts/jest-junit/junit.xml
Raw output
Error: expect(received).toMatchSnapshot()
Snapshot name: `OrganizationContactInfoForm should render correct structure with defined contacts 1`
- Snapshot - 9114
+ Received + 4620
@@ -253,54 +253,35 @@
</div>
<div
class="col-xs-12 col-md-3"
data-test-address-country="true"
>
- <div
- style="position: relative; width: 100%;"
- >
- <div
- aria-live="assertive"
- aria-relevant="additions"
- class="sr-only"
- />
+ <div>
<label
class="label"
- for="stripes-selection-5"
- id="sl-label-stripes-selection-5"
+ for="downshift-:r1:-input"
+ id="sl-label-selection-:r0:"
>
ui-organizations.data.contactTypes.country
</label>
<div
class="selectionControlContainer"
>
<button
+ aria-controls="downshift-:r1:-menu"
aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="sl-label-stripes-selection-5 selected-stripes-selection-5-item"
- aria-owns="sl-undefined"
+ aria-labelledby="sl-label-selection-:r0: selected-selection-:r0:-item"
class="selectionControl formControl"
- id="stripes-selection-5"
- name="addresses[0].country"
+ id="selection-:r0:"
type="button"
>
<span
class="sr-only"
>
stripes-components.selection.controlLabel
</span>
- <div
- class="singleValue"
- id="selected-stripes-selection-5-item"
- >
- <div
- class="optionSegment"
- data-test-selection-option-segment="true"
- >
US
- </div>
- </div>
</button>
<div
class="selectionEndControls"
>
<div
@@ -309,3825 +290,3310 @@
<span>
Icon
</span>
</div>
</div>
- </div>
<div
role="alert"
/>
</div>
<div
class="overlay"
hidden=""
>
<div
- class="selectionListRoot sr-only"
- hidden=""
- id="sl-container-stripes-selection-5"
+ class="selectionListRoot"
+ id="sl-container-selection-:r0:"
>
<div
class="selectionFilterContainer"
>
<input
- aria-activedescendant="option-stripes-selection-5-231-USA"
- aria-controls="sl-container-stripes-selection-5"
- aria-expanded="true"
+ aria-activedescendant=""
+ aria-autocomplete="list"
+ aria-controls="downshift-:r1:-menu"
+ aria-expanded="false"
aria-label="stripes-components.selection.filterOptionsLabel"
- aria-owns="sl-stripes-selection-5"
+ aria-labelledby="downshift-:r1:-label"
+ autocomplete="off"
class="selectionFilter"
+ id="downshift-:r1:-input"
placeholder="stripes-components.selection.filterOptionsPlaceholder"
role="combobox"
type="text"
value=""
/>
</div>
<ul
- aria-label="stripes-components.selection.filterOptionsLabel"
+ aria-labelledby="sl-label-selection-:r0:"
class="selectionList"
- id="sl-stripes-selection-5"
+ id="downshift-:r1:-menu"
role="listbox"
style="max-height: 174px;"
>
<li
- aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-0-null"
- role="option"
- tabindex="-1"
- unselectable="on"
+ class="groupLabel"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
/>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-1-AND"
+ class="option"
+ id="downshift-:r1:-item-0"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AD
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-2-ARE"
+ class="option"
+ id="downshift-:r1:-item-1"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AE
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-3-AFG"
+ class="option"
+ id="downshift-:r1:-item-2"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AF
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-4-ATG"
+ class="option"
+ id="downshift-:r1:-item-3"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AG
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-5-AIA"
+ class="option"
+ id="downshift-:r1:-item-4"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AI
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-6-ALB"
+ class="option"
+ id="downshift-:r1:-item-5"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AL
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-7-ARM"
+ class="option"
+ id="downshift-:r1:-item-6"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AM
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-8-ANT"
+ class="option"
+ id="downshift-:r1:-item-7"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AN
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-9-AGO"
+ class="option"
+ id="downshift-:r1:-item-8"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AO
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-10-ATA"
+ class="option"
+ id="downshift-:r1:-item-9"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AQ
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-11-ARG"
+ class="option"
+ id="downshift-:r1:-item-10"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AR
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-12-ASM"
+ class="option"
+ id="downshift-:r1:-item-11"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AS
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-13-AUT"
+ class="option"
+ id="downshift-:r1:-item-12"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AT
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-14-AUS"
+ class="option"
+ id="downshift-:r1:-item-13"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AU
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-15-ABW"
+ class="option"
+ id="downshift-:r1:-item-14"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AW
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-16-ALA"
+ class="option"
+ id="downshift-:r1:-item-15"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AX
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-17-AZE"
+ class="option"
+ id="downshift-:r1:-item-16"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
AZ
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-18-BIH"
+ class="option"
+ id="downshift-:r1:-item-17"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BA
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-19-BRB"
+ class="option"
+ id="downshift-:r1:-item-18"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BB
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-20-BGD"
+ class="option"
+ id="downshift-:r1:-item-19"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BD
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-21-BEL"
+ class="option"
+ id="downshift-:r1:-item-20"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BE
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-22-BFA"
+ class="option"
+ id="downshift-:r1:-item-21"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BF
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-23-BGR"
+ class="option"
+ id="downshift-:r1:-item-22"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BG
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-24-BHR"
+ class="option"
+ id="downshift-:r1:-item-23"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BH
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-25-BDI"
+ class="option"
+ id="downshift-:r1:-item-24"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BI
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-26-BEN"
+ class="option"
+ id="downshift-:r1:-item-25"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BJ
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-27-BLM"
+ class="option"
+ id="downshift-:r1:-item-26"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BL
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-28-BMU"
+ class="option"
+ id="downshift-:r1:-item-27"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
BM
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-5-29-BRN"
+ class="option"
+ id="downshift-:r1:-item-28"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
…class="option optionOutside"
- id="option-stripes-selection-14-465-wak"
+ class="option"
+ id="downshift-:rf:-item-464"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wakashan languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-466-wln"
+ class="option"
+ id="downshift-:rf:-item-465"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Walloon
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-467-war"
+ class="option"
+ id="downshift-:rf:-item-466"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Waray
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-468-was"
+ class="option"
+ id="downshift-:rf:-item-467"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Washo
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-469-wel"
+ class="option"
+ id="downshift-:rf:-item-468"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Welsh
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-470-fry"
+ class="option"
+ id="downshift-:rf:-item-469"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Western Frisian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-471-wal"
+ class="option"
+ id="downshift-:rf:-item-470"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wolaitta; Wolaytta
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-472-wol"
+ class="option"
+ id="downshift-:rf:-item-471"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wolof
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-473-xho"
+ class="option"
+ id="downshift-:rf:-item-472"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Xhosa
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-474-sah"
+ class="option"
+ id="downshift-:rf:-item-473"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yakut
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-475-yao"
+ class="option"
+ id="downshift-:rf:-item-474"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yao
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-476-yap"
+ class="option"
+ id="downshift-:rf:-item-475"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yapese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-477-yid"
+ class="option"
+ id="downshift-:rf:-item-476"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yiddish
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-478-yor"
+ class="option"
+ id="downshift-:rf:-item-477"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yoruba
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-479-ypk"
+ class="option"
+ id="downshift-:rf:-item-478"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yupik languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-480-znd"
+ class="option"
+ id="downshift-:rf:-item-479"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zande languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-481-zap"
+ class="option"
+ id="downshift-:rf:-item-480"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zapotec
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-482-zza"
+ class="option"
+ id="downshift-:rf:-item-481"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zaza; Dimili; Dimli; Kirdki; Kirmanjki; Zazaki
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-483-zen"
+ class="option"
+ id="downshift-:rf:-item-482"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zenaga
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-484-zha"
+ class="option"
+ id="downshift-:rf:-item-483"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zhuang; Chuang
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-485-zul"
+ class="option"
+ id="downshift-:rf:-item-484"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zulu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-14-486-zun"
+ class="option"
+ id="downshift-:rf:-item-485"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zuni
</div>
</li>
</ul>
- <div
- class="selectListSection"
- role="alert"
- />
+ </div>
</div>
</div>
</div>
<div
class="col-xs-12 col-md-3"
data-test-url-category="true"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
- id="multiselect-4"
+ id="multiselect-:rg:"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="urlFormCategoriesLabel"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="multiselect-4-input"
- id="urlFormCategoriesLabel"
+ for="downshift-:rh:-input"
+ id="multiselect-label-id-multiselect-:rg:"
>
ui-organizations.data.contactTypes.categories
</label>
<span
class="sr-only"
- id="multi-value-status-multiselect-4"
+ id="multi-value-status-multiselect-:rg:"
>
1 item selected
</span>
<span
class="sr-only"
- id="multi-describe-control-multiselect-4"
+ id="multi-describe-control-multiselect-:rg:"
>
stripes-components.multiSelection.controlDescription
</span>
<div
class="multiSelectControlWrapper"
>
<div
- aria-describedby="multi-describe-control-multiselect-4"
- aria-labelledby="urlFormCategoriesLabel multi-value-status-multiselect-4"
+ aria-describedby="multi-describe-control-multiselect-:rg:"
+ aria-labelledby="multiselect-label-id-multiselect-:rg: multi-value-status-multiselect-:rg:"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
<div
class="multiSelectValueListContainer"
- id="multi-values-list-multiselect-4"
+ id="multi-values-list-multiselect-:rg:"
>
<span
class="sr-only"
- id="multi-value-multiselect-4"
+ id="multi-value-multiselect-:rg:"
>
stripes-components.multiSelection.removeSelectedButtonLabel
</span>
<span
class="sr-only"
- id="multi-describe-action-multiselect-4"
+ id="multi-describe-action-multiselect-:rg:"
>
stripes-components.multiSelection.removeSelectedButtonDescription
</span>
<ul
class="multiSelectValueList"
@@ -34835,21 +30337,23 @@
>
ui-organizations.contactInfo.vendorCategory.customerService
</div>
</div>
<button
- aria-describedby="multi-describe-action-multiselect-4"
+ aria-describedby="multi-describe-action-multiselect-:rg:"
aria-label="times"
- aria-labelledby="urls[0].categories-category1-0_multiselect_selected_label multi-value-multiselect-4"
+ aria-labelledby="urls[0].categories-category1-0_multiselect_selected_label multi-value-multiselect-:rg:"
class="iconButton small"
icon="times"
+ index="0"
style="padding: 0px;"
type="button"
>
<span
- aria-describedby="multi-describe-action-multiselect-4"
+ aria-describedby="multi-describe-action-multiselect-:rg:"
class="iconButtonInner smallOffset"
+ index="0"
>
<span>
Icon
</span>
</span>
@@ -34857,36 +30361,37 @@
</div>
</li>
</ul>
</div>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="urlFormCategoriesLabel"
+ aria-controls="multiselect-option-list-multiselect-:rg:"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-multiselect-:rg:"
autocomplete="off"
class="multiSelectFilterField"
- id="multiselect-4-input"
- placeholder=""
+ id="multiselect-:rg:-input"
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
- id="multiselect-input-multiselect-4"
+ id="multiselect-input-multiselect-:rg:"
tabindex="-1"
- type="text"
value="urls[0].categories-category1"
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-multiselect-:rg:"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:rh:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -34897,27 +30402,28 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
/>
<ul
- aria-labelledby="urlFormCategoriesLabel"
+ aria-labelledby="multiselect-label-id-multiselect-:rg:"
class="multiSelectOptionList"
- id="multiselect-option-list-multiselect-4"
+ id="multiselect-option-list-multiselect-:rg:"
role="listbox"
style="max-height: 168px;"
>
<li
+ aria-disabled="false"
aria-selected="true"
class="multiSelectOption optionCursor optionSelected"
- id="multiselect-4-main-item-0"
+ id="downshift-:rh:-item-0"
role="option"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
@@ -34927,13 +30433,14 @@
<div>
-
</div>
</li>
<li
+ aria-disabled="false"
aria-selected="false"
class="multiSelectOption"
- id="multiselect-4-main-item-1"
+ id="downshift-:rh:-item-1"
role="option"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
@@ -34943,11 +30450,10 @@
<div>
+
</div>
</li>
</ul>
- </div>
</div>
</div>
<div
role="alert"
/>
at Object.toMatchSnapshot (/home/runner/work/ui-organizations/ui-organizations/src/Organizations/OrganizationForm/OrganizationContactInfoForm/OrganizationContactInfoForm.test.js:86:26)
Check warning on line 0 in EditContact should render correct form structure
github-actions / Jest Unit Test Results
1 out of 2 runs failed: EditContact should render correct form structure (EditContact should render correct form structure)
artifacts/jest-junit/junit.xml
Raw output
Error: expect(received).toMatchSnapshot()
Snapshot name: `EditContact should render correct form structure 1`
- Snapshot - 11137
+ Received + 5647
@@ -328,47 +328,34 @@
class="row"
>
<div
class="col-xs-3"
>
- <div
- style="position: relative; width: 100%;"
- >
- <div
- aria-live="assertive"
- aria-relevant="additions"
- class="sr-only"
- />
+ <div>
<label
class="label"
- for="stripes-selection-12"
- id="sl-label-stripes-selection-12"
+ for="downshift-:r1:-input"
+ id="sl-label-selection-:r0:"
>
ui-organizations.contactPeople.language
</label>
<div
class="selectionControlContainer"
>
<button
+ aria-controls="downshift-:r1:-menu"
aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="sl-label-stripes-selection-12 selected-stripes-selection-12-item"
- aria-owns="sl-undefined"
+ aria-labelledby="sl-label-selection-:r0: selected-selection-:r0:-item"
class="selectionControl formControl"
- id="stripes-selection-12"
- name="language"
+ id="selection-:r0:"
type="button"
>
<span
class="sr-only"
>
stripes-components.selection.controlLabel
</span>
- <div
- class="singleValue"
- id="selected-stripes-selection-12-item"
- />
</button>
<div
class="selectionEndControls"
>
<div
@@ -377,7422 +364,6438 @@
<span>
Icon
</span>
</div>
</div>
- </div>
<div
role="alert"
/>
</div>
<div
class="overlay"
hidden=""
>
<div
- class="selectionListRoot sr-only"
- hidden=""
- id="sl-container-stripes-selection-12"
+ class="selectionListRoot"
+ id="sl-container-selection-:r0:"
>
<div
class="selectionFilterContainer"
>
<input
- aria-activedescendant="option-stripes-selection-12-0-"
- aria-controls="sl-container-stripes-selection-12"
- aria-expanded="true"
+ aria-activedescendant=""
+ aria-autocomplete="list"
+ aria-controls="downshift-:r1:-menu"
+ aria-expanded="false"
aria-label="stripes-components.selection.filterOptionsLabel"
- aria-owns="sl-stripes-selection-12"
+ aria-labelledby="downshift-:r1:-label"
+ autocomplete="off"
class="selectionFilter"
+ id="downshift-:r1:-input"
placeholder="stripes-components.selection.filterOptionsPlaceholder"
role="combobox"
type="text"
value=""
/>
</div>
<ul
- aria-label="stripes-components.selection.filterOptionsLabel"
+ aria-labelledby="sl-label-selection-:r0:"
class="selectionList"
- id="sl-stripes-selection-12"
+ id="downshift-:r1:-menu"
role="listbox"
style="max-height: 174px;"
>
<li
- aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-0-null"
- role="option"
- tabindex="-1"
- unselectable="on"
+ class="groupLabel"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
/>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-1-abk"
+ class="option"
+ id="downshift-:r1:-item-0"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Abkhazian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-2-ace"
+ class="option"
+ id="downshift-:r1:-item-1"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Achinese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-3-ach"
+ class="option"
+ id="downshift-:r1:-item-2"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Acoli
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-4-ada"
+ class="option"
+ id="downshift-:r1:-item-3"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Adangme
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-5-ady"
+ class="option"
+ id="downshift-:r1:-item-4"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Adyghe; Adygei
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-6-aar"
+ class="option"
+ id="downshift-:r1:-item-5"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afar
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-7-afh"
+ class="option"
+ id="downshift-:r1:-item-6"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afrihili
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-8-afr"
+ class="option"
+ id="downshift-:r1:-item-7"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afrikaans
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-9-afa"
+ class="option"
+ id="downshift-:r1:-item-8"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afro-Asiatic languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-10-ain"
+ class="option"
+ id="downshift-:r1:-item-9"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Ainu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-11-aka"
+ class="option"
+ id="downshift-:r1:-item-10"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Akan
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-12-akk"
+ class="option"
+ id="downshift-:r1:-item-11"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Akkadian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-13-alb"
+ class="option"
+ id="downshift-:r1:-item-12"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Albanian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-14-ale"
+ class="option"
+ id="downshift-:r1:-item-13"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aleut
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-15-alg"
+ class="option"
+ id="downshift-:r1:-item-14"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Algonquian languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-16-tut"
+ class="option"
+ id="downshift-:r1:-item-15"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Altaic languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-17-amh"
+ class="option"
+ id="downshift-:r1:-item-16"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Amharic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-18-anp"
+ class="option"
+ id="downshift-:r1:-item-17"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Angika
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-19-apa"
+ class="option"
+ id="downshift-:r1:-item-18"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Apache languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-20-ara"
+ class="option"
+ id="downshift-:r1:-item-19"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arabic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-21-arg"
+ class="option"
+ id="downshift-:r1:-item-20"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aragonese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-22-arp"
+ class="option"
+ id="downshift-:r1:-item-21"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arapaho
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-23-arw"
+ class="option"
+ id="downshift-:r1:-item-22"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arawak
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-24-arm"
+ class="option"
+ id="downshift-:r1:-item-23"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Armenian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-25-rup"
+ class="option"
+ id="downshift-:r1:-item-24"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aromanian; Arumanian; Macedo-Romanian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-26-art"
+ class="option"
+ id="downshift-:r1:-item-25"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Artificial languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-27-asm"
+ class="option"
+ id="downshift-:r1:-item-26"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Assamese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-28-ast"
+ class="option"
+ id="downshift-:r1:-item-27"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Asturian; Bable; Leonese; Asturleonese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-12-29-ath"
+ class="option"
+ id="downshift-:r1:-item-28"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Athapascan languages
</div>
<… Xhosa
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-474-sah"
+ class="option"
+ id="downshift-:rj:-item-473"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yakut
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-475-yao"
+ class="option"
+ id="downshift-:rj:-item-474"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yao
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-476-yap"
+ class="option"
+ id="downshift-:rj:-item-475"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yapese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-477-yid"
+ class="option"
+ id="downshift-:rj:-item-476"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yiddish
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-478-yor"
+ class="option"
+ id="downshift-:rj:-item-477"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yoruba
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-479-ypk"
+ class="option"
+ id="downshift-:rj:-item-478"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yupik languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-480-znd"
+ class="option"
+ id="downshift-:rj:-item-479"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zande languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-481-zap"
+ class="option"
+ id="downshift-:rj:-item-480"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zapotec
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-482-zza"
+ class="option"
+ id="downshift-:rj:-item-481"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zaza; Dimili; Dimli; Kirdki; Kirmanjki; Zazaki
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-483-zen"
+ class="option"
+ id="downshift-:rj:-item-482"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zenaga
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-484-zha"
+ class="option"
+ id="downshift-:rj:-item-483"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zhuang; Chuang
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-485-zul"
+ class="option"
+ id="downshift-:rj:-item-484"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zulu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-27-486-zun"
+ class="option"
+ id="downshift-:rj:-item-485"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zuni
</div>
</li>
</ul>
- <div
- class="selectListSection"
- role="alert"
- />
</div>
</div>
</div>
+ </div>
<div
class="col-xs-12 col-md-3"
data-test-address-category="true"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
- id="multiselect-20"
+ id="multiselect-:rk:"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="addressFormCategoriesLabel"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="multiselect-20-input"
- id="addressFormCategoriesLabel"
+ for="downshift-:rl:-input"
+ id="multiselect-label-id-multiselect-:rk:"
>
ui-organizations.data.contactTypes.categories
</label>
<span
class="sr-only"
- id="multi-value-status-multiselect-20"
+ id="multi-value-status-multiselect-:rk:"
>
1 item selected
</span>
<span
class="sr-only"
- id="multi-describe-control-multiselect-20"
+ id="multi-describe-control-multiselect-:rk:"
>
stripes-components.multiSelection.controlDescription
</span>
<div
class="multiSelectControlWrapper"
>
<div
- aria-describedby="multi-describe-control-multiselect-20"
- aria-labelledby="addressFormCategoriesLabel multi-value-status-multiselect-20"
+ aria-describedby="multi-describe-control-multiselect-:rk:"
+ aria-labelledby="multiselect-label-id-multiselect-:rk: multi-value-status-multiselect-:rk:"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
<div
class="multiSelectValueListContainer"
- id="multi-values-list-multiselect-20"
+ id="multi-values-list-multiselect-:rk:"
>
<span
class="sr-only"
- id="multi-value-multiselect-20"
+ id="multi-value-multiselect-:rk:"
>
stripes-components.multiSelection.removeSelectedButtonLabel
</span>
<span
class="sr-only"
- id="multi-describe-action-multiselect-20"
+ id="multi-describe-action-multiselect-:rk:"
>
stripes-components.multiSelection.removeSelectedButtonDescription
</span>
<ul
class="multiSelectValueList"
@@ -43136,21 +37643,23 @@
>
Customer Service
</div>
</div>
<button
- aria-describedby="multi-describe-action-multiselect-20"
+ aria-describedby="multi-describe-action-multiselect-:rk:"
aria-label="times"
- aria-labelledby="addresses[0].categories-f52ceea4-8e35-0_multiselect_selected_label multi-value-multiselect-20"
+ aria-labelledby="addresses[0].categories-f52ceea4-8e35-0_multiselect_selected_label multi-value-multiselect-:rk:"
class="iconButton small"
icon="times"
+ index="0"
style="padding: 0px;"
type="button"
>
<span
- aria-describedby="multi-describe-action-multiselect-20"
+ aria-describedby="multi-describe-action-multiselect-:rk:"
class="iconButtonInner smallOffset"
+ index="0"
>
<span>
Icon
</span>
</span>
@@ -43158,36 +37667,37 @@
</div>
</li>
</ul>
</div>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="addressFormCategoriesLabel"
+ aria-controls="multiselect-option-list-multiselect-:rk:"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-multiselect-:rk:"
autocomplete="off"
class="multiSelectFilterField"
- id="multiselect-20-input"
- placeholder=""
+ id="multiselect-:rk:-input"
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
- id="multiselect-input-multiselect-20"
+ id="multiselect-input-multiselect-:rk:"
tabindex="-1"
- type="text"
value="addresses[0].categories-f52ceea4-8e35"
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-multiselect-:rk:"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:rl:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -43198,27 +37708,28 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
/>
<ul
- aria-labelledby="addressFormCategoriesLabel"
+ aria-labelledby="multiselect-label-id-multiselect-:rk:"
class="multiSelectOptionList"
- id="multiselect-option-list-multiselect-20"
+ id="multiselect-option-list-multiselect-:rk:"
role="listbox"
style="max-height: 168px;"
>
<li
+ aria-disabled="false"
aria-selected="true"
class="multiSelectOption optionCursor optionSelected"
- id="multiselect-20-main-item-0"
+ id="downshift-:rl:-item-0"
role="option"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
@@ -43228,11 +37739,10 @@
<div>
-
</div>
</li>
</ul>
- </div>
</div>
</div>
<div
role="alert"
/>
at Object.toMatchSnapshot (/home/runner/work/ui-organizations/ui-organizations/src/contacts/EditContact/EditContact.test.js:59:26)
at Promise.then.completed (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/utils.js:298:28)
at new Promise (<anonymous>)
at callAsyncCircusFn (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/utils.js:231:10)
at _callCircusTest (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/run.js:316:40)
at processTicksAndRejections (node:internal/process/task_queues:95:5)
at _runTest (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/run.js:252:3)
at _runTestsForDescribeBlock (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/run.js:126:9)
at _runTestsForDescribeBlock (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/run.js:121:9)
at run (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/run.js:71:3)
at runAndTransformResultsToJestFormat (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:122:21)
at jestAdapter (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:79:19)
at runTestInternal (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-runner/build/runTest.js:367:16)
at runTest (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-runner/build/runTest.js:444:34)
at Object.worker (/home/runner/work/ui-organizations/ui-organizations/node_modules/jest-runner/build/testWorker.js:106:12)
Check warning on line 0 in OrganizationSummaryForm should render correct structure
github-actions / Jest Unit Test Results
OrganizationSummaryForm should render correct structure (OrganizationSummaryForm should render correct structure) failed
artifacts/jest-junit/junit.xml
Raw output
Error: expect(received).toMatchSnapshot()
Snapshot name: `OrganizationSummaryForm should render correct structure 1`
- Snapshot - 2039
+ Received + 1041
@@ -185,29 +185,24 @@
</div>
<div
class="col-xs-6 col-md-3"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
id="organizations-type"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="organizationFormTypesLabel"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="organizations-type-input"
- id="organizationFormTypesLabel"
+ for="downshift-:r1:-input"
+ id="multiselect-label-id-organizations-type"
>
ui-organizations.summary.type
</label>
<span
class="sr-only"
@@ -224,13 +219,13 @@
<div
class="multiSelectControlWrapper"
>
<div
aria-describedby="multi-describe-control-organizations-type"
- aria-labelledby="organizationFormTypesLabel multi-value-status-organizations-type"
+ aria-labelledby="multiselect-label-id-organizations-type multi-value-status-organizations-type"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
@@ -270,16 +265,18 @@
aria-describedby="multi-describe-action-organizations-type"
aria-label="times"
aria-labelledby="e7e9af00-c12c-448f-8ad1-d15ff209605a-0_multiselect_selected_label multi-value-organizations-type"
class="iconButton small"
icon="times"
+ index="0"
style="padding: 0px;"
type="button"
>
<span
aria-describedby="multi-describe-action-organizations-type"
class="iconButtonInner smallOffset"
+ index="0"
>
<span>
Icon
</span>
</span>
@@ -287,36 +284,37 @@
</div>
</li>
</ul>
</div>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="organizationFormTypesLabel"
+ aria-controls="multiselect-option-list-organizations-type"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-organizations-type"
autocomplete="off"
class="multiSelectFilterField"
id="organizations-type-input"
- placeholder=""
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
id="multiselect-input-organizations-type"
tabindex="-1"
- type="text"
value="e7e9af00-c12c-448f-8ad1-d15ff209605a"
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-organizations-type"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:r1:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -327,94 +325,80 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
/>
<ul
- aria-labelledby="organizationFormTypesLabel"
+ aria-labelledby="multiselect-label-id-organizations-type"
class="multiSelectOptionList"
id="multiselect-option-list-organizations-type"
role="listbox"
style="max-height: 168px;"
>
<li
+ aria-disabled="false"
aria-selected="false"
class="multiSelectOption optionCursor"
- id="organizations-type-main-item-0"
+ id="downshift-:r1:-item-0"
role="option"
>
Auction house
<div>
+
</div>
</li>
</ul>
</div>
</div>
- </div>
<div
role="alert"
/>
</div>
</div>
<div
class="col-xs-6 col-md-3"
>
- <div
- style="position: relative; width: 100%;"
- >
- <div
- aria-live="assertive"
- aria-relevant="additions"
- class="sr-only"
- />
+ <div>
<label
class="label"
- for="stripes-selection-4"
- id="sl-label-stripes-selection-4"
+ for="downshift-:r3:-input"
+ id="sl-label-selection-:r2:"
>
ui-organizations.summary.defaultLanguage
</label>
<div
class="selectionControlContainer"
>
<button
+ aria-controls="downshift-:r3:-menu"
aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="sl-label-stripes-selection-4 selected-stripes-selection-4-item"
- aria-owns="sl-undefined"
+ aria-labelledby="sl-label-selection-:r2: selected-selection-:r2:-item"
class="selectionControl formControl"
- id="stripes-selection-4"
- name="language"
+ id="selection-:r2:"
type="button"
>
<span
class="sr-only"
>
stripes-components.selection.controlLabel
</span>
- <div
- class="singleValue"
- id="selected-stripes-selection-4-item"
- />
</button>
<div
class="selectionEndControls"
>
<div
class="textFieldIcon"
>
<span>
Icon
</span>
- </div>
</div>
</div>
<div
role="alert"
/>
@@ -422,7371 +406,6388 @@
<div
class="overlay"
hidden=""
>
<div
- class="selectionListRoot sr-only"
- hidden=""
- id="sl-container-stripes-selection-4"
+ class="selectionListRoot"
+ id="sl-container-selection-:r2:"
>
<div
class="selectionFilterContainer"
>
<input
- aria-activedescendant="option-stripes-selection-4-0-"
- aria-controls="sl-container-stripes-selection-4"
- aria-expanded="true"
+ aria-activedescendant=""
+ aria-autocomplete="list"
+ aria-controls="downshift-:r3:-menu"
+ aria-expanded="false"
aria-label="stripes-components.selection.filterOptionsLabel"
- aria-owns="sl-stripes-selection-4"
+ aria-labelledby="downshift-:r3:-label"
+ autocomplete="off"
class="selectionFilter"
+ id="downshift-:r3:-input"
placeholder="stripes-components.selection.filterOptionsPlaceholder"
role="combobox"
type="text"
value=""
/>
</div>
<ul
- aria-label="stripes-components.selection.filterOptionsLabel"
+ aria-labelledby="sl-label-selection-:r2:"
class="selectionList"
- id="sl-stripes-selection-4"
+ id="downshift-:r3:-menu"
role="listbox"
style="max-height: 174px;"
>
<li
- aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-0-null"
- role="option"
- tabindex="-1"
- unselectable="on"
+ class="groupLabel"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
/>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-1-abk"
+ class="option"
+ id="downshift-:r3:-item-0"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Abkhazian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-2-ace"
+ class="option"
+ id="downshift-:r3:-item-1"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Achinese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-3-ach"
+ class="option"
+ id="downshift-:r3:-item-2"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Acoli
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-4-ada"
+ class="option"
+ id="downshift-:r3:-item-3"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Adangme
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-5-ady"
+ class="option"
+ id="downshift-:r3:-item-4"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Adyghe; Adygei
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-6-aar"
+ class="option"
+ id="downshift-:r3:-item-5"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afar
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-7-afh"
+ class="option"
+ id="downshift-:r3:-item-6"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afrihili
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-8-afr"
+ class="option"
+ id="downshift-:r3:-item-7"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afrikaans
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-9-afa"
+ class="option"
+ id="downshift-:r3:-item-8"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Afro-Asiatic languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-10-ain"
+ class="option"
+ id="downshift-:r3:-item-9"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Ainu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-11-aka"
+ class="option"
+ id="downshift-:r3:-item-10"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Akan
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-12-akk"
+ class="option"
+ id="downshift-:r3:-item-11"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Akkadian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-13-alb"
+ class="option"
+ id="downshift-:r3:-item-12"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Albanian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-14-ale"
+ class="option"
+ id="downshift-:r3:-item-13"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aleut
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-15-alg"
+ class="option"
+ id="downshift-:r3:-item-14"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Algonquian languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-16-tut"
+ class="option"
+ id="downshift-:r3:-item-15"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Altaic languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-17-amh"
+ class="option"
+ id="downshift-:r3:-item-16"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Amharic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-18-anp"
+ class="option"
+ id="downshift-:r3:-item-17"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Angika
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-19-apa"
+ class="option"
+ id="downshift-:r3:-item-18"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Apache languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-20-ara"
+ class="option"
+ id="downshift-:r3:-item-19"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arabic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-21-arg"
+ class="option"
+ id="downshift-:r3:-item-20"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aragonese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-22-arp"
+ class="option"
+ id="downshift-:r3:-item-21"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arapaho
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-23-arw"
+ class="option"
+ id="downshift-:r3:-item-22"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Arawak
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-24-arm"
+ class="option"
+ id="downshift-:r3:-item-23"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Armenian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-25-rup"
+ class="option"
+ id="downshift-:r3:-item-24"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aromanian; Arumanian; Macedo-Romanian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-26-art"
+ class="option"
+ id="downshift-:r3:-item-25"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Artificial languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-27-asm"
+ class="option"
+ id="downshift-:r3:-item-26"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Assamese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-28-ast"
+ class="option"
+ id="downshift-:r3:-item-27"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Asturian; Bable; Leonese; Asturleonese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-29-ath"
+ class="option"
+ id="downshift-:r3:-item-28"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Athapascan languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-30-aus"
+ class="option"
+ id="downshift-:r3:-item-29"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Australian languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-31-map"
+ class="option"
+ id="downshift-:r3:-item-30"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Austronesian languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-32-ava"
+ class="option"
+ id="downshift-:r3:-item-31"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Avaric
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-33-ave"
+ class="option"
+ id="downshift-:r3:-item-32"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Avestan
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-34-awa"
+ class="option"
+ id="downshift-:r3:-item-33"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Awadhi
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-35-aym"
+ class="option"
+ id="downshift-:r3:-item-34"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Aymara
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-36-aze"
+ class="option"
+ id="downshift-:r3:-item-35"
role="option"
- … data-test-selection-option-segment="true"
>
Twi
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-450-udm"
+ class="option"
+ id="downshift-:r3:-item-449"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Udmurt
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-451-uga"
+ class="option"
+ id="downshift-:r3:-item-450"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Ugaritic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-452-uig"
+ class="option"
+ id="downshift-:r3:-item-451"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Uighur; Uyghur
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-453-ukr"
+ class="option"
+ id="downshift-:r3:-item-452"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Ukrainian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-454-umb"
+ class="option"
+ id="downshift-:r3:-item-453"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Umbundu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-455-mis"
+ class="option"
+ id="downshift-:r3:-item-454"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Uncoded languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-456-und"
+ class="option"
+ id="downshift-:r3:-item-455"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Undetermined
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-457-hsb"
+ class="option"
+ id="downshift-:r3:-item-456"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Upper Sorbian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-458-urd"
+ class="option"
+ id="downshift-:r3:-item-457"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Urdu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-459-uzb"
+ class="option"
+ id="downshift-:r3:-item-458"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Uzbek
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-460-vai"
+ class="option"
+ id="downshift-:r3:-item-459"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Vai
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-461-ven"
+ class="option"
+ id="downshift-:r3:-item-460"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Venda
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-462-vie"
+ class="option"
+ id="downshift-:r3:-item-461"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Vietnamese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-463-vol"
+ class="option"
+ id="downshift-:r3:-item-462"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Volapük
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-464-vot"
+ class="option"
+ id="downshift-:r3:-item-463"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Votic
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-465-wak"
+ class="option"
+ id="downshift-:r3:-item-464"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wakashan languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-466-wln"
+ class="option"
+ id="downshift-:r3:-item-465"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Walloon
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-467-war"
+ class="option"
+ id="downshift-:r3:-item-466"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Waray
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-468-was"
+ class="option"
+ id="downshift-:r3:-item-467"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Washo
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-469-wel"
+ class="option"
+ id="downshift-:r3:-item-468"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Welsh
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-470-fry"
+ class="option"
+ id="downshift-:r3:-item-469"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Western Frisian
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-471-wal"
+ class="option"
+ id="downshift-:r3:-item-470"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wolaitta; Wolaytta
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-472-wol"
+ class="option"
+ id="downshift-:r3:-item-471"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Wolof
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-473-xho"
+ class="option"
+ id="downshift-:r3:-item-472"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Xhosa
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-474-sah"
+ class="option"
+ id="downshift-:r3:-item-473"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yakut
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-475-yao"
+ class="option"
+ id="downshift-:r3:-item-474"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yao
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-476-yap"
+ class="option"
+ id="downshift-:r3:-item-475"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yapese
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-477-yid"
+ class="option"
+ id="downshift-:r3:-item-476"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yiddish
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-478-yor"
+ class="option"
+ id="downshift-:r3:-item-477"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yoruba
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-479-ypk"
+ class="option"
+ id="downshift-:r3:-item-478"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Yupik languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-480-znd"
+ class="option"
+ id="downshift-:r3:-item-479"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zande languages
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-481-zap"
+ class="option"
+ id="downshift-:r3:-item-480"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zapotec
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-482-zza"
+ class="option"
+ id="downshift-:r3:-item-481"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zaza; Dimili; Dimli; Kirdki; Kirmanjki; Zazaki
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-483-zen"
+ class="option"
+ id="downshift-:r3:-item-482"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zenaga
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-484-zha"
+ class="option"
+ id="downshift-:r3:-item-483"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zhuang; Chuang
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-485-zul"
+ class="option"
+ id="downshift-:r3:-item-484"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zulu
</div>
</li>
<li
aria-selected="false"
- class="option optionOutside"
- id="option-stripes-selection-4-486-zun"
+ class="option"
+ id="downshift-:r3:-item-485"
role="option"
- tabindex="-1"
- unselectable="on"
>
<div
class="optionSegment"
data-test-selection-option-segment="true"
>
Zuni
</div>
</li>
</ul>
- <div
- class="selectListSection"
- role="alert"
- />
+ </div>
</div>
</div>
</div>
<div
class="col-xs-6 col-md-3"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
id="org-acq-units"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="org-acq-units-label"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="org-acq-units-input"
- id="org-acq-units-label"
+ for="downshift-:r5:-input"
+ id="multiselect-label-id-org-acq-units"
>
stripes-acq-components.label.acqUnits
</label>
<span
class="sr-only"
@@ -7803,44 +6804,46 @@
<div
class="multiSelectControlWrapper"
>
<div
aria-describedby="multi-describe-control-org-acq-units"
- aria-labelledby="org-acq-units-label multi-value-status-org-acq-units"
+ aria-labelledby="multiselect-label-id-org-acq-units multi-value-status-org-acq-units"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="org-acq-units-label"
+ aria-controls="multiselect-option-list-org-acq-units"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-org-acq-units"
autocomplete="off"
class="multiSelectFilterField"
id="org-acq-units-input"
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
id="multiselect-input-org-acq-units"
tabindex="-1"
- type="text"
value=""
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-org-acq-units"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:r5:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -7851,11 +6854,11 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
>
@@ -7864,19 +6867,18 @@
>
stripes-components.multiSelection.defaultEmptyMessage
</div>
</div>
<ul
- aria-labelledby="org-acq-units-label"
+ aria-labelledby="multiselect-label-id-org-acq-units"
class="multiSelectOptionList"
id="multiselect-option-list-org-acq-units"
role="listbox"
style="max-height: 168px;"
/>
</div>
</div>
- </div>
<div
role="alert"
/>
</div>
</div>
@@ -7886,21 +6888,21 @@
<div
class="textArea"
>
<label
class="label"
- for="textarea-input-5"
+ for="textarea-input-4"
>
ui-organizations.summary.description
</label>
<div
class="inputGroup"
>
<textarea
aria-invalid="false"
class="formControl"
- id="textarea-input-5"
+ id="textarea-input-4"
name="description"
>
Use for rush orders, replacement requests, and second hand market
</textarea>
<div
@@ -7916,11 +6918,11 @@
class="checkbox inline vertical"
data-test-checkbox="true"
>
<label
class="label label checkboxInteractionStylesControl"
- for="checkbox-6"
+ for="checkbox-5"
>
<span
class="labelText"
>
ui-organizations.summary.isDonor
@@ -7929,11 +6931,11 @@
class="inner checkboxInteractionStyles"
>
<input
aria-invalid="false"
class="input"
- id="checkbox-6"
+ id="checkbox-5"
name="isDonor"
type="checkbox"
value=""
/>
<span
@@ -7969,11 +6971,11 @@
class="checkbox inline vertical"
data-test-checkbox="true"
>
<label
class="label label checkboxInteractionStylesControl"
- for="checkbox-7"
+ for="checkbox-6"
>
<span
class="labelText"
>
ui-organizations.summary.isVendor
@@ -7983,11 +6985,11 @@
>
<input
aria-invalid="false"
checked=""
class="input"
- id="checkbox-7"
+ id="checkbox-6"
name="isVendor"
type="checkbox"
value=""
/>
<span
@@ -8052,11 +7054,11 @@
<div
class="textField"
>
<label
class="label"
- for="text-input-8"
+ for="text-input-7"
>
ui-organizations.summary.alias
<span
aria-hidden="true"
class="asterisk"
@@ -8072,11 +7074,11 @@
aria-required="true"
autocapitalize="off"
autocomplete="off"
autocorrect="off"
error=""
- id="text-input-8"
+ id="text-input-7"
name="aliases[0].value"
required=""
spellcheck="false"
type="text"
value="Amazon"
@@ -8094,11 +7096,11 @@
<div
class="textField"
>
<label
class="label"
- for="text-input-9"
+ for="text-input-8"
>
ui-organizations.summary.description
</label>
<div
class="formControl inputGroup"
@@ -8107,11 +7109,11 @@
aria-invalid="false"
autocapitalize="off"
autocomplete="off"
autocorrect="off"
error=""
- id="text-input-9"
+ id="text-input-8"
name="aliases[0].description"
spellcheck="false"
type="text"
value=""
warning=""
at Object.toMatchSnapshot (/home/runner/work/ui-organizations/ui-organizations/src/Organizations/OrganizationForm/OrganizationSummaryForm/OrganizationSummaryForm.test.js:53:26)
at runNextTicks (node:internal/process/task_queues:60:5)
at listOnTimeout (node:internal/timers:538:9)
at processTimers (node:internal/timers:512:7)
github-actions / Jest Unit Test Results
OrganizationAccountsForm should render correct structure with defined accounts (OrganizationAccountsForm should render correct structure with defined accounts) failed
artifacts/jest-junit/junit.xml
Raw output
Error: expect(received).toMatchSnapshot()
Snapshot name: `OrganizationAccountsForm should render correct structure with defined accounts 1`
- Snapshot - 22
+ Received + 18
@@ -436,29 +436,24 @@
</div>
<div
class="col-xs-6 col-md-3"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
id="account-acq-units-0"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="account-acq-units-0-label"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="account-acq-units-0-input"
- id="account-acq-units-0-label"
+ for="downshift-:r1:-input"
+ id="multiselect-label-id-account-acq-units-0"
>
stripes-acq-components.label.acqUnits
</label>
<span
class="sr-only"
@@ -475,44 +470,46 @@
<div
class="multiSelectControlWrapper"
>
<div
aria-describedby="multi-describe-control-account-acq-units-0"
- aria-labelledby="account-acq-units-0-label multi-value-status-account-acq-units-0"
+ aria-labelledby="multiselect-label-id-account-acq-units-0 multi-value-status-account-acq-units-0"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="account-acq-units-0-label"
+ aria-controls="multiselect-option-list-account-acq-units-0"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-account-acq-units-0"
autocomplete="off"
class="multiSelectFilterField"
id="account-acq-units-0-input"
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
id="multiselect-input-account-acq-units-0"
tabindex="-1"
- type="text"
value=""
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-account-acq-units-0"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:r1:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -523,11 +520,11 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
>
@@ -536,17 +533,16 @@
>
stripes-components.multiSelection.defaultEmptyMessage
</div>
</div>
<ul
- aria-labelledby="account-acq-units-0-label"
+ aria-labelledby="multiselect-label-id-account-acq-units-0"
class="multiSelectOptionList"
id="multiselect-option-list-account-acq-units-0"
role="listbox"
style="max-height: 168px;"
/>
- </div>
</div>
</div>
<div
role="alert"
/>
at Object.toMatchSnapshot (/home/runner/work/ui-organizations/ui-organizations/src/Organizations/OrganizationForm/OrganizationAccountsForm/OrganizationAccountsForm.test.js:54:26)
at runNextTicks (node:internal/process/task_queues:60:5)
at listOnTimeout (node:internal/timers:538:9)
at processTimers (node:internal/timers:512:7)
Check warning on line 0 in OrganizationVendorInfoForm should render correct structure
github-actions / Jest Unit Test Results
OrganizationVendorInfoForm should render correct structure (OrganizationVendorInfoForm should render correct structure) failed
artifacts/jest-junit/junit.xml
Raw output
Error: expect(received).toMatchSnapshot()
Snapshot name: `OrganizationVendorInfoForm should render correct structure 1`
- Snapshot - 40
+ Received + 39
@@ -92,70 +92,65 @@
<div
class="col-xs-6 col-md-3"
data-test-currency="true"
>
<div
+ aria-expanded="false"
class="multiSelectContainer"
- id="multiselect-1"
+ id="multiselect-:r0:"
+ role="application"
>
<div
aria-live="assertive"
aria-relevant="additions"
class="sr-only"
/>
- <div
- aria-expanded="false"
- aria-haspopup="listbox"
- aria-labelledby="vendorFormCurrenciesLabel"
- class="multiSelectContainer"
- role="application"
- >
<label
class="label"
- for="multiselect-1-input"
- id="vendorFormCurrenciesLabel"
+ for="downshift-:r1:-input"
+ id="multiselect-label-id-multiselect-:r0:"
>
ui-organizations.vendorInfo.vendorCurrencies
</label>
<span
class="sr-only"
- id="multi-value-status-multiselect-1"
+ id="multi-value-status-multiselect-:r0:"
>
1 item selected
</span>
<span
class="sr-only"
- id="multi-describe-control-multiselect-1"
+ id="multi-describe-control-multiselect-:r0:"
>
stripes-components.multiSelection.controlDescription
</span>
<div
class="multiSelectControlWrapper"
>
<div
- aria-describedby="multi-describe-control-multiselect-1"
- aria-labelledby="vendorFormCurrenciesLabel multi-value-status-multiselect-1"
+ aria-describedby="multi-describe-control-multiselect-:r0:"
+ aria-labelledby="multiselect-label-id-multiselect-:r0: multi-value-status-multiselect-:r0:"
class="multiSelectControl formControl"
- role="search"
+ role="searchbox"
tabindex="0"
>
<div
class="multiSelectControlGroup"
>
<div
class="multiSelectValueListContainer"
- id="multi-values-list-multiselect-1"
+ id="multi-values-list-multiselect-:r0:"
>
<span
class="sr-only"
- id="multi-value-multiselect-1"
+ id="multi-value-multiselect-:r0:"
>
stripes-components.multiSelection.removeSelectedButtonLabel
</span>
<span
class="sr-only"
- id="multi-describe-action-multiselect-1"
+ id="multi-describe-action-multiselect-:r0:"
>
stripes-components.multiSelection.removeSelectedButtonDescription
</span>
<ul
class="multiSelectValueList"
@@ -172,21 +167,23 @@
id="USD-0_multiselect_selected_label"
>
USD (USD)
</div>
<button
- aria-describedby="multi-describe-action-multiselect-1"
+ aria-describedby="multi-describe-action-multiselect-:r0:"
aria-label="times"
- aria-labelledby="USD-0_multiselect_selected_label multi-value-multiselect-1"
+ aria-labelledby="USD-0_multiselect_selected_label multi-value-multiselect-:r0:"
class="iconButton small"
icon="times"
+ index="0"
style="padding: 0px;"
type="button"
>
<span
- aria-describedby="multi-describe-action-multiselect-1"
+ aria-describedby="multi-describe-action-multiselect-:r0:"
class="iconButtonInner smallOffset"
+ index="0"
>
<span>
Icon
</span>
</span>
@@ -194,36 +191,37 @@
</div>
</li>
</ul>
</div>
<input
+ aria-activedescendant=""
aria-autocomplete="list"
- aria-labelledby="vendorFormCurrenciesLabel"
+ aria-controls="multiselect-option-list-multiselect-:r0:"
+ aria-expanded="false"
+ aria-labelledby="multiselect-label-id-multiselect-:r0:"
autocomplete="off"
class="multiSelectFilterField"
- id="multiselect-1-input"
- placeholder=""
+ id="multiselect-:r0:-input"
+ role="combobox"
type="text"
value=""
/>
<input
- aria-autocomplete="list"
aria-hidden="true"
- autocomplete="off"
class="multiSelectValueInput"
- id="multiselect-input-multiselect-1"
+ id="multiselect-input-multiselect-:r0:"
tabindex="-1"
- type="text"
value="USD"
/>
</div>
<button
- aria-haspopup="true"
- aria-label="open menu"
+ aria-controls="multiselect-option-list-multiselect-:r0:"
+ aria-expanded="false"
+ aria-label="toggle menu"
class="multiSelectToggleButton"
- data-toggle="true"
- role="button"
+ id="downshift-:r1:-toggle-button"
+ tabindex="-1"
type="button"
>
<div
class="textFieldIcon"
>
@@ -234,49 +232,50 @@
</button>
</div>
<div
class="multiSelectMenu"
hidden=""
- style="width: 100px;"
+ style="width: 100%;"
>
<div
class="multiSelectFeedback"
role="alert"
/>
<ul
- aria-labelledby="vendorFormCurrenciesLabel"
+ aria-labelledby="multiselect-label-id-multiselect-:r0:"
class="multiSelectOptionList"
- id="multiselect-option-list-multiselect-1"
+ id="multiselect-option-list-multiselect-:r0:"
role="listbox"
style="max-height: 168px;"
>
<li
+ aria-disabled="false"
aria-selected="false"
class="multiSelectOption optionCursor"
- id="multiselect-1-main-item-0"
+ id="downshift-:r1:-item-0"
role="option"
>
BYN (BYN)
<div>
+
</div>
</li>
<li
+ aria-disabled="false"
aria-selected="true"
class="multiSelectOption optionSelected"
- id="multiselect-1-main-item-1"
+ id="downshift-:r1:-item-1"
role="option"
>
USD (USD)
<div>
-
</div>
</li>
</ul>
</div>
</div>
- </div>
<div
role="alert"
/>
</div>
</div>
@@ -603,11 +602,11 @@
<h3
class="headline size-medium margin-none font-weight-bold block"
data-test-headline="true"
>
<button
- aria-controls="accordion2"
+ aria-controls="accordion1"
aria-expanded="true"
class="defaultCollapseButton"
id="accordion-toggle-button-taxSection"
type="button"
>
@@ -637,11 +636,11 @@
>
<div
aria-labelledby="accordion-toggle-button-taxSection"
class="content-region expanded"
data-test-accordion-wrapper="true"
- id="accordion2"
+ id="accordion1"
role="region"
>
<div
class="row"
>
at Object.toMatchSnapshot (/home/runner/work/ui-organizations/ui-organizations/src/Organizations/OrganizationForm/OrganizationVendorInfoForm/OrganizationVendorInfoForm.test.js:45:26)
Loading