src/components/Section/__snapshots__/Section.test.jsx.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`The section component renders CITIZENSHIP_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 4: Citizenship
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your citizenship status and history and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review Relationships"
className="btn-cell back"
href="/form/relationships/review"
onClick={[Function]}
title="Go to previous section Review Relationships"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review Relationships
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section U.S. passport information"
className="btn-cell next"
href="/form/citizenship/passport"
onClick={[Function]}
title="Go to next section U.S. passport information"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
U.S. passport information
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders CITIZENSHIP_MULTIPLE 1`] = `
<div
className="section-view"
>
<div
className="view view-multiple"
>
<div
className="section-content multiple"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_MULTIPLE"
>
<h1
className="section-header"
>
Dual/multiple citizenship
</h1>
<div
aria-label="Do you now or have you EVER held dual/multiple citizenships?"
className="field required branch has-multiple"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you now or have you EVER held dual/multiple citizenships?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_multiple-MOCK-GUID"
name="has_multiple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_multiple-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_multiple-MOCK-GUID"
name="has_multiple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_multiple-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Citizenship status"
className="btn-cell back"
href="/form/citizenship/status"
onClick={[Function]}
title="Go to previous section Citizenship status"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Citizenship status
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign passports"
className="btn-cell next"
href="/form/citizenship/passports"
onClick={[Function]}
title="Go to next section Foreign passports"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign passports
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders CITIZENSHIP_PASSPORTS 1`] = `
<div
className="section-view"
>
<div
className="view view-passports"
>
<div
className="section-content passports"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_PASSPORTS"
>
<h1
className="section-header"
>
Foreign passports
</h1>
<div
className="has-foreignpassport"
>
<div>
<div
aria-label="Have you EVER been issued a passport (or identity card for travel) by a country other than the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been issued a passport (or identity card for travel) by a country other than the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Dual/multiple citizenship"
className="btn-cell back"
href="/form/citizenship/multiple"
onClick={[Function]}
title="Go to previous section Dual/multiple citizenship"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Dual/multiple citizenship
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review citizenship"
className="btn-cell next"
href="/form/citizenship/review"
onClick={[Function]}
title="Go to next section Review citizenship"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review citizenship
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders CITIZENSHIP_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content passport"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_US_PASSPORT"
>
<h1
className="section-header"
>
U.S. passport information
</h1>
<h3>
Provide the following information for the most recent U.S. passport you currently possess.
</h3>
<div
aria-label="Do you possess a U.S. passport (current or expired)?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you possess a U.S. passport (current or expired)?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_passport-MOCK-GUID"
name="has_passport-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_passport-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_passport-MOCK-GUID"
name="has_passport-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_passport-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content status"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_STATUS"
>
<h1
className="section-header"
>
Citizenship status
</h1>
<div
aria-label="Select the box that reflects your current citizenship status"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Select the box that reflects your current citizenship status
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<label>
Provide your current citizenship status
</label>
<div
className="blocks citizenship-status option-list option-list-vertical usa-input-error"
>
<div
className="citizenship-status-citizen block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-citizen-MOCK-GUID"
name="citizenship-status-citizen-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Citizen"
/>
<label
className=""
htmlFor="citizenship-status-citizen-MOCK-GUID"
>
<span>
<div>
<p>
I am a U.S. citizen or national by birth in the U.S. or U.S. territory/commonwealth
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-foreignborn block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-foreignborn-MOCK-GUID"
name="citizenship-status-foreignborn-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="ForeignBorn"
/>
<label
className=""
htmlFor="citizenship-status-foreignborn-MOCK-GUID"
>
<span>
<div>
<p>
I am a U.S. citizen or national by birth, born to U.S. parent(s), in a foreign country
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-naturalized block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-naturalized-MOCK-GUID"
name="citizenship-status-naturalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Naturalized"
/>
<label
className=""
htmlFor="citizenship-status-naturalized-MOCK-GUID"
>
<span>
<div>
<p>
I am a naturalized U.S. citizen
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-derived block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-derived-MOCK-GUID"
name="citizenship-status-derived-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Derived"
/>
<label
className=""
htmlFor="citizenship-status-derived-MOCK-GUID"
>
<span>
<div>
<p>
I am a derived U.S. citizen
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-notcitizen block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-notcitizen-MOCK-GUID"
name="citizenship-status-notcitizen-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="NotCitizen"
/>
<label
className=""
htmlFor="citizenship-status-notcitizen-MOCK-GUID"
>
<span>
<div>
<p>
I am not a U.S. citizen
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content multiple"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_MULTIPLE"
>
<h1
className="section-header"
>
Dual/multiple citizenship
</h1>
<div
aria-label="Do you now or have you EVER held dual/multiple citizenships?"
className="field required branch has-multiple"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you now or have you EVER held dual/multiple citizenships?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_multiple-MOCK-GUID"
name="has_multiple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_multiple-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_multiple-MOCK-GUID"
name="has_multiple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_multiple-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content passports"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_PASSPORTS"
>
<h1
className="section-header"
>
Foreign passports
</h1>
<div
className="has-foreignpassport"
>
<div>
<div
aria-label="Have you EVER been issued a passport (or identity card for travel) by a country other than the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been issued a passport (or identity card for travel) by a country other than the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign passports"
className="btn-cell back"
href="/form/citizenship/passports"
onClick={[Function]}
title="Go to previous section Foreign passports"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign passports
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Military intro"
className="btn-cell next"
href="/form/military/intro"
onClick={[Function]}
title="Go to next section Military intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Military intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders CITIZENSHIP_STATUS 1`] = `
<div
className="section-view"
>
<div
className="view view-status"
>
<div
className="section-content status"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_STATUS"
>
<h1
className="section-header"
>
Citizenship status
</h1>
<div
aria-label="Select the box that reflects your current citizenship status"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Select the box that reflects your current citizenship status
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<label>
Provide your current citizenship status
</label>
<div
className="blocks citizenship-status option-list option-list-vertical"
>
<div
className="citizenship-status-citizen block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-citizen-MOCK-GUID"
name="citizenship-status-citizen-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Citizen"
/>
<label
className=""
htmlFor="citizenship-status-citizen-MOCK-GUID"
>
<span>
<div>
<p>
I am a U.S. citizen or national by birth in the U.S. or U.S. territory/commonwealth
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-foreignborn block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-foreignborn-MOCK-GUID"
name="citizenship-status-foreignborn-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="ForeignBorn"
/>
<label
className=""
htmlFor="citizenship-status-foreignborn-MOCK-GUID"
>
<span>
<div>
<p>
I am a U.S. citizen or national by birth, born to U.S. parent(s), in a foreign country
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-naturalized block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-naturalized-MOCK-GUID"
name="citizenship-status-naturalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Naturalized"
/>
<label
className=""
htmlFor="citizenship-status-naturalized-MOCK-GUID"
>
<span>
<div>
<p>
I am a naturalized U.S. citizen
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-derived block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-derived-MOCK-GUID"
name="citizenship-status-derived-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Derived"
/>
<label
className=""
htmlFor="citizenship-status-derived-MOCK-GUID"
>
<span>
<div>
<p>
I am a derived U.S. citizen
</p>
</div>
</span>
</label>
</div>
<div
className="citizenship-status-notcitizen block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="citizenship-status-notcitizen-MOCK-GUID"
name="citizenship-status-notcitizen-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="NotCitizen"
/>
<label
className=""
htmlFor="citizenship-status-notcitizen-MOCK-GUID"
>
<span>
<div>
<p>
I am not a U.S. citizen
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section U.S. passport information"
className="btn-cell back"
href="/form/citizenship/passport"
onClick={[Function]}
title="Go to previous section U.S. passport information"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
U.S. passport information
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Dual/multiple citizenship"
className="btn-cell next"
href="/form/citizenship/multiple"
onClick={[Function]}
title="Go to next section Dual/multiple citizenship"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Dual/multiple citizenship
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders CITIZENSHIP_US_PASSPORT 1`] = `
<div
className="section-view"
>
<div
className="view view-passport"
>
<div
className="section-content passport"
data-section="CITIZENSHIP"
data-subsection="CITIZENSHIP_US_PASSPORT"
>
<h1
className="section-header"
>
U.S. passport information
</h1>
<h3>
Provide the following information for the most recent U.S. passport you currently possess.
</h3>
<div
aria-label="Do you possess a U.S. passport (current or expired)?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you possess a U.S. passport (current or expired)?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_passport-MOCK-GUID"
name="has_passport-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_passport-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_passport-MOCK-GUID"
name="has_passport-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_passport-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Citizenship intro"
className="btn-cell back"
href="/form/citizenship/intro"
onClick={[Function]}
title="Go to previous section Citizenship intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Citizenship intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Citizenship status"
className="btn-cell next"
href="/form/citizenship/status"
onClick={[Function]}
title="Go to next section Citizenship status"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Citizenship status
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_BANKRUPTCY 1`] = `
<div
className="section-view"
>
<div
className="view view-bankruptcy"
>
<div
className="section-content bankruptcies"
data-section="FINANCIAL"
data-subsection="FINANCIAL_BANKRUPTCY"
>
<h1
className="section-header"
>
Bankruptcy
</h1>
<div
aria-label="In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
className="field required branch bankruptcy-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_bankruptcydebt-MOCK-GUID"
name="has_bankruptcydebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_bankruptcydebt-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_bankruptcydebt-MOCK-GUID"
name="has_bankruptcydebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_bankruptcydebt-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Financial intro"
className="btn-cell back"
href="/form/financial/intro"
onClick={[Function]}
title="Go to previous section Financial intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Financial intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Gambling"
className="btn-cell next"
href="/form/financial/gambling"
onClick={[Function]}
title="Go to next section Gambling"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Gambling
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_CARD 1`] = `
<div
className="section-view"
>
<div
className="view view-card"
>
<div
className="section-content card-abuse"
data-section="FINANCIAL"
data-subsection="FINANCIAL_CARD"
>
<h1
className="section-header"
>
Employer card abuse
</h1>
<div
aria-label="In the last seven (7) years have you been counseled, warned, or disciplined for violating the terms of agreement for your travel or credit card provided by your employer?"
className="field required branch card-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you been counseled, warned, or disciplined for violating the terms of agreement for your travel or credit card provided by your employer?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_cardabuse-MOCK-GUID"
name="has_cardabuse-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_cardabuse-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_cardabuse-MOCK-GUID"
name="has_cardabuse-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_cardabuse-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Taxes"
className="btn-cell back"
href="/form/financial/taxes"
onClick={[Function]}
title="Go to previous section Taxes"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Taxes
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Credit counseling"
className="btn-cell next"
href="/form/financial/credit"
onClick={[Function]}
title="Go to next section Credit counseling"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Credit counseling
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_CREDIT 1`] = `
<div
className="section-view"
>
<div
className="view view-credit"
>
<div
className="section-content credit-counseling"
data-section="FINANCIAL"
data-subsection="FINANCIAL_CREDIT"
>
<h1
className="section-header"
>
Credit counseling
</h1>
<div
aria-label="Are you currently utilizing, or seeking assistance from, a credit counseling service or other similar resource to resolve your financial difficulties?"
className="field required branch credit-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Are you currently utilizing, or seeking assistance from, a credit counseling service or other similar resource to resolve your financial difficulties?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_credit-MOCK-GUID"
name="has_credit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_credit-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_credit-MOCK-GUID"
name="has_credit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_credit-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Employer card abuse"
className="btn-cell back"
href="/form/financial/card"
onClick={[Function]}
title="Go to previous section Employer card abuse"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Employer card abuse
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Delinquent payments"
className="btn-cell next"
href="/form/financial/delinquent"
onClick={[Function]}
title="Go to next section Delinquent payments"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Delinquent payments
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_DELINQUENT 1`] = `
<div
className="section-view"
>
<div
className="view view-delinquent"
>
<div
className="section-content delinquent"
data-section="FINANCIAL"
data-subsection="FINANCIAL_DELINQUENT"
>
<h1
className="section-header"
>
Delinquent payments
</h1>
<div
aria-label="Other than previously listed, has the following happened to you?"
className="field required branch delinquent-branch eapp-field-wrap"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than previously listed, has the following happened to you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
You will be asked to provide details about each financial obligation that pertains to the items identified below.
</p>
</div>
<div>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you have been delinquent on alimony or child support payments.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had a judgement entered against you. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had a lien placed against your property for failing to pay taxes or other debts. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
You are currently delinquent on any Federal debt. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
</ul>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_delinquent-MOCK-GUID"
name="has_delinquent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_delinquent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_delinquent-MOCK-GUID"
name="has_delinquent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_delinquent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Credit counseling"
className="btn-cell back"
href="/form/financial/credit"
onClick={[Function]}
title="Go to previous section Credit counseling"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Credit counseling
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Non-payment consequence"
className="btn-cell next"
href="/form/financial/nonpayment"
onClick={[Function]}
title="Go to next section Non-payment consequence"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Non-payment consequence
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_GAMBLING 1`] = `
<div
className="section-view"
>
<div
className="view view-gambling"
>
<div
className="section-content gambling"
data-section="FINANCIAL"
data-subsection="FINANCIAL_GAMBLING"
>
<h1
className="section-header"
>
Gambling
</h1>
<div
aria-label="Have you ever experienced financial problems due to gambling?"
className="field required branch has-gambling-debt"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever experienced financial problems due to gambling?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_gamblingdebt-MOCK-GUID"
name="has_gamblingdebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_gamblingdebt-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_gamblingdebt-MOCK-GUID"
name="has_gamblingdebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_gamblingdebt-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Bankruptcy"
className="btn-cell back"
href="/form/financial/bankruptcy"
onClick={[Function]}
title="Go to previous section Bankruptcy"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Bankruptcy
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Taxes"
className="btn-cell next"
href="/form/financial/taxes"
onClick={[Function]}
title="Go to next section Taxes"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Taxes
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 7: Financial record
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your financial history and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review Foreign Associations"
className="btn-cell back"
href="/form/foreign/review"
onClick={[Function]}
title="Go to previous section Review Foreign Associations"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review Foreign Associations
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Bankruptcy"
className="btn-cell next"
href="/form/financial/bankruptcy"
onClick={[Function]}
title="Go to next section Bankruptcy"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Bankruptcy
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_NONPAYMENT 1`] = `
<div
className="section-view"
>
<div
className="view view-nonpayment"
>
<div
className="section-content nonpayment"
data-section="FINANCIAL"
data-subsection="FINANCIAL_NONPAYMENT"
>
<h1
className="section-header"
>
Non-payment consequence
</h1>
<div
aria-label="Other than previously listed, have any of the following happened?"
className="field required branch nonpayment-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than previously listed, have any of the following happened?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had any possessions or property voluntarily or involuntarily repossessed or foreclosed? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you defaulted on any type of loan? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had bills or debts turned over to a collection agency? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had any account or credit card suspended, charged off, or cancelled for failing to pay as agreed? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you were evicted for non-payment?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had your wages, benefits, or assets garnished or attached for any reason?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you have been over 120 days delinquent on any debt not previously entered? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
You are currently over 120 days delinquent on any debt? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_nonpayment-MOCK-GUID"
name="has_nonpayment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_nonpayment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_nonpayment-MOCK-GUID"
name="has_nonpayment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_nonpayment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Delinquent payments"
className="btn-cell back"
href="/form/financial/delinquent"
onClick={[Function]}
title="Go to previous section Delinquent payments"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Delinquent payments
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review Financial record"
className="btn-cell next"
href="/form/financial/review"
onClick={[Function]}
title="Go to next section Review Financial record"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review Financial record
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<span>
<div
className="section-content bankruptcies"
data-section="FINANCIAL"
data-subsection="FINANCIAL_BANKRUPTCY"
>
<h1
className="section-header"
>
Bankruptcy
</h1>
<div
aria-label="In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
className="field required branch bankruptcy-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for In the last seven (7) years have you filed a petition under any chapter of the bankruptcy code?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_bankruptcydebt-MOCK-GUID"
name="has_bankruptcydebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_bankruptcydebt-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_bankruptcydebt-MOCK-GUID"
name="has_bankruptcydebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_bankruptcydebt-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content gambling"
data-section="FINANCIAL"
data-subsection="FINANCIAL_GAMBLING"
>
<h1
className="section-header"
>
Gambling
</h1>
<div
aria-label="Have you ever experienced financial problems due to gambling?"
className="field required branch has-gambling-debt"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever experienced financial problems due to gambling?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_gamblingdebt-MOCK-GUID"
name="has_gamblingdebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_gamblingdebt-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_gamblingdebt-MOCK-GUID"
name="has_gamblingdebt-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_gamblingdebt-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content taxes"
data-section="FINANCIAL"
data-subsection="FINANCIAL_TAXES"
>
<h1
className="section-header"
>
Taxes
</h1>
<div
aria-label="In the last seven (7) years have you failed to file or pay Federal, state, or other taxes when required by law or ordinance?"
className="field required branch taxes-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you failed to file or pay Federal, state, or other taxes when required by law or ordinance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_taxes-MOCK-GUID"
name="has_taxes-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_taxes-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_taxes-MOCK-GUID"
name="has_taxes-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_taxes-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content card-abuse"
data-section="FINANCIAL"
data-subsection="FINANCIAL_CARD"
>
<h1
className="section-header"
>
Employer card abuse
</h1>
<div
aria-label="In the last seven (7) years have you been counseled, warned, or disciplined for violating the terms of agreement for your travel or credit card provided by your employer?"
className="field required branch card-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you been counseled, warned, or disciplined for violating the terms of agreement for your travel or credit card provided by your employer?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_cardabuse-MOCK-GUID"
name="has_cardabuse-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_cardabuse-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_cardabuse-MOCK-GUID"
name="has_cardabuse-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_cardabuse-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content credit-counseling"
data-section="FINANCIAL"
data-subsection="FINANCIAL_CREDIT"
>
<h1
className="section-header"
>
Credit counseling
</h1>
<div
aria-label="Are you currently utilizing, or seeking assistance from, a credit counseling service or other similar resource to resolve your financial difficulties?"
className="field required branch credit-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Are you currently utilizing, or seeking assistance from, a credit counseling service or other similar resource to resolve your financial difficulties?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_credit-MOCK-GUID"
name="has_credit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_credit-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_credit-MOCK-GUID"
name="has_credit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_credit-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content delinquent"
data-section="FINANCIAL"
data-subsection="FINANCIAL_DELINQUENT"
>
<h1
className="section-header"
>
Delinquent payments
</h1>
<div
aria-label="Other than previously listed, has the following happened to you?"
className="field required branch delinquent-branch eapp-field-wrap"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than previously listed, has the following happened to you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
You will be asked to provide details about each financial obligation that pertains to the items identified below.
</p>
</div>
<div>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you have been delinquent on alimony or child support payments.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had a judgement entered against you. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had a lien placed against your property for failing to pay taxes or other debts. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
You are currently delinquent on any Federal debt. (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
</ul>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_delinquent-MOCK-GUID"
name="has_delinquent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_delinquent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_delinquent-MOCK-GUID"
name="has_delinquent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_delinquent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<div
className="section-content nonpayment"
data-section="FINANCIAL"
data-subsection="FINANCIAL_NONPAYMENT"
>
<h1
className="section-header"
>
Non-payment consequence
</h1>
<div
aria-label="Other than previously listed, have any of the following happened?"
className="field required branch nonpayment-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than previously listed, have any of the following happened?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had any possessions or property voluntarily or involuntarily repossessed or foreclosed? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you defaulted on any type of loan? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had bills or debts turned over to a collection agency? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had any account or credit card suspended, charged off, or cancelled for failing to pay as agreed? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you were evicted for non-payment?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you had your wages, benefits, or assets garnished or attached for any reason?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years,
</strong>
you have been over 120 days delinquent on any debt not previously entered? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
<li>
<div>
<p>
You are currently over 120 days delinquent on any debt? (Include financial obligations for which you were the sole debtor, as well as those for which you were a cosigner or guarantor).
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_nonpayment-MOCK-GUID"
name="has_nonpayment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_nonpayment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_nonpayment-MOCK-GUID"
name="has_nonpayment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_nonpayment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Non-payment consequence"
className="btn-cell back"
href="/form/financial/nonpayment"
onClick={[Function]}
title="Go to previous section Non-payment consequence"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Non-payment consequence
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Substance use intro"
className="btn-cell next"
href="/form/substance/intro"
onClick={[Function]}
title="Go to next section Substance use intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Substance use intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FINANCIAL_TAXES 1`] = `
<div
className="section-view"
>
<div
className="view view-taxes"
>
<div
className="section-content taxes"
data-section="FINANCIAL"
data-subsection="FINANCIAL_TAXES"
>
<h1
className="section-header"
>
Taxes
</h1>
<div
aria-label="In the last seven (7) years have you failed to file or pay Federal, state, or other taxes when required by law or ordinance?"
className="field required branch taxes-branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you failed to file or pay Federal, state, or other taxes when required by law or ordinance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_taxes-MOCK-GUID"
name="has_taxes-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_taxes-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_taxes-MOCK-GUID"
name="has_taxes-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_taxes-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Gambling"
className="btn-cell back"
href="/form/financial/gambling"
onClick={[Function]}
title="Go to previous section Gambling"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Gambling
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Employer card abuse"
className="btn-cell next"
href="/form/financial/card"
onClick={[Function]}
title="Go to next section Employer card abuse"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Employer card abuse
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_ACTIVITIES_BENEFITS 1`] = `
<div
className="section-view"
>
<div
className="view view-activities/benefits"
>
<div
className="section-content benefit-activity"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_BENEFITS"
>
<h1
className="section-header"
>
Foreign benefits
</h1>
<div
aria-label="As a U.S. citizen, have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children received in the last seven (7) years, or are eligible to receive in the future, any educational, medical, retirement, social welfare, or other such benefit from a foreign country?"
className="field required branch has-benefits"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
As a U.S. citizen, have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children received in the last seven (7) years, or are eligible to receive in the future, any educational, medical, retirement, social welfare, or other such benefit from a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_benefit-MOCK-GUID"
name="has_benefit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_benefit-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_benefit-MOCK-GUID"
name="has_benefit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_benefit-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Real estate purchase"
className="btn-cell back"
href="/form/foreign/activities/realestate"
onClick={[Function]}
title="Go to previous section Real estate purchase"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Real estate purchase
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign national support"
className="btn-cell next"
href="/form/foreign/activities/support"
onClick={[Function]}
title="Go to next section Foreign national support"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign national support
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_ACTIVITIES_DIRECT 1`] = `
<div
className="section-view"
>
<div
className="view view-activities/direct"
>
<div
className="section-content direct"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_DIRECT"
>
<h1
className="section-header"
>
Direct control
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Foreign financial interest examples: stocks, property, investments, bank accounts, ownership of corporate entities, corporate interests or exchange traded funds (ETFs) held in specific geographical or economic sectors.
</p>
</div>
<div>
<p>
Exclude financial interests in companies or diversified mutual funds or diversified ETFs that are publicly traded on a U.S. exchange.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign contacts"
className="btn-cell back"
href="/form/foreign/contacts"
onClick={[Function]}
title="Go to previous section Foreign contacts"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign contacts
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Indirect control"
className="btn-cell next"
href="/form/foreign/activities/indirect"
onClick={[Function]}
title="Go to next section Indirect control"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Indirect control
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_ACTIVITIES_INDIRECT 1`] = `
<div
className="section-view"
>
<div
className="view view-activities/indirect"
>
<div
className="section-content indirect"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_INDIRECT"
>
<h1
className="section-header"
>
Indirect control
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Direct control"
className="btn-cell back"
href="/form/foreign/activities/direct"
onClick={[Function]}
title="Go to previous section Direct control"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Direct control
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Real estate purchase"
className="btn-cell next"
href="/form/foreign/activities/realestate"
onClick={[Function]}
title="Go to next section Real estate purchase"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Real estate purchase
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_ACTIVITIES_REAL_ESTATE 1`] = `
<div
className="section-view"
>
<div
className="view view-activities/realestate"
>
<div
className="section-content realestate"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_REAL_ESTATE"
>
<h1
className="section-header"
>
Real estate purchase
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER owned, or do you anticipate owning, or plan to purchase real estate in a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER owned, or do you anticipate owning, or plan to purchase real estate in a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Indirect control"
className="btn-cell back"
href="/form/foreign/activities/indirect"
onClick={[Function]}
title="Go to previous section Indirect control"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Indirect control
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign benefits"
className="btn-cell next"
href="/form/foreign/activities/benefits"
onClick={[Function]}
title="Go to next section Foreign benefits"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign benefits
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_ACTIVITIES_SUPPORT 1`] = `
<div
className="section-view"
>
<div
className="view view-activities/support"
>
<div
className="section-content foreign-activities-support"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_SUPPORT"
>
<h1
className="section-header"
>
Foreign national support
</h1>
<div
aria-label="Have you EVER provided financial support for any foreign national?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER provided financial support for any foreign national?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_support-MOCK-GUID"
name="has_foreign_support-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_support-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_support-MOCK-GUID"
name="has_foreign_support-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_support-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign benefits"
className="btn-cell back"
href="/form/foreign/activities/benefits"
onClick={[Function]}
title="Go to previous section Foreign benefits"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign benefits
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Support provided"
className="btn-cell next"
href="/form/foreign/business/advice"
onClick={[Function]}
title="Go to next section Support provided"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Support provided
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_ADVICE 1`] = `
<div
className="section-view"
>
<div
className="view view-business/advice"
>
<div
className="section-content foreign-business-advice"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_ADVICE"
>
<h1
className="section-header"
>
Support provided
</h1>
<div
aria-label="Have you in the last seven (7) years provided advice or support to any individual associated with a foreign business or other foreign organization that you have not previously listed as a former employer?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years provided advice or support to any individual associated with a foreign business or other foreign organization that you have not previously listed as a former employer?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Answer
<strong>
"No"
</strong>
if
<strong>
all
</strong>
your advice or support was authorized pursuant to official U.S. Government business.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_advice-MOCK-GUID"
name="has_foreign_advice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_advice-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_advice-MOCK-GUID"
name="has_foreign_advice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_advice-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign national support"
className="btn-cell back"
href="/form/foreign/activities/support"
onClick={[Function]}
title="Go to previous section Foreign national support"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign national support
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Immediate family foreign support"
className="btn-cell next"
href="/form/foreign/business/family"
onClick={[Function]}
title="Go to next section Immediate family foreign support"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Immediate family foreign support
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_CONFERENCES 1`] = `
<div
className="section-view"
>
<div
className="view view-business/conferences"
>
<div
className="section-content foreign-business-conferences"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_CONFERENCES"
>
<h1
className="section-header"
>
Event participation
</h1>
<div
aria-label="Have you in the last seven (7) years attended or participated in any conferences, trade shows, seminars, or meetings outside the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years attended or participated in any conferences, trade shows, seminars, or meetings outside the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Do not include those you attended or participated in on official business for the U.S. government.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_conferences-MOCK-GUID"
name="has_foreign_conferences-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_conferences-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_conferences-MOCK-GUID"
name="has_foreign_conferences-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_conferences-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Other business ventures"
className="btn-cell back"
href="/form/foreign/business/ventures"
onClick={[Function]}
title="Go to previous section Other business ventures"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Other business ventures
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Immediate family contact"
className="btn-cell next"
href="/form/foreign/business/contact"
onClick={[Function]}
title="Go to next section Immediate family contact"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Immediate family contact
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_CONTACT 1`] = `
<div
className="section-view"
>
<div
className="view view-business/contact"
>
<div
className="section-content foreign-business-contact"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_CONTACT"
>
<h1
className="section-header"
>
Immediate family contact
</h1>
<div>
<p>
For this question, "Immediate Family" means your spouse, parents, step-parents, siblings, half and step-siblings, children, stepchildren, and cohabitant.
</p>
</div>
<div
aria-label="Have you or any member of your immediate family in the last seven (7) years had any contact with a foreign government, its establishment or its representatives, whether inside or outside the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you or any member of your immediate family in the last seven (7) years had any contact with a foreign government, its establishment or its representatives, whether inside or outside the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Such as embassy, consulate, agency, military service, intelligence or security service, etc.
</p>
</div>
<div>
<p>
Answer
<strong>
"No"
</strong>
if the contact was for routine visa applications and border crossings related to either official U.S. Government travel, foreign travel on a U.S. passport, or as a U.S. military service member in conjunction with a U.S. Government military duty.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contact-MOCK-GUID"
name="has_foreign_contact-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_contact-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contact-MOCK-GUID"
name="has_foreign_contact-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_contact-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Event participation"
className="btn-cell back"
href="/form/foreign/business/conferences"
onClick={[Function]}
title="Go to previous section Event participation"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Event participation
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign national sponsorship"
className="btn-cell next"
href="/form/foreign/business/sponsorship"
onClick={[Function]}
title="Go to next section Foreign national sponsorship"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign national sponsorship
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_EMPLOYMENT 1`] = `
<div
className="section-view"
>
<div
className="view view-business/employment"
>
<div
className="section-content foreign-business-employment"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_EMPLOYMENT"
>
<h1
className="section-header"
>
Employment
</h1>
<div
aria-label="Has any foreign national in the last seven (7) years offered you a job, asked you to work as a consultant, or consider employment with them?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has any foreign national in the last seven (7) years offered you a job, asked you to work as a consultant, or consider employment with them?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_employment-MOCK-GUID"
name="has_foreign_employment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_employment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_employment-MOCK-GUID"
name="has_foreign_employment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_employment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Immediate family foreign support"
className="btn-cell back"
href="/form/foreign/business/family"
onClick={[Function]}
title="Go to previous section Immediate family foreign support"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Immediate family foreign support
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Other business ventures"
className="btn-cell next"
href="/form/foreign/business/ventures"
onClick={[Function]}
title="Go to next section Other business ventures"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Other business ventures
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_FAMILY 1`] = `
<div
className="section-view"
>
<div
className="view view-business/family"
>
<div
className="section-content foreign-business-family"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_FAMILY"
>
<h1
className="section-header"
>
Immediate family foreign support
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or any member of your immediate family in the last seven (7) years been asked to provide advice or serve as a consultant, even informally, by any foreign government official or agency?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or any member of your immediate family in the last seven (7) years been asked to provide advice or serve as a consultant, even informally, by any foreign government official or agency?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
For this question, "Immediate Family" means your spouse or legally recognized civil union/domestic partner, parents, step-parents, siblings, half and step-siblings, children, step-children, and cohabitant.
</p>
</div>
<div>
<p>
Answer
<strong>
"No"
</strong>
if all the advice or support was authorized pursuant to official U.S. Government business.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_family-MOCK-GUID"
name="has_foreign_family-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_family-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_family-MOCK-GUID"
name="has_foreign_family-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_family-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Support provided"
className="btn-cell back"
href="/form/foreign/business/advice"
onClick={[Function]}
title="Go to previous section Support provided"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Support provided
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Employment"
className="btn-cell next"
href="/form/foreign/business/employment"
onClick={[Function]}
title="Go to next section Employment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Employment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_POLITICAL 1`] = `
<div
className="section-view"
>
<div
className="view view-business/political"
>
<div
className="section-content foreign-business-political"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_POLITICAL"
>
<h1
className="section-header"
>
Held political office
</h1>
<div
aria-label="Have you EVER held political office in a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER held political office in a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_political-MOCK-GUID"
name="has_foreign_political-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_political-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_political-MOCK-GUID"
name="has_foreign_political-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_political-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign national sponsorship"
className="btn-cell back"
href="/form/foreign/business/sponsorship"
onClick={[Function]}
title="Go to previous section Foreign national sponsorship"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign national sponsorship
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Voting"
className="btn-cell next"
href="/form/foreign/business/voting"
onClick={[Function]}
title="Go to next section Voting"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Voting
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_SPONSORSHIP 1`] = `
<div
className="section-view"
>
<div
className="view view-business/sponsorship"
>
<div
className="section-content foreign-business-sponsorship"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_SPONSORSHIP"
>
<h1
className="section-header"
>
Foreign national sponsorship
</h1>
<div
aria-label="Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_sponsorship-MOCK-GUID"
name="has_foreign_sponsorship-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_sponsorship-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_sponsorship-MOCK-GUID"
name="has_foreign_sponsorship-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_sponsorship-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Immediate family contact"
className="btn-cell back"
href="/form/foreign/business/contact"
onClick={[Function]}
title="Go to previous section Immediate family contact"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Immediate family contact
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Held political office"
className="btn-cell next"
href="/form/foreign/business/political"
onClick={[Function]}
title="Go to next section Held political office"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Held political office
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_VENTURES 1`] = `
<div
className="section-view"
>
<div
className="view view-business/ventures"
>
<div
className="section-content foreign-business-ventures"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_VENTURES"
>
<h1
className="section-header"
>
Other business ventures
</h1>
<div
aria-label="Have you in the last seven (7) years been involved in any other type of business venture with a foreign national not described above?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years been involved in any other type of business venture with a foreign national not described above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Own, co-own, serve as a business consultant, provide financial support, etc.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_ventures-MOCK-GUID"
name="has_foreign_ventures-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_ventures-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_ventures-MOCK-GUID"
name="has_foreign_ventures-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_ventures-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Employment"
className="btn-cell back"
href="/form/foreign/business/employment"
onClick={[Function]}
title="Go to previous section Employment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Employment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Event participation"
className="btn-cell next"
href="/form/foreign/business/conferences"
onClick={[Function]}
title="Go to next section Event participation"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Event participation
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_BUSINESS_VOTING 1`] = `
<div
className="section-view"
>
<div
className="view view-business/voting"
>
<div
className="section-content foreign-business-voting"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_VOTING"
>
<h1
className="section-header"
>
Voting
</h1>
<div
aria-label="Have you EVER voted in the election of a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voted in the election of a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_voting-MOCK-GUID"
name="has_foreign_voting-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_voting-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_voting-MOCK-GUID"
name="has_foreign_voting-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_voting-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Held political office"
className="btn-cell back"
href="/form/foreign/business/political"
onClick={[Function]}
title="Go to previous section Held political office"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Held political office
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign countries you have visited"
className="btn-cell next"
href="/form/foreign/travel"
onClick={[Function]}
title="Go to next section Foreign countries you have visited"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign countries you have visited
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_CONTACTS 1`] = `
<div
className="section-view"
>
<div
className="view view-contacts"
>
<div
className="section-content foreign-contacts"
data-section="FOREIGN"
data-subsection="FOREIGN_CONTACTS"
>
<h1
className="section-header"
>
Foreign contacts
</h1>
<div
aria-label="Do you have, or have you had, close and/or continuing contact with a foreign national within the last seven (7) years with whom you, or your spouse, or legally recognized civil union/domestic partner, or cohabitant are bound by affection, influence, common interests, and/or obligation?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have, or have you had, close and/or continuing contact with a foreign national within the last seven (7) years with whom you, or your spouse, or legally recognized civil union/domestic partner, or cohabitant are bound by affection, influence, common interests, and/or obligation?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
A foreign national is defined as any person who is not a citizen or national of the U.S.
</p>
</div>
<div>
<p>
Include associates as well as relatives, not previously listed in the relatives section.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contacts-MOCK-GUID"
name="has_foreign_contacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_contacts-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contacts-MOCK-GUID"
name="has_foreign_contacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_contacts-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign intro"
className="btn-cell back"
href="/form/foreign/intro"
onClick={[Function]}
title="Go to previous section Foreign intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Direct control"
className="btn-cell next"
href="/form/foreign/activities/direct"
onClick={[Function]}
title="Go to next section Direct control"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Direct control
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 6: Foreign associations
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your current and previous foreign associations and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review military history"
className="btn-cell back"
href="/form/military/review"
onClick={[Function]}
title="Go to previous section Review military history"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review military history
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign contacts"
className="btn-cell next"
href="/form/foreign/contacts"
onClick={[Function]}
title="Go to next section Foreign contacts"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign contacts
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<span>
<div
className="section-content foreign-contacts"
data-section="FOREIGN"
data-subsection="FOREIGN_CONTACTS"
>
<h1
className="section-header"
>
Foreign contacts
</h1>
<div
aria-label="Do you have, or have you had, close and/or continuing contact with a foreign national within the last seven (7) years with whom you, or your spouse, or legally recognized civil union/domestic partner, or cohabitant are bound by affection, influence, common interests, and/or obligation?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have, or have you had, close and/or continuing contact with a foreign national within the last seven (7) years with whom you, or your spouse, or legally recognized civil union/domestic partner, or cohabitant are bound by affection, influence, common interests, and/or obligation?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
A foreign national is defined as any person who is not a citizen or national of the U.S.
</p>
</div>
<div>
<p>
Include associates as well as relatives, not previously listed in the relatives section.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contacts-MOCK-GUID"
name="has_foreign_contacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_contacts-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contacts-MOCK-GUID"
name="has_foreign_contacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_contacts-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content direct"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_DIRECT"
>
<h1
className="section-header"
>
Direct control
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests in which you or they have direct control or direct ownership?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Foreign financial interest examples: stocks, property, investments, bank accounts, ownership of corporate entities, corporate interests or exchange traded funds (ETFs) held in specific geographical or economic sectors.
</p>
</div>
<div>
<p>
Exclude financial interests in companies or diversified mutual funds or diversified ETFs that are publicly traded on a U.S. exchange.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content indirect"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_INDIRECT"
>
<h1
className="section-header"
>
Indirect control
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER had any foreign financial interests that someone controlled on your behalf?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content realestate"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_REAL_ESTATE"
>
<h1
className="section-header"
>
Real estate purchase
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER owned, or do you anticipate owning, or plan to purchase real estate in a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children EVER owned, or do you anticipate owning, or plan to purchase real estate in a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_interests-MOCK-GUID"
name="has_interests-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_interests-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content benefit-activity"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_BENEFITS"
>
<h1
className="section-header"
>
Foreign benefits
</h1>
<div
aria-label="As a U.S. citizen, have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children received in the last seven (7) years, or are eligible to receive in the future, any educational, medical, retirement, social welfare, or other such benefit from a foreign country?"
className="field required branch has-benefits"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
As a U.S. citizen, have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or dependent children received in the last seven (7) years, or are eligible to receive in the future, any educational, medical, retirement, social welfare, or other such benefit from a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_benefit-MOCK-GUID"
name="has_benefit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_benefit-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_benefit-MOCK-GUID"
name="has_benefit-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_benefit-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-activities-support"
data-section="FOREIGN"
data-subsection="FOREIGN_ACTIVITIES_SUPPORT"
>
<h1
className="section-header"
>
Foreign national support
</h1>
<div
aria-label="Have you EVER provided financial support for any foreign national?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER provided financial support for any foreign national?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_support-MOCK-GUID"
name="has_foreign_support-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_support-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_support-MOCK-GUID"
name="has_foreign_support-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_support-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<span>
<div
className="section-content foreign-business-advice"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_ADVICE"
>
<h1
className="section-header"
>
Support provided
</h1>
<div
aria-label="Have you in the last seven (7) years provided advice or support to any individual associated with a foreign business or other foreign organization that you have not previously listed as a former employer?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years provided advice or support to any individual associated with a foreign business or other foreign organization that you have not previously listed as a former employer?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Answer
<strong>
"No"
</strong>
if
<strong>
all
</strong>
your advice or support was authorized pursuant to official U.S. Government business.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_advice-MOCK-GUID"
name="has_foreign_advice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_advice-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_advice-MOCK-GUID"
name="has_foreign_advice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_advice-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-family"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_FAMILY"
>
<h1
className="section-header"
>
Immediate family foreign support
</h1>
<div
aria-label="Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or any member of your immediate family in the last seven (7) years been asked to provide advice or serve as a consultant, even informally, by any foreign government official or agency?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you, your spouse or legally recognized civil union/domestic partner, cohabitant, or any member of your immediate family in the last seven (7) years been asked to provide advice or serve as a consultant, even informally, by any foreign government official or agency?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
For this question, "Immediate Family" means your spouse or legally recognized civil union/domestic partner, parents, step-parents, siblings, half and step-siblings, children, step-children, and cohabitant.
</p>
</div>
<div>
<p>
Answer
<strong>
"No"
</strong>
if all the advice or support was authorized pursuant to official U.S. Government business.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_family-MOCK-GUID"
name="has_foreign_family-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_family-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_family-MOCK-GUID"
name="has_foreign_family-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_family-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-employment"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_EMPLOYMENT"
>
<h1
className="section-header"
>
Employment
</h1>
<div
aria-label="Has any foreign national in the last seven (7) years offered you a job, asked you to work as a consultant, or consider employment with them?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has any foreign national in the last seven (7) years offered you a job, asked you to work as a consultant, or consider employment with them?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_employment-MOCK-GUID"
name="has_foreign_employment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_employment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_employment-MOCK-GUID"
name="has_foreign_employment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_employment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-ventures"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_VENTURES"
>
<h1
className="section-header"
>
Other business ventures
</h1>
<div
aria-label="Have you in the last seven (7) years been involved in any other type of business venture with a foreign national not described above?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years been involved in any other type of business venture with a foreign national not described above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Own, co-own, serve as a business consultant, provide financial support, etc.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_ventures-MOCK-GUID"
name="has_foreign_ventures-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_ventures-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_ventures-MOCK-GUID"
name="has_foreign_ventures-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_ventures-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-conferences"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_CONFERENCES"
>
<h1
className="section-header"
>
Event participation
</h1>
<div
aria-label="Have you in the last seven (7) years attended or participated in any conferences, trade shows, seminars, or meetings outside the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years attended or participated in any conferences, trade shows, seminars, or meetings outside the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Do not include those you attended or participated in on official business for the U.S. government.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_conferences-MOCK-GUID"
name="has_foreign_conferences-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_conferences-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_conferences-MOCK-GUID"
name="has_foreign_conferences-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_conferences-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-contact"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_CONTACT"
>
<h1
className="section-header"
>
Immediate family contact
</h1>
<div>
<p>
For this question, "Immediate Family" means your spouse, parents, step-parents, siblings, half and step-siblings, children, stepchildren, and cohabitant.
</p>
</div>
<div
aria-label="Have you or any member of your immediate family in the last seven (7) years had any contact with a foreign government, its establishment or its representatives, whether inside or outside the U.S.?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you or any member of your immediate family in the last seven (7) years had any contact with a foreign government, its establishment or its representatives, whether inside or outside the U.S.?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Such as embassy, consulate, agency, military service, intelligence or security service, etc.
</p>
</div>
<div>
<p>
Answer
<strong>
"No"
</strong>
if the contact was for routine visa applications and border crossings related to either official U.S. Government travel, foreign travel on a U.S. passport, or as a U.S. military service member in conjunction with a U.S. Government military duty.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contact-MOCK-GUID"
name="has_foreign_contact-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_contact-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_contact-MOCK-GUID"
name="has_foreign_contact-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_contact-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-sponsorship"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_SPONSORSHIP"
>
<h1
className="section-header"
>
Foreign national sponsorship
</h1>
<div
aria-label="Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you in the last seven (7) years sponsored any foreign national to come to the U.S. as a student, for work, or for permanent residence?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_sponsorship-MOCK-GUID"
name="has_foreign_sponsorship-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_sponsorship-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_sponsorship-MOCK-GUID"
name="has_foreign_sponsorship-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_sponsorship-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-political"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_POLITICAL"
>
<h1
className="section-header"
>
Held political office
</h1>
<div
aria-label="Have you EVER held political office in a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER held political office in a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_political-MOCK-GUID"
name="has_foreign_political-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_political-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_political-MOCK-GUID"
name="has_foreign_political-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_political-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign-business-voting"
data-section="FOREIGN"
data-subsection="FOREIGN_BUSINESS_VOTING"
>
<h1
className="section-header"
>
Voting
</h1>
<div
aria-label="Have you EVER voted in the election of a foreign country?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voted in the election of a foreign country?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_voting-MOCK-GUID"
name="has_foreign_voting-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_voting-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_voting-MOCK-GUID"
name="has_foreign_voting-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_voting-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
</span>
<div
className="section-content foreign-travel"
data-section="FOREIGN"
data-subsection="FOREIGN_TRAVEL"
>
<h1
className="section-header"
>
Foreign countries you have visited
</h1>
<div
aria-label="Have you traveled outside the U.S. in the last past seven (7) years?"
className="field required branch foreign-travel-outside"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you traveled outside the U.S. in the last past seven (7) years?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_travel_outside-MOCK-GUID"
name="has_foreign_travel_outside-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_travel_outside-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_travel_outside-MOCK-GUID"
name="has_foreign_travel_outside-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_travel_outside-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign countries you have visited"
className="btn-cell back"
href="/form/foreign/travel"
onClick={[Function]}
title="Go to previous section Foreign countries you have visited"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign countries you have visited
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Financial intro"
className="btn-cell next"
href="/form/financial/intro"
onClick={[Function]}
title="Go to next section Financial intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Financial intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders FOREIGN_TRAVEL 1`] = `
<div
className="section-view"
>
<div
className="view view-travel"
>
<div
className="section-content foreign-travel"
data-section="FOREIGN"
data-subsection="FOREIGN_TRAVEL"
>
<h1
className="section-header"
>
Foreign countries you have visited
</h1>
<div
aria-label="Have you traveled outside the U.S. in the last past seven (7) years?"
className="field required branch foreign-travel-outside"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you traveled outside the U.S. in the last past seven (7) years?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_travel_outside-MOCK-GUID"
name="has_foreign_travel_outside-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign_travel_outside-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign_travel_outside-MOCK-GUID"
name="has_foreign_travel_outside-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign_travel_outside-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Voting"
className="btn-cell back"
href="/form/foreign/business/voting"
onClick={[Function]}
title="Go to previous section Voting"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Voting
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review Foreign Associations"
className="btn-cell next"
href="/form/foreign/review"
onClick={[Function]}
title="Go to next section Review Foreign Associations"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review Foreign Associations
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_EDUCATION 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<div
className="view view-education"
>
<div
className="section-content education"
data-section="HISTORY"
data-subsection="HISTORY_EDUCATION"
>
<h1
className="section-header"
>
Where you went to school
</h1>
<div
aria-label="List the places you went to school"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
List the places you went to school
</h3>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Do not list education before your 18th birthday, unless to provide a minimum of two years education history.
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Have you attended any schools in the last 10 years?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you attended any schools in the last 10 years?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you attended any schools in the last 10 years?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you attended any schools in the last 10 years?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branch_school-MOCK-GUID"
name="branch_school-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branch_school-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branch_school-MOCK-GUID"
name="branch_school-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branch_school-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Employment history"
className="btn-cell back"
href="/form/history/employment"
onClick={[Function]}
title="Go to previous section Employment history"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Employment history
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Former federal service"
className="btn-cell next"
href="/form/history/federal"
onClick={[Function]}
title="Go to next section Former federal service"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Former federal service
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_EMPLOYMENT 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<div
className="view view-employment"
>
<div>
<h1
className="section-header"
>
Employment activities
</h1>
<div
aria-label="List where you have worked"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
List where you have worked
</h3>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
List all of your employment activities, including unemployment and self-employment, beginning with the present and working back 10 years. The entire period must be accounted for without breaks. If the employment activity was military duty, list separate employment activity periods to show each change of military duty station.
</p>
<p>
Provide separate entries for employment activities with the same employer but having different physical addresses.
</p>
</div>
<div>
<p>
Do not list employment before your 18th birthday unless to provide a minimum of 2 years employment history.
</p>
</div>
</span>
</span>
</div>
</div>
<span
id="scrollToHistory"
/>
<div
className="summary-progress residence"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="Years covered for your employment activities"
className="svg"
src="/img/employer-briefcase.svg"
/>
</div>
<span
className="title"
>
Employment activities
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
10
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
<div
className="section-content employment"
data-section="HISTORY"
data-subsection="HISTORY_EMPLOYMENT"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of your work history
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional employment activity to enter?"
className="field required branch addendum no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional employment activity to enter?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
aria-label="Have any of the following happened to you in the last seven (7) years at employment activities that you have not previously listed?"
className="field required branch employment-record"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have any of the following happened to you in the last seven (7) years at employment activities that you have not previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<ul>
<li>
Fired from a job?
</li>
<li>
Quit a job after being told you would be fired?
</li>
<li>
Have you left a job by mutual agreement following charges or allegations of misconduct?
</li>
<li>
Left a job by mutual agreement following notice of unsatisfactory performance?
</li>
<li>
Received a written warning, been officially reprimanded, suspended, or disciplined for misconduct in the workplace, such as violation of security policy?
</li>
</ul>
</div>
<div>
<p>
If you answer "Yes", you will be required to add an additional employment record above.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="not-complete"
>
<hr
className="section-divider"
/>
<div
aria-label="Before you leave this section"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Before you leave this section
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
<strong>
The full 10 year period of employment history is not covered.
</strong>
Your SF86 cannot be submitted until all 10 years are covered with no gaps.
<span
dangerouslySetInnerHTML={
Object {
"__html": "<br>",
}
}
/>
<span
dangerouslySetInnerHTML={
Object {
"__html": "<br>",
}
}
/>
We will mark the gaps and highlight them for you when you come back.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Places you lived"
className="btn-cell back"
href="/form/history/residence"
onClick={[Function]}
title="Go to previous section Places you lived"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Places you lived
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Schools & diplomas"
className="btn-cell next"
href="/form/history/education"
onClick={[Function]}
title="Go to next section Schools & diplomas"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Schools & diplomas
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_FEDERAL 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<div
className="view view-federal"
>
<div>
<h1
className="section-header"
>
Former federal service
</h1>
<div
className="section-content federal"
data-section="HISTORY"
data-subsection="HISTORY_FEDERAL"
>
<div
aria-label="Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_federalservice-MOCK-GUID"
name="has_federalservice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_federalservice-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_federalservice-MOCK-GUID"
name="has_federalservice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_federalservice-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Schools & diplomas"
className="btn-cell back"
href="/form/history/education"
onClick={[Function]}
title="Go to previous section Schools & diplomas"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Schools & diplomas
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review your history"
className="btn-cell next"
href="/form/history/review"
onClick={[Function]}
title="Go to next section Review your history"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review your history
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_INTRO 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 2: Your history
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your history and be asked to provide details if necessary. This section includes where you have lived, where you have worked, and where you went to school.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review Identification"
className="btn-cell back"
href="/form/identification/review"
onClick={[Function]}
title="Go to previous section Review Identification"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review Identification
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Places you lived"
className="btn-cell next"
href="/form/history/residence"
onClick={[Function]}
title="Go to next section Places you lived"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Places you lived
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_RESIDENCE 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<div
className="view view-residence"
>
<div>
<h1
className="section-header"
>
Where you have lived
</h1>
<div
aria-label="List the places where you have lived beginning with your present residence and working back 10 years."
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
List the places where you have lived beginning with your present residence and working back 10 years.
</h3>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Residences for the entire period must be accounted for without breaks.
</p>
</div>
<div>
<ul>
<li>
<strong>
Indicate the actual physical location of your residence
</strong>
, not a Post Office box or a permanent residence when you were not physically located there.
</li>
</ul>
</div>
<div>
<ul>
<li>
<strong>
If you split your time between one or more residences during a time period
</strong>
, you must list all residences.
</li>
</ul>
</div>
<div>
<ul>
<li>
<strong>
Do not list residences before your 18th birthday
</strong>
unless to provide a minimum of 2 years residence history.
</li>
</ul>
</div>
<div>
<ul>
<li>
<strong>
You are not required to list temporary locations of less than 90 days
</strong>
that did not serve as your permanent or mailing address.
</li>
</ul>
</div>
</span>
</span>
</div>
</div>
<span
id="scrollToHistory"
/>
<div
className="summary-progress residence"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="Years covered for locations you have lived"
className="svg"
src="/img/residence-house.svg"
/>
</div>
<span
className="title"
>
Where you have lived
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
10
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
<div
className="section-content residence"
data-section="HISTORY"
data-subsection="HISTORY_RESIDENCE"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of places you have lived
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional residence to report?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional residence to report?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="not-complete"
>
<hr
className="section-divider"
/>
<div
aria-label="Before you leave this section"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Before you leave this section
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
<strong>
The full 10 year period of residence history is not covered.
</strong>
Your SF86 cannot be submitted until all 10 years are covered with no gaps.
<span
dangerouslySetInnerHTML={
Object {
"__html": "<br>",
}
}
/>
<span
dangerouslySetInnerHTML={
Object {
"__html": "<br>",
}
}
/>
We will mark the gaps and highlight them for you when you come back.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section History intro"
className="btn-cell back"
href="/form/history/intro"
onClick={[Function]}
title="Go to previous section History intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
History intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Employment history"
className="btn-cell next"
href="/form/history/employment"
onClick={[Function]}
title="Go to next section Employment history"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Employment history
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders HISTORY_REVIEW 1`] = `
<div
className="history"
>
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<span>
<div
className="summary-progress residence"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="Years covered for locations you have lived"
className="svg"
src="/img/residence-house.svg"
/>
</div>
<span
className="title"
>
Where you have lived
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
10
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
<div
className="summary-progress residence"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="Years covered for your employment activities"
className="svg"
src="/img/employer-briefcase.svg"
/>
</div>
<span
className="title"
>
Employment activities
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
10
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
</span>
<hr
className="section-divider"
/>
<h1
className="section-header"
>
Where you have lived
</h1>
<div
className="section-content residence"
data-section="HISTORY"
data-subsection="HISTORY_RESIDENCE"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of places you have lived
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional residence to report?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional residence to report?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<h1
className="section-header"
>
Employment activities
</h1>
<div
className="section-content employment"
data-section="HISTORY"
data-subsection="HISTORY_EMPLOYMENT"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of your work history
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional employment activity to enter?"
className="field required branch addendum no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional employment activity to enter?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
aria-label="Have any of the following happened to you in the last seven (7) years at employment activities that you have not previously listed?"
className="field required branch employment-record"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have any of the following happened to you in the last seven (7) years at employment activities that you have not previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<ul>
<li>
Fired from a job?
</li>
<li>
Quit a job after being told you would be fired?
</li>
<li>
Have you left a job by mutual agreement following charges or allegations of misconduct?
</li>
<li>
Left a job by mutual agreement following notice of unsatisfactory performance?
</li>
<li>
Received a written warning, been officially reprimanded, suspended, or disciplined for misconduct in the workplace, such as violation of security policy?
</li>
</ul>
</div>
<div>
<p>
If you answer "Yes", you will be required to add an additional employment record above.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<h1
className="section-header"
>
Where you went to school
</h1>
<div
className="section-content education"
data-section="HISTORY"
data-subsection="HISTORY_EDUCATION"
>
<div
aria-label="List the places you went to school"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
List the places you went to school
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Do not list education before your 18th birthday, unless to provide a minimum of two years education history.
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Have you attended any schools in the last 10 years?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Have you attended any schools in the last 10 years?
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Have you attended any schools in the last 10 years?"
className="toggle h3 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you attended any schools in the last 10 years?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branch_school-MOCK-GUID"
name="branch_school-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branch_school-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branch_school-MOCK-GUID"
name="branch_school-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branch_school-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div>
<h1
className="section-header"
>
Former federal service
</h1>
<div
className="section-content federal"
data-section="HISTORY"
data-subsection="HISTORY_FEDERAL"
>
<div
aria-label="Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Do you have former federal civilian employment, excluding military service, NOT indicated previously, to report?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_federalservice-MOCK-GUID"
name="has_federalservice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_federalservice-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_federalservice-MOCK-GUID"
name="has_federalservice-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_federalservice-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Former federal service"
className="btn-cell back"
href="/form/history/federal"
onClick={[Function]}
title="Go to previous section Former federal service"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Former federal service
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Relationships intro"
className="btn-cell next"
href="/form/relationships/intro"
onClick={[Function]}
title="Go to next section Relationships intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Relationships intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_BIRTH_DATE 1`] = `
<div
className="section-view"
>
<div
className="view view-birthdate"
>
<div
className="section-content birthdate"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_BIRTH_DATE"
>
<h1
className="section-header"
>
Date of birth
</h1>
<div
aria-label="Provide your date of birth"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your date of birth
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Provide your date of birth"
className="toggle h4"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your date of birth"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="datecontrol"
>
<div
className="datecontrol-container"
>
<div
className="usa-form-group month"
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="month-MOCK-GUID"
>
Month
</label>
<input
aria-describedby="month-error"
aria-label="Month"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="month-MOCK-GUID"
maxLength="2"
name="month"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="usa-form-group day "
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="day-MOCK-GUID"
>
Day
</label>
<input
aria-describedby="day-error"
aria-label="Day"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="day-MOCK-GUID"
maxLength="2"
name="day"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="usa-form-group year"
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="year-MOCK-GUID"
>
Year
</label>
<input
aria-describedby="year-error"
aria-label="Year"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="year-MOCK-GUID"
maxLength="4"
name="year"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
<div
className="flags"
>
<div
className="estimated block"
>
<input
aria-label="Estimated for null"
checked={false}
className="usa-input-success"
disabled={false}
id="estimated-MOCK-GUID"
name="estimated"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="estimated-MOCK-GUID"
>
<span>
Estimated
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Full name"
className="btn-cell back"
href="/form/identification/name"
onClick={[Function]}
title="Go to previous section Full name"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Full name
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Place of birth"
className="btn-cell next"
href="/form/identification/birthplace"
onClick={[Function]}
title="Go to next section Place of birth"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Place of birth
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_BIRTH_PLACE 1`] = `
<div
className="section-view"
>
<div
className="view view-birthplace"
>
<div
className="section-content applicant-birthplace"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_BIRTH_PLACE"
>
<h1
className="section-header"
>
Place of birth
</h1>
<div
aria-label="Provide your place of birth"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your place of birth
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="location"
>
<div
className="fields"
>
<div
className="toggleable-location"
>
<div
aria-label=""
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="birthplace-MOCK-GUID"
name="birthplace-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="birthplace-MOCK-GUID"
>
<span>
<div>
<p>
In the U.S.
</p>
</div>
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="birthplace-MOCK-GUID"
name="birthplace-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="birthplace-MOCK-GUID"
>
<span>
<div>
<p>
Outside the U.S.
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Date of birth"
className="btn-cell back"
href="/form/identification/birthdate"
onClick={[Function]}
title="Go to previous section Date of birth"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Date of birth
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Social security number"
className="btn-cell next"
href="/form/identification/ssn"
onClick={[Function]}
title="Go to next section Social security number"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Social security number
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_CONTACTS 1`] = `
<div
className="section-view"
>
<div
className="view view-contacts"
>
<div
className="section-content contact"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_CONTACTS"
>
<h1
className="section-header"
>
Your contact information
</h1>
<div
aria-label="Your email addresses"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Your email addresses
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Your email addresses"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Your email addresses"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Email addresses may be used as contact method, and identify subject in records.
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Home email address"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Home email address
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print email email-home"
>
<input
aria-describedby="HomeEmail-error"
aria-label={null}
autoCapitalize={false}
autoComplete={true}
autoCorrect={false}
className=""
id="HomeEmail-MOCK-GUID"
maxLength={255}
name="HomeEmail"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern={/\\^\\(\\[A-z0-9_\\.-\\]\\+\\)@\\(\\[A-z0-9\\.-\\]\\+\\)\\\\\\.\\+\\(\\[A-z\\.\\]\\{2,63\\}\\)\\$/}
spellCheck={false}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Work email address"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Work email address
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print email email-work"
>
<input
aria-describedby="WorkEmail-error"
aria-label={null}
autoCapitalize={false}
autoComplete={true}
autoCorrect={false}
className=""
id="WorkEmail-MOCK-GUID"
maxLength={255}
name="WorkEmail"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern={/\\^\\(\\[A-z0-9_\\.-\\]\\+\\)@\\(\\[A-z0-9\\.-\\]\\+\\)\\\\\\.\\+\\(\\[A-z\\.\\]\\{2,63\\}\\)\\$/}
spellCheck={false}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Your phone numbers"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Your phone numbers
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Your phone numbers"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Your phone numbers"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Provide three contact numbers.
<strong>
At least one telephone number is required
</strong>
. Additional numbers may assist in the completion of your background investigation.
</p>
</div>
</span>
</span>
</div>
</div>
<div />
<div
className=" telephone-collection"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of phone numbers
</strong>
<div
className="items"
/>
<div
className="append-button"
>
<button
className="add usa-button-outline"
onClick={[Function]}
>
Add another phone number
<i
className="fa fa-plus-circle"
/>
</button>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Other names used"
className="btn-cell back"
href="/form/identification/othernames"
onClick={[Function]}
title="Go to previous section Other names used"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Other names used
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Your identifying information"
className="btn-cell next"
href="/form/identification/physical"
onClick={[Function]}
title="Go to next section Your identifying information"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Your identifying information
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 1: Information about you
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your personal information and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<div
className="btn-cell"
/>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Full name"
className="btn-cell next"
href="/form/identification/name"
onClick={[Function]}
title="Go to next section Full name"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Full name
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_NAME 1`] = `
<div
className="section-view"
>
<div
className="view view-name"
>
<div
className="section-content applicant-name"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_NAME"
>
<h1
className="section-header"
>
Full name
</h1>
<div
aria-label="Provide your full name"
className="field"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your full name
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<label
className="name-label"
>
If you have only initials in your name, provide them and indicate “initial only”. If you do not have a middle name, indicate “No Middle Name”. If you are a “Jr”, “Sr”, etc. enter this under suffix.
</label>
<div
className="name "
>
<div
aria-label="First name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
First name
</label>
<span
className="icon"
>
<a
aria-label="Show help for First name"
className="toggle label adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for First name"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print first"
>
<input
aria-describedby="first-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="first-MOCK-GUID"
maxLength="100"
name="first"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="flags"
>
<div
className="first-initial-only block"
>
<input
aria-label="Initial only for null"
checked={false}
className="usa-input-success"
id="firstInitialOnly-MOCK-GUID"
name="firstInitialOnly"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="firstInitialOnly-MOCK-GUID"
>
<span>
Initial only
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Middle name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Middle name
</label>
<span
className="icon"
>
<a
aria-label="Show help for Middle name"
className="toggle label adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Middle name"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print middle"
>
<input
aria-describedby="middle-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="middle-MOCK-GUID"
maxLength="100"
name="middle"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="middle-options flags"
>
<div
className="middle-none block"
>
<input
aria-label="No middle name for null"
checked={false}
className="usa-input-success"
id="noMiddleName-MOCK-GUID"
name="noMiddleName"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="noMiddleName-MOCK-GUID"
>
<span>
No middle name
</span>
</label>
</div>
<div
className="middle-initial-only block"
>
<input
aria-label="Initial only for null"
checked={false}
className="usa-input-success"
id="middleInitialOnly-MOCK-GUID"
name="middleInitialOnly"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="middleInitialOnly-MOCK-GUID"
>
<span>
Initial only
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Last name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Last name
</label>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print last"
>
<input
aria-describedby="last-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="last-MOCK-GUID"
maxLength="100"
name="last"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
style={
Object {
"height": "50px",
}
}
/>
<div
aria-label="Suffix"
className="field usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Suffix
<span
className="optional"
>
(Optional)
</span>
</label>
<span
className="icon"
>
<a
aria-label="Show help for Suffix"
className="toggle label"
href="javascript:;"
onClick={[Function]}
title="Show help for Suffix"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="option-list suffix usa-small-input"
>
<select
className=""
disabled={false}
name="suffix"
onChange={[Function]}
value=""
>
<option
label=""
value=""
>
</option>
<option
label="Jr"
value="Jr"
>
Jr
</option>
<option
label="Sr"
value="Sr"
>
Sr
</option>
<option
label="I"
value="I"
>
I
</option>
<option
label="II"
value="II"
>
II
</option>
<option
label="III"
value="III"
>
III
</option>
<option
label="IV"
value="IV"
>
IV
</option>
<option
label="V"
value="V"
>
V
</option>
<option
label="VI"
value="VI"
>
VI
</option>
<option
label="VII"
value="VII"
>
VII
</option>
<option
label="VIII"
value="VIII"
>
VIII
</option>
<option
label="IX"
value="IX"
>
IX
</option>
<option
label="X"
value="X"
>
X
</option>
<option
label="Other"
value="Other"
>
Other
</option>
</select>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Identification intro"
className="btn-cell back"
href="/form/identification/intro"
onClick={[Function]}
title="Go to previous section Identification intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Identification intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Date of birth"
className="btn-cell next"
href="/form/identification/birthdate"
onClick={[Function]}
title="Go to next section Date of birth"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Date of birth
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_OTHER_NAMES 1`] = `
<div
className="section-view"
>
<div
className="view view-othernames"
>
<div
className="section-content other-names"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_OTHER_NAMES"
>
<h1
className="section-header"
>
Other names used
</h1>
<div
aria-label="Provide your other names used and the period of time you used them"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Provide your other names used and the period of time you used them
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Provide your other names used and the period of time you used them"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your other names used and the period of time you used them"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
For example: your maiden name, name(s) by a former marriage, former name(s), alias(es), or nickname(s).
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Have you used any other names?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you used any other names?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_othernames-MOCK-GUID"
name="has_othernames-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_othernames-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_othernames-MOCK-GUID"
name="has_othernames-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_othernames-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Social security number"
className="btn-cell back"
href="/form/identification/ssn"
onClick={[Function]}
title="Go to previous section Social security number"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Social security number
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Your contact information"
className="btn-cell next"
href="/form/identification/contacts"
onClick={[Function]}
title="Go to next section Your contact information"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Your contact information
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_PHYSICAL 1`] = `
<div
className="section-view"
>
<div
className="view view-physical"
>
<div
className="section-content physical"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_PHYSICAL"
>
<h1
className="section-header"
>
Your identifying information
</h1>
<div
aria-label="Height"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Height
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Height"
className="toggle h4 adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Height"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="height"
>
<div
className="feet"
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="feet-MOCK-GUID"
>
Feet
</label>
<input
aria-describedby="feet-error"
aria-label="Feet"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="feet-MOCK-GUID"
maxLength="1"
name="feet"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="inches"
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="inches-MOCK-GUID"
>
Inches
</label>
<input
aria-describedby="inches-error"
aria-label="Inches"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="inches-MOCK-GUID"
maxLength="2"
name="inches"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Weight"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Weight
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Weight"
className="toggle h4 adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Weight"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="weight"
>
<div
className="pounds"
>
<div
className="hide-for-print "
>
<label
className=""
htmlFor="pounds-MOCK-GUID"
>
Pounds
</label>
<input
aria-describedby="pounds-error"
aria-label="Pounds"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="pounds-MOCK-GUID"
maxLength="3"
name="pounds"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Hair color"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Hair color
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Hair color"
className="toggle h4 adjust-for-big-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Hair color"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className=" hair-colors"
>
<label />
<div
className="blocks option-list eapp-extend-labels physical-radio"
>
<div
className="black block extended"
>
<input
aria-label="Black for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-black-MOCK-GUID"
name="hair-black-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Black"
/>
<label
className=""
htmlFor="hair-black-MOCK-GUID"
>
<div
className="hair-icon black"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Black
</span>
</label>
</div>
<div
className="brown block extended"
>
<input
aria-label="Brown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-brown-MOCK-GUID"
name="hair-brown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Brown"
/>
<label
className=""
htmlFor="hair-brown-MOCK-GUID"
>
<div
className="hair-icon brown"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Brown
</span>
</label>
</div>
<div
className="red block extended"
>
<input
aria-label="Red or auburn for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-red-MOCK-GUID"
name="hair-red-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Red"
/>
<label
className=""
htmlFor="hair-red-MOCK-GUID"
>
<div
className="hair-icon red"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Red or auburn
</span>
</label>
</div>
<div
className="blonde block extended"
>
<input
aria-label="Blonde or strawberry for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-blonde-MOCK-GUID"
name="hair-blonde-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blonde"
/>
<label
className=""
htmlFor="hair-blonde-MOCK-GUID"
>
<div
className="hair-icon blonde"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Blonde or strawberry
</span>
</label>
</div>
<div
className="sandy block extended"
>
<input
aria-label="Sandy for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-sandy-MOCK-GUID"
name="hair-sandy-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Sandy"
/>
<label
className=""
htmlFor="hair-sandy-MOCK-GUID"
>
<div
className="hair-icon sandy"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Sandy
</span>
</label>
</div>
<div
className="gray block extended"
>
<input
aria-label="Gray or partially gray for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-gray-MOCK-GUID"
name="hair-gray-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Gray"
/>
<label
className=""
htmlFor="hair-gray-MOCK-GUID"
>
<div
className="hair-icon gray"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Gray or partially gray
</span>
</label>
</div>
<div
className="white block extended"
>
<input
aria-label="White for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-white-MOCK-GUID"
name="hair-white-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="White"
/>
<label
className=""
htmlFor="hair-white-MOCK-GUID"
>
<div
className="hair-icon white"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
White
</span>
</label>
</div>
<div
className="bald block extended"
>
<input
aria-label="Bald for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-bald-MOCK-GUID"
name="hair-bald-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Bald"
/>
<label
className=""
htmlFor="hair-bald-MOCK-GUID"
>
<div
className="hair-icon bald"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 18.01 30.87"
>
<path
d="M11.571,30.953h-1.328L10.04,30.9c-0.377-0.188-0.754-0.378-1.226-0.566l0.371-0.928 c0.018,0.007,0.035,0.014,0.051,0.021c-0.007-0.018-0.014-0.034-0.021-0.052l0.928-0.371c0.173,0.431,0.351,0.877,0.569,1.095 L11.571,30.953z"
/>
<path
d="M6.4,28.932c-0.853-0.538-1.63-1.108-2.31-1.696l0.653-0.756c0.643,0.555,1.379,1.095,2.189,1.606L6.4,28.932 z M2.102,25.136c-0.599-0.789-1.088-1.638-1.456-2.521L1.57,22.23c0.334,0.806,0.782,1.58,1.329,2.302L2.102,25.136z M-0.118,19.807c-0.086-0.607-0.13-1.244-0.13-1.893c0-0.352,0.018-0.688,0.053-1.013l0.994,0.107 c-0.031,0.289-0.047,0.591-0.047,0.905c0,0.602,0.041,1.19,0.121,1.752L-0.118,19.807z M1.53,14.525l-0.891-0.454 c0.418-0.819,0.987-1.591,1.739-2.36l0.715,0.699C2.413,13.105,1.901,13.797,1.53,14.525z M5.152,10.626L4.537,9.838l0.451-0.35 c0.61-0.472,1.186-0.918,1.697-1.38L7.355,8.85c-0.54,0.488-1.13,0.946-1.756,1.43L5.152,10.626z M9.168,6.477L8.243,6.095 C8.416,5.677,8.5,5.25,8.5,4.791c0-0.332-0.05-0.744-0.138-1.13l0.975-0.222C9.44,3.895,9.5,4.388,9.5,4.791 C9.5,5.375,9.388,5.943,9.168,6.477z"
/>
<path
d="M7.855,1.963C7.666,1.491,7.478,1.018,7.289,0.64L6.928-0.083h0.927l0.203,0.053 c0.381,0.19,0.757,0.379,1.226,0.566L8.912,1.464C8.838,1.435,8.767,1.405,8.697,1.376C8.726,1.448,8.755,1.52,8.784,1.592 L7.855,1.963z"
/>
<path
d="M8.667,27.461C8.556,27.004,8.5,26.539,8.5,26.079c0-0.576,0.104-1.134,0.31-1.656l0.931,0.365 C9.579,25.2,9.5,25.622,9.5,26.079c0,0.381,0.046,0.767,0.138,1.147L8.667,27.461z M11.267,22.762l-0.676-0.738 c0.563-0.516,1.186-0.994,1.845-1.501l0.361-0.278l0.611,0.791l-0.363,0.28C12.404,21.809,11.798,22.274,11.267,22.762z M15.579,19.179l-0.709-0.705c0.687-0.688,1.203-1.375,1.581-2.1l0.887,0.463C16.913,17.652,16.337,18.418,15.579,19.179z M18.191,14.012l-0.994-0.112c0.034-0.301,0.052-0.615,0.052-0.943c0-0.585-0.038-1.162-0.111-1.714l0.99-0.133 c0.08,0.596,0.121,1.217,0.121,1.847C18.249,13.323,18.229,13.675,18.191,14.012z M16.469,8.668 c-0.326-0.812-0.763-1.59-1.299-2.315l0.803-0.595c0.588,0.793,1.066,1.646,1.424,2.538L16.469,8.668z M13.345,4.394 c-0.638-0.558-1.372-1.099-2.182-1.61l0.533-0.846c0.854,0.539,1.63,1.112,2.307,1.703L13.345,4.394z"
/>
</svg>
</div>
<span>
Bald
</span>
</label>
</div>
<div
className="blue block extended"
>
<input
aria-label="Blue for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-blue-MOCK-GUID"
name="hair-blue-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blue"
/>
<label
className=""
htmlFor="hair-blue-MOCK-GUID"
>
<div
className="hair-icon blue"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Blue
</span>
</label>
</div>
<div
className="green block extended"
>
<input
aria-label="Green for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-green-MOCK-GUID"
name="hair-green-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Green"
/>
<label
className=""
htmlFor="hair-green-MOCK-GUID"
>
<div
className="hair-icon green"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Green
</span>
</label>
</div>
<div
className="orange block extended"
>
<input
aria-label="Orange for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-orange-MOCK-GUID"
name="hair-orange-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Orange"
/>
<label
className=""
htmlFor="hair-orange-MOCK-GUID"
>
<div
className="hair-icon orange"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Orange
</span>
</label>
</div>
<div
className="pink block extended"
>
<input
aria-label="Pink for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-pink-MOCK-GUID"
name="hair-pink-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Pink"
/>
<label
className=""
htmlFor="hair-pink-MOCK-GUID"
>
<div
className="hair-icon pink"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Pink
</span>
</label>
</div>
<div
className="purple block extended"
>
<input
aria-label="Purple for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-purple-MOCK-GUID"
name="hair-purple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Purple"
/>
<label
className=""
htmlFor="hair-purple-MOCK-GUID"
>
<div
className="hair-icon purple"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Purple
</span>
</label>
</div>
<div
className="unknown block extended"
>
<input
aria-label="Unspecified or unknown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-unknown-MOCK-GUID"
name="hair-unknown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Unknown"
/>
<label
className=""
htmlFor="hair-unknown-MOCK-GUID"
>
<div
className="hair-icon unknown"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 30.86 36.84"
>
<path
d="M15.43,34.25C6.91,34.25,0,27.34,0,18.82C0,10.3,6.91,3.39,15.43,3.39s15.43,6.91,15.43,15.43 C30.87,27.34,23.95,34.25,15.43,34.25z M15.84,8.53c-3.28,0-5.73,1.41-7.46,4.28c-0.18,0.28-0.1,0.64,0.16,0.84l2.65,2.01 c0.1,0.08,0.24,0.12,0.38,0.12c0.18,0,0.38-0.08,0.5-0.24c0.94-1.21,1.35-1.57,1.73-1.85c0.34-0.24,1-0.48,1.73-0.48 c1.29,0,2.47,0.82,2.47,1.71c0,1.04-0.54,1.57-1.77,2.13c-1.43,0.64-3.38,2.31-3.38,4.26v0.72c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64c0-0.46,0.58-1.45,1.53-1.99c1.53-0.87,3.62-2.03,3.62-5.08C23.15,11.28,19.29,8.53,15.84,8.53z M18.01,24.61c0-0.36-0.28-0.64-0.64-0.64H13.5c-0.36,0-0.64,0.28-0.64,0.64v3.86c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64V24.61z"
/>
</svg>
</div>
<span>
Unspecified or unknown
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Eye color"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Eye color
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Eye color"
className="toggle h4 adjust-for-big-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Eye color"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className=" eye-colors"
>
<label />
<div
className="blocks option-list eapp-extend-labels physical-radio"
>
<div
className="brown block extended"
>
<input
aria-label="Brown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-brown-MOCK-GUID"
name="eye-brown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Brown"
/>
<label
className=""
htmlFor="eye-brown-MOCK-GUID"
>
<div
className="eye-icon brown"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Brown
</span>
</label>
</div>
<div
className="hazel block extended"
>
<input
aria-label="Hazel for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-hazel-MOCK-GUID"
name="eye-hazel-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Hazel"
/>
<label
className=""
htmlFor="eye-hazel-MOCK-GUID"
>
<div
className="eye-icon hazel"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Hazel
</span>
</label>
</div>
<div
className="blue block extended"
>
<input
aria-label="Blue for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-blue-MOCK-GUID"
name="eye-blue-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blue"
/>
<label
className=""
htmlFor="eye-blue-MOCK-GUID"
>
<div
className="eye-icon blue"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Blue
</span>
</label>
</div>
<div
className="green block extended"
>
<input
aria-label="Green for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-green-MOCK-GUID"
name="eye-green-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Green"
/>
<label
className=""
htmlFor="eye-green-MOCK-GUID"
>
<div
className="eye-icon green"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Green
</span>
</label>
</div>
<div
className="gray block extended"
>
<input
aria-label="Gray for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-gray-MOCK-GUID"
name="eye-gray-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Gray"
/>
<label
className=""
htmlFor="eye-gray-MOCK-GUID"
>
<div
className="eye-icon gray"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Gray
</span>
</label>
</div>
<div
className="maroon block extended"
>
<input
aria-label="Maroon for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-maroon-MOCK-GUID"
name="eye-maroon-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Maroon"
/>
<label
className=""
htmlFor="eye-maroon-MOCK-GUID"
>
<div
className="eye-icon maroon"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Maroon
</span>
</label>
</div>
<div
className="black block extended"
>
<input
aria-label="Black for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-black-MOCK-GUID"
name="eye-black-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Black"
/>
<label
className=""
htmlFor="eye-black-MOCK-GUID"
>
<div
className="eye-icon black"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Black
</span>
</label>
</div>
<div
className="multi block extended"
>
<input
aria-label="Multicolored for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-multi-MOCK-GUID"
name="eye-multi-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Multicolored"
/>
<label
className=""
htmlFor="eye-multi-MOCK-GUID"
>
<div
className="eye-icon multi"
>
<img
alt="Scalable vector graphic"
className="svg"
src="/img/eye-multicolor.svg"
/>
</div>
<span>
Multicolored
</span>
</label>
</div>
<div
className="pink block extended"
>
<input
aria-label="Pink for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-pink-MOCK-GUID"
name="eye-pink-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Pink"
/>
<label
className=""
htmlFor="eye-pink-MOCK-GUID"
>
<div
className="eye-icon pink"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Pink
</span>
</label>
</div>
<div
className="unknown block extended"
>
<input
aria-label="Unknown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-unknown-MOCK-GUID"
name="eye-unknown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Unknown"
/>
<label
className=""
htmlFor="eye-unknown-MOCK-GUID"
>
<div
className="eye-icon unknown"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 30.86 36.84"
>
<path
d="M15.43,34.25C6.91,34.25,0,27.34,0,18.82C0,10.3,6.91,3.39,15.43,3.39s15.43,6.91,15.43,15.43 C30.87,27.34,23.95,34.25,15.43,34.25z M15.84,8.53c-3.28,0-5.73,1.41-7.46,4.28c-0.18,0.28-0.1,0.64,0.16,0.84l2.65,2.01 c0.1,0.08,0.24,0.12,0.38,0.12c0.18,0,0.38-0.08,0.5-0.24c0.94-1.21,1.35-1.57,1.73-1.85c0.34-0.24,1-0.48,1.73-0.48 c1.29,0,2.47,0.82,2.47,1.71c0,1.04-0.54,1.57-1.77,2.13c-1.43,0.64-3.38,2.31-3.38,4.26v0.72c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64c0-0.46,0.58-1.45,1.53-1.99c1.53-0.87,3.62-2.03,3.62-5.08C23.15,11.28,19.29,8.53,15.84,8.53z M18.01,24.61c0-0.36-0.28-0.64-0.64-0.64H13.5c-0.36,0-0.64,0.28-0.64,0.64v3.86c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64V24.61z"
/>
</svg>
</div>
<span>
Unknown
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Sex"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Sex
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className=" sex"
>
<label />
<div
className="blocks option-list physical-radio"
>
<div
className="female block extended"
>
<input
aria-label="Female for null"
checked={false}
className="usa-input-success"
disabled={false}
id="sex-MOCK-GUID"
name="sex-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Female"
/>
<label
className=""
htmlFor="sex-MOCK-GUID"
>
<div
className="sex-icon"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 50.81 79.19"
>
<path
d="M50.81,25.4C50.81,11.37,39.43,0,25.4,0S0,11.37,0,25.4c0,12.32,8.77,22.59,20.4,24.91v9.09h-9.79v10h9.79v9.79 h10V69.4h9.79v-10H30.4v-9.09C42.04,47.99,50.81,37.72,50.81,25.4z M10,25.4C10,16.91,16.91,10,25.4,10s15.4,6.91,15.4,15.4 s-6.91,15.4-15.4,15.4S10,33.9,10,25.4z"
/>
</svg>
</div>
<span>
Female
</span>
</label>
</div>
<div
className="male block extended"
>
<input
aria-label="Male for null"
checked={false}
className="usa-input-success"
disabled={false}
id="sex-MOCK-GUID"
name="sex-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Male"
/>
<label
className=""
htmlFor="sex-MOCK-GUID"
>
<div
className="sex-icon"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="-10 -10 80 80"
>
<path
d="M62.77,0.12V0H37.69v10h8.64l-6.4,6.4c-4.35-3.04-9.43-4.56-14.52-4.56c-6.5,0-13,2.48-17.96,7.44 c-9.92,9.92-9.92,26.01,0,35.93c4.96,4.96,11.46,7.44,17.96,7.44c6.5,0,13-2.48,17.96-7.44c8.58-8.58,9.73-21.76,3.48-31.58 l6.05-6.05v7.64h10V0.12H62.77z M36.3,48.14c-2.91,2.91-6.78,4.51-10.89,4.51c-4.11,0-7.98-1.6-10.89-4.51 C11.6,45.23,10,41.36,10,37.24c0-4.11,1.6-7.98,4.51-10.89s6.78-4.51,10.89-4.51c4.11,0,7.98,1.6,10.89,4.51s4.51,6.78,4.51,10.89 C40.81,41.36,39.21,45.23,36.3,48.14z"
/>
</svg>
</div>
<span>
Male
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Your contact information"
className="btn-cell back"
href="/form/identification/contacts"
onClick={[Function]}
title="Go to previous section Your contact information"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Your contact information
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review Identification"
className="btn-cell next"
href="/form/identification/review"
onClick={[Function]}
title="Go to next section Review Identification"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review Identification
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content applicant-name"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_NAME"
>
<h1
className="section-header"
>
Full name
</h1>
<div
aria-label="Provide your full name"
className="field"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your full name
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.name.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<label
className="name-label"
>
If you have only initials in your name, provide them and indicate “initial only”. If you do not have a middle name, indicate “No Middle Name”. If you are a “Jr”, “Sr”, etc. enter this under suffix.
</label>
<div
className="name "
>
<div
aria-label="First name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
First name
</label>
<span
className="icon"
>
<a
aria-label="Show help for First name"
className="toggle label adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for First name"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print first usa-input-error"
>
<input
aria-describedby="first-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="first-MOCK-GUID"
maxLength="100"
name="first"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="flags"
>
<div
className="first-initial-only block usa-input-error"
>
<input
aria-label="Initial only for null"
checked={false}
className=""
id="firstInitialOnly-MOCK-GUID"
name="firstInitialOnly"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox usa-input-error-label no-toggle"
htmlFor="firstInitialOnly-MOCK-GUID"
>
<span>
Initial only
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Middle name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Middle name
</label>
<span
className="icon"
>
<a
aria-label="Show help for Middle name"
className="toggle label adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Middle name"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print middle usa-input-error"
>
<input
aria-describedby="middle-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="middle-MOCK-GUID"
maxLength="100"
name="middle"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="middle-options flags"
>
<div
className="middle-none block usa-input-error"
>
<input
aria-label="No middle name for null"
checked={false}
className=""
id="noMiddleName-MOCK-GUID"
name="noMiddleName"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox usa-input-error-label no-toggle"
htmlFor="noMiddleName-MOCK-GUID"
>
<span>
No middle name
</span>
</label>
</div>
<div
className="middle-initial-only block usa-input-error"
>
<input
aria-label="Initial only for null"
checked={false}
className=""
id="middleInitialOnly-MOCK-GUID"
name="middleInitialOnly"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox usa-input-error-label no-toggle"
htmlFor="middleInitialOnly-MOCK-GUID"
>
<span>
Initial only
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Last name"
className="field required usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Last name
</label>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print last usa-input-error"
>
<input
aria-describedby="last-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
id="last-MOCK-GUID"
maxLength="100"
name="last"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^[a-zA-Z\\\\-\\\\.' ]*$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
style={
Object {
"height": "50px",
}
}
/>
<div
aria-label="Suffix"
className="field usa-form-control"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<label
className="title label"
>
Suffix
<span
className="optional"
>
(Optional)
</span>
</label>
<span
className="icon"
>
<a
aria-label="Show help for Suffix"
className="toggle label"
href="javascript:;"
onClick={[Function]}
title="Show help for Suffix"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.name.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="option-list suffix usa-small-input usa-input-error"
>
<select
className=""
disabled={false}
name="suffix"
onChange={[Function]}
value=""
>
<option
label=""
value=""
>
</option>
<option
label="Jr"
value="Jr"
>
Jr
</option>
<option
label="Sr"
value="Sr"
>
Sr
</option>
<option
label="I"
value="I"
>
I
</option>
<option
label="II"
value="II"
>
II
</option>
<option
label="III"
value="III"
>
III
</option>
<option
label="IV"
value="IV"
>
IV
</option>
<option
label="V"
value="V"
>
V
</option>
<option
label="VI"
value="VI"
>
VI
</option>
<option
label="VII"
value="VII"
>
VII
</option>
<option
label="VIII"
value="VIII"
>
VIII
</option>
<option
label="IX"
value="IX"
>
IX
</option>
<option
label="X"
value="X"
>
X
</option>
<option
label="Other"
value="Other"
>
Other
</option>
</select>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content birthdate"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_BIRTH_DATE"
>
<h1
className="section-header"
>
Date of birth
</h1>
<div
aria-label="Provide your date of birth"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your date of birth
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Provide your date of birth"
className="toggle h4"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your date of birth"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.date.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
<span>
<div>
<p>
All parts of the date are required even if it is
<strong>
estimated
</strong>
.
</p>
</div>
</span>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="datecontrol"
>
<div
className="datecontrol-container"
>
<div
className="usa-form-group month"
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="month-MOCK-GUID"
>
Month
</label>
<input
aria-describedby="month-error"
aria-label="Month"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="month-MOCK-GUID"
maxLength="2"
name="month"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="usa-form-group day "
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="day-MOCK-GUID"
>
Day
</label>
<input
aria-describedby="day-error"
aria-label="Day"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="day-MOCK-GUID"
maxLength="2"
name="day"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="usa-form-group year"
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="year-MOCK-GUID"
>
Year
</label>
<input
aria-describedby="year-error"
aria-label="Year"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="year-MOCK-GUID"
maxLength="4"
name="year"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
<div
className="flags"
>
<div
className="estimated block"
>
<input
aria-label="Estimated for null"
checked={false}
className="usa-input-success"
disabled={false}
id="estimated-MOCK-GUID"
name="estimated"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="estimated-MOCK-GUID"
>
<span>
Estimated
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content applicant-birthplace"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_BIRTH_PLACE"
>
<h1
className="section-header"
>
Place of birth
</h1>
<div
aria-label="Provide your place of birth"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your place of birth
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.location.toggleablelocation.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="location"
>
<div
className="fields"
>
<div
className="toggleable-location"
>
<div
aria-label=""
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.toggleablelocation.required"
>
<h5
className="usa-alert-heading"
>
en.error.toggleablelocation.required.title
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="birthplace-MOCK-GUID"
name="birthplace-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="birthplace-MOCK-GUID"
>
<span>
<div>
<p>
In the U.S.
</p>
</div>
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="birthplace-MOCK-GUID"
name="birthplace-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="birthplace-MOCK-GUID"
>
<span>
<div>
<p>
Outside the U.S.
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content applicant-ssn"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_SSN"
>
<h1
className="section-header"
>
Social security number
</h1>
<div
aria-label="Provide your U.S. Social Security Number"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your U.S. Social Security Number
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Provide your U.S. Social Security Number"
className="toggle h4"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your U.S. Social Security Number"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.ssn.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="ssn applicant-ssn-initial"
>
<div
className="hide-for-print first eapp-short-input usa-input-error"
>
<input
aria-describedby="first-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="first-MOCK-GUID"
maxLength="3"
name="first"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{3}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="hide-for-print middle eapp-short-input usa-input-error"
>
<input
aria-describedby="middle-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="middle-MOCK-GUID"
maxLength="2"
name="middle"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{2}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="hide-for-print last eapp-short-input usa-input-error"
>
<input
aria-describedby="last-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="last-MOCK-GUID"
maxLength="4"
name="last"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{4}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="flags"
>
<div
className="not-applicable block"
>
<input
aria-label="Not applicable for null"
checked={false}
className="usa-input-success"
id="notApplicable-MOCK-GUID"
name="notApplicable"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="notApplicable-MOCK-GUID"
>
<span>
Not applicable
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content other-names"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_OTHER_NAMES"
>
<h1
className="section-header"
>
Other names used
</h1>
<div
aria-label="Provide your other names used and the period of time you used them"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Provide your other names used and the period of time you used them
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Provide your other names used and the period of time you used them"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your other names used and the period of time you used them"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
For example: your maiden name, name(s) by a former marriage, former name(s), alias(es), or nickname(s).
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Have you used any other names?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you used any other names?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_othernames-MOCK-GUID"
name="has_othernames-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_othernames-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_othernames-MOCK-GUID"
name="has_othernames-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_othernames-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content contact"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_CONTACTS"
>
<h1
className="section-header"
>
Your contact information
</h1>
<div
aria-label="Your email addresses"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Your email addresses
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Your email addresses"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Your email addresses"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Email addresses may be used as contact method, and identify subject in records.
</p>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Home email address"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Home email address
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.email.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print email email-home usa-input-error"
>
<input
aria-describedby="HomeEmail-error"
aria-label={null}
autoCapitalize={false}
autoComplete={true}
autoCorrect={false}
className=""
id="HomeEmail-MOCK-GUID"
maxLength={255}
name="HomeEmail"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern={/\\^\\(\\[A-z0-9_\\.-\\]\\+\\)@\\(\\[A-z0-9\\.-\\]\\+\\)\\\\\\.\\+\\(\\[A-z\\.\\]\\{2,63\\}\\)\\$/}
spellCheck={false}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Work email address"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Work email address
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.email.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="hide-for-print email email-work usa-input-error"
>
<input
aria-describedby="WorkEmail-error"
aria-label={null}
autoCapitalize={false}
autoComplete={true}
autoCorrect={false}
className=""
id="WorkEmail-MOCK-GUID"
maxLength={255}
name="WorkEmail"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern={/\\^\\(\\[A-z0-9_\\.-\\]\\+\\)@\\(\\[A-z0-9\\.-\\]\\+\\)\\\\\\.\\+\\(\\[A-z\\.\\]\\{2,63\\}\\)\\$/}
spellCheck={false}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Your phone numbers"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Your phone numbers
</h3>
<span
className="icon"
>
<a
aria-label="Show help for Your phone numbers"
className="toggle h3"
href="javascript:;"
onClick={[Function]}
title="Show help for Your phone numbers"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
Provide three contact numbers.
<strong>
At least one telephone number is required
</strong>
. Additional numbers may assist in the completion of your background investigation.
</p>
</div>
</span>
</span>
</div>
</div>
<div />
<div
className=" telephone-collection"
>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of phone numbers
</strong>
<div
className="items"
/>
<div
className="append-button"
>
<button
className="add usa-button-outline"
onClick={[Function]}
>
Add another phone number
<i
className="fa fa-plus-circle"
/>
</button>
</div>
</div>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content physical"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_PHYSICAL"
>
<h1
className="section-header"
>
Your identifying information
</h1>
<div
aria-label="Height"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Height
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Height"
className="toggle h4 adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Height"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.height.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="height"
>
<div
className="feet"
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="feet-MOCK-GUID"
>
Feet
</label>
<input
aria-describedby="feet-error"
aria-label="Feet"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="feet-MOCK-GUID"
maxLength="1"
name="feet"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
<div
className="inches"
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="inches-MOCK-GUID"
>
Inches
</label>
<input
aria-describedby="inches-error"
aria-label="Inches"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="inches-MOCK-GUID"
maxLength="2"
name="inches"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Weight"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Weight
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Weight"
className="toggle h4 adjust-for-labels"
href="javascript:;"
onClick={[Function]}
title="Show help for Weight"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.weight.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="weight"
>
<div
className="pounds"
>
<div
className="hide-for-print usa-input-error"
>
<label
className="usa-input-error-label"
htmlFor="pounds-MOCK-GUID"
>
Pounds
</label>
<input
aria-describedby="pounds-error"
aria-label="Pounds"
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="pounds-MOCK-GUID"
maxLength="3"
name="pounds"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
pattern="^(\\\\s*|\\\\d+)$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Hair color"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Hair color
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Hair color"
className="toggle h4 adjust-for-big-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Hair color"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className=" hair-colors"
>
<label />
<div
className="blocks option-list eapp-extend-labels physical-radio usa-input-error"
>
<div
className="black block extended"
>
<input
aria-label="Black for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-black-MOCK-GUID"
name="hair-black-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Black"
/>
<label
className=""
htmlFor="hair-black-MOCK-GUID"
>
<div
className="hair-icon black"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Black
</span>
</label>
</div>
<div
className="brown block extended"
>
<input
aria-label="Brown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-brown-MOCK-GUID"
name="hair-brown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Brown"
/>
<label
className=""
htmlFor="hair-brown-MOCK-GUID"
>
<div
className="hair-icon brown"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Brown
</span>
</label>
</div>
<div
className="red block extended"
>
<input
aria-label="Red or auburn for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-red-MOCK-GUID"
name="hair-red-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Red"
/>
<label
className=""
htmlFor="hair-red-MOCK-GUID"
>
<div
className="hair-icon red"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Red or auburn
</span>
</label>
</div>
<div
className="blonde block extended"
>
<input
aria-label="Blonde or strawberry for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-blonde-MOCK-GUID"
name="hair-blonde-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blonde"
/>
<label
className=""
htmlFor="hair-blonde-MOCK-GUID"
>
<div
className="hair-icon blonde"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Blonde or strawberry
</span>
</label>
</div>
<div
className="sandy block extended"
>
<input
aria-label="Sandy for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-sandy-MOCK-GUID"
name="hair-sandy-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Sandy"
/>
<label
className=""
htmlFor="hair-sandy-MOCK-GUID"
>
<div
className="hair-icon sandy"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Sandy
</span>
</label>
</div>
<div
className="gray block extended"
>
<input
aria-label="Gray or partially gray for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-gray-MOCK-GUID"
name="hair-gray-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Gray"
/>
<label
className=""
htmlFor="hair-gray-MOCK-GUID"
>
<div
className="hair-icon gray"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Gray or partially gray
</span>
</label>
</div>
<div
className="white block extended"
>
<input
aria-label="White for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-white-MOCK-GUID"
name="hair-white-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="White"
/>
<label
className=""
htmlFor="hair-white-MOCK-GUID"
>
<div
className="hair-icon white"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
White
</span>
</label>
</div>
<div
className="bald block extended"
>
<input
aria-label="Bald for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-bald-MOCK-GUID"
name="hair-bald-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Bald"
/>
<label
className=""
htmlFor="hair-bald-MOCK-GUID"
>
<div
className="hair-icon bald"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 18.01 30.87"
>
<path
d="M11.571,30.953h-1.328L10.04,30.9c-0.377-0.188-0.754-0.378-1.226-0.566l0.371-0.928 c0.018,0.007,0.035,0.014,0.051,0.021c-0.007-0.018-0.014-0.034-0.021-0.052l0.928-0.371c0.173,0.431,0.351,0.877,0.569,1.095 L11.571,30.953z"
/>
<path
d="M6.4,28.932c-0.853-0.538-1.63-1.108-2.31-1.696l0.653-0.756c0.643,0.555,1.379,1.095,2.189,1.606L6.4,28.932 z M2.102,25.136c-0.599-0.789-1.088-1.638-1.456-2.521L1.57,22.23c0.334,0.806,0.782,1.58,1.329,2.302L2.102,25.136z M-0.118,19.807c-0.086-0.607-0.13-1.244-0.13-1.893c0-0.352,0.018-0.688,0.053-1.013l0.994,0.107 c-0.031,0.289-0.047,0.591-0.047,0.905c0,0.602,0.041,1.19,0.121,1.752L-0.118,19.807z M1.53,14.525l-0.891-0.454 c0.418-0.819,0.987-1.591,1.739-2.36l0.715,0.699C2.413,13.105,1.901,13.797,1.53,14.525z M5.152,10.626L4.537,9.838l0.451-0.35 c0.61-0.472,1.186-0.918,1.697-1.38L7.355,8.85c-0.54,0.488-1.13,0.946-1.756,1.43L5.152,10.626z M9.168,6.477L8.243,6.095 C8.416,5.677,8.5,5.25,8.5,4.791c0-0.332-0.05-0.744-0.138-1.13l0.975-0.222C9.44,3.895,9.5,4.388,9.5,4.791 C9.5,5.375,9.388,5.943,9.168,6.477z"
/>
<path
d="M7.855,1.963C7.666,1.491,7.478,1.018,7.289,0.64L6.928-0.083h0.927l0.203,0.053 c0.381,0.19,0.757,0.379,1.226,0.566L8.912,1.464C8.838,1.435,8.767,1.405,8.697,1.376C8.726,1.448,8.755,1.52,8.784,1.592 L7.855,1.963z"
/>
<path
d="M8.667,27.461C8.556,27.004,8.5,26.539,8.5,26.079c0-0.576,0.104-1.134,0.31-1.656l0.931,0.365 C9.579,25.2,9.5,25.622,9.5,26.079c0,0.381,0.046,0.767,0.138,1.147L8.667,27.461z M11.267,22.762l-0.676-0.738 c0.563-0.516,1.186-0.994,1.845-1.501l0.361-0.278l0.611,0.791l-0.363,0.28C12.404,21.809,11.798,22.274,11.267,22.762z M15.579,19.179l-0.709-0.705c0.687-0.688,1.203-1.375,1.581-2.1l0.887,0.463C16.913,17.652,16.337,18.418,15.579,19.179z M18.191,14.012l-0.994-0.112c0.034-0.301,0.052-0.615,0.052-0.943c0-0.585-0.038-1.162-0.111-1.714l0.99-0.133 c0.08,0.596,0.121,1.217,0.121,1.847C18.249,13.323,18.229,13.675,18.191,14.012z M16.469,8.668 c-0.326-0.812-0.763-1.59-1.299-2.315l0.803-0.595c0.588,0.793,1.066,1.646,1.424,2.538L16.469,8.668z M13.345,4.394 c-0.638-0.558-1.372-1.099-2.182-1.61l0.533-0.846c0.854,0.539,1.63,1.112,2.307,1.703L13.345,4.394z"
/>
</svg>
</div>
<span>
Bald
</span>
</label>
</div>
<div
className="blue block extended"
>
<input
aria-label="Blue for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-blue-MOCK-GUID"
name="hair-blue-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blue"
/>
<label
className=""
htmlFor="hair-blue-MOCK-GUID"
>
<div
className="hair-icon blue"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Blue
</span>
</label>
</div>
<div
className="green block extended"
>
<input
aria-label="Green for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-green-MOCK-GUID"
name="hair-green-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Green"
/>
<label
className=""
htmlFor="hair-green-MOCK-GUID"
>
<div
className="hair-icon green"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Green
</span>
</label>
</div>
<div
className="orange block extended"
>
<input
aria-label="Orange for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-orange-MOCK-GUID"
name="hair-orange-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Orange"
/>
<label
className=""
htmlFor="hair-orange-MOCK-GUID"
>
<div
className="hair-icon orange"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Orange
</span>
</label>
</div>
<div
className="pink block extended"
>
<input
aria-label="Pink for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-pink-MOCK-GUID"
name="hair-pink-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Pink"
/>
<label
className=""
htmlFor="hair-pink-MOCK-GUID"
>
<div
className="hair-icon pink"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Pink
</span>
</label>
</div>
<div
className="purple block extended"
>
<input
aria-label="Purple for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-purple-MOCK-GUID"
name="hair-purple-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Purple"
/>
<label
className=""
htmlFor="hair-purple-MOCK-GUID"
>
<div
className="hair-icon purple"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 18 32"
focusable="false"
tabIndex="-1"
viewBox="0 0 18 32"
>
<path
d="M9,26.37c0,1.41,0.7,3.28,1.35,4.5l-0.08-0.02l0.02,0.02C4.74,28.32,0,24.8,0,18.01c0-7.7,9-8.38,9-13.5 C9,3.1,8.3,1.23,7.68,0l0.06,0.02L7.72,0c5.55,2.55,10.29,6.07,10.29,12.86C18.01,20.56,9,21.24,9,26.37z"
/>
</svg>
</div>
<span>
Purple
</span>
</label>
</div>
<div
className="unknown block extended"
>
<input
aria-label="Unspecified or unknown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hair-unknown-MOCK-GUID"
name="hair-unknown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Unknown"
/>
<label
className=""
htmlFor="hair-unknown-MOCK-GUID"
>
<div
className="hair-icon unknown"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 30.86 36.84"
>
<path
d="M15.43,34.25C6.91,34.25,0,27.34,0,18.82C0,10.3,6.91,3.39,15.43,3.39s15.43,6.91,15.43,15.43 C30.87,27.34,23.95,34.25,15.43,34.25z M15.84,8.53c-3.28,0-5.73,1.41-7.46,4.28c-0.18,0.28-0.1,0.64,0.16,0.84l2.65,2.01 c0.1,0.08,0.24,0.12,0.38,0.12c0.18,0,0.38-0.08,0.5-0.24c0.94-1.21,1.35-1.57,1.73-1.85c0.34-0.24,1-0.48,1.73-0.48 c1.29,0,2.47,0.82,2.47,1.71c0,1.04-0.54,1.57-1.77,2.13c-1.43,0.64-3.38,2.31-3.38,4.26v0.72c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64c0-0.46,0.58-1.45,1.53-1.99c1.53-0.87,3.62-2.03,3.62-5.08C23.15,11.28,19.29,8.53,15.84,8.53z M18.01,24.61c0-0.36-0.28-0.64-0.64-0.64H13.5c-0.36,0-0.64,0.28-0.64,0.64v3.86c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64V24.61z"
/>
</svg>
</div>
<span>
Unspecified or unknown
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Eye color"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Eye color
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Eye color"
className="toggle h4 adjust-for-big-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Eye color"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className=" eye-colors"
>
<label />
<div
className="blocks option-list eapp-extend-labels physical-radio usa-input-error"
>
<div
className="brown block extended"
>
<input
aria-label="Brown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-brown-MOCK-GUID"
name="eye-brown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Brown"
/>
<label
className=""
htmlFor="eye-brown-MOCK-GUID"
>
<div
className="eye-icon brown"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Brown
</span>
</label>
</div>
<div
className="hazel block extended"
>
<input
aria-label="Hazel for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-hazel-MOCK-GUID"
name="eye-hazel-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Hazel"
/>
<label
className=""
htmlFor="eye-hazel-MOCK-GUID"
>
<div
className="eye-icon hazel"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Hazel
</span>
</label>
</div>
<div
className="blue block extended"
>
<input
aria-label="Blue for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-blue-MOCK-GUID"
name="eye-blue-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Blue"
/>
<label
className=""
htmlFor="eye-blue-MOCK-GUID"
>
<div
className="eye-icon blue"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Blue
</span>
</label>
</div>
<div
className="green block extended"
>
<input
aria-label="Green for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-green-MOCK-GUID"
name="eye-green-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Green"
/>
<label
className=""
htmlFor="eye-green-MOCK-GUID"
>
<div
className="eye-icon green"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Green
</span>
</label>
</div>
<div
className="gray block extended"
>
<input
aria-label="Gray for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-gray-MOCK-GUID"
name="eye-gray-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Gray"
/>
<label
className=""
htmlFor="eye-gray-MOCK-GUID"
>
<div
className="eye-icon gray"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Gray
</span>
</label>
</div>
<div
className="maroon block extended"
>
<input
aria-label="Maroon for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-maroon-MOCK-GUID"
name="eye-maroon-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Maroon"
/>
<label
className=""
htmlFor="eye-maroon-MOCK-GUID"
>
<div
className="eye-icon maroon"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Maroon
</span>
</label>
</div>
<div
className="black block extended"
>
<input
aria-label="Black for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-black-MOCK-GUID"
name="eye-black-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Black"
/>
<label
className=""
htmlFor="eye-black-MOCK-GUID"
>
<div
className="eye-icon black"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Black
</span>
</label>
</div>
<div
className="multi block extended"
>
<input
aria-label="Multicolored for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-multi-MOCK-GUID"
name="eye-multi-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Multicolored"
/>
<label
className=""
htmlFor="eye-multi-MOCK-GUID"
>
<div
className="eye-icon multi"
>
<img
alt="Scalable vector graphic"
className="svg"
src="/img/eye-multicolor.svg"
/>
</div>
<span>
Multicolored
</span>
</label>
</div>
<div
className="pink block extended"
>
<input
aria-label="Pink for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-pink-MOCK-GUID"
name="eye-pink-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Pink"
/>
<label
className=""
htmlFor="eye-pink-MOCK-GUID"
>
<div
className="eye-icon pink"
>
<svg
alt="Scalable vector graphic"
enableBackground="new 0 0 36 36.84"
focusable="false"
tabIndex="-1"
viewBox="0 0 36 36.84"
>
<path
d="M35.61,21.49c-3.7,6.09-10.47,10.19-17.6,10.19S4.1,27.56,0.4,21.49C0.16,21.07,0,20.61,0,20.11 c0-0.5,0.16-0.96,0.4-1.39c3.7-6.07,10.47-10.19,17.6-10.19s13.91,4.12,17.6,10.19c0.24,0.42,0.4,0.88,0.4,1.39 C36.01,20.61,35.85,21.07,35.61,21.49z M25.78,13.01c0.8,1.37,1.23,2.93,1.23,4.52c0,4.96-4.04,9-9,9s-9-4.04-9-9 c0-1.59,0.42-3.16,1.23-4.52c-3.13,1.61-5.75,4.14-7.66,7.09c3.44,5.3,8.98,9,15.43,9s12-3.7,15.43-9 C31.53,17.15,28.92,14.62,25.78,13.01z M18.01,11.42c-3.36,0-6.11,2.75-6.11,6.11c0,0.52,0.44,0.96,0.96,0.96s0.96-0.44,0.96-0.96 c0-2.29,1.89-4.18,4.18-4.18c0.52,0,0.96-0.44,0.96-0.96C18.97,11.87,18.53,11.42,18.01,11.42z"
/>
</svg>
</div>
<span>
Pink
</span>
</label>
</div>
<div
className="unknown block extended"
>
<input
aria-label="Unknown for null"
checked={false}
className="usa-input-success"
disabled={false}
id="eye-unknown-MOCK-GUID"
name="eye-unknown-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Unknown"
/>
<label
className=""
htmlFor="eye-unknown-MOCK-GUID"
>
<div
className="eye-icon unknown"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 30.86 36.84"
>
<path
d="M15.43,34.25C6.91,34.25,0,27.34,0,18.82C0,10.3,6.91,3.39,15.43,3.39s15.43,6.91,15.43,15.43 C30.87,27.34,23.95,34.25,15.43,34.25z M15.84,8.53c-3.28,0-5.73,1.41-7.46,4.28c-0.18,0.28-0.1,0.64,0.16,0.84l2.65,2.01 c0.1,0.08,0.24,0.12,0.38,0.12c0.18,0,0.38-0.08,0.5-0.24c0.94-1.21,1.35-1.57,1.73-1.85c0.34-0.24,1-0.48,1.73-0.48 c1.29,0,2.47,0.82,2.47,1.71c0,1.04-0.54,1.57-1.77,2.13c-1.43,0.64-3.38,2.31-3.38,4.26v0.72c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64c0-0.46,0.58-1.45,1.53-1.99c1.53-0.87,3.62-2.03,3.62-5.08C23.15,11.28,19.29,8.53,15.84,8.53z M18.01,24.61c0-0.36-0.28-0.64-0.64-0.64H13.5c-0.36,0-0.64,0.28-0.64,0.64v3.86c0,0.36,0.28,0.64,0.64,0.64h3.86 c0.36,0,0.64-0.28,0.64-0.64V24.61z"
/>
</svg>
</div>
<span>
Unknown
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
<div
aria-label="Sex"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Sex
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className=" sex"
>
<label />
<div
className="blocks option-list physical-radio usa-input-error"
>
<div
className="female block extended"
>
<input
aria-label="Female for null"
checked={false}
className="usa-input-success"
disabled={false}
id="sex-MOCK-GUID"
name="sex-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Female"
/>
<label
className=""
htmlFor="sex-MOCK-GUID"
>
<div
className="sex-icon"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="0 0 50.81 79.19"
>
<path
d="M50.81,25.4C50.81,11.37,39.43,0,25.4,0S0,11.37,0,25.4c0,12.32,8.77,22.59,20.4,24.91v9.09h-9.79v10h9.79v9.79 h10V69.4h9.79v-10H30.4v-9.09C42.04,47.99,50.81,37.72,50.81,25.4z M10,25.4C10,16.91,16.91,10,25.4,10s15.4,6.91,15.4,15.4 s-6.91,15.4-15.4,15.4S10,33.9,10,25.4z"
/>
</svg>
</div>
<span>
Female
</span>
</label>
</div>
<div
className="male block extended"
>
<input
aria-label="Male for null"
checked={false}
className="usa-input-success"
disabled={false}
id="sex-MOCK-GUID"
name="sex-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Male"
/>
<label
className=""
htmlFor="sex-MOCK-GUID"
>
<div
className="sex-icon"
>
<svg
alt="Scalable vector graphic"
focusable="false"
tabIndex="-1"
viewBox="-10 -10 80 80"
>
<path
d="M62.77,0.12V0H37.69v10h8.64l-6.4,6.4c-4.35-3.04-9.43-4.56-14.52-4.56c-6.5,0-13,2.48-17.96,7.44 c-9.92,9.92-9.92,26.01,0,35.93c4.96,4.96,11.46,7.44,17.96,7.44c6.5,0,13-2.48,17.96-7.44c8.58-8.58,9.73-21.76,3.48-31.58 l6.05-6.05v7.64h10V0.12H62.77z M36.3,48.14c-2.91,2.91-6.78,4.51-10.89,4.51c-4.11,0-7.98-1.6-10.89-4.51 C11.6,45.23,10,41.36,10,37.24c0-4.11,1.6-7.98,4.51-10.89s6.78-4.51,10.89-4.51c4.11,0,7.98,1.6,10.89,4.51s4.51,6.78,4.51,10.89 C40.81,41.36,39.21,45.23,36.3,48.14z"
/>
</svg>
</div>
<span>
Male
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Your identifying information"
className="btn-cell back"
href="/form/identification/physical"
onClick={[Function]}
title="Go to previous section Your identifying information"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Your identifying information
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section History intro"
className="btn-cell next"
href="/form/history/intro"
onClick={[Function]}
title="Go to next section History intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
History intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders IDENTIFICATION_SSN 1`] = `
<div
className="section-view"
>
<div
className="view view-ssn"
>
<div
className="section-content applicant-ssn"
data-section="IDENTIFICATION"
data-subsection="IDENTIFICATION_SSN"
>
<h1
className="section-header"
>
Social security number
</h1>
<div
aria-label="Provide your U.S. Social Security Number"
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your U.S. Social Security Number
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Provide your U.S. Social Security Number"
className="toggle h4"
href="javascript:;"
onClick={[Function]}
title="Show help for Provide your U.S. Social Security Number"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="ssn applicant-ssn-initial"
>
<div
className="hide-for-print first eapp-short-input"
>
<input
aria-describedby="first-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="first-MOCK-GUID"
maxLength="3"
name="first"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{3}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="hide-for-print middle eapp-short-input"
>
<input
aria-describedby="middle-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="middle-MOCK-GUID"
maxLength="2"
name="middle"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{2}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="hide-for-print last eapp-short-input"
>
<input
aria-describedby="last-error"
aria-label={null}
autoCapitalize={true}
autoComplete={true}
autoCorrect={true}
className=""
disabled={false}
id="last-MOCK-GUID"
maxLength="4"
name="last"
onBlur={[Function]}
onChange={[Function]}
onCopy={[Function]}
onCut={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onPaste={[Function]}
pattern="^[0-9]{4}$"
spellCheck={true}
type="text"
value=""
/>
<div
className="text-print print-only"
>
</div>
</div>
<div
className="flags"
>
<div
className="not-applicable block"
>
<input
aria-label="Not applicable for null"
checked={false}
className="usa-input-success"
id="notApplicable-MOCK-GUID"
name="notApplicable"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="checkbox"
value={false}
/>
<label
className="checkbox no-toggle"
htmlFor="notApplicable-MOCK-GUID"
>
<span>
Not applicable
</span>
</label>
</div>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Place of birth"
className="btn-cell back"
href="/form/identification/birthplace"
onClick={[Function]}
title="Go to previous section Place of birth"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Place of birth
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Other names used"
className="btn-cell next"
href="/form/identification/othernames"
onClick={[Function]}
title="Go to next section Other names used"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Other names used
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_ACTIVITIES_TO_OVERTHROW 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/activities-to-overthrow"
>
<div
className="section-content legal-associations-activities"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ACTIVITIES_TO_OVERTHROW"
>
<h1
className="section-header"
>
Activities to overthrow
</h1>
<div
aria-label="Have you EVER knowingly engaged in activities designed to overthrow the U.S. Government by force?"
className="field required branch legal-associations-activities-has-activities"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER knowingly engaged in activities designed to overthrow the U.S. Government by force?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_activities-MOCK-GUID"
name="has_activities-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_activities-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_activities-MOCK-GUID"
name="has_activities-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_activities-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Membership - violence or force"
className="btn-cell back"
href="/form/legal/associations/membership-violence-or-force"
onClick={[Function]}
title="Go to previous section Membership - violence or force"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Membership - violence or force
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Terrorism association"
className="btn-cell next"
href="/form/legal/associations/terrorism-association"
onClick={[Function]}
title="Go to next section Terrorism association"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Terrorism association
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_ADVOCATING 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/advocating"
>
<div
className="section-content legal-associations-advocating"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ADVOCATING"
>
<h1
className="section-header"
>
Advocating
</h1>
<div
aria-label="Have you EVER advocated any acts of terrorism or activities designed to overthrow the U.S. Government by force?"
className="field required branch legal-associations-advocating-has-advocated"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER advocated any acts of terrorism or activities designed to overthrow the U.S. Government by force?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_advocated-MOCK-GUID"
name="has_advocated-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_advocated-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_advocated-MOCK-GUID"
name="has_advocated-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_advocated-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Engaged in terrorism"
className="btn-cell back"
href="/form/legal/associations/engaged-in-terrorism"
onClick={[Function]}
title="Go to previous section Engaged in terrorism"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Engaged in terrorism
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Membership - overthrow"
className="btn-cell next"
href="/form/legal/associations/membership-overthrow"
onClick={[Function]}
title="Go to next section Membership - overthrow"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Membership - overthrow
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_ENGAGED_IN_TERRORISM 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/engaged-in-terrorism"
>
<div
className="section-content legal-associations-engaged"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ENGAGED_IN_TERRORISM"
>
<h1
className="section-header"
>
Engaged in terrorism
</h1>
<div
aria-label="Have you EVER knowingly engaged in any acts of terrorism?"
className="field required branch legal-associations-engaged-has-engaged"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER knowingly engaged in any acts of terrorism?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_engaged-MOCK-GUID"
name="has_engaged-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_engaged-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_engaged-MOCK-GUID"
name="has_engaged-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_engaged-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Terrorist organization"
className="btn-cell back"
href="/form/legal/associations/terrorist-organization"
onClick={[Function]}
title="Go to previous section Terrorist organization"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Terrorist organization
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Advocating"
className="btn-cell next"
href="/form/legal/associations/advocating"
onClick={[Function]}
title="Go to next section Advocating"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Advocating
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_MEMBERSHIP_OVERTHROW 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/membership-overthrow"
>
<div
className="section-content legal-associations-overthrow"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_MEMBERSHIP_OVERTHROW"
>
<h1
className="section-header"
>
Membership - overthrow
</h1>
<div
aria-label="Have you EVER been a member of an organization dedicated to the use of violence or force to overthrow the United States Government, and which engaged in activities to that end with an awareness of the organization's dedication to that end or with the specific intent to further such activities?"
className="field required branch legal-associations-overthrow-has-overthrow"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been a member of an organization dedicated to the use of violence or force to overthrow the United States Government, and which engaged in activities to that end with an awareness of the organization's dedication to that end or with the specific intent to further such activities?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_overthrow-MOCK-GUID"
name="has_overthrow-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_overthrow-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_overthrow-MOCK-GUID"
name="has_overthrow-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_overthrow-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Advocating"
className="btn-cell back"
href="/form/legal/associations/advocating"
onClick={[Function]}
title="Go to previous section Advocating"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Advocating
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Membership - violence or force"
className="btn-cell next"
href="/form/legal/associations/membership-violence-or-force"
onClick={[Function]}
title="Go to next section Membership - violence or force"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Membership - violence or force
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_MEMBERSHIP_VIOLENCE 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/membership-violence-or-force"
>
<div
className="section-content legal-associations-violence"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_MEMBERSHIP_VIOLENCE"
>
<h1
className="section-header"
>
Membership - violence or force
</h1>
<div
aria-label="Have you EVER been a member of an organization that advocates or practices commission of acts of force or violence to discourage others from exercising their rights under the U.S. Constitution or any state of the United States with the specific intent to further such action?"
className="field required branch legal-associations-violence-has-violence"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been a member of an organization that advocates or practices commission of acts of force or violence to discourage others from exercising their rights under the U.S. Constitution or any state of the United States with the specific intent to further such action?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_violence-MOCK-GUID"
name="has_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_violence-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_violence-MOCK-GUID"
name="has_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_violence-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Membership - overthrow"
className="btn-cell back"
href="/form/legal/associations/membership-overthrow"
onClick={[Function]}
title="Go to previous section Membership - overthrow"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Membership - overthrow
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Activities to overthrow"
className="btn-cell next"
href="/form/legal/associations/activities-to-overthrow"
onClick={[Function]}
title="Go to next section Activities to overthrow"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Activities to overthrow
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_TERRORISM_ASSOCIATION 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/terrorism-association"
>
<div
className="section-content legal-associations-terrorism"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_TERRORISM_ASSOCIATION"
>
<h1
className="section-header"
>
Terrorism association
</h1>
<div
aria-label="Have you EVER associated with anyone involved in activities to further terrorism?"
className="field required branch legal-associations-terrorism-has-terrorism"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER associated with anyone involved in activities to further terrorism?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorsim-MOCK-GUID"
name="has_terrorsim-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_terrorsim-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorsim-MOCK-GUID"
name="has_terrorsim-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_terrorsim-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Activities to overthrow"
className="btn-cell back"
href="/form/legal/associations/activities-to-overthrow"
onClick={[Function]}
title="Go to previous section Activities to overthrow"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Activities to overthrow
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review investigative & criminal history"
className="btn-cell next"
href="/form/legal/review"
onClick={[Function]}
title="Go to next section Review investigative & criminal history"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review investigative & criminal history
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_ASSOCIATIONS_TERRORIST_ORGANIZATION 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-associations/terrorist-organization"
>
<div
className="section-content legal-associations-terrorist"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_TERRORIST_ORGANIZATION"
>
<h1
className="section-header"
>
Terrorist organization
</h1>
<div>
<p>
The following pertain to your associations. You are required to answer the questions fully and truthfully, and your failure to do so could be grounds for an adverse employment, security, or credentialing decision.
</p>
<p>
For the purpose of this question, terrorism is defined as any criminal acts that involve violence or are dangerous to human life and appear to be intended to intimidate or coerce a civilian population to influence the policy of a government by intimidation or coercion or to affect the conduct of a government by mass destruction, assassination or kidnapping.
</p>
</div>
<div
aria-label="Are you now or have you EVER been a member of an organization dedicated to terrorism, either with an awareness of the organization's dedication to that end, or with the specific intent to further such activities?"
className="field required branch legal-associations-terrorist-has-terrorist"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Are you now or have you EVER been a member of an organization dedicated to terrorism, either with an awareness of the organization's dedication to that end, or with the specific intent to further such activities?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorist-MOCK-GUID"
name="has_terrorist-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_terrorist-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorist-MOCK-GUID"
name="has_terrorist-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_terrorist-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Unlawful use"
className="btn-cell back"
href="/form/legal/technology/unlawful"
onClick={[Function]}
title="Go to previous section Unlawful use"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Unlawful use
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Engaged in terrorism"
className="btn-cell next"
href="/form/legal/associations/engaged-in-terrorism"
onClick={[Function]}
title="Go to next section Engaged in terrorism"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Engaged in terrorism
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_COURT 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-court"
>
<div
className="section-content non-criminal-court-actions"
data-section="LEGAL"
data-subsection="LEGAL_COURT"
>
<h1
className="section-header"
>
Involvement in non-criminal court actions
</h1>
<div
aria-label="In the last ten (10) years, have you been a party to any public record civil court action not listed elsewhere on this form?"
className="field required branch has-court-actions"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last ten (10) years, have you been a party to any public record civil court action not listed elsewhere on this form?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasCourtActions-MOCK-GUID"
name="HasCourtActions-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="HasCourtActions-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasCourtActions-MOCK-GUID"
name="HasCourtActions-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="HasCourtActions-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Debarment"
className="btn-cell back"
href="/form/legal/investigations/debarred"
onClick={[Function]}
title="Go to previous section Debarment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Debarment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Unauthorized access"
className="btn-cell next"
href="/form/legal/technology/unauthorized"
onClick={[Function]}
title="Go to next section Unauthorized access"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Unauthorized access
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_INTRO 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 9: Investigative and criminal history
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your investigative and criminal background and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review substance use"
className="btn-cell back"
href="/form/substance/review"
onClick={[Function]}
title="Go to previous section Review substance use"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review substance use
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Police record"
className="btn-cell next"
href="/form/legal/police/intro"
onClick={[Function]}
title="Go to next section Police record"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Police record
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_INVESTIGATIONS_DEBARRED 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-investigations/debarred"
>
<div
className="section-content investigations-debarred"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_DEBARRED"
>
<h1
className="section-header"
>
Debarment
</h1>
<div
aria-label="Have you EVER been debarred from government employment?"
className="field required branch legal-investigations-debarred-has-debarment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been debarred from government employment?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_debarred-MOCK-GUID"
name="has_debarred-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_debarred-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_debarred-MOCK-GUID"
name="has_debarred-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_debarred-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Denied"
className="btn-cell back"
href="/form/legal/investigations/revoked"
onClick={[Function]}
title="Go to previous section Denied"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Denied
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Non-criminal court actions"
className="btn-cell next"
href="/form/legal/court"
onClick={[Function]}
title="Go to next section Non-criminal court actions"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Non-criminal court actions
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_INVESTIGATIONS_HISTORY 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-investigations/history"
>
<div
className="section-content investigations-history"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_HISTORY"
>
<h1
className="section-header"
>
Ever been investigated
</h1>
<div
aria-label="Has the U.S. Government (or a foreign government) EVER investigated your background and/or granted you a security clearance eligibility/access?"
className="field required branch legal-investigations-history-has-history"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has the U.S. Government (or a foreign government) EVER investigated your background and/or granted you a security clearance eligibility/access?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_history-MOCK-GUID"
name="has_history-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_history-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_history-MOCK-GUID"
name="has_history-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_history-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Domestic violence"
className="btn-cell back"
href="/form/legal/police/domesticviolence"
onClick={[Function]}
title="Go to previous section Domestic violence"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Domestic violence
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Denied"
className="btn-cell next"
href="/form/legal/investigations/revoked"
onClick={[Function]}
title="Go to next section Denied"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Denied
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_INVESTIGATIONS_REVOKED 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-investigations/revoked"
>
<div
className="section-content investigations-revoked"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_REVOKED"
>
<h1
className="section-header"
>
Denied
</h1>
<div
aria-label="Have you EVER had a security clearance eligibility/access authorization denied, suspended, or revoked?"
className="field required branch legal-investigations-revoked-has-revocations"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER had a security clearance eligibility/access authorization denied, suspended, or revoked?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Note: An administrative downgrade or administrative termination of a security clearance is not a revocation.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_revoked-MOCK-GUID"
name="has_revoked-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_revoked-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_revoked-MOCK-GUID"
name="has_revoked-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_revoked-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Ever been investigated"
className="btn-cell back"
href="/form/legal/investigations/history"
onClick={[Function]}
title="Go to previous section Ever been investigated"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Ever been investigated
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Debarment"
className="btn-cell next"
href="/form/legal/investigations/debarred"
onClick={[Function]}
title="Go to next section Debarment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Debarment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_POLICE_ADDITIONAL_OFFENSES 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-police/additionaloffenses"
>
<div
className="section-content police-other-offenses"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_ADDITIONAL_OFFENSES"
>
<h1
className="section-header"
>
Additional offenses
</h1>
<div
className="has-otheroffenses"
>
<div>
<div
aria-label="Other than those offenses already listed, have you EVER had the following happen to you?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than those offenses already listed, have you EVER had the following happen to you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
Have you EVER been convicted
</strong>
in any court of the United States of a crime, sentenced to imprisonment for a term exceeding 1 year for that crime, and incarcerated as a result of that sentence for not less than 1 year? Include all qualifying convictions in Federal, state, local, or military court, even if previously listed on this form
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with any felony offense? Include those under the Uniform Code of Military Justice and non-military/civilian offenses
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been convicted
</strong>
of an offense involving domestic violence or a crime of violence (such as battery or assault) against your child, dependent, cohabitant, spouse or legally recognized civil union/domestic partner, former spouse or legally recognized civil union/domestic partner, or someone with whom you share a child in common?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with an offense involving firearms or explosives?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with an offense involving alcohol or drugs?
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Offenses"
className="btn-cell back"
href="/form/legal/police/offenses"
onClick={[Function]}
title="Go to previous section Offenses"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Offenses
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Domestic violence"
className="btn-cell next"
href="/form/legal/police/domesticviolence"
onClick={[Function]}
title="Go to next section Domestic violence"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Domestic violence
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_POLICE_DOMESTIC_VIOLENCE 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-police/domesticviolence"
>
<div
className="section-content domestic-violence-list"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_DOMESTIC_VIOLENCE"
>
<h1
className="section-header"
>
Domestic violence
</h1>
<div
aria-label="Is there currently a domestic violence protective order or restraining order issued against you?"
className="field required branch has-domestic-violence"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Is there currently a domestic violence protective order or restraining order issued against you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_domestic_violence-MOCK-GUID"
name="has_domestic_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_domestic_violence-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_domestic_violence-MOCK-GUID"
name="has_domestic_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_domestic_violence-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Additional offenses"
className="btn-cell back"
href="/form/legal/police/additionaloffenses"
onClick={[Function]}
title="Go to previous section Additional offenses"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Additional offenses
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Ever been investigated"
className="btn-cell next"
href="/form/legal/investigations/history"
onClick={[Function]}
title="Go to next section Ever been investigated"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Ever been investigated
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_POLICE_INTRO 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-police/intro"
>
<div>
<h1
className="section-header"
>
Police record
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
For this section report information regardless of whether the record in your case has been sealed, expunged, or otherwise stricken from the court record, or the charge was dismissed.
</p>
</div>
<div>
<p>
You need not report convictions under the Federal Controlled Substances Act for which the court issued an expungement order under the authority of 21 U.S.C 844 or 18 U.S.C. 3607.
</p>
</div>
<div>
<p>
<strong>
Be sure to include all incidents whether occurring in the U.S. or abroad.
</strong>
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Investigative and criminal history intro"
className="btn-cell back"
href="/form/legal/intro"
onClick={[Function]}
title="Go to previous section Investigative and criminal history intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Investigative and criminal history intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Offenses"
className="btn-cell next"
href="/form/legal/police/offenses"
onClick={[Function]}
title="Go to next section Offenses"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Offenses
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_POLICE_OFFENSES 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-police/offenses"
>
<div
className="section-content police-offenses"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_OFFENSES"
>
<h1
className="section-header"
>
Offenses
</h1>
<div
className="has-offenses"
>
<div>
<div
aria-label="Have any of the following happened?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have any of the following happened?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been issued a summons, citation, or ticket to appear in court in a criminal proceeding against you? Do not check if all the citations involved traffic infractions where the fine was less than $300 and did not include alcohol or drugs.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been arrested by any police officer, sheriff, marshal or any other type of law enforcement official?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been charged with, convicted of, or sentenced for a crime in any court? Include all qualifying charges, convictions or sentences in any federal, state, local, military, or non-U.S. court, even if previously listed on this form.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been or are you currently on probation or parole?
</p>
</div>
</li>
<li>
<div>
<p>
Are you currently on trial or awaiting a trial on criminal charges?
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_offenses-MOCK-GUID"
name="has_offenses-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_offenses-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_offenses-MOCK-GUID"
name="has_offenses-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_offenses-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Police record"
className="btn-cell back"
href="/form/legal/police/intro"
onClick={[Function]}
title="Go to previous section Police record"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Police record
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Additional offenses"
className="btn-cell next"
href="/form/legal/police/additionaloffenses"
onClick={[Function]}
title="Go to next section Additional offenses"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Additional offenses
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_REVIEW 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content police-offenses"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_OFFENSES"
>
<h1
className="section-header"
>
Offenses
</h1>
<div
className="has-offenses"
>
<div>
<div
aria-label="Have any of the following happened?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have any of the following happened?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been issued a summons, citation, or ticket to appear in court in a criminal proceeding against you? Do not check if all the citations involved traffic infractions where the fine was less than $300 and did not include alcohol or drugs.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been arrested by any police officer, sheriff, marshal or any other type of law enforcement official?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been charged with, convicted of, or sentenced for a crime in any court? Include all qualifying charges, convictions or sentences in any federal, state, local, military, or non-U.S. court, even if previously listed on this form.
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
In the last seven (7) years
</strong>
have you been or are you currently on probation or parole?
</p>
</div>
</li>
<li>
<div>
<p>
Are you currently on trial or awaiting a trial on criminal charges?
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_offenses-MOCK-GUID"
name="has_offenses-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_offenses-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_offenses-MOCK-GUID"
name="has_offenses-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_offenses-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<span>
<hr
className="section-divider"
/>
<div
className="section-content police-other-offenses"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_ADDITIONAL_OFFENSES"
>
<h1
className="section-header"
>
Additional offenses
</h1>
<div
className="has-otheroffenses"
>
<div>
<div
aria-label="Other than those offenses already listed, have you EVER had the following happen to you?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Other than those offenses already listed, have you EVER had the following happen to you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<ul>
<li>
<div>
<p>
<strong>
Have you EVER been convicted
</strong>
in any court of the United States of a crime, sentenced to imprisonment for a term exceeding 1 year for that crime, and incarcerated as a result of that sentence for not less than 1 year? Include all qualifying convictions in Federal, state, local, or military court, even if previously listed on this form
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with any felony offense? Include those under the Uniform Code of Military Justice and non-military/civilian offenses
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been convicted
</strong>
of an offense involving domestic violence or a crime of violence (such as battery or assault) against your child, dependent, cohabitant, spouse or legally recognized civil union/domestic partner, former spouse or legally recognized civil union/domestic partner, or someone with whom you share a child in common?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with an offense involving firearms or explosives?
</p>
</div>
</li>
<li>
<div>
<p>
<strong>
Have you EVER been charged
</strong>
with an offense involving alcohol or drugs?
</p>
</div>
</li>
</ul>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="branchcollection-MOCK-GUID"
name="branchcollection-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="branchcollection-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</span>
<hr
className="section-divider"
/>
<div
className="section-content domestic-violence-list"
data-section="LEGAL"
data-subsection="LEGAL_POLICE_DOMESTIC_VIOLENCE"
>
<h1
className="section-header"
>
Domestic violence
</h1>
<div
aria-label="Is there currently a domestic violence protective order or restraining order issued against you?"
className="field required branch has-domestic-violence"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Is there currently a domestic violence protective order or restraining order issued against you?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_domestic_violence-MOCK-GUID"
name="has_domestic_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_domestic_violence-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_domestic_violence-MOCK-GUID"
name="has_domestic_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_domestic_violence-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content investigations-history"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_HISTORY"
>
<h1
className="section-header"
>
Ever been investigated
</h1>
<div
aria-label="Has the U.S. Government (or a foreign government) EVER investigated your background and/or granted you a security clearance eligibility/access?"
className="field required branch legal-investigations-history-has-history"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has the U.S. Government (or a foreign government) EVER investigated your background and/or granted you a security clearance eligibility/access?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_history-MOCK-GUID"
name="has_history-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_history-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_history-MOCK-GUID"
name="has_history-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_history-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content investigations-revoked"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_REVOKED"
>
<h1
className="section-header"
>
Denied
</h1>
<div
aria-label="Have you EVER had a security clearance eligibility/access authorization denied, suspended, or revoked?"
className="field required branch legal-investigations-revoked-has-revocations"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER had a security clearance eligibility/access authorization denied, suspended, or revoked?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Note: An administrative downgrade or administrative termination of a security clearance is not a revocation.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_revoked-MOCK-GUID"
name="has_revoked-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_revoked-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_revoked-MOCK-GUID"
name="has_revoked-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_revoked-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content investigations-debarred"
data-section="LEGAL"
data-subsection="LEGAL_INVESTIGATIONS_DEBARRED"
>
<h1
className="section-header"
>
Debarment
</h1>
<div
aria-label="Have you EVER been debarred from government employment?"
className="field required branch legal-investigations-debarred-has-debarment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been debarred from government employment?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_debarred-MOCK-GUID"
name="has_debarred-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_debarred-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_debarred-MOCK-GUID"
name="has_debarred-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_debarred-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<span>
<hr
className="section-divider"
/>
<div
className="section-content non-criminal-court-actions"
data-section="LEGAL"
data-subsection="LEGAL_COURT"
>
<h1
className="section-header"
>
Involvement in non-criminal court actions
</h1>
<div
aria-label="In the last ten (10) years, have you been a party to any public record civil court action not listed elsewhere on this form?"
className="field required branch has-court-actions"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last ten (10) years, have you been a party to any public record civil court action not listed elsewhere on this form?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasCourtActions-MOCK-GUID"
name="HasCourtActions-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="HasCourtActions-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasCourtActions-MOCK-GUID"
name="HasCourtActions-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="HasCourtActions-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
<span>
<hr
className="section-divider"
/>
<div
className="section-content legal-technology-unauthorized"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_UNAUTHORIZED"
>
<h1
className="section-header"
>
Unauthorized access
</h1>
<div>
<p>
We note, with reference to this section, that neither your truthful responses nor information derived from your responses to this section will be used as evidence against you in a subsequent criminal proceeding.
</p>
</div>
<div>
<p>
As to this particular section, this applies whether or not you are currently employed by the Federal government. The following questions ask about your use of information technology systems. Information technology systems include all related computer hardware, software, firmware, and data used for the communication, transmission, processing, manipulation, storage or protection of information.
</p>
</div>
<div
aria-label="In the last seven (7) years have you illegally or without proper authorization accessed or attempted to access any information technology system?"
className="field required branch legal-technology-unauthorized-has-unauthorized"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you illegally or without proper authorization accessed or attempted to access any information technology system?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unauthorized-MOCK-GUID"
name="has_unauthorized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_unauthorized-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unauthorized-MOCK-GUID"
name="has_unauthorized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_unauthorized-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-technology-manipulating"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_MANIPULATING"
>
<h1
className="section-header"
>
Manipulating access
</h1>
<div
aria-label="In the last seven (7) years have you illegally or without authorization, modified, destroyed, manipulated, or denied others access to information residing on an information technology system or attempted any of the above?"
className="field required branch legal-technology-manipulating-has-manipulating"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you illegally or without authorization, modified, destroyed, manipulated, or denied others access to information residing on an information technology system or attempted any of the above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_manipulating-MOCK-GUID"
name="has_manipulating-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_manipulating-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_manipulating-MOCK-GUID"
name="has_manipulating-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_manipulating-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-technology-unlawful"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_UNLAWFUL"
>
<h1
className="section-header"
>
Unlawful use
</h1>
<div
aria-label="In the last seven (7) years have you introduced, removed, or used hardware, software, or media in connection with any information technology system without authorization, when specifically prohibited by rules, procedures, guidelines, or regulations or attempted any of the above?"
className="field required branch legal-technology-unlawful-has-unlawful"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you introduced, removed, or used hardware, software, or media in connection with any information technology system without authorization, when specifically prohibited by rules, procedures, guidelines, or regulations or attempted any of the above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unlawful-MOCK-GUID"
name="has_unlawful-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_unlawful-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unlawful-MOCK-GUID"
name="has_unlawful-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_unlawful-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-terrorist"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_TERRORIST_ORGANIZATION"
>
<h1
className="section-header"
>
Terrorist organization
</h1>
<div>
<p>
The following pertain to your associations. You are required to answer the questions fully and truthfully, and your failure to do so could be grounds for an adverse employment, security, or credentialing decision.
</p>
<p>
For the purpose of this question, terrorism is defined as any criminal acts that involve violence or are dangerous to human life and appear to be intended to intimidate or coerce a civilian population to influence the policy of a government by intimidation or coercion or to affect the conduct of a government by mass destruction, assassination or kidnapping.
</p>
</div>
<div
aria-label="Are you now or have you EVER been a member of an organization dedicated to terrorism, either with an awareness of the organization's dedication to that end, or with the specific intent to further such activities?"
className="field required branch legal-associations-terrorist-has-terrorist"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Are you now or have you EVER been a member of an organization dedicated to terrorism, either with an awareness of the organization's dedication to that end, or with the specific intent to further such activities?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorist-MOCK-GUID"
name="has_terrorist-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_terrorist-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorist-MOCK-GUID"
name="has_terrorist-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_terrorist-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-engaged"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ENGAGED_IN_TERRORISM"
>
<h1
className="section-header"
>
Engaged in terrorism
</h1>
<div
aria-label="Have you EVER knowingly engaged in any acts of terrorism?"
className="field required branch legal-associations-engaged-has-engaged"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER knowingly engaged in any acts of terrorism?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_engaged-MOCK-GUID"
name="has_engaged-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_engaged-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_engaged-MOCK-GUID"
name="has_engaged-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_engaged-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-advocating"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ADVOCATING"
>
<h1
className="section-header"
>
Advocating
</h1>
<div
aria-label="Have you EVER advocated any acts of terrorism or activities designed to overthrow the U.S. Government by force?"
className="field required branch legal-associations-advocating-has-advocated"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER advocated any acts of terrorism or activities designed to overthrow the U.S. Government by force?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_advocated-MOCK-GUID"
name="has_advocated-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_advocated-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_advocated-MOCK-GUID"
name="has_advocated-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_advocated-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-overthrow"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_MEMBERSHIP_OVERTHROW"
>
<h1
className="section-header"
>
Membership - overthrow
</h1>
<div
aria-label="Have you EVER been a member of an organization dedicated to the use of violence or force to overthrow the United States Government, and which engaged in activities to that end with an awareness of the organization's dedication to that end or with the specific intent to further such activities?"
className="field required branch legal-associations-overthrow-has-overthrow"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been a member of an organization dedicated to the use of violence or force to overthrow the United States Government, and which engaged in activities to that end with an awareness of the organization's dedication to that end or with the specific intent to further such activities?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_overthrow-MOCK-GUID"
name="has_overthrow-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_overthrow-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_overthrow-MOCK-GUID"
name="has_overthrow-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_overthrow-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-violence"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_MEMBERSHIP_VIOLENCE"
>
<h1
className="section-header"
>
Membership - violence or force
</h1>
<div
aria-label="Have you EVER been a member of an organization that advocates or practices commission of acts of force or violence to discourage others from exercising their rights under the U.S. Constitution or any state of the United States with the specific intent to further such action?"
className="field required branch legal-associations-violence-has-violence"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been a member of an organization that advocates or practices commission of acts of force or violence to discourage others from exercising their rights under the U.S. Constitution or any state of the United States with the specific intent to further such action?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_violence-MOCK-GUID"
name="has_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_violence-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_violence-MOCK-GUID"
name="has_violence-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_violence-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-activities"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_ACTIVITIES_TO_OVERTHROW"
>
<h1
className="section-header"
>
Activities to overthrow
</h1>
<div
aria-label="Have you EVER knowingly engaged in activities designed to overthrow the U.S. Government by force?"
className="field required branch legal-associations-activities-has-activities"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER knowingly engaged in activities designed to overthrow the U.S. Government by force?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_activities-MOCK-GUID"
name="has_activities-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_activities-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_activities-MOCK-GUID"
name="has_activities-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_activities-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content legal-associations-terrorism"
data-section="LEGAL"
data-subsection="LEGAL_ASSOCIATIONS_TERRORISM_ASSOCIATION"
>
<h1
className="section-header"
>
Terrorism association
</h1>
<div
aria-label="Have you EVER associated with anyone involved in activities to further terrorism?"
className="field required branch legal-associations-terrorism-has-terrorism"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER associated with anyone involved in activities to further terrorism?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorsim-MOCK-GUID"
name="has_terrorsim-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_terrorsim-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_terrorsim-MOCK-GUID"
name="has_terrorsim-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_terrorsim-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Terrorism association"
className="btn-cell back"
href="/form/legal/associations/terrorism-association"
onClick={[Function]}
title="Go to previous section Terrorism association"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Terrorism association
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Psychological and emotional health intro"
className="btn-cell next"
href="/form/psychological/intro"
onClick={[Function]}
title="Go to next section Psychological and emotional health intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Psychological and emotional health intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_TECHNOLOGY_MANIPULATING 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-technology/manipulating"
>
<div
className="section-content legal-technology-manipulating"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_MANIPULATING"
>
<h1
className="section-header"
>
Manipulating access
</h1>
<div
aria-label="In the last seven (7) years have you illegally or without authorization, modified, destroyed, manipulated, or denied others access to information residing on an information technology system or attempted any of the above?"
className="field required branch legal-technology-manipulating-has-manipulating"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you illegally or without authorization, modified, destroyed, manipulated, or denied others access to information residing on an information technology system or attempted any of the above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_manipulating-MOCK-GUID"
name="has_manipulating-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_manipulating-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_manipulating-MOCK-GUID"
name="has_manipulating-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_manipulating-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Unauthorized access"
className="btn-cell back"
href="/form/legal/technology/unauthorized"
onClick={[Function]}
title="Go to previous section Unauthorized access"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Unauthorized access
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Unlawful use"
className="btn-cell next"
href="/form/legal/technology/unlawful"
onClick={[Function]}
title="Go to next section Unlawful use"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Unlawful use
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_TECHNOLOGY_UNAUTHORIZED 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-technology/unauthorized"
>
<div
className="section-content legal-technology-unauthorized"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_UNAUTHORIZED"
>
<h1
className="section-header"
>
Unauthorized access
</h1>
<div>
<p>
We note, with reference to this section, that neither your truthful responses nor information derived from your responses to this section will be used as evidence against you in a subsequent criminal proceeding.
</p>
</div>
<div>
<p>
As to this particular section, this applies whether or not you are currently employed by the Federal government. The following questions ask about your use of information technology systems. Information technology systems include all related computer hardware, software, firmware, and data used for the communication, transmission, processing, manipulation, storage or protection of information.
</p>
</div>
<div
aria-label="In the last seven (7) years have you illegally or without proper authorization accessed or attempted to access any information technology system?"
className="field required branch legal-technology-unauthorized-has-unauthorized"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you illegally or without proper authorization accessed or attempted to access any information technology system?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unauthorized-MOCK-GUID"
name="has_unauthorized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_unauthorized-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unauthorized-MOCK-GUID"
name="has_unauthorized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_unauthorized-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Non-criminal court actions"
className="btn-cell back"
href="/form/legal/court"
onClick={[Function]}
title="Go to previous section Non-criminal court actions"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Non-criminal court actions
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Manipulating access"
className="btn-cell next"
href="/form/legal/technology/manipulating"
onClick={[Function]}
title="Go to next section Manipulating access"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Manipulating access
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders LEGAL_TECHNOLOGY_UNLAWFUL 1`] = `
<div
className="legal"
>
<div
className="section-view"
>
<div
className="view view-technology/unlawful"
>
<div
className="section-content legal-technology-unlawful"
data-section="LEGAL"
data-subsection="LEGAL_TECHNOLOGY_UNLAWFUL"
>
<h1
className="section-header"
>
Unlawful use
</h1>
<div
aria-label="In the last seven (7) years have you introduced, removed, or used hardware, software, or media in connection with any information technology system without authorization, when specifically prohibited by rules, procedures, guidelines, or regulations or attempted any of the above?"
className="field required branch legal-technology-unlawful-has-unlawful"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you introduced, removed, or used hardware, software, or media in connection with any information technology system without authorization, when specifically prohibited by rules, procedures, guidelines, or regulations or attempted any of the above?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unlawful-MOCK-GUID"
name="has_unlawful-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_unlawful-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_unlawful-MOCK-GUID"
name="has_unlawful-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_unlawful-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Manipulating access"
className="btn-cell back"
href="/form/legal/technology/manipulating"
onClick={[Function]}
title="Go to previous section Manipulating access"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Manipulating access
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Terrorist organization"
className="btn-cell next"
href="/form/legal/associations/terrorist-organization"
onClick={[Function]}
title="Go to next section Terrorist organization"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Terrorist organization
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_DISCIPLINARY 1`] = `
<div
className="section-view"
>
<div
className="view view-disciplinary"
>
<div
className="section-content disciplinary"
data-section="MILITARY"
data-subsection="MILITARY_DISCIPLINARY"
>
<h1
className="section-header"
>
Disciplinary procedures
</h1>
<div
aria-label="In the last 7 years, have you been subject to court martial or other disciplinary procedure under the Uniform Code of Military Justice (UCMJ), such as Article 15, Captain's mast, Article 135 Court of Inquiry, etc?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last 7 years, have you been subject to court martial or other disciplinary procedure under the Uniform Code of Military Justice (UCMJ), such as Article 15, Captain's mast, Article 135 Court of Inquiry, etc?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_disciplinary-MOCK-GUID"
name="has_disciplinary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_disciplinary-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_disciplinary-MOCK-GUID"
name="has_disciplinary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_disciplinary-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section U.S. military"
className="btn-cell back"
href="/form/military/history"
onClick={[Function]}
title="Go to previous section U.S. military"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
U.S. military
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign military"
className="btn-cell next"
href="/form/military/foreign"
onClick={[Function]}
title="Go to next section Foreign military"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign military
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_FOREIGN 1`] = `
<div
className="section-view"
>
<div
className="view view-foreign"
>
<div
className="section-content foreign"
data-section="MILITARY"
data-subsection="MILITARY_FOREIGN"
>
<h1
className="section-header"
>
Foreign military
</h1>
<div>
<div>
<div
aria-label="Have you ever served, as a civilian or military member in a foreign country's military, intelligence, diplomatic, security forces, militia, other defense force, or government agency?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever served, as a civilian or military member in a foreign country's military, intelligence, diplomatic, security forces, militia, other defense force, or government agency?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign-MOCK-GUID"
name="has_foreign-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign-MOCK-GUID"
name="has_foreign-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Disciplinary procedures"
className="btn-cell back"
href="/form/military/disciplinary"
onClick={[Function]}
title="Go to previous section Disciplinary procedures"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Disciplinary procedures
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review military history"
className="btn-cell next"
href="/form/military/review"
onClick={[Function]}
title="Go to next section Review military history"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review military history
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_HISTORY 1`] = `
<div
className="section-view"
>
<div
className="view view-history"
>
<div
className="section-content military-history"
data-section="MILITARY"
data-subsection="MILITARY_HISTORY"
>
<h1
className="section-header"
>
U.S. military
</h1>
<div
aria-label="Have you ever served in the U.S. Military?"
className="field required branch served"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever served in the U.S. Military?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you ever served in the U.S. Military?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you ever served in the U.S. Military?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="has_served-MOCK-GUID"
name="has_served-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className="checked"
htmlFor="has_served-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_served-MOCK-GUID"
name="has_served-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_served-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of military history
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have additional military service to report?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have additional military service to report?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Selective service record"
className="btn-cell back"
href="/form/military/selective"
onClick={[Function]}
title="Go to previous section Selective service record"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Selective service record
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Disciplinary procedures"
className="btn-cell next"
href="/form/military/disciplinary"
onClick={[Function]}
title="Go to next section Disciplinary procedures"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Disciplinary procedures
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 5: Military history
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your military history and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review citizenship"
className="btn-cell back"
href="/form/citizenship/review"
onClick={[Function]}
title="Go to previous section Review citizenship"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review citizenship
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Selective service record"
className="btn-cell next"
href="/form/military/selective"
onClick={[Function]}
title="Go to next section Selective service record"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Selective service record
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content selective"
data-section="MILITARY"
data-subsection="MILITARY_SELECTIVE"
>
<h1
className="section-header"
>
Selective service record
</h1>
<div
aria-label="Were you born a male after December 31, 1959?"
className="field required branch born"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Were you born a male after December 31, 1959?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Were you born a male after December 31, 1959?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Were you born a male after December 31, 1959?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="was_bornafter-MOCK-GUID"
name="was_bornafter-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="was_bornafter-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="was_bornafter-MOCK-GUID"
name="was_bornafter-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="was_bornafter-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content military-history"
data-section="MILITARY"
data-subsection="MILITARY_HISTORY"
>
<h1
className="section-header"
>
U.S. military
</h1>
<div
aria-label="Have you ever served in the U.S. Military?"
className="field required branch served"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever served in the U.S. Military?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Have you ever served in the U.S. Military?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Have you ever served in the U.S. Military?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="has_served-MOCK-GUID"
name="has_served-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className="checked"
htmlFor="has_served-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_served-MOCK-GUID"
name="has_served-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_served-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of military history
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have additional military service to report?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have additional military service to report?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content disciplinary"
data-section="MILITARY"
data-subsection="MILITARY_DISCIPLINARY"
>
<h1
className="section-header"
>
Disciplinary procedures
</h1>
<div
aria-label="In the last 7 years, have you been subject to court martial or other disciplinary procedure under the Uniform Code of Military Justice (UCMJ), such as Article 15, Captain's mast, Article 135 Court of Inquiry, etc?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last 7 years, have you been subject to court martial or other disciplinary procedure under the Uniform Code of Military Justice (UCMJ), such as Article 15, Captain's mast, Article 135 Court of Inquiry, etc?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_disciplinary-MOCK-GUID"
name="has_disciplinary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_disciplinary-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_disciplinary-MOCK-GUID"
name="has_disciplinary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_disciplinary-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content foreign"
data-section="MILITARY"
data-subsection="MILITARY_FOREIGN"
>
<h1
className="section-header"
>
Foreign military
</h1>
<div>
<div>
<div
aria-label="Have you ever served, as a civilian or military member in a foreign country's military, intelligence, diplomatic, security forces, militia, other defense force, or government agency?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you ever served, as a civilian or military member in a foreign country's military, intelligence, diplomatic, security forces, militia, other defense force, or government agency?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign-MOCK-GUID"
name="has_foreign-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_foreign-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_foreign-MOCK-GUID"
name="has_foreign-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_foreign-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Foreign military"
className="btn-cell back"
href="/form/military/foreign"
onClick={[Function]}
title="Go to previous section Foreign military"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Foreign military
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Foreign intro"
className="btn-cell next"
href="/form/foreign/intro"
onClick={[Function]}
title="Go to next section Foreign intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Foreign intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders MILITARY_SELECTIVE 1`] = `
<div
className="section-view"
>
<div
className="view view-selective"
>
<div
className="section-content selective"
data-section="MILITARY"
data-subsection="MILITARY_SELECTIVE"
>
<h1
className="section-header"
>
Selective service record
</h1>
<div
aria-label="Were you born a male after December 31, 1959?"
className="field required branch born"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Were you born a male after December 31, 1959?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Were you born a male after December 31, 1959?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Were you born a male after December 31, 1959?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="was_bornafter-MOCK-GUID"
name="was_bornafter-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="was_bornafter-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="was_bornafter-MOCK-GUID"
name="was_bornafter-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="was_bornafter-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Military intro"
className="btn-cell back"
href="/form/military/intro"
onClick={[Function]}
title="Go to previous section Military intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Military intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section U.S. military"
className="btn-cell next"
href="/form/military/history"
onClick={[Function]}
title="Go to next section U.S. military"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
U.S. military
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_COMPETENCE 1`] = `
<div
className="section-view"
>
<div
className="view view-competence"
>
<div
className="section-content competence"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_COMPETENCE"
>
<h1
className="section-header"
>
Competence
</h1>
<div
aria-label="Has a court or administrative agency ever issued an order declaring you mentally incompetent?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has a court or administrative agency ever issued an order declaring you mentally incompetent?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Psychological and emotional health intro"
className="btn-cell back"
href="/form/psychological/intro"
onClick={[Function]}
title="Go to previous section Psychological and emotional health intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Psychological and emotional health intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Consultations"
className="btn-cell next"
href="/form/psychological/consultations"
onClick={[Function]}
title="Go to next section Consultations"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Consultations
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_CONDITIONS 1`] = `
<div
className="section-view"
>
<div
className="view view-conditions"
>
<div
className="section-content existingconditions"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_CONDITIONS"
>
<h1
className="section-header"
>
Existing conditions
</h1>
<div
aria-label="Do you have a mental health or other health condition that substantially adversely affects your judgment, reliability, or trustworthiness even if you are not experiencing such symptoms today?"
className="field required branch eapp-field-wrap hascondition"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have a mental health or other health condition that substantially adversely affects your judgment, reliability, or trustworthiness even if you are not experiencing such symptoms today?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Note: If your judgment, reliability, or trustworthiness is not substantially adversely affected by a mental health or other condition, then you should answer
<strong>
"no"
</strong>
even if you have a mental health or other condition requiring treatment.
</p>
<p>
For example, if you are in need of emotional or mental health counseling as a result of service as a first responder, service in a military combat environment, having been sexually assaulted or a victim of domestic violence, or marital issues, but your judgment, reliability or trustworthiness is not substantially adversely affected, then answer
<strong>
"no."
</strong>
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hascondition-MOCK-GUID"
name="hascondition-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hascondition-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hascondition-MOCK-GUID"
name="hascondition-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="hascondition-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Diagnoses"
className="btn-cell back"
href="/form/psychological/diagnoses"
onClick={[Function]}
title="Go to previous section Diagnoses"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Diagnoses
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review"
className="btn-cell next"
href="/form/psychological/review"
onClick={[Function]}
title="Go to next section Review"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_CONSULTATIONS 1`] = `
<div
className="section-view"
>
<div
className="view view-consultations"
>
<div
className="section-content consultation"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_CONSULTATIONS"
>
<h1
className="section-header"
>
Consultations
</h1>
<div
aria-label="Has a court or administrative agency EVER ordered you to consult with a mental health professional?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has a court or administrative agency EVER ordered you to consult with a mental health professional?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
For example, a psychiatrist, psychologist, licensed clinical social worker, etc.
</p>
<p>
An order to a military member by a superior officer is not within the scope of this question, and therefore would not require an affirmative response.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Competence"
className="btn-cell back"
href="/form/psychological/competence"
onClick={[Function]}
title="Go to previous section Competence"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Competence
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Hospitalizations"
className="btn-cell next"
href="/form/psychological/hospitalizations"
onClick={[Function]}
title="Go to next section Hospitalizations"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Hospitalizations
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_DIAGNOSES 1`] = `
<div
className="section-view"
>
<div
className="view view-diagnoses"
>
<div
className="section-content diagnoses"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_DIAGNOSES"
>
<h1
className="section-header"
>
Diagnoses
</h1>
<div>
<p>
The following question asks whether you have been diagnosed with a specified mental health condition that may, particularly if untreated, impact your judgment, reliability, or trustworthiness. If you answer in the affirmative, we will seek additional information about the seriousness and symptoms of the condition, as well as any applicable course of treatment.
</p>
<p>
It is important to note that any such diagnosis, in and of itself,
<strong>
is not a reason
</strong>
to revoke or deny eligibility/or access to classified information or for holding a sensitive position, suitability or fitness to obtain or retain Federal or contract employment, or eligibility for physical or logical access to federally controlled facilities or information systems.
</p>
</div>
<div
aria-label="Have you EVER been diagnosed by a physician or other health professional with psychotic disorder, schizophrenia, schizoaffective disorder, delusional disorder, bipolar mood disorder, borderline personality disorder, or antisocial personality disorder?"
className="field required branch diagnosed"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been diagnosed by a physician or other health professional with psychotic disorder, schizophrenia, schizoaffective disorder, delusional disorder, bipolar mood disorder, borderline personality disorder, or antisocial personality disorder?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Health professional examples: a psychiatrist, psychologist, licensed clinical social worker, or nurse practitioner.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="diagnosed-MOCK-GUID"
name="diagnosed-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="diagnosed-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="diagnosed-MOCK-GUID"
name="diagnosed-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="diagnosed-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Hospitalizations"
className="btn-cell back"
href="/form/psychological/hospitalizations"
onClick={[Function]}
title="Go to previous section Hospitalizations"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Hospitalizations
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Existing conditions"
className="btn-cell next"
href="/form/psychological/conditions"
onClick={[Function]}
title="Go to next section Existing conditions"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Existing conditions
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_HOSPITALIZATIONS 1`] = `
<div
className="section-view"
>
<div
className="view view-hospitalizations"
>
<div
className="section-content hospitalizations"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_HOSPITALIZATIONS"
>
<h1
className="section-header"
>
Hospitalizations
</h1>
<div
aria-label="Have you EVER been hospitalized for a mental health condition?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been hospitalized for a mental health condition?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hospitalized-MOCK-GUID"
name="hospitalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hospitalized-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="hospitalized-MOCK-GUID"
name="hospitalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="hospitalized-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Consultations"
className="btn-cell back"
href="/form/psychological/consultations"
onClick={[Function]}
title="Go to previous section Consultations"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Consultations
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Diagnoses"
className="btn-cell next"
href="/form/psychological/diagnoses"
onClick={[Function]}
title="Go to next section Diagnoses"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Diagnoses
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 10: Psychological and emotional health
</h1>
<div
aria-label="Why we are asking"
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Why we are asking
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<span>
<div>
<p>
The U.S. government recognizes the critical importance of mental health and advocates proactive management of mental health conditions to support the wellness and recovery of Federal employees and others. Every day individuals with mental health conditions carry out their duties without presenting a security risk. While most individuals with mental health conditions do not present security risks, there may be times when such a condition can affect a person’s eligibility for a security clearance.
</p>
</div>
<div>
<p>
Individuals experience a range of reactions to traumatic events. For example, the death of a loved one, divorce, major injury, service in a military combat environment, sexual assault, domestic violence, or other difficult work-related, family, personal, or medical issues may lead to grief, depression, or other responses. The government recognizes that mental health counseling and treatment may provide important support for those who have experienced such events, as well as for those with other mental health conditions. Nothing in this questionnaire is intended to discourage those who might benefit from such treatment from seeking it.
</p>
</div>
<div>
<p>
<strong>
Mental health treatment and counseling, in and of itself, is not a reason to revoke or deny eligibility
</strong>
for access to classified information or for holding a sensitive position, suitability or fitness to obtain or retain Federal or contract employment, or eligibility for physical or logical access to federally controlled facilities or information systems.
</p>
</div>
<div>
<p>
<strong>
Seeking or receiving mental health care for personal wellness and recovery may contribute favorably to decisions about your eligibility.
</strong>
</p>
</div>
</span>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review investigative & criminal history"
className="btn-cell back"
href="/form/legal/review"
onClick={[Function]}
title="Go to previous section Review investigative & criminal history"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review investigative & criminal history
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Competence"
className="btn-cell next"
href="/form/psychological/competence"
onClick={[Function]}
title="Go to next section Competence"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Competence
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders PSYCHOLOGICAL_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content competence"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_COMPETENCE"
>
<h1
className="section-header"
>
Competence
</h1>
<div
aria-label="Has a court or administrative agency ever issued an order declaring you mentally incompetent?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has a court or administrative agency ever issued an order declaring you mentally incompetent?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content consultation"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_CONSULTATIONS"
>
<h1
className="section-header"
>
Consultations
</h1>
<div
aria-label="Has a court or administrative agency EVER ordered you to consult with a mental health professional?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Has a court or administrative agency EVER ordered you to consult with a mental health professional?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
For example, a psychiatrist, psychologist, licensed clinical social worker, etc.
</p>
<p>
An order to a military member by a superior officer is not within the scope of this question, and therefore would not require an affirmative response.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="is_incompetent-MOCK-GUID"
name="is_incompetent-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="is_incompetent-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content hospitalizations"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_HOSPITALIZATIONS"
>
<h1
className="section-header"
>
Hospitalizations
</h1>
<div
aria-label="Have you EVER been hospitalized for a mental health condition?"
className="field required branch"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been hospitalized for a mental health condition?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hospitalized-MOCK-GUID"
name="hospitalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hospitalized-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="hospitalized-MOCK-GUID"
name="hospitalized-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="hospitalized-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content diagnoses"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_DIAGNOSES"
>
<h1
className="section-header"
>
Diagnoses
</h1>
<div>
<p>
The following question asks whether you have been diagnosed with a specified mental health condition that may, particularly if untreated, impact your judgment, reliability, or trustworthiness. If you answer in the affirmative, we will seek additional information about the seriousness and symptoms of the condition, as well as any applicable course of treatment.
</p>
<p>
It is important to note that any such diagnosis, in and of itself,
<strong>
is not a reason
</strong>
to revoke or deny eligibility/or access to classified information or for holding a sensitive position, suitability or fitness to obtain or retain Federal or contract employment, or eligibility for physical or logical access to federally controlled facilities or information systems.
</p>
</div>
<div
aria-label="Have you EVER been diagnosed by a physician or other health professional with psychotic disorder, schizophrenia, schizoaffective disorder, delusional disorder, bipolar mood disorder, borderline personality disorder, or antisocial personality disorder?"
className="field required branch diagnosed"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been diagnosed by a physician or other health professional with psychotic disorder, schizophrenia, schizoaffective disorder, delusional disorder, bipolar mood disorder, borderline personality disorder, or antisocial personality disorder?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Health professional examples: a psychiatrist, psychologist, licensed clinical social worker, or nurse practitioner.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="diagnosed-MOCK-GUID"
name="diagnosed-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="diagnosed-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={true}
className="usa-input-success selected"
disabled={false}
id="diagnosed-MOCK-GUID"
name="diagnosed-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className="checked"
htmlFor="diagnosed-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content existingconditions"
data-section="PSYCHOLOGICAL"
data-subsection="PSYCHOLOGICAL_CONDITIONS"
>
<h1
className="section-header"
>
Existing conditions
</h1>
<div
aria-label="Do you have a mental health or other health condition that substantially adversely affects your judgment, reliability, or trustworthiness even if you are not experiencing such symptoms today?"
className="field required branch eapp-field-wrap hascondition"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have a mental health or other health condition that substantially adversely affects your judgment, reliability, or trustworthiness even if you are not experiencing such symptoms today?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Note: If your judgment, reliability, or trustworthiness is not substantially adversely affected by a mental health or other condition, then you should answer
<strong>
"no"
</strong>
even if you have a mental health or other condition requiring treatment.
</p>
<p>
For example, if you are in need of emotional or mental health counseling as a result of service as a first responder, service in a military combat environment, having been sexually assaulted or a victim of domestic violence, or marital issues, but your judgment, reliability or trustworthiness is not substantially adversely affected, then answer
<strong>
"no."
</strong>
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hascondition-MOCK-GUID"
name="hascondition-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hascondition-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hascondition-MOCK-GUID"
name="hascondition-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="hascondition-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Existing conditions"
className="btn-cell back"
href="/form/psychological/conditions"
onClick={[Function]}
title="Go to previous section Existing conditions"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Existing conditions
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Additional Comments"
className="btn-cell next"
href="/form/package/comments"
onClick={[Function]}
title="Go to next section Additional Comments"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Additional Comments
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_INTRO 1`] = `
<div>
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 3: Relationships
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your personal relationships and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review your history"
className="btn-cell back"
href="/form/history/review"
onClick={[Function]}
title="Go to previous section Review your history"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review your history
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Marital status"
className="btn-cell next"
href="/form/relationships/status/marital"
onClick={[Function]}
title="Go to next section Marital status"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Marital status
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_PEOPLE 1`] = `
<div>
<div
className="section-view"
>
<div
className="view view-people"
>
<div
className="section-content people"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_PEOPLE"
>
<h1
className="section-header"
>
People who know you well
</h1>
<div>
<h3>
Provide three people who know you well and who preferably live in the U.S.
</h3>
<p>
They should be friends, peers, colleagues, college roommates, associates, etc., who are collectively aware of your activities outside of your workplace, school, or neighborhood, and whose combined association with you
<strong>
covers at least the last seven (7) years.
</strong>
</p>
<p>
<strong>
Do not list your spouse, former spouse (s), other relatives, or anyone listed elsewhere on this form.
</strong>
</p>
</div>
<span
id="scrollToPeople"
/>
<div
className="summary-progress"
>
<div
className="summaryprogress progress"
>
<div
className="summary-progress people-summary"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="People who know you well 7 year coverage"
className="svg"
src="/img/people-who-know-you.svg"
/>
</div>
<span
className="title"
>
People who know you well 7 year coverage
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
7
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
</div>
<div
className="summaryprogress counter"
>
<div
className="people-counter"
>
<div
className="count"
>
0/3
</div>
<div
className="unit"
>
People added
</div>
</div>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of people who know you
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional person who knows you well to list?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional person who knows you well to list?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Cohabitant"
className="btn-cell back"
href="/form/relationships/status/cohabitant"
onClick={[Function]}
title="Go to previous section Cohabitant"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Cohabitant
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Relatives"
className="btn-cell next"
href="/form/relationships/relatives"
onClick={[Function]}
title="Go to next section Relatives"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Relatives
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_RELATIVES 1`] = `
<div>
<div
className="section-view"
>
<div
className="view view-relatives"
>
<div
className="section-content relatives"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_RELATIVES"
>
<h1
className="section-header"
>
Relatives
</h1>
<div
aria-label="Add each relative applicable to you, regardless if they are living or deceased."
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Add each relative applicable to you, regardless if they are living or deceased.
</h3>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
An opportunity will be provided to list multiple relatives for each type.
</p>
</div>
</span>
</span>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of relatives
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional relative to enter?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional relative to enter?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section People who know you well"
className="btn-cell back"
href="/form/relationships/people"
onClick={[Function]}
title="Go to previous section People who know you well"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
People who know you well
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review Relationships"
className="btn-cell next"
href="/form/relationships/review"
onClick={[Function]}
title="Go to next section Review Relationships"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review Relationships
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_REVIEW 1`] = `
<div>
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content marital"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_STATUS_MARITAL"
>
<h1
className="section-header"
>
Marital
</h1>
<div
aria-label="Provide your current marital/relationship status with regard to civil marriage, legally recognized civil union, or legally recognized domestic partnership."
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your current marital/relationship status with regard to civil marriage, legally recognized civil union, or legally recognized domestic partnership.
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="blocks status-options option-list option-list-vertical usa-input-error"
>
<div
className="status-never block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="NeverMarried"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Never entered into a civil marriage, legally recognized civil union, or legally recognized domestic partnership
</p>
</div>
</span>
</label>
</div>
<div
className="status-married block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Married"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Currently in a civil marriage, legally recognized civil union, or legally recognized domestic partnership
</p>
</div>
</span>
</label>
</div>
<div
className="status-separated block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Separated"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Separated
</p>
</div>
</span>
</label>
</div>
<div
className="status-annulled block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Annulled"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Annulled
</p>
</div>
</span>
</label>
</div>
<div
className="status-divorced block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Divorced"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Divorced/dissolved
</p>
</div>
</span>
</label>
</div>
<div
className="status-widowed block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Widowed"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Widowed
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content cohabitants"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_STATUS_COHABITANTS"
>
<h1
className="section-header"
>
Cohabitants
</h1>
<div
aria-label="Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
className="field required branch has-cohabitant"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hasCohabitant-MOCK-GUID"
name="hasCohabitant-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hasCohabitant-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hasCohabitant-MOCK-GUID"
name="hasCohabitant-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="hasCohabitant-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content people"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_PEOPLE"
>
<h1
className="section-header"
>
People who know you well
</h1>
<div>
<h3>
Provide three people who know you well and who preferably live in the U.S.
</h3>
<p>
They should be friends, peers, colleagues, college roommates, associates, etc., who are collectively aware of your activities outside of your workplace, school, or neighborhood, and whose combined association with you
<strong>
covers at least the last seven (7) years.
</strong>
</p>
<p>
<strong>
Do not list your spouse, former spouse (s), other relatives, or anyone listed elsewhere on this form.
</strong>
</p>
</div>
<span
id="scrollToPeople"
/>
<div
className="summary-progress"
>
<div
className="summaryprogress progress"
>
<div
className="summary-progress people-summary"
>
<div
className="content"
>
<div>
<div
className="summary-icon"
>
<img
alt="People who know you well 7 year coverage"
className="svg"
src="/img/people-who-know-you.svg"
/>
</div>
<span
className="title"
>
People who know you well 7 year coverage
</span>
</div>
<div
className="progress"
/>
</div>
<div
className="stats"
>
<div
className="fraction"
>
<span
className="completed"
>
0
</span>
<span
className="slash"
>
/
</span>
<span
className="total"
>
7
</span>
</div>
<span
className="unit"
>
Years covered
</span>
</div>
</div>
</div>
<div
className="summaryprogress counter"
>
<div
className="people-counter"
>
<div
className="count"
>
0/3
</div>
<div
className="unit"
>
People added
</div>
</div>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of people who know you
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional person who knows you well to list?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional person who knows you well to list?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content relatives"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_RELATIVES"
>
<h1
className="section-header"
>
Relatives
</h1>
<div
aria-label="Add each relative applicable to you, regardless if they are living or deceased."
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h3
className="title h3"
>
Add each relative applicable to you, regardless if they are living or deceased.
</h3>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
An opportunity will be provided to list multiple relatives for each type.
</p>
</div>
</span>
</span>
</div>
</div>
<div>
<div
className="accordion"
>
<strong
className="aria-description"
>
Summary of relatives
</strong>
<div
className="items"
/>
<div
className="append-button"
/>
</div>
<div
aria-label="Do you have an additional relative to enter?"
className="field required branch addendum"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you have an additional relative to enter?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="radio_input-MOCK-GUID"
name="radio_input-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="radio_input-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Relatives"
className="btn-cell back"
href="/form/relationships/relatives"
onClick={[Function]}
title="Go to previous section Relatives"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Relatives
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Citizenship intro"
className="btn-cell next"
href="/form/citizenship/intro"
onClick={[Function]}
title="Go to next section Citizenship intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Citizenship intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_STATUS_COHABITANTS 1`] = `
<div>
<div
className="section-view"
>
<div
className="view view-status/cohabitant"
>
<div
className="section-content cohabitants"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_STATUS_COHABITANTS"
>
<h1
className="section-header"
>
Cohabitants
</h1>
<div
aria-label="Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
className="field required branch has-cohabitant"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?
</h4>
<span
className="icon"
>
<a
aria-label="Show help for Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
className="toggle h4 adjust-for-buttons"
href="javascript:;"
onClick={[Function]}
title="Show help for Do you presently reside with a person, other than a spouse or legally recognized civil union/domestic partner, with whom you share bonds of affection, obligation, or other commitment, as opposed to a person with whom you live for reasons of convenience?"
>
<svg
alt="Scalable vector graphic"
focusable="false"
height="14.57px"
tabIndex="-1"
viewBox="0 0 14.57 14.57"
width="14.57px"
>
<g>
<path
className="eapp-help-icon"
d="M13.59,3.63c0.65,1.12,0.98,2.34,0.98,3.66s-0.33,2.54-0.98,3.66c-0.65,1.12-1.54,2-2.65,2.65 s-2.33,0.98-3.66,0.98c-1.32,0-2.54-0.33-3.66-0.98s-2-1.54-2.65-2.65C0.33,9.83,0,8.61,0,7.29s0.33-2.54,0.98-3.66 c0.65-1.12,1.54-2,2.65-2.65S5.96,0,7.29,0c1.32,0,2.54,0.33,3.66,0.98S12.94,2.51,13.59,3.63z M10.93,5.46 c0-0.56-0.18-1.07-0.53-1.55c-0.35-0.47-0.79-0.84-1.31-1.1C8.56,2.56,8.03,2.43,7.48,2.43c-1.54,0-2.71,0.67-3.52,2.02 C3.86,4.6,3.89,4.73,4.03,4.85L5.28,5.8c0.04,0.04,0.1,0.06,0.18,0.06c0.1,0,0.18-0.04,0.24-0.11c0.33-0.43,0.61-0.72,0.82-0.87 C6.73,4.71,7,4.64,7.33,4.64c0.3,0,0.57,0.08,0.81,0.25C8.38,5.05,8.5,5.24,8.5,5.45c0,0.24-0.06,0.43-0.19,0.58 C8.18,6.17,7.97,6.31,7.67,6.45C7.27,6.63,6.9,6.9,6.57,7.27c-0.33,0.37-0.5,0.77-0.5,1.19V8.8c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.09,0.22,0.09H8.2c0.09,0,0.16-0.03,0.22-0.09C8.47,8.96,8.5,8.89,8.5,8.8c0-0.12,0.07-0.28,0.2-0.47 c0.14-0.19,0.31-0.35,0.52-0.47c0.2-0.11,0.36-0.21,0.46-0.27s0.25-0.18,0.44-0.33c0.18-0.15,0.32-0.31,0.42-0.46 c0.1-0.15,0.19-0.34,0.27-0.57C10.89,6,10.93,5.74,10.93,5.46z M8.5,11.84v-1.82c0-0.09-0.03-0.16-0.08-0.22 C8.36,9.74,8.29,9.71,8.2,9.71H6.38c-0.09,0-0.16,0.03-0.22,0.08C6.1,9.86,6.07,9.93,6.07,10.02v1.82c0,0.09,0.03,0.16,0.09,0.22 c0.06,0.06,0.13,0.08,0.22,0.08H8.2c0.09,0,0.16-0.03,0.22-0.08C8.47,12,8.5,11.93,8.5,11.84z"
/>
</g>
</svg>
</a>
</span>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hasCohabitant-MOCK-GUID"
name="hasCohabitant-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="hasCohabitant-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="hasCohabitant-MOCK-GUID"
name="hasCohabitant-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="hasCohabitant-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Marital status"
className="btn-cell back"
href="/form/relationships/status/marital"
onClick={[Function]}
title="Go to previous section Marital status"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Marital status
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section People who know you well"
className="btn-cell next"
href="/form/relationships/people"
onClick={[Function]}
title="Go to next section People who know you well"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
People who know you well
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders RELATIONSHIPS_STATUS_MARITAL 1`] = `
<div>
<div
className="section-view"
>
<div
className="view view-status/marital"
>
<div
className="section-content marital"
data-section="RELATIONSHIPS"
data-subsection="RELATIONSHIPS_STATUS_MARITAL"
>
<h1
className="section-header"
>
Marital
</h1>
<div
aria-label="Provide your current marital/relationship status with regard to civil marriage, legally recognized civil union, or legally recognized domestic partnership."
className="field required"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Provide your current marital/relationship status with regard to civil marriage, legally recognized civil union, or legally recognized domestic partnership.
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div
className="blocks status-options option-list option-list-vertical"
>
<div
className="status-never block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="NeverMarried"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Never entered into a civil marriage, legally recognized civil union, or legally recognized domestic partnership
</p>
</div>
</span>
</label>
</div>
<div
className="status-married block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Married"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Currently in a civil marriage, legally recognized civil union, or legally recognized domestic partnership
</p>
</div>
</span>
</label>
</div>
<div
className="status-separated block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Separated"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Separated
</p>
</div>
</span>
</label>
</div>
<div
className="status-annulled block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Annulled"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Annulled
</p>
</div>
</span>
</label>
</div>
<div
className="status-divorced block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Divorced"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Divorced/dissolved
</p>
</div>
</span>
</label>
</div>
<div
className="status-widowed block"
>
<input
aria-label="[object Object] for null"
checked={false}
className="usa-input-success"
disabled={false}
id="status-MOCK-GUID-status-MOCK-GUID"
name="status-MOCK-GUID-status-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Widowed"
/>
<label
className=""
htmlFor="status-MOCK-GUID-status-MOCK-GUID"
>
<span>
<div>
<p>
Widowed
</p>
</div>
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Relationships intro"
className="btn-cell back"
href="/form/relationships/intro"
onClick={[Function]}
title="Go to previous section Relationships intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Relationships intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Cohabitant"
className="btn-cell next"
href="/form/relationships/status/cohabitant"
onClick={[Function]}
title="Go to next section Cohabitant"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Cohabitant
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_ALCOHOL_ADDITIONAL 1`] = `
<div
className="section-view"
>
<div
className="view view-alcohol/additional"
>
<div
className="section-content received-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_ADDITIONAL"
>
<h1
className="section-header"
>
Additional instances
</h1>
<div
aria-label="Have you EVER received counseling or treatment as a result of your use of alcohol in addition to what you have already listed on this form?"
className="field required branch received-treatment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER received counseling or treatment as a result of your use of alcohol in addition to what you have already listed on this form?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="ReceivedTreatment-MOCK-GUID"
name="ReceivedTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="ReceivedTreatment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="ReceivedTreatment-MOCK-GUID"
name="ReceivedTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="ReceivedTreatment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Voluntary counseling or treatment"
className="btn-cell back"
href="/form/substance/alcohol/voluntary"
onClick={[Function]}
title="Go to previous section Voluntary counseling or treatment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Voluntary counseling or treatment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Review substance use"
className="btn-cell next"
href="/form/substance/review"
onClick={[Function]}
title="Go to next section Review substance use"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Review substance use
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_ALCOHOL_NEGATIVE 1`] = `
<div
className="section-view"
>
<div
className="view view-alcohol/negative"
>
<div
className="section-content negative-impacts"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_NEGATIVE"
>
<h1
className="section-header"
>
Negative impact
</h1>
<div
aria-label="In the last seven (7) years has your use of alcohol had a negative impact on your work performance, your professional or personal relationships, your finances, or resulted in intervention by law enforcement/public safety personnel?"
className="field required branch has-impacts"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years has your use of alcohol had a negative impact on your work performance, your professional or personal relationships, your finances, or resulted in intervention by law enforcement/public safety personnel?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_impacts-MOCK-GUID"
name="has_impacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_impacts-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_impacts-MOCK-GUID"
name="has_impacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_impacts-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Voluntary counseling or treatment"
className="btn-cell back"
href="/form/substance/drugs/voluntary"
onClick={[Function]}
title="Go to previous section Voluntary counseling or treatment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Voluntary counseling or treatment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Mandatory counseling or treatment"
className="btn-cell next"
href="/form/substance/alcohol/ordered"
onClick={[Function]}
title="Go to next section Mandatory counseling or treatment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Mandatory counseling or treatment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_ALCOHOL_ORDERED 1`] = `
<div
className="section-view"
>
<div
className="view view-alcohol/ordered"
>
<div
className="section-content ordered-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_ORDERED"
>
<h1
className="section-header"
>
Mandatory counseling or treatment
</h1>
<div
aria-label="Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your use of alcohol?"
className="field required branch has-been-ordered"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your use of alcohol?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasBeenOrdered-MOCK-GUID"
name="HasBeenOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="HasBeenOrdered-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasBeenOrdered-MOCK-GUID"
name="HasBeenOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="HasBeenOrdered-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Negative impact"
className="btn-cell back"
href="/form/substance/alcohol/negative"
onClick={[Function]}
title="Go to previous section Negative impact"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Negative impact
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Voluntary counseling or treatment"
className="btn-cell next"
href="/form/substance/alcohol/voluntary"
onClick={[Function]}
title="Go to next section Voluntary counseling or treatment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Voluntary counseling or treatment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_ALCOHOL_VOLUNTARY 1`] = `
<div
className="section-view"
>
<div
className="view view-alcohol/voluntary"
>
<div
className="section-content voluntary-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_VOLUNTARY"
>
<h1
className="section-header"
>
Voluntary counseling or treatment
</h1>
<div
aria-label="Have you EVER voluntarily sought counseling or treatment as a result of your use of alcohol?"
className="field required branch sought-treatment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voluntarily sought counseling or treatment as a result of your use of alcohol?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="SoughtTreatment-MOCK-GUID"
name="SoughtTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="SoughtTreatment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="SoughtTreatment-MOCK-GUID"
name="SoughtTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="SoughtTreatment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Mandatory counseling or treatment"
className="btn-cell back"
href="/form/substance/alcohol/ordered"
onClick={[Function]}
title="Go to previous section Mandatory counseling or treatment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Mandatory counseling or treatment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Additional instances"
className="btn-cell next"
href="/form/substance/alcohol/additional"
onClick={[Function]}
title="Go to next section Additional instances"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Additional instances
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_CLEARANCE 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/clearance"
>
<div
className="section-content drug-clearance-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_CLEARANCE"
>
<h1
className="section-header"
>
Security clearance position
</h1>
<div
aria-label="Have you EVER illegally used or otherwise been illegally involved with a drug or controlled substance while possessing a security clearance other than previously listed?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER illegally used or otherwise been illegally involved with a drug or controlled substance while possessing a security clearance other than previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Purchase"
className="btn-cell back"
href="/form/substance/drugs/purchase"
onClick={[Function]}
title="Go to previous section Purchase"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Purchase
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Public safety position"
className="btn-cell next"
href="/form/substance/drugs/publicsafety"
onClick={[Function]}
title="Go to next section Public safety position"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Public safety position
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_MISUSE 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/misuse"
>
<div
className="section-content prescription-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_MISUSE"
>
<h1
className="section-header"
>
Prescription drug misuse
</h1>
<div
aria-label="In the last seven (7) years have you intentionally engaged in the misuse of prescription drugs, regardless of whether or not the drugs were prescribed for you or someone else?"
className="field required branch misused"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you intentionally engaged in the misuse of prescription drugs, regardless of whether or not the drugs were prescribed for you or someone else?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Misused-MOCK-GUID"
name="Misused-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="Misused-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Misused-MOCK-GUID"
name="Misused-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="Misused-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Public safety position"
className="btn-cell back"
href="/form/substance/drugs/publicsafety"
onClick={[Function]}
title="Go to previous section Public safety position"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Public safety position
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Mandatory counseling or treatment"
className="btn-cell next"
href="/form/substance/drugs/ordered"
onClick={[Function]}
title="Go to next section Mandatory counseling or treatment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Mandatory counseling or treatment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_ORDERED 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/ordered"
>
<div
className="section-content ordered-treatments"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_ORDERED"
>
<h1
className="section-header"
>
Mandatory counseling or treatment
</h1>
<div
aria-label="Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your illegal use of drugs or controlled substances?"
className="field required branch treatment-ordered"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your illegal use of drugs or controlled substances?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentOrdered-MOCK-GUID"
name="TreatmentOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="TreatmentOrdered-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentOrdered-MOCK-GUID"
name="TreatmentOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="TreatmentOrdered-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Prescription drug misuse"
className="btn-cell back"
href="/form/substance/drugs/misuse"
onClick={[Function]}
title="Go to previous section Prescription drug misuse"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Prescription drug misuse
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Voluntary counseling or treatment"
className="btn-cell next"
href="/form/substance/drugs/voluntary"
onClick={[Function]}
title="Go to next section Voluntary counseling or treatment"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Voluntary counseling or treatment
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_PUBLIC_SAFETY 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/publicsafety"
>
<div
className="section-content drug-public-safety-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_PUBLIC_SAFETY"
>
<h1
className="section-header"
>
Public safety position
</h1>
<div
aria-label="Have you EVER illegally used or otherwise been involved with a drug or controlled substance while employed as a law enforcement officer, prosecutor, or courtroom official; or while in a position directly and immediately affecting the public safety other than previously listed?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER illegally used or otherwise been involved with a drug or controlled substance while employed as a law enforcement officer, prosecutor, or courtroom official; or while in a position directly and immediately affecting the public safety other than previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Security clearance position"
className="btn-cell back"
href="/form/substance/drugs/clearance"
onClick={[Function]}
title="Go to previous section Security clearance position"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Security clearance position
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Prescription drug misuse"
className="btn-cell next"
href="/form/substance/drugs/misuse"
onClick={[Function]}
title="Go to next section Prescription drug misuse"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Prescription drug misuse
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_PURCHASE 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/purchase"
>
<div
className="section-content drug-involvements"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_PURCHASE"
>
<h1
className="section-header"
>
Purchase
</h1>
<div
aria-label="In the last seven (7) years, have you been involved in the illegal purchase, manufacture, cultivation, trafficking, production, transfer, shipping, receiving, handling or sale of any drug or controlled substance?"
className="field required branch involved"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years, have you been involved in the illegal purchase, manufacture, cultivation, trafficking, production, transfer, shipping, receiving, handling or sale of any drug or controlled substance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Involved-MOCK-GUID"
name="Involved-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="Involved-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Involved-MOCK-GUID"
name="Involved-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="Involved-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Usage"
className="btn-cell back"
href="/form/substance/drugs/usage"
onClick={[Function]}
title="Go to previous section Usage"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Usage
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Security clearance position"
className="btn-cell next"
href="/form/substance/drugs/clearance"
onClick={[Function]}
title="Go to next section Security clearance position"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Security clearance position
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_USAGE 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/usage"
>
<div
className="section-content drug-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_USAGE"
>
<h1
className="section-header"
>
Usage
</h1>
<div>
<p>
We note, with reference to this section, that neither your truthful responses nor information derived from your responses to this section will be used as evidence against you in a subsequent criminal proceeding. This particular section applies whether or not you are currently employed by the Federal government. The following questions pertain to the illegal use of drugs or controlled substances or drug or controlled substance activity not in accordance with Federal laws, even though permissible under state laws.
</p>
</div>
<div
aria-label="In the last seven (7) years, have you illegally used any drugs or controlled substances?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years, have you illegally used any drugs or controlled substances?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Use of a drug or controlled substance includes injecting, snorting, inhaling, swallowing, experimenting with or otherwise consuming any drug or controlled substance.
</p>
</div>
</div>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Substance use intro"
className="btn-cell back"
href="/form/substance/intro"
onClick={[Function]}
title="Go to previous section Substance use intro"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Substance use intro
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Purchase"
className="btn-cell next"
href="/form/substance/drugs/purchase"
onClick={[Function]}
title="Go to next section Purchase"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Purchase
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_DRUGS_VOLUNTARY 1`] = `
<div
className="section-view"
>
<div
className="view view-drugs/voluntary"
>
<div
className="section-content voluntary-treatments"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_VOLUNTARY"
>
<h1
className="section-header"
>
Voluntary counseling or treatment
</h1>
<div
aria-label="Have you EVER voluntarily sought counseling or treatment as a result of your use of a drug or controlled substance?"
className="field required branch treatment-voluntary"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voluntarily sought counseling or treatment as a result of your use of a drug or controlled substance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentVoluntary-MOCK-GUID"
name="TreatmentVoluntary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="TreatmentVoluntary-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentVoluntary-MOCK-GUID"
name="TreatmentVoluntary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="TreatmentVoluntary-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Mandatory counseling or treatment"
className="btn-cell back"
href="/form/substance/drugs/ordered"
onClick={[Function]}
title="Go to previous section Mandatory counseling or treatment"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Mandatory counseling or treatment
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Negative impact"
className="btn-cell next"
href="/form/substance/alcohol/negative"
onClick={[Function]}
title="Go to next section Negative impact"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Negative impact
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_INTRO 1`] = `
<div
className="section-view"
>
<div
className="view view-intro"
>
<div>
<h1
className="section-header"
>
Section 8: Substance use
</h1>
<div
aria-label=""
className="field no-margin-bottom"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
/>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component"
>
<div>
<p>
You will be asked questions about your substance use and be asked to provide details if necessary.
</p>
</div>
</span>
</span>
</div>
</div>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Review Financial record"
className="btn-cell back"
href="/form/financial/review"
onClick={[Function]}
title="Go to previous section Review Financial record"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Review Financial record
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Usage"
className="btn-cell next"
href="/form/substance/drugs/usage"
onClick={[Function]}
title="Go to next section Usage"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Usage
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;
exports[`The section component renders SUBSTANCE_USE_REVIEW 1`] = `
<div
className="section-view"
>
<h1
className="title"
>
Review your answers
</h1>
<div>
<p>
View the full section to make sure everything looks right and make changes if needed.
</p>
</div>
<div
className="view view-review"
>
<div
className="top-btns"
/>
<div>
<div
className="section-content drug-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_USAGE"
>
<h1
className="section-header"
>
Usage
</h1>
<div>
<p>
We note, with reference to this section, that neither your truthful responses nor information derived from your responses to this section will be used as evidence against you in a subsequent criminal proceeding. This particular section applies whether or not you are currently employed by the Federal government. The following questions pertain to the illegal use of drugs or controlled substances or drug or controlled substance activity not in accordance with Federal laws, even though permissible under state laws.
</p>
</div>
<div
aria-label="In the last seven (7) years, have you illegally used any drugs or controlled substances?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years, have you illegally used any drugs or controlled substances?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
>
<div>
<p>
Use of a drug or controlled substance includes injecting, snorting, inhaling, swallowing, experimenting with or otherwise consuming any drug or controlled substance.
</p>
</div>
</div>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content drug-involvements"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_PURCHASE"
>
<h1
className="section-header"
>
Purchase
</h1>
<div
aria-label="In the last seven (7) years, have you been involved in the illegal purchase, manufacture, cultivation, trafficking, production, transfer, shipping, receiving, handling or sale of any drug or controlled substance?"
className="field required branch involved"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years, have you been involved in the illegal purchase, manufacture, cultivation, trafficking, production, transfer, shipping, receiving, handling or sale of any drug or controlled substance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Involved-MOCK-GUID"
name="Involved-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="Involved-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Involved-MOCK-GUID"
name="Involved-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="Involved-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<span>
<hr
className="section-divider"
/>
<div
className="section-content drug-clearance-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_CLEARANCE"
>
<h1
className="section-header"
>
Security clearance position
</h1>
<div
aria-label="Have you EVER illegally used or otherwise been illegally involved with a drug or controlled substance while possessing a security clearance other than previously listed?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER illegally used or otherwise been illegally involved with a drug or controlled substance while possessing a security clearance other than previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
<span>
<hr
className="section-divider"
/>
<div
className="section-content drug-public-safety-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_PUBLIC_SAFETY"
>
<h1
className="section-header"
>
Public safety position
</h1>
<div
aria-label="Have you EVER illegally used or otherwise been involved with a drug or controlled substance while employed as a law enforcement officer, prosecutor, or courtroom official; or while in a position directly and immediately affecting the public safety other than previously listed?"
className="field required branch used-drugs"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER illegally used or otherwise been involved with a drug or controlled substance while employed as a law enforcement officer, prosecutor, or courtroom official; or while in a position directly and immediately affecting the public safety other than previously listed?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="UsedDrugs-MOCK-GUID"
name="UsedDrugs-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="UsedDrugs-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
<hr
className="section-divider"
/>
<div
className="section-content prescription-uses"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_MISUSE"
>
<h1
className="section-header"
>
Prescription drug misuse
</h1>
<div
aria-label="In the last seven (7) years have you intentionally engaged in the misuse of prescription drugs, regardless of whether or not the drugs were prescribed for you or someone else?"
className="field required branch misused"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years have you intentionally engaged in the misuse of prescription drugs, regardless of whether or not the drugs were prescribed for you or someone else?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Misused-MOCK-GUID"
name="Misused-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="Misused-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="Misused-MOCK-GUID"
name="Misused-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="Misused-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content ordered-treatments"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_ORDERED"
>
<h1
className="section-header"
>
Mandatory counseling or treatment
</h1>
<div
aria-label="Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your illegal use of drugs or controlled substances?"
className="field required branch treatment-ordered"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your illegal use of drugs or controlled substances?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentOrdered-MOCK-GUID"
name="TreatmentOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="TreatmentOrdered-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentOrdered-MOCK-GUID"
name="TreatmentOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="TreatmentOrdered-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content voluntary-treatments"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_DRUGS_VOLUNTARY"
>
<h1
className="section-header"
>
Voluntary counseling or treatment
</h1>
<div
aria-label="Have you EVER voluntarily sought counseling or treatment as a result of your use of a drug or controlled substance?"
className="field required branch treatment-voluntary"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voluntarily sought counseling or treatment as a result of your use of a drug or controlled substance?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentVoluntary-MOCK-GUID"
name="TreatmentVoluntary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="TreatmentVoluntary-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="TreatmentVoluntary-MOCK-GUID"
name="TreatmentVoluntary-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="TreatmentVoluntary-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<span>
<hr
className="section-divider"
/>
<div
className="section-content negative-impacts"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_NEGATIVE"
>
<h1
className="section-header"
>
Negative impact
</h1>
<div
aria-label="In the last seven (7) years has your use of alcohol had a negative impact on your work performance, your professional or personal relationships, your finances, or resulted in intervention by law enforcement/public safety personnel?"
className="field required branch has-impacts"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
In the last seven (7) years has your use of alcohol had a negative impact on your work performance, your professional or personal relationships, your finances, or resulted in intervention by law enforcement/public safety personnel?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_impacts-MOCK-GUID"
name="has_impacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="has_impacts-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="has_impacts-MOCK-GUID"
name="has_impacts-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="has_impacts-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content ordered-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_ORDERED"
>
<h1
className="section-header"
>
Mandatory counseling or treatment
</h1>
<div
aria-label="Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your use of alcohol?"
className="field required branch has-been-ordered"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER been ordered, advised, or asked to seek counseling or treatment as a result of your use of alcohol?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasBeenOrdered-MOCK-GUID"
name="HasBeenOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="HasBeenOrdered-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="HasBeenOrdered-MOCK-GUID"
name="HasBeenOrdered-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="HasBeenOrdered-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content voluntary-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_VOLUNTARY"
>
<h1
className="section-header"
>
Voluntary counseling or treatment
</h1>
<div
aria-label="Have you EVER voluntarily sought counseling or treatment as a result of your use of alcohol?"
className="field required branch sought-treatment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER voluntarily sought counseling or treatment as a result of your use of alcohol?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="SoughtTreatment-MOCK-GUID"
name="SoughtTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="SoughtTreatment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="SoughtTreatment-MOCK-GUID"
name="SoughtTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="SoughtTreatment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
<hr
className="section-divider"
/>
<div
className="section-content received-counselings"
data-section="SUBSTANCE_USE"
data-subsection="SUBSTANCE_USE_ALCOHOL_ADDITIONAL"
>
<h1
className="section-header"
>
Additional instances
</h1>
<div
aria-label="Have you EVER received counseling or treatment as a result of your use of alcohol in addition to what you have already listed on this form?"
className="field required branch received-treatment"
data-uuid="field-MOCK-GUID"
>
<a
aria-hidden="true"
className="anchor"
id="field-MOCK-GUID"
name="field-MOCK-GUID"
/>
<h4
className="title h4"
>
Have you EVER received counseling or treatment as a result of your use of alcohol in addition to what you have already listed on this form?
</h4>
<span
className="icon"
/>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages help-messages"
/>
</div>
<div
className="table expand"
>
<span
aria-live="polite"
className="messages error-messages"
role="alert"
>
<div
aria-live="polite"
className="message error usa-alert usa-alert-error"
role="alert"
>
<div
className="usa-alert-body"
>
<div
data-i18n="error.required"
>
<h5
className="usa-alert-heading"
>
Your response is required
</h5>
</div>
</div>
</div>
</span>
</div>
<div
className="table"
>
<span
className="content"
>
<span
className="component shrink"
>
<div
className="content"
/>
<div
className="blocks option-list branch usa-input-error"
>
<div
className="yes block"
>
<input
aria-label="Yes for null"
checked={false}
className="usa-input-success"
disabled={false}
id="ReceivedTreatment-MOCK-GUID"
name="ReceivedTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="Yes"
/>
<label
className=""
htmlFor="ReceivedTreatment-MOCK-GUID"
>
<span>
Yes
</span>
</label>
</div>
<div
className="no block"
>
<input
aria-label="No for null"
checked={false}
className="usa-input-success"
disabled={false}
id="ReceivedTreatment-MOCK-GUID"
name="ReceivedTreatment-MOCK-GUID"
onBlur={[Function]}
onChange={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
type="radio"
value="No"
/>
<label
className=""
htmlFor="ReceivedTreatment-MOCK-GUID"
>
<span>
No
</span>
</label>
</div>
</div>
</span>
</span>
</div>
</div>
</div>
</span>
</div>
<div
className="bottom-btns"
>
<div
className="btn-wrap"
>
<div
className="btn-container"
>
<a
aria-label="Go to previous section Additional instances"
className="btn-cell back"
href="/form/substance/alcohol/additional"
onClick={[Function]}
title="Go to previous section Additional instances"
>
<div
className="actions back"
>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-left"
/>
</div>
<div
className="text"
>
<div
className="direction"
>
Back
</div>
<div
className="label"
>
Additional instances
</div>
</div>
</div>
</a>
<div
className="btn-spacer"
/>
<a
aria-label="Go to next section Investigative and criminal history intro"
className="btn-cell next"
href="/form/legal/intro"
onClick={[Function]}
title="Go to next section Investigative and criminal history intro"
>
<div
className="actions next"
>
<div
className="text"
>
<div
className="direction"
>
Next
</div>
<div
className="label"
>
Investigative and criminal history intro
</div>
</div>
<div
className="icon"
>
<i
aria-hidden="true"
className="fa fa-arrow-circle-right"
/>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
`;