Some autotests failing in Firefox

[msmithNI]

🧹 Tech Debt

We currently have some test failures in Firefox. We should triage these to see if there's any user-visible impact (i.e. if they could be actual bugs in Nimble on Firefox) and fix them if possible.

Note: The drawer/dialog test failures are also present in WebKit. If we find a fix for one browser, we should test it in the other too.

To reproduce: npm run test-firefox -w @ni/nimble-components

NO LONGER FAILING:

• TableHeader has correct state when sorted descending FAILED
  Expected null to equal 'descending'.
• TableHeader has correct state when sorted ascending FAILED
  Expected null to equal 'ascending'.

TRACKED BY #1943

• Drawer with default setup supports opening multiple drawers on top of each other FAILED
  Expected ... to be . Tip: To check for deep equality, use .toEqual() instead of .toBe().
• Dialog supports opening multiple dialogs on top of each other FAILED
  Expected ... to be . Tip: To check for deep equality, use .toEqual() instead of .toBe().

TRACKED BY #1937

• Drawer with default setup should resolve promise if drawer completely opens before being closed FAILED
  Error: Timeout - Async function did not complete within 5000ms (set by jasmine.DEFAULT_TIMEOUT_INTERVAL)

TRACKED BY WEBCOMPAT BUG (https://webcompat.com/issues/121098) and #1936 :

• Drawer with default setup focuses the first button on the drawer when it opens FAILED
  Expected ... to be .... Tip: To check for deep equality, use .toEqual() instead of .toBe().
• Drawer with default setup focuses the button with autofocus when the drawer opens FAILED
  Expected ... to be .... Tip: To check for deep equality, use .toEqual() instead of .toBe().
• Dialog focuses the button with autofocus when the dialog opens FAILED
  Expected ... to be .... Tip: To check for deep equality, use .toEqual() instead of .toBe().
• Dialog focuses the first button on the dialog when it opens FAILED
  Expected ... to be .... Tip: To check for deep equality, use .toEqual() instead of .toBe().

FIXED:

• AnchorTabs should set aria-selected on active tab FAILED
  Expected undefined to be 'true'.
• Tooltip should render the error severity when selected and render the corresponding icon when true FAILED
  Expected true to be false.
• Tooltip should render the default state when selected FAILED
  Expected true to be false.
• Tooltip should render the information severity when selected FAILED
  Expected true to be false.
• Tooltip should render the information severity when selected and render the corresponding icon when true FAILED
  Expected true to be false.
• Tooltip should render the default state when selected and not render an icon when true FAILED
  Expected true to be false.
• Tooltip should render the error severity when selected FAILED
  Expected true to be false.
• TableColumnText sets title when cell text is ellipsized FAILED
  Expected '' to be 'a very long value that should get ellipsized due to not fitting within the default cell width'.

[m-akinc]

All of the dialog/drawer tests that deal with the focusing of a certain control are due to a bug/compatibility issue in Firefox. I have filed an issue with webcompat. Basically, the dialog element fails to auto-focus elements if they are slotted. With a plain dialog (no slotting), it focuses just fine.

[jattasNI]

@m-akinc once #1188 goes in could you update the description of this issue to categorize the failures into sections like "fixed", "tracked by webcompat bug", "needs investigation", etc?

[jattasNI]

Next action item is to take another pass at addressing the failures. Anything that's left should be broken into separate issues for each underlying cause. Those issues should be appropriately marked as blocked/upstream with bugs filed to browser vendors.

[jattasNI]

Updated the issue description to link to specific issues for each root cause. Closing this one.