src/Components/CompareList/__snapshots__/CompareList.test.jsx.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`CompareListComponent matches snapshot 1`] = `
<div
className="usa-grid-full content-container comparison-outer-container"
>
<div>
<Connect(withRouter(BackButton))
blacklistMatcher="/compare"
ignoreCurrentPath={true}
/>
</div>
<div
className="comparison-container"
>
<h1>
Compare Positions
</h1>
<div
className="comparison-table-container"
>
<table
className="tm-table"
>
<caption
className="usa-sr-only"
>
Position details comparison:
</caption>
<thead
className="usa-sr-only"
>
<tr>
<th
scope="row"
>
Position
</th>
<th
key="1"
>
<div
className="column-title-main"
/>
</th>
<th
key="2"
>
<div
className="column-title-main"
/>
</th>
<th
className="empty"
key="3"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="4"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="5"
>
Return to search results and add more positions to compare.
</th>
</tr>
</thead>
<tbody>
<tr>
<th
scope="row"
>
Position
</th>
<td
key="6"
>
<div
className="usa-grid-full"
>
<div
className="column-title-main"
>
OMS (DCM)
</div>
<div
className="close-button-container"
>
<CompareCheck
as="div"
className=""
customElement={
<FontAwesome
name="close"
/>
}
interactiveElementProps={
Object {
"title": "Remove this comparison",
}
}
limit={5}
onToggle={[Function]}
refKey={1}
type="compare"
/>
</div>
</div>
<span
aria-labelledby="1 0 0 3 4 0 0 1"
>
10034001
</span>
</td>
<td
key="7"
>
<div
className="usa-grid-full"
>
<div
className="column-title-main"
>
SPECIAL AGENT
</div>
<div
className="close-button-container"
>
<CompareCheck
as="div"
className=""
customElement={
<FontAwesome
name="close"
/>
}
interactiveElementProps={
Object {
"title": "Remove this comparison",
}
}
limit={5}
onToggle={[Function]}
refKey={2}
type="compare"
/>
</div>
</div>
<span
aria-labelledby="5 6 0 8 2 0 0 0"
>
56082000
</span>
</td>
<th
className="empty"
key="8"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="9"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="10"
>
Return to search results and add more positions to compare.
</th>
</tr>
<tr>
<th
scope="row"
>
Link to details
</th>
<td
key="11"
>
<div
className="column-title-link"
>
<Link
replace={false}
to="/details/1"
>
View position
</Link>
</div>
</td>
<td
key="12"
>
<div
className="column-title-link"
>
<Link
replace={false}
to="/details/2"
>
View position
</Link>
</div>
</td>
<td
className="empty"
key="13"
/>
<td
className="empty"
key="14"
/>
<td
className="empty"
key="15"
/>
</tr>
<tr>
<th
scope="row"
>
Bid Count
</th>
<td
key="16"
>
<span
className="bid-stats"
>
<BidCount
altStyle={true}
bidStatistics={Object {}}
hideLabel={true}
isCondensed={false}
isTandemTwo={false}
label="Bid Count"
/>
</span>
</td>
<td
key="17"
>
<span
className="bid-stats"
>
<BidCount
altStyle={true}
bidStatistics={Object {}}
hideLabel={true}
isCondensed={false}
isTandemTwo={false}
label="Bid Count"
/>
</span>
</td>
<td
className="empty"
key="18"
/>
<td
className="empty"
key="19"
/>
<td
className="empty"
key="20"
/>
</tr>
<tr>
<th
scope="row"
>
Location
</th>
<td
key="21"
>
Freetown, Sierra Leone
</td>
<td
key="22"
>
Chicago, IL
</td>
<td
className="empty"
key="23"
/>
<td
className="empty"
key="24"
/>
<td
className="empty"
key="25"
/>
</tr>
<tr>
<th
scope="row"
>
TED
</th>
<td
key="26"
>
None listed
</td>
<td
key="27"
>
None listed
</td>
<td
className="empty"
key="28"
/>
<td
className="empty"
key="29"
/>
<td
className="empty"
key="30"
/>
</tr>
<tr>
<th
scope="row"
>
Skill
</th>
<td
key="31"
>
None listed
</td>
<td
key="32"
>
SECURITY (2501)
</td>
<td
className="empty"
key="33"
/>
<td
className="empty"
key="34"
/>
<td
className="empty"
key="35"
/>
</tr>
<tr>
<th
scope="row"
>
Grade
</th>
<td
key="36"
>
06
</td>
<td
key="37"
>
04
</td>
<td
className="empty"
key="38"
/>
<td
className="empty"
key="39"
/>
<td
className="empty"
key="40"
/>
</tr>
<tr>
<th
scope="row"
>
Bureau
</th>
<td
key="41"
>
None listed
</td>
<td
key="42"
>
(WHA) BUREAU OF WESTERN HEMISPHERIC AFFAIRS
</td>
<td
className="empty"
key="43"
/>
<td
className="empty"
key="44"
/>
<td
className="empty"
key="45"
/>
</tr>
<tr>
<th
scope="row"
>
Tour of Duty
</th>
<td
key="46"
>
None listed
</td>
<td
key="47"
>
2 YRS (2 R & R)
</td>
<td
className="empty"
key="48"
/>
<td
className="empty"
key="49"
/>
<td
className="empty"
key="50"
/>
</tr>
<tr>
<th
scope="row"
>
Language
</th>
<td
key="51"
>
<LanguageList
languages={Array []}
propToUse="representation"
/>
</td>
<td
key="52"
>
<LanguageList
languages={
Array [
Object {
"id": 1,
"language": "French (FR)",
"reading_proficiency": "2",
"representation": "French (FR) 2/2",
"spoken_proficiency": "2",
},
Object {
"id": 20,
"language": "Haitian Creole (HC)",
"reading_proficiency": "0",
"representation": "Haitian Creole (HC) 0/0",
"spoken_proficiency": "0",
},
]
}
propToUse="representation"
/>
</td>
<td
className="empty"
key="53"
/>
<td
className="empty"
key="54"
/>
<td
className="empty"
key="55"
/>
</tr>
<tr>
<th
scope="row"
>
Post Differential | Danger Pay
</th>
<td
key="56"
>
<DefinitionList
dangerPay={0}
obcUrl={Object {}}
postDifferential={30}
/>
</td>
<td
key="57"
>
<DefinitionList
dangerPay={15}
obcUrl={Object {}}
postDifferential={20}
/>
</td>
<td
className="empty"
key="58"
/>
<td
className="empty"
key="59"
/>
<td
className="empty"
key="60"
/>
</tr>
<tr>
<th
scope="row"
>
Favorite
</th>
<td
key="61"
>
<Connect(FavoriteContainer)
compareArray={Array []}
hasBorder={true}
refKey={1}
refresh={true}
useButtonClass={true}
useButtonClassSecondary={true}
/>
</td>
<td
key="62"
>
<Connect(FavoriteContainer)
compareArray={Array []}
hasBorder={true}
refKey={2}
refresh={true}
useButtonClass={true}
useButtonClassSecondary={true}
/>
</td>
<td
className="empty"
key="63"
/>
<td
className="empty"
key="64"
/>
<td
className="empty"
key="65"
/>
</tr>
<tr>
<th
scope="row"
/>
<MediaQueryWrapper
breakpoint="screenLgMin"
widthType="min"
>
<Component />
</MediaQueryWrapper>
<MediaQueryWrapper
breakpoint="screenLgMin"
widthType="min"
>
<Component />
</MediaQueryWrapper>
<td
className="empty"
key="66"
/>
<td
className="empty"
key="67"
/>
<td
className="empty"
key="68"
/>
</tr>
</tbody>
</table>
</div>
</div>
</div>
`;
exports[`CompareListComponent matches snapshot when isLoading is true 1`] = `
<div
className="usa-grid-full content-container comparison-outer-container"
>
<div>
<Connect(withRouter(BackButton))
blacklistMatcher="/compare"
ignoreCurrentPath={true}
/>
</div>
<div
className="comparison-container"
>
<h1>
Compare Positions
</h1>
<Spinner
size="big"
style={Object {}}
type="homepage-position-results"
/>
</div>
</div>
`;
exports[`CompareListComponent matches snapshot when there is an obc id 1`] = `
<div
className="usa-grid-full content-container comparison-outer-container"
>
<div>
<Connect(withRouter(BackButton))
blacklistMatcher="/compare"
ignoreCurrentPath={true}
/>
</div>
<div
className="comparison-container"
>
<h1>
Compare Positions
</h1>
<div
className="comparison-table-container"
>
<table
className="tm-table"
>
<caption
className="usa-sr-only"
>
Position details comparison:
</caption>
<thead
className="usa-sr-only"
>
<tr>
<th
scope="row"
>
Position
</th>
<th
key="1"
>
<div
className="column-title-main"
/>
</th>
<th
key="2"
>
<div
className="column-title-main"
/>
</th>
<th
className="empty"
key="3"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="4"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="5"
>
Return to search results and add more positions to compare.
</th>
</tr>
</thead>
<tbody>
<tr>
<th
scope="row"
>
Position
</th>
<td
key="6"
>
<div
className="usa-grid-full"
>
<div
className="column-title-main"
>
OMS (DCM)
</div>
<div
className="close-button-container"
>
<CompareCheck
as="div"
className=""
customElement={
<FontAwesome
name="close"
/>
}
interactiveElementProps={
Object {
"title": "Remove this comparison",
}
}
limit={5}
onToggle={[Function]}
refKey={1}
type="compare"
/>
</div>
</div>
<span
aria-labelledby="1 0 0 3 4 0 0 1"
>
10034001
</span>
</td>
<td
key="7"
>
<div
className="usa-grid-full"
>
<div
className="column-title-main"
>
SPECIAL AGENT
</div>
<div
className="close-button-container"
>
<CompareCheck
as="div"
className=""
customElement={
<FontAwesome
name="close"
/>
}
interactiveElementProps={
Object {
"title": "Remove this comparison",
}
}
limit={5}
onToggle={[Function]}
refKey={2}
type="compare"
/>
</div>
</div>
<span
aria-labelledby="5 6 0 8 2 0 0 0"
>
56082000
</span>
</td>
<th
className="empty"
key="8"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="9"
>
Return to search results and add more positions to compare.
</th>
<th
className="empty"
key="10"
>
Return to search results and add more positions to compare.
</th>
</tr>
<tr>
<th
scope="row"
>
Link to details
</th>
<td
key="11"
>
<div
className="column-title-link"
>
<Link
replace={false}
to="/details/1"
>
View position
</Link>
</div>
</td>
<td
key="12"
>
<div
className="column-title-link"
>
<Link
replace={false}
to="/details/2"
>
View position
</Link>
</div>
</td>
<td
className="empty"
key="13"
/>
<td
className="empty"
key="14"
/>
<td
className="empty"
key="15"
/>
</tr>
<tr>
<th
scope="row"
>
Bid Count
</th>
<td
key="16"
>
<span
className="bid-stats"
>
<BidCount
altStyle={true}
bidStatistics={Object {}}
hideLabel={true}
isCondensed={false}
isTandemTwo={false}
label="Bid Count"
/>
</span>
</td>
<td
key="17"
>
<span
className="bid-stats"
>
<BidCount
altStyle={true}
bidStatistics={Object {}}
hideLabel={true}
isCondensed={false}
isTandemTwo={false}
label="Bid Count"
/>
</span>
</td>
<td
className="empty"
key="18"
/>
<td
className="empty"
key="19"
/>
<td
className="empty"
key="20"
/>
</tr>
<tr>
<th
scope="row"
>
Location
</th>
<td
key="21"
>
Freetown, Sierra Leone
</td>
<td
key="22"
>
Chicago, IL
</td>
<td
className="empty"
key="23"
/>
<td
className="empty"
key="24"
/>
<td
className="empty"
key="25"
/>
</tr>
<tr>
<th
scope="row"
>
TED
</th>
<td
key="26"
>
None listed
</td>
<td
key="27"
>
None listed
</td>
<td
className="empty"
key="28"
/>
<td
className="empty"
key="29"
/>
<td
className="empty"
key="30"
/>
</tr>
<tr>
<th
scope="row"
>
Skill
</th>
<td
key="31"
>
None listed
</td>
<td
key="32"
>
SECURITY (2501)
</td>
<td
className="empty"
key="33"
/>
<td
className="empty"
key="34"
/>
<td
className="empty"
key="35"
/>
</tr>
<tr>
<th
scope="row"
>
Grade
</th>
<td
key="36"
>
06
</td>
<td
key="37"
>
04
</td>
<td
className="empty"
key="38"
/>
<td
className="empty"
key="39"
/>
<td
className="empty"
key="40"
/>
</tr>
<tr>
<th
scope="row"
>
Bureau
</th>
<td
key="41"
>
None listed
</td>
<td
key="42"
>
(WHA) BUREAU OF WESTERN HEMISPHERIC AFFAIRS
</td>
<td
className="empty"
key="43"
/>
<td
className="empty"
key="44"
/>
<td
className="empty"
key="45"
/>
</tr>
<tr>
<th
scope="row"
>
Tour of Duty
</th>
<td
key="46"
>
None listed
</td>
<td
key="47"
>
2 YRS (2 R & R)
</td>
<td
className="empty"
key="48"
/>
<td
className="empty"
key="49"
/>
<td
className="empty"
key="50"
/>
</tr>
<tr>
<th
scope="row"
>
Language
</th>
<td
key="51"
>
<LanguageList
languages={Array []}
propToUse="representation"
/>
</td>
<td
key="52"
>
<LanguageList
languages={
Array [
Object {
"id": 1,
"language": "French (FR)",
"reading_proficiency": "2",
"representation": "French (FR) 2/2",
"spoken_proficiency": "2",
},
Object {
"id": 20,
"language": "Haitian Creole (HC)",
"reading_proficiency": "0",
"representation": "Haitian Creole (HC) 0/0",
"spoken_proficiency": "0",
},
]
}
propToUse="representation"
/>
</td>
<td
className="empty"
key="53"
/>
<td
className="empty"
key="54"
/>
<td
className="empty"
key="55"
/>
</tr>
<tr>
<th
scope="row"
>
Post Differential | Danger Pay
</th>
<td
key="56"
>
<DefinitionList
dangerPay={0}
obcUrl={Object {}}
postDifferential={30}
/>
</td>
<td
key="57"
>
<DefinitionList
dangerPay={15}
obcUrl={Object {}}
postDifferential={20}
/>
</td>
<td
className="empty"
key="58"
/>
<td
className="empty"
key="59"
/>
<td
className="empty"
key="60"
/>
</tr>
<tr>
<th
scope="row"
>
Favorite
</th>
<td
key="61"
>
<Connect(FavoriteContainer)
compareArray={Array []}
hasBorder={true}
refKey={1}
refresh={true}
useButtonClass={true}
useButtonClassSecondary={true}
/>
</td>
<td
key="62"
>
<Connect(FavoriteContainer)
compareArray={Array []}
hasBorder={true}
refKey={2}
refresh={true}
useButtonClass={true}
useButtonClassSecondary={true}
/>
</td>
<td
className="empty"
key="63"
/>
<td
className="empty"
key="64"
/>
<td
className="empty"
key="65"
/>
</tr>
<tr>
<th
scope="row"
/>
<MediaQueryWrapper
breakpoint="screenLgMin"
widthType="min"
>
<Component />
</MediaQueryWrapper>
<MediaQueryWrapper
breakpoint="screenLgMin"
widthType="min"
>
<Component />
</MediaQueryWrapper>
<td
className="empty"
key="66"
/>
<td
className="empty"
key="67"
/>
<td
className="empty"
key="68"
/>
</tr>
</tbody>
</table>
</div>
</div>
</div>
`;