web: Fix css loading in unit tests, remove unneeded dot paths (#11629)

* Adding the aliases to Vite helped, but now why are the E2E tests failing?

* web: fix CSS loading with unit tests

- Fix the CSS loader and replace the cut-and-paste loader with a standardized one.
- Fix the aliasing for Wdio's "browser"-based unit testing (Vite)
  - With the aliasing fixed, remove all of the dotted paths in tests.
- Update the End-to-End tests to run in Firefox and Safari.
- Put an (optional) pause at the end of each unit test so we can visually confirm the CSS works.
  - Environment flag is `WDIO_LEMME_SEE=true`
- Reduce the verbosity of the tests to level `warn` or higher

* This change was due to a misunderstanding. It is not needed in 9.

* Fix the Oauth2 Provider test.

web/tests/specs/oauth-provider.ts

@@ -9,7 +9,7 @@ async function reachTheProvider() {
     await ProvidersListPage.logout();
     await login();
     await ProvidersListPage.open();
-    await expect(await ProvidersListPage.pageHeader).toHaveText("Providers");
+    await expect(await ProvidersListPage.pageHeader()).toHaveText("Providers");
 
     await ProvidersListPage.startWizardButton.click();
     await ProviderWizardView.wizardTitle.waitForDisplayed();
@@ -22,16 +22,13 @@ describe("Configure Oauth2 Providers", () => {
 
         await reachTheProvider();
 
-        await ProviderWizardView.providerList.waitForDisplayed();
-        // @ts-expect-error "TSC does not understand metaprogramming."
-        await ProviderWizardView.oauth2Provider.scrollIntoView();
-        // @ts-expect-error "TSC does not understand metaprogramming."
-        await ProviderWizardView.oauth2Provider.click();
+        await $("ak-wizard-page-type-create").waitForDisplayed();
+        await $('div[data-ouid-component-name="oauth2provider"]').scrollIntoView();
+        await $('div[data-ouid-component-name="oauth2provider"]').click();
         await ProviderWizardView.nextButton.click();
         await ProviderWizardView.pause();
 
-        // @ts-expect-error "TSC does not understand ChainablePromiseElement"
-        await ProviderWizardView.oauth.providerName.setValue(newProviderName);
+        return await $('ak-form-element-horizontal[name="name"]').$("input");
         await ProviderWizardView.oauth.setAuthorizationFlow(
             "default-provider-authorization-explicit-consent",
         );