change to use typescript

tests/cypress/integration/00_set_new_admin_console.spec.ts

@@ -0,0 +1,23 @@
+import LoginPage from "../support/pages/LoginPage";
+import WelcomePage from "../support/pages/WelcomePage";
+import OldClientPage from "../support/pages/admin_console/manage/clients/OldClientPage";
+
+describe("Set up test", function () {
+  const loginPage = new LoginPage();
+  const welcomePage = new WelcomePage();
+  const oldClientPage = new OldClientPage();
+
+  describe("Set up test", function () {
+    beforeEach(function () {
+      cy.visit("http://localhost:8180/auth");
+    });
+
+    it("Create admin user and adds admin console client", function () {
+      welcomePage.createAdminUser().goToAdminConsole();
+
+      loginPage.logIn();
+
+      oldClientPage.goToClients().addNewAdminConsole();
+    });
+  });
+});

tests/cypress/integration/client_scopes_test.spec.ts

@@ -1,8 +1,8 @@
-import LoginPage from "../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import Masthead from "../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
-import ListingPage from "../support/pages/admin_console/ListingPage.js";
+import ListingPage from "../support/pages/admin_console/ListingPage";
-import SidebarPage from "../support/pages/admin_console/SidebarPage.js";
+import SidebarPage from "../support/pages/admin_console/SidebarPage";
-import CreateClientScopePage from "../support/pages/admin_console/manage/client_scopes/CreateClientScopePage.js";
+import CreateClientScopePage from "../support/pages/admin_console/manage/client_scopes/CreateClientScopePage";
 
 let itemId = "client_scope_crud";
 const loginPage = new LoginPage();
@@ -36,26 +36,20 @@ describe("Client Scopes test", function () {
       );
     });
 
-    it('Client scope CRUD test',async function () {
+    it("Client scope CRUD test", () => {
       itemId += "_" + (Math.random() + 1).toString(36).substring(7);
 
       // Create
-      listingPage
+      listingPage.itemExist(itemId, false).goToCreateItem();
-        .itemExist(itemId, false)
-        .goToCreateItem();
 
-      createClientScopePage
+      createClientScopePage.fillClientScopeData(itemId).save();
-        .fillClientScopeData(itemId)
-        .save();
 
         masthead.checkNotificationMessage("Client scope created");
 
       sidebarPage.goToClientScopes();
 
       // Delete
-      listingPage
+      listingPage.itemExist(itemId).deleteItem(itemId); // There should be a confirmation pop-up
-        .itemExist(itemId)
-        .deleteItem(itemId); // There should be a confirmation pop-up
 
         masthead.checkNotificationMessage("The client scope has been deleted");
 
@@ -63,4 +57,4 @@ describe("Client Scopes test", function () {
         .itemExist(itemId, false);
     });
   });
-})
+});

tests/cypress/integration/clients_test.spec.ts

@@ -1,8 +1,8 @@
-import LoginPage from "../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import Masthead from "../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
-import ListingPage from "../support/pages/admin_console/ListingPage.js";
+import ListingPage from "../support/pages/admin_console/ListingPage";
-import SidebarPage from "../support/pages/admin_console/SidebarPage.js";
+import SidebarPage from "../support/pages/admin_console/SidebarPage";
-import CreateClientPage from "../support/pages/admin_console/manage/clients/CreateClientPage.js";
+import CreateClientPage from "../support/pages/admin_console/manage/clients/CreateClientPage";
 
 let itemId = "client_crud";
 const loginPage = new LoginPage();
