Add ouiaIds to Select component

This commit is contained in:
Marliana Lara
2020-11-30 11:49:24 -05:00
parent 0d7f7df043
commit 3e64e8225a
2 changed files with 10 additions and 3 deletions

View File

@@ -160,7 +160,7 @@ function Search({
const searchOptions = columns const searchOptions = columns
.filter(({ key }) => key !== searchKey) .filter(({ key }) => key !== searchKey)
.map(({ key, name }) => ( .map(({ key, name }) => (
<SelectOption key={key} value={name}> <SelectOption key={key} value={name} id={`select-option-${key}`}>
{name} {name}
</SelectOption> </SelectOption>
)); ));
@@ -177,6 +177,7 @@ function Search({
onSelect={handleDropdownSelect} onSelect={handleDropdownSelect}
selections={searchColumnName} selections={searchColumnName}
isOpen={isSearchDropdownOpen} isOpen={isSearchDropdownOpen}
ouiaId="simple-key-select"
> >
{searchOptions} {searchOptions}
</Select> </Select>
@@ -217,9 +218,14 @@ function Search({
})} })}
isOpen={isFilterDropdownOpen} isOpen={isFilterDropdownOpen}
placeholderText={`Filter By ${name}`} placeholderText={`Filter By ${name}`}
ouiaId={`filter-by-${key}`}
> >
{options.map(([optionKey, optionLabel]) => ( {options.map(([optionKey, optionLabel]) => (
<SelectOption key={optionKey} value={optionKey}> <SelectOption
key={optionKey}
value={optionKey}
inputId={`select-option-${optionKey}`}
>
{optionLabel} {optionLabel}
</SelectOption> </SelectOption>
))} ))}
@@ -234,6 +240,7 @@ function Search({
selections={chipsByKey[key].chips[0]?.label} selections={chipsByKey[key].chips[0]?.label}
isOpen={isFilterDropdownOpen} isOpen={isFilterDropdownOpen}
placeholderText={`Filter By ${name}`} placeholderText={`Filter By ${name}`}
ouiaId={`filter-by-${key}`}
> >
<SelectOption key="true" value="true"> <SelectOption key="true" value="true">
{booleanLabels.true || i18n._(t`Yes`)} {booleanLabels.true || i18n._(t`Yes`)}

View File

@@ -57,7 +57,7 @@ function Project({ i18n, setBreadcrumb }) {
useEffect(() => { useEffect(() => {
fetchProjectAndRoles(); fetchProjectAndRoles();
}, [fetchProjectAndRoles]); }, [fetchProjectAndRoles, location.pathname]);
useEffect(() => { useEffect(() => {
if (project) { if (project) {