web: eslint & prettier fixes, plus small aesthetic differences.

tests/wdio/test/pageobjects/admin.page.ts

@@ -4,7 +4,6 @@ import { browser } from "@wdio/globals";
 const CLICK_TIME_DELAY = 250;
 
 export default class AdminPage extends Page {
-
     public get pageHeader() {
         return $('>>>ak-page-header slot[name="header"]');
     }

tests/wdio/test/pageobjects/application-wizard.page.ts

@@ -1,12 +1,12 @@
 import AdminPage from "./admin.page.js";
 import ApplicationForm from "./forms/application.form.js";
+import ForwardProxyForm from "./forms/forward-proxy.form.js";
 import LdapForm from "./forms/ldap.form.js";
 import OauthForm from "./forms/oauth.form.js";
-import TransparentProxyForm from "./forms/transparent-proxy.form.js";
+import RadiusForm from "./forms/radius.form.js";
-import ForwardProxyForm from "./forms/forward-proxy.form.js";
 import SamlForm from "./forms/saml.form.js";
 import ScimForm from "./forms/scim.form.js";
-import RadiusForm from "./forms/radius.form.js";
+import TransparentProxyForm from "./forms/transparent-proxy.form.js";
 import { $ } from "@wdio/globals";
 
 /**
@@ -44,7 +44,7 @@ class ApplicationWizardView extends AdminPage {
     }
 
     get successMessage() {
-        return $('>>>[data-commit-state="success"]')
+        return $('>>>[data-commit-state="success"]');
     }
 }
 

tests/wdio/test/pageobjects/forms/application.form.ts

@@ -1,5 +1,5 @@
-import { $ } from "@wdio/globals";
 import Page from "../page.js";
+import { $ } from "@wdio/globals";
 
 export class ApplicationForm extends Page {
     get name() {

tests/wdio/test/pageobjects/forms/forward-proxy.form.ts

@@ -1,12 +1,12 @@
-import { $ } from "@wdio/globals";
 import Page from "../page.js";
+import { $ } from "@wdio/globals";
 
 export class ForwardProxyForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
             '>>>ak-flow-search[name="authorizationFlow"] input[type="text"]',
             "authorizationFlow",
-            `button*=${selector}`
+            `button*=${selector}`,
         );
     }
 

tests/wdio/test/pageobjects/forms/ldap.form.ts

@@ -5,7 +5,7 @@ export class LdapForm extends Page {
         await this.searchSelect(
             '>>>ak-tenanted-flow-search[name="authorizationFlow"] input[type="text"]',
             "authorizationFlow",
-            `button*=${selector}`
+            `button*=${selector}`,
         );
     }
 }

tests/wdio/test/pageobjects/forms/radius.form.ts

@@ -5,7 +5,7 @@ export class RadiusForm extends Page {
         await this.searchSelect(
             '>>>ak-tenanted-flow-search[name="authorizationFlow"] input[type="text"]',
             "authorizationFlow",
-            `button*=${selector}`
+            `button*=${selector}`,
         );
     }
 }

tests/wdio/test/pageobjects/forms/saml.form.ts

@@ -1,12 +1,12 @@
-import { $ } from "@wdio/globals";
 import Page from "../page.js";
+import { $ } from "@wdio/globals";
 
 export class SamlForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
             '>>>ak-flow-search[name="authorizationFlow"] input[type="text"]',
             "authorizationFlow",
-            `button*=${selector}`
+            `button*=${selector}`,
         );
     }
 

tests/wdio/test/pageobjects/forms/scim.form.ts

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

tests/wdio/test/pageobjects/forms/transparent-proxy.form.ts

@@ -1,12 +1,12 @@
-import { $ } from "@wdio/globals";
 import Page from "../page.js";
+import { $ } from "@wdio/globals";
 
 export class TransparentProxyForm extends Page {
     async setAuthorizationFlow(selector: string) {
         await this.searchSelect(
             '>>>ak-flow-search[name="authorizationFlow"] input[type="text"]',
             "authorizationFlow",
-            `button*=${selector}`
+            `button*=${selector}`,
         );
     }
 

tests/wdio/test/specs/new-application-by-wizard.ts

@@ -4,41 +4,34 @@ import { randomId } from "../utils/index.js";
 import { login } from "../utils/login.js";
 import { expect } from "@wdio/globals";
 
-
-
 async function reachTheProvider(title: string) {
     const newPrefix = randomId();
-    
+
     await ApplicationsListPage.logout();
     await login();
     await ApplicationsListPage.open();
     await expect(await ApplicationsListPage.pageHeader).toHaveText("Applications");
-    
+
     await ApplicationsListPage.startWizardButton.click();
     await ApplicationWizardView.wizardTitle.waitForDisplayed();
     await expect(await ApplicationWizardView.wizardTitle).toHaveText("New application");
-    
+
     await ApplicationWizardView.app.name.setValue(`${title} - ${newPrefix}`);
     await ApplicationWizardView.app.uiSettings.scrollIntoView();
     await ApplicationWizardView.app.uiSettings.click();
     await ApplicationWizardView.app.launchUrl.scrollIntoView();
-    await ApplicationWizardView.app.launchUrl.setValue('http://example.goauthentik.io');
+    await ApplicationWizardView.app.launchUrl.setValue("http://example.goauthentik.io");
-    
+
     await ApplicationWizardView.nextButton.click();
     return await ApplicationWizardView.pause();
 }
 
-
 async function getCommitMessage() {
     await ApplicationWizardView.successMessage.waitForDisplayed();
     return await ApplicationWizardView.successMessage;
 }
 
-
 describe("Configure Applications with the Application Wizard", () => {
-        
-
-
     it("Should configure a simple LDAP Application", async () => {
         await reachTheProvider("New LDAP Application");
 
@@ -53,9 +46,7 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple Oauth2 Application", async () => {
@@ -69,14 +60,12 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.pause();
 
         await ApplicationWizardView.oauth.setAuthorizationFlow(
-            "default-provider-authorization-explicit-consent"
+            "default-provider-authorization-explicit-consent",
         );
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple SAML Application", async () => {
@@ -90,15 +79,13 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.pause();
 
         await ApplicationWizardView.saml.setAuthorizationFlow(
-            "default-provider-authorization-explicit-consent"
+            "default-provider-authorization-explicit-consent",
         );
         await ApplicationWizardView.saml.acsUrl.setValue("http://example.com:8000/");
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple SCIM Application", async () => {
@@ -116,9 +103,7 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple Radius Application", async () => {
@@ -131,15 +116,11 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await ApplicationWizardView.radius.setAuthenticationFlow(
+        await ApplicationWizardView.radius.setAuthenticationFlow("default-authentication-flow");
-            "default-authentication-flow"
-        );
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple Transparent Proxy Application", async () => {
@@ -152,17 +133,19 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.pause();
 
         await ApplicationWizardView.transparentProxy.setAuthorizationFlow(
-            "default-provider-authorization-explicit-consent"
+            "default-provider-authorization-explicit-consent",
+        );
+        await ApplicationWizardView.transparentProxy.externalHost.setValue(
+            "http://external.example.com",
+        );
+        await ApplicationWizardView.transparentProxy.internalHost.setValue(
+            "http://internal.example.com",
         );
-        await ApplicationWizardView.transparentProxy.externalHost.setValue("http://external.example.com");
-        await ApplicationWizardView.transparentProxy.internalHost.setValue("http://internal.example.com");
 
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 
     it("Should configure a simple Forward Proxy Application", async () => {
@@ -175,15 +158,15 @@ describe("Configure Applications with the Application Wizard", () => {
         await ApplicationWizardView.pause();
 
         await ApplicationWizardView.forwardProxy.setAuthorizationFlow(
-            "default-provider-authorization-explicit-consent"
+            "default-provider-authorization-explicit-consent",
+        );
+        await ApplicationWizardView.forwardProxy.externalHost.setValue(
+            "http://external.example.com",
         );
-        await ApplicationWizardView.forwardProxy.externalHost.setValue("http://external.example.com");
 
         await ApplicationWizardView.nextButton.click();
         await ApplicationWizardView.pause();
 
-        await expect(getCommitMessage()).toHaveText(
+        await expect(getCommitMessage()).toHaveText("Your application has been saved");
-            "Your application has been saved"
-        );
     });
 });

tests/wdio/wdio.conf.ts

@@ -209,8 +209,7 @@ export const config: Options.Testrunner = {
      * @param {Array.<String>} specs        List of spec file paths that are to be run
      * @param {object}         browser      instance of created browser/device session
      */
-    before: function (capabilities, specs) {
+    before: function (capabilities, specs) {},
-    },
     /**
      * Runs before a WebdriverIO command gets executed.
      * @param {string} commandName hook command name

web/src/components/ak-slug-input.ts

@@ -101,6 +101,7 @@ export class AkSlugInput extends AKElement {
         // iteration are *similar enough*, set the input value. "Similar enough" here is defined as
         // "any event which adds or removes a character but leaves the rest of the slug looking like
         // the previous iteration, set it to the current iteration."
+
         const newSlug = convertToSlug(ev.target.value);
         const oldSlug = this.input.value;
         const [shorter, longer] =