web: update tests for Chromedriver 131 (#12199)

* web: Add InvalidationFlow to Radius Provider dialogues

## What

- Bugfix: adds the InvalidationFlow to the Radius Provider dialogues
  - Repairs: `{"invalidation_flow":["This field is required."]}` message, which was *not* propagated
    to the Notification.
- Nitpick: Pretties `?foo=${true}` expressions: `s/\?([^=]+)=\$\{true\}/\1/`

## Note

Yes, I know I'm going to have to do more magic when we harmonize the forms, and no, I didn't add the
Property Mappings to the wizard, and yes, I know I'm going to have pain with the *new* version of
the wizard. But this is a serious bug; you can't make Radius servers with *either* of the current
dialogues at the moment.

* web: fix selector warnings in WebdriverIO

Despite the [promises made](https://webdriver.io/docs/selectors#deep-selectors) by the WebdriverIO
team, we are still getting a lot of warnings and "falling back to pre-BIDI behavior" messages
when we attempt to access ShadowDOM contexts without the "pierce" (`>>>`) syntax.  So I've put
it back wherever it occurred and the system now uses the BIDI controllers correctly.

* web: update to Chromedriver 131 breaks a lot of stuff

This annoying bit of janitorial work cleans up the failure messages and resolution bugs
that arose when updating to the latest version of Chrome.  Keeping track of all the
weakness and breakage while the in-browser testing teams figure out how to live with
the ShadowDOM is just really time-consuming.

web/tests/pageobjects/admin.page.ts

@@ -4,7 +4,7 @@ import Page from "../pageobjects/page.js";
 
 export default class AdminPage extends Page {
     public async pageHeader() {
-        return await $("ak-page-header").$('slot[name="header"]');
+        return await $(">>>ak-page-header").$('>>>slot[name="header"]');
     }
 
     async openApplicationsListPage() {

web/tests/pageobjects/application-wizard.page.ts

@@ -29,15 +29,15 @@ class ApplicationWizardView extends AdminPage {
     app = ApplicationForm;
 
     async wizardTitle() {
-        return await $("ak-wizard-frame").$(".pf-c-wizard__title");
+        return await $(">>>ak-wizard-frame").$(">>>.pf-c-wizard__title");
     }
 
     async providerList() {
-        return await $("ak-application-wizard-authentication-method-choice");
+        return await $(">>>ak-application-wizard-authentication-method-choice");
     }
 
     async nextButton() {
-        return await $("ak-wizard-frame").$("footer button.pf-m-primary");
+        return await $(">>>ak-wizard-frame").$(">>>footer button.pf-m-primary");
     }
 
     async getProviderType(type: string) {
@@ -46,7 +46,7 @@ class ApplicationWizardView extends AdminPage {
     }
 
     async successMessage() {
-        return await $('[data-commit-state="success"]');
+        return await $('>>>[data-commit-state="success"]');
     }
 }
 
@@ -70,7 +70,7 @@ providerValues.forEach(([value, name]: Pair) => {
             get: async function () {
                 return await (
                     await this.providerList()
-                ).$(`div[data-ouid-component-name="${value}"]`);
+                ).$(`>>>div[data-ouid-component-name="${value}"]`);
             },
         },
     });

web/tests/pageobjects/applications-list.page.ts

@@ -11,7 +11,7 @@ class ApplicationsListPage extends AdminPage {
      */
 
     async startWizardButton() {
-        return await $("ak-application-wizard").$('button[slot="trigger"]');
+        return await $(">>>ak-application-wizard").$('>>>button[slot="trigger"]');
     }
 
     async open() {

web/tests/pageobjects/forms/application.form.ts

@@ -4,15 +4,15 @@ import Page from "../page.js";
 
 export class ApplicationForm extends Page {
     async name() {
-        return await $('ak-text-input[name="name"]').$("input");
+        return await $('>>>ak-text-input[name="name"]').$(">>>input");
     }
 
     async uiSettings() {
-        return await $("ak-form-group").$('button[aria-label="UI Settings"]');
+        return await $(">>>ak-form-group").$('button[aria-label="UI Settings"]');
     }
 
     async launchUrl() {
-        return await $('input[name="metaLaunchUrl"]');
+        return await $('>>>input[name="metaLaunchUrl"]');
     }
 }
 

web/tests/pageobjects/forms/forward-proxy.form.ts

@@ -5,14 +5,14 @@ import Page from "../page.js";
 export class ForwardProxyForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
-            'ak-flow-search[name="authorizationFlow"]',
+            '>>>ak-flow-search[name="authorizationFlow"]',
             "authorizationFlow",
             selector,
         );
     }
 
     get externalHost() {
-        return $('input[name="externalHost"]');
+        return $('>>>input[name="externalHost"]');
     }
 }
 

web/tests/pageobjects/forms/ldap.form.ts

@@ -3,7 +3,7 @@ import Page from "../page.js";
 export class LdapForm extends Page {
     async setBindFlow() {
         await this.searchSelect(
-            'ak-search-select-view[name="authorizationFlow"]',
+            '>>>ak-search-select-view[name="authorizationFlow"]',
             "authorizationFlow",
             "default-authentication-flow",
         );

web/tests/pageobjects/forms/oauth.form.ts

@@ -5,14 +5,14 @@ import Page from "../page.js";
 export class OauthForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
-            'ak-flow-search[name="authorizationFlow"]',
+            '>>>ak-flow-search[name="authorizationFlow"]',
             "authorizationFlow",
             `${selector}`,
         );
     }
 
     async providerName() {
-        return await $('ak-form-element-horizontal[name="name"]').$("input");
+        return await $('>>>ak-form-element-horizontal[name="name"]').$("input");
     }
 }
 

web/tests/pageobjects/forms/radius.form.ts

@@ -3,7 +3,7 @@ import Page from "../page.js";
 export class RadiusForm extends Page {
     async setAuthenticationFlow(selector: string) {
         await this.searchSelect(
-            'ak-branded-flow-search[name="authorizationFlow"]',
+            '>>>ak-branded-flow-search[name="authorizationFlow"]',
             "authorizationFlow",
             selector,
         );

web/tests/pageobjects/forms/saml.form.ts

@@ -5,14 +5,14 @@ import Page from "../page.js";
 export class SamlForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
-            'ak-flow-search[name="authorizationFlow"]',
+            '>>>ak-flow-search[name="authorizationFlow"]',
             "authorizationFlow",
             selector,
         );
     }
 
     get acsUrl() {
-        return $('input[name="acsUrl"]');
+        return $('>>>input[name="acsUrl"]');
     }
 }
 

