Skip to content

Commit 0715cb5

Browse files
kydeckerkydecker
committed
Use keyboard controls to interact with combobox inputs
1 parent 399b9eb commit 0715cb5

3 files changed

Lines changed: 61 additions & 37 deletions

File tree

‎src/content/forms/court-order-ma/e2e.spec.ts‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -109,14 +109,16 @@ test("Massachusetts Court Order", async ({ page }, testInfo) => {
109109
page.getByRole("heading", { name: "Where were you born?" }),
110110
).toBeVisible();
111111
await page.getByRole("textbox", { name: "City" }).fill("Birthcity");
112-
await page.getByRole("combobox", { name: "Country" }).click();
113-
await page.getByRole("combobox", { name: "Country" }).fill("unite");
114-
await page
115-
.getByRole("option", { name: "United States of America" })
116-
.click();
117-
await page.getByRole("combobox", { name: "State" }).click();
118-
await page.getByRole("combobox", { name: "State" }).fill("mas");
119-
await page.getByRole("option", { name: "Massachusetts" }).click();
112+
const countryCombobox = page.getByRole("combobox", { name: "Country" });
113+
await countryCombobox.fill("united sta");
114+
await countryCombobox.press("ArrowDown");
115+
await countryCombobox.press("Enter");
116+
117+
const stateCombobox = page.getByRole("combobox", { name: "State" });
118+
await stateCombobox.fill("mass");
119+
await stateCombobox.press("ArrowDown");
120+
await stateCombobox.press("Enter");
121+
120122
await page.getByRole("button", { name: "Continue" }).click();
121123
});
122124

‎src/content/forms/court-order-ri/e2e.spec.ts‎

Lines changed: 24 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -95,8 +95,12 @@ test("Rhode Island Court Order", async ({ page }, testInfo) => {
9595
.getByRole("textbox", { name: "Street address" })
9696
.fill("100 Main St");
9797
await page.getByRole("textbox", { name: "City" }).fill("Providence");
98-
await page.getByRole("combobox", { name: "State" }).click();
99-
await page.getByRole("option", { name: "Rhode Island" }).click();
98+
99+
const stateCombobox = page.getByRole("combobox", { name: "State" });
100+
await stateCombobox.fill("rhode is");
101+
await stateCombobox.press("ArrowDown");
102+
await stateCombobox.press("Enter");
103+
100104
await page.getByRole("textbox", { name: "ZIP" }).fill("02903");
101105
await page.getByRole("button", { name: "Continue" }).click();
102106
});
@@ -132,13 +136,16 @@ test("Rhode Island Court Order", async ({ page }, testInfo) => {
132136
page.getByRole("heading", { name: "Where were you born?" }),
133137
).toBeVisible();
134138
await page.getByRole("textbox", { name: "City" }).fill("Providence");
135-
await page.getByRole("combobox", { name: "Country" }).click();
136-
await page
137-
.getByRole("option", { name: "United States of America" })
138-
.click();
139-
await expect(page.getByRole("combobox", { name: "State" })).toBeVisible();
140-
await page.getByRole("combobox", { name: "State" }).click();
141-
await page.getByRole("option", { name: "Rhode Island" }).click();
139+
140+
const countryCombobox = page.getByRole("combobox", { name: "Country" });
141+
await countryCombobox.fill("united states");
142+
await countryCombobox.press("ArrowDown");
143+
await countryCombobox.press("Enter");
144+
145+
const stateCombobox = page.getByRole("combobox", { name: "State" });
146+
await stateCombobox.fill("rhode is");
147+
await stateCombobox.press("ArrowDown");
148+
await stateCombobox.press("Enter");
142149
await page.getByRole("button", { name: "Continue" }).click();
143150
});
144151

@@ -198,10 +205,14 @@ test("Rhode Island Court Order", async ({ page }, testInfo) => {
198205
await page
199206
.getByRole("textbox", { name: "Occupation" })
200207
.fill("Software Engineer");
201-
await page
202-
.getByRole("combobox", { name: "Marital status (optional)" })
203-
.click();
204-
await page.getByRole("option", { name: "Single" }).click();
208+
209+
const maritalStatusCombobox = page.getByRole("combobox", {
210+
name: "Marital status (optional)",
211+
});
212+
await maritalStatusCombobox.fill("single");
213+
await maritalStatusCombobox.press("ArrowDown");
214+
await maritalStatusCombobox.press("Enter");
215+
205216
await page.getByRole("button", { name: "Continue" }).click();
206217
});
207218

‎src/content/forms/social-security/e2e.spec.ts‎

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -96,20 +96,26 @@ test("Social Security", async ({ page }, testInfo) => {
9696
await page
9797
.getByRole("textbox", { name: "City of birth" })
9898
.fill("Springfield");
99-
await page.getByRole("combobox", { name: "Country" }).click();
100-
await page.getByRole("combobox", { name: "Country" }).fill("can");
101-
await page.getByRole("option", { name: "Canada" }).click();
102-
await expect(page.getByRole("combobox", { name: "State" })).toHaveCount(0);
10399

104-
await page.getByRole("combobox", { name: "Country" }).click();
105-
await page.getByRole("combobox", { name: "Country" }).fill("unite");
106-
await page
107-
.getByRole("option", { name: "United States of America" })
108-
.click();
109-
await expect(page.getByRole("combobox", { name: "State" })).toBeVisible();
110-
await page.getByRole("combobox", { name: "State" }).click();
111-
await page.getByRole("combobox", { name: "State" }).fill("mas");
112-
await page.getByRole("option", { name: "Massachusetts" }).click();
100+
const countryCombobox = page.getByRole("combobox", { name: "Country" });
101+
await countryCombobox.fill("canada");
102+
await countryCombobox.press("ArrowDown");
103+
await countryCombobox.press("Enter");
104+
await expect(countryCombobox).toHaveValue("Canada");
105+
106+
const stateCombobox = page.getByRole("combobox", { name: "State" });
107+
await expect(stateCombobox).toHaveCount(0);
108+
109+
await countryCombobox.fill("united sta");
110+
await countryCombobox.press("ArrowDown");
111+
await countryCombobox.press("Enter");
112+
await expect(countryCombobox).toHaveValue("United States of America");
113+
114+
await expect(stateCombobox).toBeVisible();
115+
await stateCombobox.fill("mas");
116+
await stateCombobox.press("ArrowDown");
117+
await stateCombobox.press("Enter");
118+
await expect(stateCombobox).toHaveValue("Massachusetts");
113119

114120
await page.getByRole("button", { name: "Continue" }).click();
115121
});
@@ -285,9 +291,14 @@ test("Social Security", async ({ page }, testInfo) => {
285291
.getByRole("textbox", { name: "Street address" })
286292
.fill("200 Oak St");
287293
await page.getByRole("textbox", { name: "City" }).fill("Boston");
288-
await page.getByRole("combobox", { name: "State" }).click();
289-
await page.getByRole("combobox", { name: "State" }).fill("ma");
290-
await page.getByRole("option", { name: "Massachusetts" }).click();
294+
295+
const stateCombobox = page.getByRole("combobox", { name: "State" });
296+
await stateCombobox.click();
297+
await stateCombobox.fill("mass");
298+
await stateCombobox.press("ArrowDown");
299+
await stateCombobox.press("Enter");
300+
await expect(stateCombobox).toHaveValue("Massachusetts");
301+
291302
await page.getByRole("textbox", { name: "ZIP" }).fill("02110");
292303
await page.getByRole("button", { name: "Continue" }).click();
293304
});

0 commit comments

Comments
 (0)