Skip to content

Commit

Permalink
Merge pull request #191 from usagov/stage
Browse files Browse the repository at this point in the history
Sprint 54: release to MAIN
  • Loading branch information
rayestrada authored Mar 12, 2024
2 parents 30bbe2c + ac661a7 commit a62280d
Show file tree
Hide file tree
Showing 8 changed files with 147 additions and 133 deletions.
8 changes: 4 additions & 4 deletions src/components/Eligibility.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,8 @@ function Eligibility(props) {
.replace("@reg_eligibility_desc", stateContent.reg_eligibility_desc)}}/>

<Form id="eligibility" autoComplete="off" className={'margin-top-2'} style={{ maxWidth:'none' }} onSubmit={(e) => {e.preventDefault(), props.handleNext()}}>
<div data-test="checkBox" className="input-parent">
<Label htmlFor="eligibility-error" className={'margin-top-1'}>
<div className="input-parent" data-test="checkBox">
<Label htmlFor="eligibility-checkbox" className={'margin-top-1'}>
<strong>{eligibility.name}</strong>
</Label>
<Checkbox
Expand All @@ -45,15 +45,15 @@ function Eligibility(props) {
value="eligibility-checkbox"
label={getFieldLabel(fields, "39fc63ad-ed5a-4ad5-98d3-aa236c96c61c")}
aria-required="true"
aria-describedby="eligibility-error"
aria-describedby="eligibility-checkbox_error"
required={true}
defaultChecked={props.hasConfirmed}
onChange={(e) => props.confirmCheckbox(e.target.checked)}
onInvalid={(e) => e.target.setCustomValidity(' ')}
onInput={(e) => e.target.setCustomValidity('')}
onBlur={(e) => toggleError(e, !props.hasConfirmed)}
/>
<span id="eligibility-error" role="alert" className='error-text' data-test="errorText">
<span id="eligibility-checkbox_error" role="alert" className='error-text' data-test="errorText">
{getFieldError(fields, "39fc63ad-ed5a-4ad5-98d3-aa236c96c61c")}
</span>
</div>
Expand Down
86 changes: 44 additions & 42 deletions src/components/FormSections/Addresses.jsx

Large diffs are not rendered by default.

11 changes: 6 additions & 5 deletions src/components/FormSections/Confirmation.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ function Confirmation(props) {

<p><strong>{headings.confirmation.previous_name.label}</strong></p>
{!prevName && (
<Alert type="info" headingLevel="h4" noIcon>
<Alert type="info" headingLevel="h4" role="region" aria-live="polite" noIcon>
{headings.confirmation.previous_name.alert}
</Alert>
)}
Expand Down Expand Up @@ -93,7 +93,7 @@ function Confirmation(props) {
</div>
<p><strong>{headings.confirmation.current_address.label}</strong></p>
{!currentAddress && (
<Alert type="info" headingLevel="h4" noIcon>
<Alert type="info" headingLevel="h4"role="region" aria-live="polite" noIcon>
{headings.confirmation.current_address.alert}
</Alert>
)}
Expand All @@ -107,7 +107,7 @@ function Confirmation(props) {

<p><strong>{headings.confirmation.previous_address.label}</strong></p>
{!prevAddress && (
<Alert type="info" headingLevel="h4" noIcon>
<Alert type="info" headingLevel="h4"role="region" aria-live="polite" noIcon>
{headings.confirmation.previous_address.alert}
</Alert>
)}
Expand All @@ -121,7 +121,7 @@ function Confirmation(props) {

<p><strong>{headings.confirmation.mailing_address.label}</strong></p>
{!prevMailAddress && (
<Alert type="info" headingLevel="h4" noIcon>
<Alert type="info" headingLevel="h4"role="region" aria-live="polite" noIcon>
{headings.confirmation.mailing_address.alert}
</Alert>
)}
Expand Down Expand Up @@ -168,7 +168,7 @@ function Confirmation(props) {
<hr />

{confirmInstructions && (
<div className="usa-alert usa-alert--info margin-top-6" role="alert">
<div id="acknowledge-check-alert" className="usa-alert usa-alert--info margin-top-6" role="region" aria-live="polite">
<div className="usa-alert__body" dangerouslySetInnerHTML={{__html: confirmInstructions}}/>
</div>)}

Expand All @@ -177,6 +177,7 @@ function Confirmation(props) {
data-test="confirm"
id="acknowledge-checkbox"
name="acknowledge-check"
aria-describedby="acknowledge-check-alert"
required
defaultChecked={props.hasAcknowledged}
label={getFieldLabel("73e74065-fd5a-43c0-907c-268120e34bc3")}
Expand Down
58 changes: 31 additions & 27 deletions src/components/FormSections/Identification.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,25 +32,24 @@ function Identification(props){
<h2>{headings.step_label_3}</h2>

{idStateInstructions && (
<div className="usa-alert usa-alert--info" role="alert">
<div id="id_alert" className="usa-alert usa-alert--info" role="region" aria-live="polite">
<div className="usa-alert__body" dangerouslySetInnerHTML={{__html: idStateInstructions}}/>
</div>)}

{(stateData.abbrev === "mo") && (
{(stateData.abbrev === "mo") ? (
<>
<Checkbox id="id-none" name="id-none" checked={props.hasNoID} onChange={props.onChangeHasNoIdCheckbox} label={noIdField.label} />
<Checkbox id="id-none" name="id-none" checked={props.hasNoID} onChange={props.onChangeHasNoIdCheckbox} label={noIdField.label} />
</>
)}

{(stateData.abbrev != "mo") && (
) : (
<>
<h3 className={'margin-top-5'}>{idTypeField.label}<span className='required-text'>*</span></h3>
<div dangerouslySetInnerHTML={{__html: idTypeFieldInstructions}}/>
<div className="input-parent">
<Select
id="id-selection"
name="id-selection"
aria-describedby="id-selection_error"
data-test="dropDown"
id="id-num-dropdown"
name="input-dropdown"
value={props.idType}
required={true}
aria-invalid={false}
Expand All @@ -68,23 +67,25 @@ function Identification(props){
{(noIdFieldReq) && <option key="id-none" value="none">{noIdField.label}</option>}
</React.Fragment>
</Select>
<span id="id-num-dropdown-error" role="alert" className='error-text' data-test="errorText">
<span id="id-selection_error" role="alert" className='error-text' data-test="errorText">
{stateIDField.error_msg}
</span>
</div>
</>)}
</>
)}

{((props.idType === 'driver-id-num') || (props.idType === 'state-id-num') || ((stateData.abbrev === "mo") && (props.idType != "none"))) &&
<div id="state-id" className="input-parent">
<div id="id-number" className="input-parent">
{((props.idType === 'driver-id-num') || (stateData.abbrev === "mo")) &&
<>
<Label className="text-bold" htmlFor="state-id-num-error">
<Label className="text-bold" htmlFor="id-driver">
{driverLicenseField.label}{(driverIDFieldReq) && <span className='required-text'>*</span>}
</Label>
<TextInput
id="driver-id-num"
id="id-driver"
className="radius-md"
name="driver-id-num"
name="id-driver"
aria-describedby="id-driver_error"
type="text"
autoComplete="off"
required={parseInt(driverIDFieldReq.required)}
Expand All @@ -94,21 +95,22 @@ function Identification(props){
onInvalid={(e) => e.target.setCustomValidity(' ')}
onInput={(e) => e.target.setCustomValidity('')}
/>
<span id="state-id-num-error" role="alert" className='error-text' data-test="errorText">
<span id="id-driver_error" role="alert" className='error-text' data-test="errorText">
{driverLicenseField.error_msg}
</span>
</>
}
{(props.idType === 'state-id-num') &&
<>
<Label className="text-bold"
htmlFor="state-id-num-error">{stateIDField.label}{(stateIDFieldDReq) &&
htmlFor="id-state">{stateIDField.label}{(stateIDFieldDReq) &&
<span className='required-text'>*</span>}
</Label>
<TextInput
id="driver-id-num"
id="id-state"
className="radius-md"
name="driver-id-num"
name="id-state"
aria-describedby="id-state_error"
type="text"
autoComplete="off"
required={parseInt(stateIDFieldDReq.required)}
Expand All @@ -118,7 +120,7 @@ function Identification(props){
onInvalid={(e) => e.target.setCustomValidity(' ')}
onInput={(e) => e.target.setCustomValidity('')}
/>
<span id="state-id-num-error" role="alert" className='error-text' data-test="errorText">
<span id="id-state_error" role="alert" className='error-text' data-test="errorText">
{stateIDField.error_msg}
</span>
</>
Expand All @@ -127,14 +129,15 @@ function Identification(props){

{((props.idType === 'ssn') || ((stateData.abbrev === "mo") && (props.idType != "none"))) &&
<div className="input-parent">
<Label className="text-bold" htmlFor="ssn-input-error">
<Label className="text-bold" htmlFor="ssn">
{ssnField.label}{(ssnFieldReq) && <span className='required-text'>*</span>}
</Label>
<span className="usa-hint" id="ssn-hint">{ssnField.help_text}</span>
<TextInput
id="ssn-input"
id="ssn"
className="radius-md"
name="ssn-input"
name="ssn"
aria-describedby="ssn_error"
autoComplete="off"
required={parseInt(ssnFieldReq.required)}
type="text"
Expand All @@ -148,21 +151,22 @@ function Identification(props){
onInvalid={(e) => e.target.setCustomValidity(' ')}
onInput={(e) => e.target.setCustomValidity('')}
/>
<span id="ssn-input-error" role="alert" className='error-text' data-test="errorText">
<span id="ssn_error" role="alert" className='error-text' data-test="errorText">
{ssnField.error_msg}
</span>
</div>}

{props.idType === 'ssn-full' &&
<div className="input-parent">
<Label className="text-bold" htmlFor="ssn-input-error">
<Label className="text-bold" htmlFor="ssn-full">
{ssnFullField.label}{(ssnFullFieldReq) && <span className='required-text'>*</span>}
</Label>
<span className="usa-hint" id="ssn-hint">{ssnFullField.help_text}</span>
<TextInput
id="ssn-full-input"
id="ssn-full"
className="radius-md"
name="ssn-full-input"
name="ssn-full"
aria-describedby="ssn-full_error"
autoComplete="off"
required={parseInt(ssnFullFieldReq.required)}
type="text"
Expand All @@ -176,7 +180,7 @@ function Identification(props){
onInvalid={(e) => e.target.setCustomValidity(' ')}
onInput={(e) => e.target.setCustomValidity('')}
/>
<span id="ssn-input-error" role="alert" className='error-text' data-test="errorText">
<span id="ssn-full_error" role="alert" className='error-text' data-test="errorText">
{ssnFullField.error_msg}
</span>
</div>}
Expand Down
Loading

0 comments on commit a62280d

Please sign in to comment.