Skip to content

Commit b730fc7

Browse files
authored
Merge pull request #164 from jpinsonneau/326
NETOBSERV-326 data-test attributes
2 parents e179ea5 + 3d3e8ce commit b730fc7

30 files changed

+248
-65
lines changed

web/src/components/dropdowns/display-dropdown.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,17 +23,19 @@ export const DisplayDropdown: React.FC<Props> = ({ id, setSize }) => {
2323

2424
return (
2525
<Dropdown
26+
data-test={id}
2627
id={id}
2728
isPlain
2829
dropdownItems={_.map(sizeOptions, (name, key) => (
29-
<DropdownItem id={key} component="button" key={key} onClick={() => setSize(key as Size)}>
30+
<DropdownItem data-test={key} id={key} component="button" key={key} onClick={() => setSize(key as Size)}>
3031
{name}
3132
</DropdownItem>
3233
))}
3334
isOpen={isOpen}
3435
onSelect={() => setIsOpen(false)}
3536
toggle={
3637
<DropdownToggle
38+
data-test={`${id}-dropdown`}
3739
id={`${id}-dropdown`}
3840
className="overflow-button"
3941
icon={<ThIcon />}

web/src/components/dropdowns/group-dropdown.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,10 +61,12 @@ export const GroupDropdown: React.FC<{
6161

6262
return (
6363
<Dropdown
64+
data-test={id}
6465
id={id}
6566
position={DropdownPosition.right}
6667
toggle={
6768
<DropdownToggle
69+
data-test={`${id}-dropdown`}
6870
id={`${id}-dropdown`}
6971
isDisabled={disabled}
7072
onToggle={() => setGroupDropdownOpen(!groupDropdownOpen)}
@@ -75,6 +77,7 @@ export const GroupDropdown: React.FC<{
7577
isOpen={groupDropdownOpen}
7678
dropdownItems={getAvailableGroups().map(v => (
7779
<DropdownItem
80+
data-test={v}
7881
id={v}
7982
key={v}
8083
onClick={() => {

web/src/components/dropdowns/layout-dropdown.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,16 +32,22 @@ export const LayoutDropdown: React.FC<{
3232

3333
return (
3434
<Dropdown
35+
data-test={id}
3536
id={id}
3637
position={DropdownPosition.right}
3738
toggle={
38-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setLayoutDropdownOpen(!layoutDropdownOpen)}>
39+
<DropdownToggle
40+
data-test={`${id}-dropdown`}
41+
id={`${id}-dropdown`}
42+
onToggle={() => setLayoutDropdownOpen(!layoutDropdownOpen)}
43+
>
3944
{getLayoutDisplay(selected)}
4045
</DropdownToggle>
4146
}
4247
isOpen={layoutDropdownOpen}
4348
dropdownItems={Object.values(LayoutName).map(v => (
4449
<DropdownItem
50+
data-test={v}
4551
id={v}
4652
key={v}
4753
onClick={() => {

web/src/components/dropdowns/metric-function-dropdown.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,16 +28,22 @@ export const MetricFunctionDropdown: React.FC<{
2828

2929
return (
3030
<Dropdown
31+
data-test={id}
3132
id={id}
3233
position={DropdownPosition.right}
3334
toggle={
34-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setMetricDropdownOpen(!metricDropdownOpen)}>
35+
<DropdownToggle
36+
data-test={`${id}-dropdown`}
37+
id={`${id}-dropdown`}
38+
onToggle={() => setMetricDropdownOpen(!metricDropdownOpen)}
39+
>
3540
{getMetricDisplay(selected)}
3641
</DropdownToggle>
3742
}
3843
isOpen={metricDropdownOpen}
3944
dropdownItems={Object.values(TopologyMetricFunctions).map(v => (
4045
<DropdownItem
46+
data-test={v}
4147
id={v}
4248
key={v}
4349
onClick={() => {

web/src/components/dropdowns/metric-type-dropdown.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,22 @@ export const MetricTypeDropdown: React.FC<{
2424

2525
return (
2626
<Dropdown
27+
data-test={id}
2728
id={id}
2829
position={DropdownPosition.right}
2930
toggle={
30-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setMetricDropdownOpen(!metricDropdownOpen)}>
31+
<DropdownToggle
32+
data-test={`${id}-dropdown`}
33+
id={`${id}-dropdown`}
34+
onToggle={() => setMetricDropdownOpen(!metricDropdownOpen)}
35+
>
3136
{getMetricDisplay(selected)}
3237
</DropdownToggle>
3338
}
3439
isOpen={metricDropdownOpen}
3540
dropdownItems={Object.values(TopologyMetricTypes).map(v => (
3641
<DropdownItem
42+
data-test={v}
3743
id={v}
3844
key={v}
3945
onClick={() => {

web/src/components/dropdowns/query-options-dropdown.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,7 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
8686
name={`reporter-${opt.value}`}
8787
onChange={() => setReporter(opt.value)}
8888
label={opt.label}
89+
data-test={`reporter-${opt.value}`}
8990
id={`reporter-${opt.value}`}
9091
value={opt.value}
9192
/>
@@ -116,6 +117,7 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
116117
name={`match-${opt.value}`}
117118
onChange={() => setMatch(opt.value)}
118119
label={opt.label}
120+
data-test={`match-${opt.value}`}
119121
id={`match-${opt.value}`}
120122
value={opt.value}
121123
/>
@@ -140,6 +142,7 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
140142
<div key={'limit-' + l}>
141143
<label className="pf-c-select__menu-item">
142144
<Radio
145+
data-test={'limit-' + l}
143146
id={'limit-' + l}
144147
name={'limit-' + l}
145148
isChecked={l === limit}
@@ -159,8 +162,9 @@ export const QueryOptionsDropdown: React.FC<QueryOptionsDropdownProps> = props =
159162
const { t } = useTranslation('plugin__network-observability-plugin');
160163
const [isOpen, setOpen] = React.useState<boolean>(false);
161164
return (
162-
<div data-test-id="query-options-dropdown-container">
165+
<div data-test="query-options-dropdown-container">
163166
<Select
167+
data-test="query-options-dropdown"
164168
id="query-options-dropdown"
165169
placeholderText={<span>{t('Query Options')}</span>}
166170
isOpen={isOpen}

web/src/components/dropdowns/refresh-dropdown.tsx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,16 +46,22 @@ export const RefreshDropdown: React.FC<RefreshDropdownProps> = ({ disabled, id,
4646

4747
return (
4848
<Dropdown
49+
data-test={id}
4950
id={id}
5051
dropdownItems={_.map(refreshOptions, (name, key) => (
51-
<DropdownItem id={key} component="button" key={key} onClick={() => onChange(key)}>
52+
<DropdownItem data-test={key} id={key} component="button" key={key} onClick={() => onChange(key)}>
5253
{name}
5354
</DropdownItem>
5455
))}
5556
isOpen={isOpen}
5657
onSelect={() => setIsOpen(false)}
5758
toggle={
58-
<DropdownToggle id={`${id}-dropdown`} isDisabled={disabled} onToggle={() => setIsOpen(!isOpen)}>
59+
<DropdownToggle
60+
data-test={`${id}-dropdown`}
61+
id={`${id}-dropdown`}
62+
isDisabled={disabled}
63+
onToggle={() => setIsOpen(!isOpen)}
64+
>
5965
{refreshOptions[selectedKey as keyof typeof refreshOptions]}
6066
</DropdownToggle>
6167
}

web/src/components/dropdowns/scope-dropdown.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,16 +26,22 @@ export const ScopeDropdown: React.FC<{
2626

2727
return (
2828
<Dropdown
29+
data-test={id}
2930
id={id}
3031
position={DropdownPosition.right}
3132
toggle={
32-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setScopeDropdownOpen(!scopeDropdownOpen)}>
33+
<DropdownToggle
34+
data-test={`${id}-dropdown`}
35+
id={`${id}-dropdown`}
36+
onToggle={() => setScopeDropdownOpen(!scopeDropdownOpen)}
37+
>
3338
{getScopeDisplay(selected)}
3439
</DropdownToggle>
3540
}
3641
isOpen={scopeDropdownOpen}
3742
dropdownItems={Object.values(TopologyScopes).map(v => (
3843
<DropdownItem
44+
data-test={v}
3945
id={v}
4046
key={v}
4147
onClick={() => {

web/src/components/dropdowns/time-range-dropdown.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,10 @@ export const TimeRangeDropdown: React.FC<TimeRangeDropdownProps> = ({ id, range,
5757

5858
return (
5959
<Dropdown
60+
data-test={id}
6061
id={id}
6162
dropdownItems={_.map(timeRangeOptions, (name, key) => (
62-
<DropdownItem id={key} component="button" key={key} onClick={() => onChange(key)}>
63+
<DropdownItem data-test={key} id={key} component="button" key={key} onClick={() => onChange(key)}>
6364
{name}
6465
</DropdownItem>
6566
))}
@@ -71,7 +72,7 @@ export const TimeRangeDropdown: React.FC<TimeRangeDropdownProps> = ({ id, range,
7172
position="top"
7273
content={textContent()}
7374
>
74-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setIsOpen(!isOpen)}>
75+
<DropdownToggle data-test={`${id}-dropdown`} id={`${id}-dropdown`} onToggle={() => setIsOpen(!isOpen)}>
7576
{timeRangeOptions[selectedKey as keyof typeof timeRangeOptions]}
7677
</DropdownToggle>
7778
</Tooltip>

web/src/components/dropdowns/truncate-dropdown.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,15 @@ export const TruncateDropdown: React.FC<{
3030

3131
return (
3232
<Dropdown
33+
data-test={id}
3334
id={id}
3435
position={DropdownPosition.right}
3536
toggle={
36-
<DropdownToggle id={`${id}-dropdown`} onToggle={() => setTruncateDropdownOpen(!truncateDropdownOpen)}>
37+
<DropdownToggle
38+
data-test={`${id}-dropdown`}
39+
id={`${id}-dropdown`}
40+
onToggle={() => setTruncateDropdownOpen(!truncateDropdownOpen)}
41+
>
3742
{getTruncateDisplay(selected)}
3843
</DropdownToggle>
3944
}
@@ -47,6 +52,7 @@ export const TruncateDropdown: React.FC<{
4752
TopologyTruncateLength.XL
4853
].map((v: TopologyTruncateLength) => (
4954
<DropdownItem
55+
data-test={String(v)}
5056
id={String(v)}
5157
key={v}
5258
onClick={() => {

0 commit comments

Comments
 (0)