web/tests/pageobjects/forms/scim.form.ts

@@ -2,11 +2,11 @@ import Page from "../page.js";
 
 export class ScimForm extends Page {
     get url() {
-        return $('input[name="url"]');
+        return $('>>>input[name="url"]');
     }
 
     get token() {
-        return $('input[name="token"]');
+        return $('>>>input[name="token"]');
     }
 }
 

web/tests/pageobjects/forms/transparent-proxy.form.ts

@@ -5,18 +5,18 @@ import Page from "../page.js";
 export class TransparentProxyForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
-            'ak-flow-search[name="authorizationFlow"]',
+            '>>>ak-flow-search[name="authorizationFlow"]',
             "authorizationFlow",
             selector,
         );
     }
 
     get externalHost() {
-        return $('input[name="externalHost"]');
+        return $('>>>input[name="externalHost"]');
     }
 
     get internalHost() {
-        return $('input[name="internalHost"]');
+        return $('>>>input[name="internalHost"]');
     }
 }
 

web/tests/pageobjects/login.page.ts

@@ -11,23 +11,23 @@ class LoginPage extends Page {
      * Selectors
      */
     async inputUsername() {
-        return await $('input[name="uidField"]');
+        return await $('>>>input[name="uidField"]');
     }
 
     async usernameBtnSubmit() {
-        return await $('button[type="submit"]');
+        return await $('>>>button[type="submit"]');
     }
 
     async inputPassword() {
-        return await $("input#ak-stage-password-input");
+        return await $(">>>input#ak-stage-password-input");
     }
 
     async passwordBtnSubmit() {
-        return await $("ak-stage-password").$('button[type="submit"]');
+        return await $(">>>ak-stage-password").$('>>>button[type="submit"]');
     }
 
     async authFailure() {
-        return await $(".pf-m-error");
+        return await $(">>>.pf-m-error");
     }
 
     /**
@@ -53,7 +53,7 @@ class LoginPage extends Page {
         await this.pause();
         await this.password(password);
         await this.pause();
-        await this.pause("div.header h1");
+        await this.pause(">>>div.header h1");
         return UserLibraryPage;
     }
 

web/tests/pageobjects/page.ts

@@ -34,11 +34,11 @@ export default class Page {
 
     async searchSelect(searchSelector: string, managedSelector: string, buttonSelector: string) {
         const inputBind = await $(searchSelector);
-        const inputMain = await inputBind.$('input[type="text"]');
+        const inputMain = await inputBind.$('>>>input[type="text"]');
         await inputMain.click();
         const searchBlock = await (
-            await $(`div[data-managed-for="${managedSelector}"]`).$("ak-list-select")
-        ).shadow$$("button");
+            await $(`>>>div[data-managed-for="${managedSelector}"]`).$(">>>ak-list-select")
+        ).$$(">>>button");
         let target: WebdriverIO.Element;
         // @ts-expect-error "Types break on shadow$$"
         for (const button of searchBlock) {

web/tests/pageobjects/user-library.page.ts

@@ -11,11 +11,11 @@ class UserLibraryPage extends Page {
      */
 
     public async pageHeader() {
-        return await $('h1[aria-level="1"]');
+        return await $('>>>h1[aria-level="1"]');
     }
 
     public async goToAdmin() {
-        await $('a[href="/if/admin"]').click();
+        await $('>>>a[href="/if/admin"]').click();
         return await $("ak-admin-overview").waitForDisplayed();
     }
 }

web/tests/specs/new-application-by-wizard.ts

@@ -16,7 +16,7 @@ async function reachTheProvider(title: string) {
     await ApplicationsListPage.logout();
     await login();
     await ApplicationsListPage.open();
-    await ApplicationsListPage.pause("ak-page-header");
+    await ApplicationsListPage.pause();
     await expect(await ApplicationsListPage.pageHeader()).toBeDisplayed();
     await expect(await ApplicationsListPage.pageHeader()).toHaveText("Applications");
 

web/tests/specs/oauth-provider.ts

@@ -22,13 +22,13 @@ describe("Configure Oauth2 Providers", () => {
 
         await reachTheProvider();
 
-        await $("ak-wizard-page-type-create").waitForDisplayed();
-        await $('div[data-ouid-component-name="oauth2provider"]').scrollIntoView();
-        await $('div[data-ouid-component-name="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();
 
-        return await $('ak-form-element-horizontal[name="name"]').$("input");
+        return await $('>>>ak-form-element-horizontal[name="name"]').$(">>>input");
         await ProviderWizardView.oauth.setAuthorizationFlow(
             "default-provider-authorization-explicit-consent",
         );