Add test hooks to network settings page
- Adds data-test-id test hooks to simplify the xpath queries needed
to set up automation testing
- Adds standardized test hooks to all interactive elements: input fields,
buttons, and form select
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Id6253ac7355f1da8b73f55ffd2fcc1ea73c63555
diff --git a/src/views/Configuration/NetworkSettings/NetworkSettings.vue b/src/views/Configuration/NetworkSettings/NetworkSettings.vue
index 63de237..604949c 100644
--- a/src/views/Configuration/NetworkSettings/NetworkSettings.vue
+++ b/src/views/Configuration/NetworkSettings/NetworkSettings.vue
@@ -11,6 +11,7 @@
<b-form-select
id="interface-select"
v-model="selectedInterfaceIndex"
+ data-test-id="networkSettings-select-interface"
:options="interfaceSelectOptions"
@change="selectInterface"
>
@@ -30,6 +31,7 @@
<b-form-input
id="default-gateway"
v-model.trim="form.gateway"
+ data-test-id="networkSettings-input-gateway"
type="text"
:readonly="dhcpEnabled"
:state="getValidationState($v.form.gateway)"
@@ -53,6 +55,7 @@
<b-form-input
id="hostname-field"
v-model.trim="form.hostname"
+ data-test-id="networkSettings-input-hostname"
type="text"
:state="getValidationState($v.form.hostname)"
@change="$v.form.hostname.$touch()"
@@ -77,6 +80,7 @@
<b-form-input
id="mac-address"
v-model.trim="form.macAddress"
+ data-test-id="networkSettings-input-macAddress"
type="text"
:state="getValidationState($v.form.macAddress)"
@change="$v.form.macAddress.$touch()"
@@ -104,6 +108,7 @@
<template v-slot:cell(Address)="{ item, index }">
<b-form-input
v-model.trim="item.Address"
+ :data-test-id="`networkSettings-input-staticIpv4-${index}`"
:aria-label="
$t('pageNetworkSettings.ariaLabel.staticIpv4AddressRow') +
' ' +
@@ -143,6 +148,7 @@
<template v-slot:cell(SubnetMask)="{ item, index }">
<b-form-input
v-model.trim="item.SubnetMask"
+ :data-test-id="`networkSettings-input-subnetMask-${index}`"
:aria-label="
$t('pageNetworkSettings.ariaLabel.staticIpv4SubnetRow') +
' ' +
@@ -211,6 +217,7 @@
<template v-slot:cell(address)="{ item, index }">
<b-form-input
v-model.trim="item.address"
+ :data-test-id="`networkSettings-input-dnsAddress-${index}`"
:aria-label="
$t('pageNetworkSettings.ariaLabel.staticDnsRow') +
' ' +
@@ -270,6 +277,7 @@
<b-button
variant="primary"
type="submit"
+ data-test-id="networkSettings-button-saveNetworkSettings"
:disabled="!$v.form.$anyDirty || $v.form.$invalid"
>
{{ $t('global.action.saveSettings') }}