publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-02-23 10:04:18 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add aria labels to pass a11y

Browse source 
- update snapshot
This commit is contained in:
Vim USDS 2021-10-28 10:41:01 -07:00
parent 6bd9d202dc
commit 4b4d4eef23
2 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
client/src/pages/__snapshots__/contact.test.tsx.snap
View file

@ -319,12 +319,15 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
<input <input
aria-describedby="combobox-messageType-assistive-hint" aria-describedby="combobox-messageType-assistive-hint"
aria-expanded="false" aria-expanded="false"
aria-label="Select form type"
aria-labelledby="Select form type"
aria-owns="combobox-messageType-list" aria-owns="combobox-messageType-list"
autocapitalize="off" autocapitalize="off"
autocomplete="off" autocomplete="off"
class="usa-combo-box__input" class="usa-combo-box__input"
data-testid="combo-box-input" data-testid="combo-box-input"
role="combobox" role="combobox"
title="Form Selector"
type="text" type="text"
value="" value=""
/> />
@ -362,7 +365,7 @@ exports[`rendering of the DatasetContainer checks if various text fields are vis
</button> </button>
</span> </span>
<ul <ul
aria-labelledby="message-type-label" aria-labelledby="Form type options"
class="usa-combo-box__list" class="usa-combo-box__list"
data-testid="combo-box-option-list" data-testid="combo-box-option-list"
hidden="" hidden=""

7
client/src/pages/contact.tsx
View file

@ -56,9 +56,14 @@ const ContactPage = ({location}: IContactPageProps) => {
<ComboBox <ComboBox
id="messageType" id="messageType"
name="messageType" name="messageType"
inputProps={{
'aria-labelledby': 'Select form type',
'title': 'Form Selector',
'aria-label': 'Select form type',
}}
options={messageTypes} options={messageTypes}
onChange={(messageType) => onMessageTypeChange(messageType)} onChange={(messageType) => onMessageTypeChange(messageType)}
ulProps={{'aria-labelledby': 'message-type-label'}} ulProps={{'aria-labelledby': 'Form type options'}}
/> />
<IQContactForm messageType={messageType} /> <IQContactForm messageType={messageType} />