minor: try to fix firewall rule test flake again (#2993)

try to fix firewall rule test flake

Author: david-crespo

app/forms/firewall-rules-common.tsx

@@ -494,6 +494,12 @@ const ProtocolFilters = ({ control }: { control: Control<FirewallRuleValues> })
                   placeholder=""
                   validate={icmpCodeValidation}
                   transform={normalizeDashes}
+                  onKeyDown={(e) => {
+                    if (e.key === KEYS.enter) {
+                      e.preventDefault() // prevent full form submission
+                      submitProtocol(e)
+                    }
+                  }}
                 />
               )}
             </>

app/ui/lib/Combobox.tsx

@@ -213,14 +213,16 @@ export const Combobox = ({
                 onInputChange?.(value)
               }}
               onKeyDown={(e) => {
-                // If the caller is using onEnter to override enter behavior, preventDefault
-                // in order to prevent the containing form from being submitted too. We don't
-                // need to do this when the combobox is open because that enter keypress is
-                // already handled internally (selects the highlighted item). So we only do
-                // this when the combobox is closed.
-                if (e.key === 'Enter' && onEnter && !open) {
+                // When the combobox is open, Enter is handled internally by
+                // Headless UI (selects the highlighted item). When closed,
+                // we need to prevent the default behavior to avoid submitting
+                // the containing form. We also considered always preventing
+                // default on Enter regardless of open status, but it appears
+                // to break the combobox handling. Headless UI likely checks
+                // e.defaultPrevented before processing item selection.
+                if (e.key === 'Enter' && !open) {
                   e.preventDefault()
-                  onEnter(e)
+                  onEnter?.(e)
                 }
               }}
               placeholder={placeholder}

test/e2e/firewall-rules.e2e.ts

@@ -456,10 +456,6 @@ test('can update firewall rule', async ({ page }) => {
   await selectOption(page, 'Protocol filters', 'ICMP')
   await page.getByRole('combobox', { name: 'ICMP Type' }).fill('3')
   await page.getByRole('combobox', { name: 'ICMP Type' }).press('Enter')
-
-  // give FF time to process the above enter before moving to the next field
-  await sleep(300)
-
   await page.getByRole('textbox', { name: 'ICMP Code' }).fill('0')
   await page.getByRole('button', { name: 'Add protocol' }).click()