test: stabilize tests using setFocus (#7295)

**Related Issue:** N/A

## Summary

Adds more `page.waitForChanges()` after `setFocus` calls. This is needed
after #7277.

Author: jcfranco

packages/calcite-components/src/components/color-picker-hex-input/color-picker-hex-input.e2e.ts

@@ -407,6 +407,7 @@ describe("calcite-color-picker-hex-input", () => {
             await input.setProperty("value", noColorValue);
             await page.waitForChanges();
             await input.callMethod("setFocus");
+            await page.waitForChanges();
 
             await page.keyboard.press("ArrowUp");
             await page.waitForChanges();
@@ -525,6 +526,7 @@ describe("calcite-color-picker-hex-input", () => {
             await input.setProperty("value", noColorValue);
             await page.waitForChanges();
             await input.callMethod("setFocus");
+            await page.waitForChanges();
 
             await page.keyboard.press("ArrowUp");
             await page.waitForChanges();

packages/calcite-components/src/components/color-picker/color-picker.e2e.ts

@@ -281,6 +281,7 @@ describe("calcite-color-picker", () => {
     value: string
   ): Promise<void> => {
     await channelInputOrHexInput.callMethod("setFocus");
+    await page.waitForChanges();
     await selectText(channelInputOrHexInput);
     await channelInputOrHexInput.press("Backspace");
     await channelInputOrHexInput.type(value);
@@ -1051,6 +1052,7 @@ describe("calcite-color-picker", () => {
 
             const assertChannelValueNudge = async (page: E2EPage, calciteInput: E2EElement): Promise<void> => {
               await calciteInput.callMethod("setFocus");
+              await page.waitForChanges();
               const currentValue = await calciteInput.getProperty("value");
 
               await page.keyboard.press("ArrowUp");
@@ -1140,7 +1142,6 @@ describe("calcite-color-picker", () => {
             });
 
             const assertChannelValueNudge = async (page: E2EPage, calciteInput: E2EElement): Promise<void> => {
-              await calciteInput.callMethod("setFocus");
               await clearAndEnterHexOrChannelValue(page, calciteInput, "");
 
               // using page.waitForChanges as keyboard nudges occur in the next frame
@@ -1598,6 +1599,7 @@ describe("calcite-color-picker", () => {
 
           const assertChannelValueNudge = async (page: E2EPage, calciteInputOrSlider: E2EElement): Promise<void> => {
             await calciteInputOrSlider.callMethod("setFocus");
+            await page.waitForChanges();
             const currentValue = await calciteInputOrSlider.getProperty("value");
 
             function ensureValueType(value: string | number): number | string {
@@ -1717,6 +1719,7 @@ describe("calcite-color-picker", () => {
               }
 
               await calciteInputOrSlider.callMethod("setFocus");
+              await page.waitForChanges();
               await clearValue();
 
               // using page.waitForChanges as keyboard nudges occur in the next frame

packages/calcite-components/src/components/combobox/combobox.e2e.ts

@@ -783,6 +783,7 @@ describe("calcite-combobox", () => {
         }
       } else {
         await combobox.callMethod("setFocus");
+        await page.waitForChanges();
         await page.keyboard.press("Escape");
       }
 

packages/calcite-components/src/components/dropdown-item/dropdown-item.e2e.ts

@@ -31,13 +31,15 @@ describe("calcite-dropdown-item", () => {
 
     calciteDropdownItemSelectEvent = page.waitForEvent("calciteDropdownItemSelect");
     await element.callMethod("setFocus");
+    await page.waitForChanges();
     await page.keyboard.press("Enter");
     await calciteDropdownItemSelectEvent;
 
     expect(itemChangeSpy).toHaveReceivedEventTimes(2);
 
     calciteDropdownItemSelectEvent = page.waitForEvent("calciteDropdownItemSelect");
     await element.callMethod("setFocus");
+    await page.waitForChanges();
     await page.keyboard.press("Space");
     await calciteDropdownItemSelectEvent;
 

packages/calcite-components/src/components/dropdown/dropdown.e2e.ts

@@ -754,6 +754,7 @@ describe("calcite-dropdown", () => {
       expect(calciteDropdownClose).toHaveReceivedEventTimes(0);
 
       await element.callMethod("setFocus");
+      await page.waitForChanges();
       await page.keyboard.press("Space");
       await page.waitForChanges();
       expect(await dropdownWrapper.isVisible()).toBe(false);
@@ -799,6 +800,7 @@ describe("calcite-dropdown", () => {
       expect(calciteDropdownClose).toHaveReceivedEventTimes(0);
 
       await element.callMethod("setFocus");
+      await page.waitForChanges();
       await page.keyboard.press("Space");
       await page.waitForChanges();
       expect(await dropdownWrapper.isVisible()).toBe(false);

packages/calcite-components/src/components/filter/filter.e2e.ts

@@ -93,6 +93,7 @@ describe("calcite-filter", () => {
       it("should clear the value in the input when pressed", async () => {
         const filter = await page.find("calcite-filter");
         await filter.callMethod("setFocus");
+        await page.waitForChanges();
 
         await page.keyboard.type("developer");
         await page.waitForChanges();
@@ -118,6 +119,7 @@ describe("calcite-filter", () => {
       it("should clear the value in the input when the Escape key is pressed", async () => {
         const filter = await page.find("calcite-filter");
         await filter.callMethod("setFocus");
+        await page.waitForChanges();
 
         await page.keyboard.type("developer");
         await page.waitForChanges();
@@ -203,6 +205,7 @@ describe("calcite-filter", () => {
 
       const filterChangeEvent = page.waitForEvent("calciteFilterChange");
       await filter.callMethod("setFocus");
+      await page.waitForChanges();
       await filter.type("developer");
       await filterChangeEvent;
 
@@ -224,6 +227,7 @@ describe("calcite-filter", () => {
       const filter = await page.find("calcite-filter");
 
       await filter.callMethod("setFocus");
+      await page.waitForChanges();
       await filter.type("volt");
       await waitForEvent;
 
@@ -235,6 +239,7 @@ describe("calcite-filter", () => {
       const filter = await page.find("calcite-filter");
 
       await filter.callMethod("setFocus");
+      await page.waitForChanges();
       await filter.type("regex()");
       await waitForEvent;