Use new Root API to render Admin UI (keycloak#21102)

Pastor · Jul 25, 2023 · 4932494 · 4932494
1 parent 8848dfe
commit 4932494
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/js/apps/admin-ui/cypress/e2e/realm_settings_general_tab_test.spec.ts b/js/apps/admin-ui/cypress/e2e/realm_settings_general_tab_test.spec.ts
@@ -52,6 +52,10 @@ describe("Realm settings general tab tests", () => {
     realmSettingsPage.disableRealm();
     masthead.checkNotificationMessage("Realm successfully updated", true);
 
+    // Sometimes it takes the Keycloak server a while to disable the realm, even though the notification message has been displayed.
+    // To prevent flaky tests, we wait a second before continuing.
+    cy.wait(1000);
+
     // Re-enable realm
     realmSettingsPage.toggleSwitch(`${realmName}-switch`);
     masthead.checkNotificationMessage("Realm successfully updated");

diff --git a/js/apps/admin-ui/cypress/support/pages/admin-ui/manage/users/CredentialsPage.ts b/js/apps/admin-ui/cypress/support/pages/admin-ui/manage/users/CredentialsPage.ts
@@ -63,7 +63,7 @@ export default class CredentialsPage {
   }
 
   clickConfirmationBtn() {
-    cy.findByTestId(this.confirmationButton).dblclick();
+    cy.findByTestId(this.confirmationButton).click();
 
     return this;
   }

diff --git a/js/apps/admin-ui/src/main.tsx b/js/apps/admin-ui/src/main.tsx
@@ -2,8 +2,7 @@ import "@patternfly/react-core/dist/styles/base.css";
 import "@patternfly/patternfly/patternfly-addons.css";
 
 import { StrictMode } from "react";
-// eslint-disable-next-line react/no-deprecated
-import { render } from "react-dom";
+import { createRoot } from "react-dom/client";
 import { createHashRouter, RouterProvider } from "react-router-dom";
 
 import { i18n } from "./i18n/i18n";
@@ -18,10 +17,10 @@ await i18n.init();
 
 const router = createHashRouter([RootRoute]);
 const container = document.getElementById("app");
+const root = createRoot(container!);
 
-render(
+root.render(
   <StrictMode>
     <RouterProvider router={router} />
   </StrictMode>,
-  container,
 );