@@ -51,7 +51,7 @@ describe("Clients test", function () {
 
     it("Client CRUD test", function () {
       itemId += "_" + (Math.random() + 1).toString(36).substring(7);
-      
+
       // Create
       listingPage.itemExist(itemId, false).goToCreateItem();
 
@@ -65,13 +65,10 @@ describe("Clients test", function () {
 
       sidebarPage.goToClients();
 
-      listingPage
+      listingPage.searchItem(itemId).itemExist(itemId);
-        .searchItem(itemId)
-        .itemExist(itemId);
 
       // Delete
-      listingPage
+      listingPage.deleteItem(itemId); // There should be a confirmation pop-up
-        .deleteItem(itemId); // There should be a confirmation pop-up
 
       masthead.checkNotificationMessage("The client has been deleted");
 

tests/cypress/integration/login_test.spec.ts

@@ -1,5 +1,5 @@
-import LoginPage from "./../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import Masthead from "./../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
 
 const username = "admin";
 const password = "admin";

tests/cypress/integration/masthead_test.spec.ts

@@ -1,7 +1,7 @@
-import ListingPage from "../support/pages/admin_console/ListingPage.js";
+import ListingPage from "../support/pages/admin_console/ListingPage";
-import LoginPage from "../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import SidebarPage from "../support/pages/admin_console/SidebarPage.js";
+import SidebarPage from "../support/pages/admin_console/SidebarPage";
-import Masthead from "../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
 
 const loginPage = new LoginPage();
 const masthead = new Masthead();

tests/cypress/integration/realm_roles_test.spec.ts

@@ -1,9 +1,9 @@
-import LoginPage from "../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import Masthead from "../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
-import ModalUtils from "../support/util/ModalUtils.js";
+import ModalUtils from "../support/util/ModalUtils";
-import ListingPage from "../support/pages/admin_console/ListingPage.js";
+import ListingPage from "../support/pages/admin_console/ListingPage";
-import SidebarPage from "../support/pages/admin_console/SidebarPage.js";
+import SidebarPage from "../support/pages/admin_console/SidebarPage";
-import CreateRealmRolePage from "../support/pages/admin_console/manage/realm_roles/CreateRealmRolePage.js";
+import CreateRealmRolePage from "../support/pages/admin_console/manage/realm_roles/CreateRealmRolePage";
 
 let itemId = "realm_role_crud";
 const loginPage = new LoginPage();
@@ -39,9 +39,7 @@ describe("Realm roles test", function () {
       itemId += "_" + (Math.random() + 1).toString(36).substring(7);
 
       // Create
-      listingPage
+      listingPage.itemExist(itemId, false).goToCreateItem();
-        .itemExist(itemId, false)
-        .goToCreateItem();
 
       createRealmRolePage.fillRealmRoleData(itemId).save();
 
@@ -49,15 +47,12 @@ describe("Realm roles test", function () {
 
       sidebarPage.goToRealmRoles();
 
-      listingPage
+      listingPage.searchItem(itemId).itemExist(itemId);
-        .searchItem(itemId)
-        .itemExist(itemId);
 
       // Update
-      
+
       // Delete
-      listingPage
+      listingPage.deleteItem(itemId);
-        .deleteItem(itemId);
 
       modalUtils.checkModalTitle("Delete role?").confirmModal();
 

tests/cypress/integration/realm_test.spec.ts

@@ -1,7 +1,7 @@
-import LoginPage from "../support/pages/LoginPage.js";
+import LoginPage from "../support/pages/LoginPage";
-import SidebarPage from "../support/pages/admin_console/SidebarPage.js";
+import SidebarPage from "../support/pages/admin_console/SidebarPage";
-import CreateRealmPage from "../support/pages/admin_console/CreateRealmPage.js";
+import CreateRealmPage from "../support/pages/admin_console/CreateRealmPage";
-import Masthead from "../support/pages/admin_console/Masthead.js";
+import Masthead from "../support/pages/admin_console/Masthead";
 
 const masthead = new Masthead();
 const loginPage = new LoginPage();

tests/cypress/support/pages/LoginPage.ts

@@ -0,0 +1,43 @@
+export default class LoginPage {
+  userNameInput: string;
+  passwordInput: string;
+  submitBtn: string;
+  errorText: string;
+  userDrpDwn: string;
+
+  constructor() {
+    this.userNameInput = "#username";
+    this.passwordInput = "#password";
+    this.submitBtn = "#kc-login";
+
+    this.errorText = ".kc-feedback-text";
+  }
+
+  isLogInPage() {
+    cy.get(this.userNameInput).should("exist");
+    cy.url().should("include", "/auth");
+
+    return this;
+  }
+
+  logIn(userName = "admin", password = "admin") {
+    cy.get(this.userNameInput).type(userName);
+    cy.get(this.passwordInput).type(password);
+
+    cy.get(this.submitBtn).click();
+
+    return this;
+  }
+
+  checkErrorIsDisplayed() {
+    cy.get(this.userDrpDwn).should("exist");
+
+    return this;
+  }
+
+  checkErrorMessage(message: string) {
+    cy.get(this.errorText).invoke("text").should("contain", message);
+
+    return this;
+  }
+}

tests/cypress/support/pages/WelcomePage.js

@@ -1,27 +0,0 @@
-export default class WelcomePage {
-
-    constructor() {
-        this.userNameInput = "#username";
-        this.passwordInput = "#password";
-        this.confirmPasswordInput = "#passwordConfirmation";
-        this.createBtn = "#create-button";
-
-        this.adminConsoleBtn = ".welcome-primary-link a";
-    }
-
-    createAdminUser(userName = "admin", password = "admin") {
-        cy.get(this.userNameInput).type(userName);
-        cy.get(this.passwordInput).type(password);
-        cy.get(this.confirmPasswordInput).type(password);
-
-        cy.get(this.createBtn).click();
-
-        return this;
-    }
-
-    goToAdminConsole() {
-        cy.get(this.adminConsoleBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/WelcomePage.ts

@@ -0,0 +1,32 @@
+export default class WelcomePage {
+  userNameInput: string;
+  passwordInput: string;
+  confirmPasswordInput: string;
+  createBtn: string;
+  adminConsoleBtn: string;
+
+  constructor() {
+    this.userNameInput = "#username";
+    this.passwordInput = "#password";
+    this.confirmPasswordInput = "#passwordConfirmation";
+    this.createBtn = "#create-button";
+
+    this.adminConsoleBtn = ".welcome-primary-link a";
+  }
+
+  createAdminUser(userName = "admin", password = "admin") {
+    cy.get(this.userNameInput).type(userName);
+    cy.get(this.passwordInput).type(password);
+    cy.get(this.confirmPasswordInput).type(password);
+
+    cy.get(this.createBtn).click();
+
+    return this;
+  }
+
+  goToAdminConsole() {
+    cy.get(this.adminConsoleBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/CreateRealmPage.js

@@ -1,25 +0,0 @@
-export default class CreateRealmPage {
-
-    constructor() {
-        this.browseBtn = '#kc-realm-filename-browse-button';
-        this.clearBtn = '.pf-c-file-upload__file-select button:last-child';
-        this.realmFileNameInput = '#kc-realm-filename';
-        this.realmNameInput = '#kc-realm-name';
-        this.enabledSwitch = '[for="kc-realm-enabled-switch"] span.pf-c-switch__toggle';
-
-        this.createBtn = '.pf-c-form__group:last-child button[type="submit"]';
-        this.cancelBtn = '.pf-c-form__group:last-child button[type="button"]';
-    }
-
-    fillRealmName(realmName) {
-        cy.get(this.realmNameInput).type(realmName);
-
-        return this;
-    }
-
-    createRealm() {
-        cy.get(this.createBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/CreateRealmPage.ts

@@ -0,0 +1,33 @@
+export default class CreateRealmPage {
+  browseBtn: string;
+  clearBtn: string;
+  realmFileNameInput: string;
+  realmNameInput: string;
+  enabledSwitch: string;
+  createBtn: string;
+  cancelBtn: string;
+
+  constructor() {
+    this.browseBtn = "#kc-realm-filename-browse-button";
+    this.clearBtn = ".pf-c-file-upload__file-select button:last-child";
+    this.realmFileNameInput = "#kc-realm-filename";
+    this.realmNameInput = "#kc-realm-name";
+    this.enabledSwitch =
+      '[for="kc-realm-enabled-switch"] span.pf-c-switch__toggle';
+
+    this.createBtn = '.pf-c-form__group:last-child button[type="submit"]';
+    this.cancelBtn = '.pf-c-form__group:last-child button[type="button"]';
+  }
+
+  fillRealmName(realmName) {
+    cy.get(this.realmNameInput).type(realmName);
+
+    return this;
+  }
+
+  createRealm() {
+    cy.get(this.createBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/ListingPage.js

@@ -1,58 +0,0 @@
-export default class ListingPage {
-
-    constructor() {
-        this.searchInput = '.pf-c-toolbar__item [type="search"]';
-        this.itemsRows = '.pf-c-page__main-section table';
-        this.itemRowDrpDwn = '.pf-c-dropdown > button';
-        this.exportBtn = '[role="menuitem"]:nth-child(1)';
-        this.deleteBtn = '[role="menuitem"]:nth-child(2)';
-        this.searchBtn = '.pf-c-page__main .pf-c-toolbar__content-section button.pf-m-control';
-        this.createBtn = '.pf-c-page__main .pf-c-toolbar__content-section button.pf-m-primary';
-        this.importBtn = '.pf-c-page__main .pf-c-toolbar__content-section button.pf-m-link';
-    }
-
-    goToCreateItem() {
-        cy.get(this.createBtn).click();
-
-        return this;
-    }
-
-    goToImportItem() {
-        cy.get(this.importBtn).click();
-
-        return this;
-    }
-
-    searchItem(searchValue) {
-        cy.get(this.searchInput).type(searchValue);
-        cy.get(this.searchBtn).click();
-
-        return this;
-    }
-
-    itemExist(itemName, exist = true) {
-        cy.get(this.itemsRows).contains(itemName).should((!exist ? 'not.': '') + 'exist')
-
-        return this;
-    }
-
-    goToItemDetails(itemName) {
-        cy.get(this.itemsRows).contains(itemName).click();
-
-        return this;
-    }
-
-    deleteItem(itemName) {
-        cy.get(this.itemsRows).contains(itemName).parentsUntil('tbody').find(this.itemRowDrpDwn).click();
-        cy.get(this.itemsRows).contains('Delete').click();
-
-        return this;
-    }
-
-    exportItem(itemName) {
-        cy.get(this.itemsRows).contains(itemName).parentsUntil('tbody').find(this.itemRowDrpDwn).click();
-        cy.get(this.itemsRows).contains('Export').click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/ListingPage.ts

@@ -0,0 +1,79 @@
+export default class ListingPage {
+  searchInput: string;
+  itemsRows: string;
+  itemRowDrpDwn: string;
+  exportBtn: string;
+  deleteBtn: string;
+  searchBtn: string;
+  createBtn: string;
+  importBtn: string;
+
+  constructor() {
+    this.searchInput = '.pf-c-toolbar__item [type="search"]';
+    this.itemsRows = ".pf-c-page__main-section table";
+    this.itemRowDrpDwn = ".pf-c-dropdown > button";
+    this.exportBtn = '[role="menuitem"]:nth-child(1)';
+    this.deleteBtn = '[role="menuitem"]:nth-child(2)';
+    this.searchBtn =
+      ".pf-c-page__main .pf-c-toolbar__content-section button.pf-m-control";
+    this.createBtn =
+      ".pf-c-page__main .pf-c-toolbar__content-section button.pf-m-primary";
+    this.importBtn =
+      ".pf-c-page__main .pf-c-toolbar__content-section button.pf-m-link";
+  }
+
+  goToCreateItem() {
+    cy.get(this.createBtn).click();
+
+    return this;
+  }
+
+  goToImportItem() {
+    cy.get(this.importBtn).click();
+
+    return this;
+  }
+
+  searchItem(searchValue) {
+    cy.get(this.searchInput).type(searchValue);
+    cy.get(this.searchBtn).click();
+
+    return this;
+  }
+
+  itemExist(itemName, exist = true) {
+    cy.get(this.itemsRows)
+      .contains(itemName)
+      .should((!exist ? "not." : "") + "exist");
+
+    return this;
+  }
+
+  goToItemDetails(itemName) {
+    cy.get(this.itemsRows).contains(itemName).click();
+
+    return this;
+  }
+
+  deleteItem(itemName) {
+    cy.get(this.itemsRows)
+      .contains(itemName)
+      .parentsUntil("tbody")
+      .find(this.itemRowDrpDwn)
+      .click();
+    cy.get(this.itemsRows).contains("Delete").click();
+
+    return this;
+  }
+
+  exportItem(itemName) {
+    cy.get(this.itemsRows)
+      .contains(itemName)
+      .parentsUntil("tbody")
+      .find(this.itemRowDrpDwn)
+      .click();
+    cy.get(this.itemsRows).contains("Export").click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/Masthead.ts

@@ -1,4 +1,9 @@
 export default class Masthead {
+  menuBtn: string;
+  logoBtn: string;
+  helpBtn: string;
+  userDrpDwn: string;
+  userDrpDwnKebab: string;
   constructor() {
     this.menuBtn = "#nav-toggle";
     this.logoBtn = "#masthead-logo";
@@ -23,7 +28,7 @@ export default class Masthead {
     if (isMobileMode) {
       cy.viewport("iphone-6");
     } else {
-      cy.viewport();
+      cy.viewport(1024, 768);
     }
   }
 

tests/cypress/support/pages/admin_console/SidebarPage.js

@@ -1,105 +0,0 @@
-export default class SidebarPage {
-
-    constructor() {
-        this.realmsDrpDwn = '#realm-select-toggle';
-        this.realmsList = '#realm-select ul';
-        this.createRealmBtn = '#realm-select li:last-child a';
-
-        this.clientsBtn = '#nav-item-clients';
-        this.clientScopesBtn = '#nav-item-client-scopes';
-        this.realmRolesBtn = '#nav-item-roles';
-        this.usersBtn = '#nav-item-users';
-        this.groupsBtn = '#nav-item-groups';
-        this.sessionsBtn = '#nav-item-sessions';
-        this.eventsBtn = '#nav-item-events';
-
-        this.realmSettingsBtn = '#nav-item-realm-settings';
-        this.authenticationBtn = '#nav-item-authentication';
-        this.identityProvidersBtn = '#nav-item-identity-providers';
-        this.userFederationBtn = '#nav-item-user-federation';
-    }
-
-    getCurrentRealm() {
-        return cy.get(this.realmsDrpDwn).invoke('text');
-    }
-
-    goToRealm(realmName) {
-        cy.get(this.realmsDrpDwn).click();
-        cy.get(this.realmsList).contains(realmName).click();
-
-        return this;
-    }
-
-    goToCreateRealm() {
-        cy.get(this.realmsDrpDwn).click();
-        cy.get(this.createRealmBtn).click();
-
-        return this;
-    }
-
-    goToClients() {
-        cy.get(this.clientsBtn).click();
-
-        return this;
-    }
-
-    goToClientScopes() {
-        cy.get(this.clientScopesBtn).click();
-
-        return this;
-    }
-
-    goToRealmRoles() {
-        cy.get(this.realmRolesBtn).click();
-
-        return this;
-    }
-
-    goToUsers() {
-        cy.get(this.usersBtn).click();
-
-        return this;
-    }
-
-    goToGroups() {
-        cy.get(this.groupsBtn).click();
-
-        return this;
-    }
-
-    goToSessions() {
-        cy.get(this.sessionsBtn).click();
-
-        return this;
-    }
-
-    goToEvents() {
-        cy.get(this.eventsBtn).click();
-
-        return this;
-    }
-
-    goToRealmSettings() {
-        cy.get(this.realmSettingsBtn).click();
-
-        return this;
-    }
-
-    goToAuthentication() {
-        cy.get(this.authenticationBtn).click();
-
-        return this;
-    }
-
-    goToIdentityProviders() {
-        cy.get(this.identityProvidersBtn).click();
-
-        return this;
-    }
-
-    goToUserFederation() {
-        cy.get(this.userFederationBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/SidebarPage.ts

@@ -0,0 +1,119 @@
+export default class SidebarPage {
+  realmsDrpDwn: string;
+  realmsList: string;
+  createRealmBtn: string;
+  clientsBtn: string;
+  clientScopesBtn: string;
+  realmRolesBtn: string;
+  usersBtn: string;
+  groupsBtn: string;
+  sessionsBtn: string;
+  eventsBtn: string;
+  realmSettingsBtn: string;
+  authenticationBtn: string;
+  identityProvidersBtn: string;
+  userFederationBtn: string;
+
+  constructor() {
+    this.realmsDrpDwn = "#realm-select-toggle";
+    this.realmsList = "#realm-select ul";
+    this.createRealmBtn = "#realm-select li:last-child a";
+
+    this.clientsBtn = "#nav-item-clients";
+    this.clientScopesBtn = "#nav-item-client-scopes";
+    this.realmRolesBtn = "#nav-item-roles";
+    this.usersBtn = "#nav-item-users";
+    this.groupsBtn = "#nav-item-groups";
+    this.sessionsBtn = "#nav-item-sessions";
+    this.eventsBtn = "#nav-item-events";
+
+    this.realmSettingsBtn = "#nav-item-realm-settings";
+    this.authenticationBtn = "#nav-item-authentication";
+    this.identityProvidersBtn = "#nav-item-identity-providers";
+    this.userFederationBtn = "#nav-item-user-federation";
+  }
+
+  getCurrentRealm() {
+    return cy.get(this.realmsDrpDwn).invoke("text");
+  }
+
+  goToRealm(realmName) {
+    cy.get(this.realmsDrpDwn).click();
+    cy.get(this.realmsList).contains(realmName).click();
+
+    return this;
+  }
+
+  goToCreateRealm() {
+    cy.get(this.realmsDrpDwn).click();
+    cy.get(this.createRealmBtn).click();
+
+    return this;
+  }
+
+  goToClients() {
+    cy.get(this.clientsBtn).click();
+
+    return this;
+  }
+
+  goToClientScopes() {
+    cy.get(this.clientScopesBtn).click();
+
+    return this;
+  }
+
+  goToRealmRoles() {
+    cy.get(this.realmRolesBtn).click();
+
+    return this;
+  }
+
+  goToUsers() {
+    cy.get(this.usersBtn).click();
+
+    return this;
+  }
+
+  goToGroups() {
+    cy.get(this.groupsBtn).click();
+
+    return this;
+  }
+
+  goToSessions() {
+    cy.get(this.sessionsBtn).click();
+
+    return this;
+  }
+
+  goToEvents() {
+    cy.get(this.eventsBtn).click();
+
+    return this;
+  }
+
+  goToRealmSettings() {
+    cy.get(this.realmSettingsBtn).click();
+
+    return this;
+  }
+
+  goToAuthentication() {
+    cy.get(this.authenticationBtn).click();
+
+    return this;
+  }
+
+  goToIdentityProviders() {
+    cy.get(this.identityProvidersBtn).click();
+
+    return this;
+  }
+
+  goToUserFederation() {
+    cy.get(this.userFederationBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/manage/client_scopes/CreateClientScopePage.js

@@ -1,81 +0,0 @@
-export default class CreateClientScopePage {
-
-    constructor() {
-        this.settingsTab = '.pf-c-tabs__item:nth-child(1)';
-        this.mappersTab = '.pf-c-tabs__item:nth-child(2)';
-
-        this.clientScopeNameInput = '#kc-name';
-        this.clientScopeNameError = '#kc-name-helper';
-        this.clientScopeDescriptionInput = '#kc-description';
-        this.clientScopeTypeDrpDwn = '#kc-protocol';
-        this.clientScopeTypeList = '#kc-protocol + ul';
-        this.displayOnConsentSwitch = '[id="kc-display.on.consent.screen"] + .pf-c-switch__toggle';
-        this.consentScreenTextInput = '#kc-consent-screen-text';
-        this.includeInTokenSwitch = '[id="includeInTokenScope"] + .pf-c-switch__toggle';
-        this.displayOrderInput = '#kc-gui-order';
-
-        this.saveBtn = '[type="submit"]';
-        this.cancelBtn = '[type="button"]';
-    }
-
-    //#region General Settings
-    fillClientScopeData(name, description = '', consentScreenText = '', displayOrder = '') {
-        cy.get(this.clientScopeNameInput).clear();
-
-        if(name) {
-            cy.get(this.clientScopeNameInput).type(name);
-        }
-
-        if(description) {
-            cy.get(this.clientScopeDescriptionInput).type(description);
-        }
-
-        if(consentScreenText) {
-            cy.get(this.consentScreenTextInput).type(consentScreenText);
-        }
-
-        if(displayOrder) {
-            cy.get(this.displayOrderInput).type(displayOrder);
-        }
-
-        return this;
-    }
-
-    selectClientScopeType(clientScopeType) {
-        cy.get(this.clientScopeTypeDrpDwn).click();
-        cy.get(this.clientScopeTypeList).contains(clientScopeType).click();
-
-        return this;
-    }
-
-    checkClientNameRequiredMessage(exist = true) {
-        cy.get(this.clientScopeNameError).should((!exist ? 'not.': '') + 'exist');
-
-        return this;
-    }
-    
-    switchDisplayOnConsentScreen() {
-        cy.get(this.displayOnConsentSwitch).click();
-
-        return this;
-    }
-
-    switchIncludeInTokenScope() {
-        cy.get(this.includeInTokenSwitch).click();
-
-        return this;
-    }
-    //#endregion
-
-    save() {
-        cy.get(this.saveBtn).click();
-
-        return this;
-    }
-
-    cancel() {
-        cy.get(this.cancelBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/manage/client_scopes/CreateClientScopePage.ts

@@ -0,0 +1,101 @@
+export default class CreateClientScopePage {
+  settingsTab: string;
+  mappersTab: string;
+  clientScopeNameInput: string;
+  clientScopeNameError: string;
+  clientScopeDescriptionInput: string;
+  clientScopeTypeDrpDwn: string;
+  clientScopeTypeList: string;
+  displayOnConsentSwitch: string;
+  consentScreenTextInput: string;
+  includeInTokenSwitch: string;
+  displayOrderInput: string;
+  saveBtn: string;
+  cancelBtn: string;
+
+  constructor() {
+    this.settingsTab = ".pf-c-tabs__item:nth-child(1)";
+    this.mappersTab = ".pf-c-tabs__item:nth-child(2)";
+
+    this.clientScopeNameInput = "#kc-name";
+    this.clientScopeNameError = "#kc-name-helper";
+    this.clientScopeDescriptionInput = "#kc-description";
+    this.clientScopeTypeDrpDwn = "#kc-protocol";
+    this.clientScopeTypeList = "#kc-protocol + ul";
+    this.displayOnConsentSwitch =
+      '[id="kc-display.on.consent.screen"] + .pf-c-switch__toggle';
+    this.consentScreenTextInput = "#kc-consent-screen-text";
+    this.includeInTokenSwitch =
+      '[id="includeInTokenScope"] + .pf-c-switch__toggle';
+    this.displayOrderInput = "#kc-gui-order";
+
+    this.saveBtn = '[type="submit"]';
+    this.cancelBtn = '[type="button"]';
+  }
+
+  //#region General Settings
+  fillClientScopeData(
+    name,
+    description = "",
+    consentScreenText = "",
+    displayOrder = ""
+  ) {
+    cy.get(this.clientScopeNameInput).clear();
+
+    if (name) {
+      cy.get(this.clientScopeNameInput).type(name);
+    }
+
+    if (description) {
+      cy.get(this.clientScopeDescriptionInput).type(description);
+    }
+
+    if (consentScreenText) {
+      cy.get(this.consentScreenTextInput).type(consentScreenText);
+    }
+
+    if (displayOrder) {
+      cy.get(this.displayOrderInput).type(displayOrder);
+    }
+
+    return this;
+  }
+
+  selectClientScopeType(clientScopeType) {
+    cy.get(this.clientScopeTypeDrpDwn).click();
+    cy.get(this.clientScopeTypeList).contains(clientScopeType).click();
+
+    return this;
+  }
+
+  checkClientNameRequiredMessage(exist = true) {
+    cy.get(this.clientScopeNameError).should((!exist ? "not." : "") + "exist");
+
+    return this;
+  }
+
+  switchDisplayOnConsentScreen() {
+    cy.get(this.displayOnConsentSwitch).click();
+
+    return this;
+  }
+
+  switchIncludeInTokenScope() {
+    cy.get(this.includeInTokenSwitch).click();
+
+    return this;
+  }
+  //#endregion
+
+  save() {
+    cy.get(this.saveBtn).click();
+
+    return this;
+  }
+
+  cancel() {
+    cy.get(this.cancelBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/manage/clients/CreateClientPage.js

@@ -1,118 +0,0 @@
-export default class CreateClientPage {
-
-    constructor() {
-        this.clientTypeDrpDwn = '.pf-c-select__toggle';
-        this.clientTypeError = '.pf-c-select + div';
-        this.clientTypeList = '.pf-c-select__toggle + ul';
-        this.clientIdInput = '#kc-client-id';
-        this.clientIdError = '#kc-client-id + div';
-        this.clientNameInput = '#kc-name';
-        this.clientDescriptionInput = '#kc-description';
-
-        this.clientAuthenticationSwitch = '[for="kc-authentication"] .pf-c-switch__toggle';
-        this.clientAuthorizationSwitch = '[for="kc-authorization"] .pf-c-switch__toggle';
-        this.standardFlowChkBx = '#kc-flow-standard';
-        this.directAccessChkBx = '#kc-flow-direct';
-        this.implicitFlowChkBx = '#kc-flow-implicit';
-        this.serviceAccountRolesChkBx = '#kc-flow-service-account';
-
-        this.continueBtn = '.pf-c-wizard__footer .pf-m-primary';
-        this.backBtn = '.pf-c-wizard__footer .pf-m-secondary';
-        this.cancelBtn = '.pf-c-wizard__footer .pf-m-link';
-    }
-
-    //#region General Settings
-    selectClientType(clientType) {
-        cy.get(this.clientTypeDrpDwn).click();
-        cy.get(this.clientTypeList).contains(clientType).click();
-
-        return this;
-    }
-
-    fillClientData(id, name = '', description = '') {
-        cy.get(this.clientIdInput).clear();
-
-        if(id) {
-            cy.get(this.clientIdInput).type(id);
-        }
-
-        if(name) {
-            cy.get(this.clientNameInput).type(name);
-        }
-
-        if(description) {
-            cy.get(this.clientDescriptionInput).type(description);
-        }
-
-        return this;
-    }
-
-    checkClientTypeRequiredMessage(exist = true) {
-        cy.get(this.clientTypeError).should((!exist ? 'not.': '') + 'exist');
-
-        return this;
-    }
-
-    checkClientIdRequiredMessage(exist = true) {
-        cy.get(this.clientIdError).should((!exist ? 'not.': '') + 'exist');
-
-        return this;
-    }
-    //#endregion
-
-    //#region Capability config
-    switchClientAuthentication() {
-        cy.get(this.clientAuthenticationSwitch).click();
-
-        return this;
-    }
-
-    switchClientAuthorization() {
-        cy.get(this.clientAuthorizationSwitch).click();
-
-        return this;
-    }
-
-    clickStandardFlow() {
-        cy.get(this.standardFlowChkBx).click();
-
-        return this;
-    }
-
-    clickDirectAccess() {
-        cy.get(this.directAccessChkBx).click();
-
-        return this;
-    }
-
-    clickImplicitFlow() {
-        cy.get(this.implicitFlowChkBx).click();
-
-        return this;
-    }
-
-    clickServiceAccountRoles() {
-        cy.get(this.serviceAccountRolesChkBx).click();
-
-        return this;
-    }
-    //#endregion
-
-    continue() {
-        cy.get(this.continueBtn).click();
-
-        return this;
-    }
-
-    back() {
-        cy.get(this.backBtn).click();
-
-        return this;
-    }
-
-    cancel() {
-        cy.get(this.cancelBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/manage/clients/CreateClientPage.ts

@@ -0,0 +1,129 @@
+export default class CreateClientPage {
+  clientTypeDrpDwn: string;
+  clientTypeError: string;
+  clientTypeList: string;
+  clientIdInput: string;
+  clientIdError: string;
+  clientDescriptionInput: string;
+  clientAuthenticationSwitch: string;
+  standardFlowChkBx: string;
+  directAccessChkBx: string;
+  implicitFlowChkBx: string;
+  serviceAccountRolesChkBx: string;
+  continueBtn: string;
+  backBtn: string;
+  cancelBtn: string;
+  clientNameInput: string;
+
+  constructor() {
+    this.clientTypeDrpDwn = ".pf-c-select__toggle";
+    this.clientTypeError = ".pf-c-select + div";
+    this.clientTypeList = ".pf-c-select__toggle + ul";
+    this.clientIdInput = "#kc-client-id";
+    this.clientIdError = "#kc-client-id + div";
+    this.clientNameInput = "#kc-name";
+    this.clientDescriptionInput = "#kc-description";
+
+    this.clientAuthenticationSwitch =
+      '[for="kc-authentication"] .pf-c-switch__toggle';
+    this.clientAuthenticationSwitch =
+      '[for="kc-authorization"] .pf-c-switch__toggle';
+    this.standardFlowChkBx = "#kc-flow-standard";
+    this.directAccessChkBx = "#kc-flow-direct";
+    this.implicitFlowChkBx = "#kc-flow-implicit";
+    this.serviceAccountRolesChkBx = "#kc-flow-service-account";
+
+    this.continueBtn = ".pf-c-wizard__footer .pf-m-primary";
+    this.backBtn = ".pf-c-wizard__footer .pf-m-secondary";
+    this.cancelBtn = ".pf-c-wizard__footer .pf-m-link";
+  }
+
+  //#region General Settings
+  selectClientType(clientType) {
+    cy.get(this.clientTypeDrpDwn).click();
+    cy.get(this.clientTypeList).contains(clientType).click();
+
+    return this;
+  }
+
+  fillClientData(id, name = "", description = "") {
+    cy.get(this.clientIdInput).clear();
+
+    if (id) {
+      cy.get(this.clientIdInput).type(id);
+    }
+
+    if (name) {
+      cy.get(this.clientNameInput).type(name);
+    }
+
+    if (description) {
+      cy.get(this.clientDescriptionInput).type(description);
+    }
+
+    return this;
+  }
+
+  checkClientTypeRequiredMessage(exist = true) {
+    cy.get(this.clientTypeError).should((!exist ? "not." : "") + "exist");
+
+    return this;
+  }
+
+  checkClientIdRequiredMessage(exist = true) {
+    cy.get(this.clientIdError).should((!exist ? "not." : "") + "exist");
+
+    return this;
+  }
+  //#endregion
+
+  //#region Capability config
+  switchClientAuthentication() {
+    cy.get(this.clientAuthenticationSwitch).click();
+
+    return this;
+  }
+
+  clickStandardFlow() {
+    cy.get(this.standardFlowChkBx).click();
+
+    return this;
+  }
+
+  clickDirectAccess() {
+    cy.get(this.directAccessChkBx).click();
+
+    return this;
+  }
+
+  clickImplicitFlow() {
+    cy.get(this.implicitFlowChkBx).click();
+
+    return this;
+  }
+
+  clickServiceAccountRoles() {
+    cy.get(this.serviceAccountRolesChkBx).click();
+
+    return this;
+  }
+  //#endregion
+
+  continue() {
+    cy.get(this.continueBtn).click();
+
+    return this;
+  }
+
+  back() {
+    cy.get(this.backBtn).click();
+
+    return this;
+  }
+
+  cancel() {
+    cy.get(this.cancelBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/manage/clients/OldClientPage.js

@@ -1,29 +0,0 @@
-export default class CreateClientPage {
-
-    constructor() {
-        this.goToClientsBtn = '[href="#/realms/master/clients"]';
-        this.createClientBtn = '#createClient';
-
-        this.clientIdInput = '#clientId';
-        this.rootUrlInput = '#rootUrl';
-
-        this.saveBtn = '[kc-save]';
-    }
-
-    goToClients() {
-        cy.get(this.goToClientsBtn).click();
-
-        return this;
-    }
-
-    addNewAdminConsole() {
-        cy.get(this.createClientBtn).click();
-
-        cy.get(this.clientIdInput).type('security-admin-console-v2');
-        cy.get(this.rootUrlInput).type('http://localhost:8080/');
-
-        cy.get(this.saveBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/manage/clients/OldClientPage.ts

@@ -0,0 +1,34 @@
+export default class CreateClientPage {
+  goToClientsBtn: string;
+  createClientBtn: string;
+  clientIdInput: string;
+  rootUrlInput: string;
+  saveBtn: string;
+
+  constructor() {
+    this.goToClientsBtn = '[href="#/realms/master/clients"]';
+    this.createClientBtn = "#createClient";
+
+    this.clientIdInput = "#clientId";
+    this.rootUrlInput = "#rootUrl";
+
+    this.saveBtn = "[kc-save]";
+  }
+
+  goToClients() {
+    cy.get(this.goToClientsBtn).click();
+
+    return this;
+  }
+
+  addNewAdminConsole() {
+    cy.get(this.createClientBtn).click();
+
+    cy.get(this.clientIdInput).type("security-admin-console-v2");
+    cy.get(this.rootUrlInput).type("http://localhost:8080/");
+
+    cy.get(this.saveBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/pages/admin_console/manage/realm_roles/CreateRealmRolePage.js

@@ -1,45 +0,0 @@
-export default class CreateRealmRolePage {
-
-    constructor() {
-        this.realmRoleNameInput = '#kc-name';
-        this.realmRoleNameError = '#kc-name-helper';
-        this.realmRoleDescriptionInput = '#kc-role-description';
-
-        this.saveBtn = '[type="submit"]';
-        this.cancelBtn = '[type="button"]';
-    }
-
-    //#region General Settings
-    fillRealmRoleData(name, description = '') {
-        cy.get(this.realmRoleNameInput).clear();
-
-        if(name) {
-            cy.get(this.realmRoleNameInput).type(name);
-        }
-
-        if(description) {
-            cy.get(this.realmRoleDescriptionInput).type(description);
-        }
-
-        return this;
-    }
-
-    checkRealmRoleNameRequiredMessage(exist = true) {
-        cy.get(this.realmRoleNameError).should((!exist ? 'not.': '') + 'exist');
-
-        return this;
-    }
-    //#endregion
-
-    save() {
-        cy.get(this.saveBtn).click();
-
-        return this;
-    }
-
-    cancel() {
-        cy.get(this.cancelBtn).click();
-
-        return this;
-    }
-}

tests/cypress/support/pages/admin_console/manage/realm_roles/CreateRealmRolePage.ts

@@ -0,0 +1,50 @@
+export default class CreateRealmRolePage {
+  realmRoleNameInput: string;
+  realmRoleNameError: string;
+  realmRoleDescriptionInput: string;
+  saveBtn: string;
+  cancelBtn: string;
+
+  constructor() {
+    this.realmRoleNameInput = "#kc-name";
+    this.realmRoleNameError = "#kc-name-helper";
+    this.realmRoleDescriptionInput = "#kc-role-description";
+
+    this.saveBtn = '[type="submit"]';
+    this.cancelBtn = '[type="button"]';
+  }
+
+  //#region General Settings
+  fillRealmRoleData(name, description = "") {
+    cy.get(this.realmRoleNameInput).clear();
+
+    if (name) {
+      cy.get(this.realmRoleNameInput).type(name);
+    }
+
+    if (description) {
+      cy.get(this.realmRoleDescriptionInput).type(description);
+    }
+
+    return this;
+  }
+
+  checkRealmRoleNameRequiredMessage(exist = true) {
+    cy.get(this.realmRoleNameError).should((!exist ? "not." : "") + "exist");
+
+    return this;
+  }
+  //#endregion
+
+  save() {
+    cy.get(this.saveBtn).click();
+
+    return this;
+  }
+
+  cancel() {
+    cy.get(this.cancelBtn).click();
+
+    return this;
+  }
+}

tests/cypress/support/util/ModalUtils.ts

@@ -1,4 +1,9 @@
 export default class ModalUtils {
+  modalTitle: string;
+  modalMessage: string;
+  confirmModalBtn: string;
+  cancelModalBtn: string;
+  closeModalBtn: string;
   constructor() {
     this.modalTitle = ".pf-c-modal-box .pf-c-modal-box__title-text";
     this.modalMessage = ".pf-c-modal-box .pf-c-modal-box__body";

tests/package.json

@@ -4,11 +4,13 @@
   "description": "UI tests for Keycloak using Cypress.",
   "main": "index.js",
   "scripts": {
+    "build": "tsc",
     "test": "cypress open"
   },
   "author": "",
   "license": "ISC",
   "devDependencies": {
     "cypress": "6.2.1"
+    "typescript": "^4.1.3"
   }
 }

tests/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "lib": ["es5", "dom"],
+    "types": ["cypress"],
+    "skipLibCheck": true,
+    "noEmit": true
+  },
+  "include": [
+    "**/*.ts"
+  ]
+}

tests/yarn.lock

@@ -359,10 +359,10 @@ cross-spawn@^7.0.0:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
-cypress@^5.6.0:
+cypress@6.3.0:
-  version "5.6.0"
+  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/cypress/-/cypress-5.6.0.tgz#6781755c3ddfd644ce3179fcd7389176c0c82280"
+  resolved "https://registry.yarnpkg.com/cypress/-/cypress-6.3.0.tgz#e27bba01d7e493265700e1e85333dca0b0127ede"
-  integrity sha512-cs5vG3E2JLldAc16+5yQxaVRLLqMVya5RlrfPWkC72S5xrlHFdw7ovxPb61s4wYweROKTyH01WQc2PFzwwVvyQ==
+  integrity sha512-Ec6TAFOxdSB2HPINNJ1f7z75pENXcfCaQkz+A9j0eGSvusFJ2NNErq650DexCbNJAnCQkPqXB4XPH9kXnSQnUA==
   dependencies:
     "@cypress/listr-verbose-renderer" "^0.4.1"
     "@cypress/request" "^2.88.5"
@@ -1325,6 +1325,11 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
+typescript@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.1.3.tgz#519d582bd94cba0cf8934c7d8e8467e473f53bb7"
+  integrity sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==
+
 universalify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-1.0.0.tgz#b61a1da173e8435b2fe3c67d29b9adf8594bd16d"