diff --git a/src/core/components/auth/oauth2.jsx b/src/core/components/auth/oauth2.jsx
index d41a90356d9..a47cbff2ab2 100644
--- a/src/core/components/auth/oauth2.jsx
+++ b/src/core/components/auth/oauth2.jsx
@@ -196,11 +196,11 @@ export default class Oauth2 extends React.Component {
         {
           ( flow === AUTH_FLOW_APPLICATION || flow === AUTH_FLOW_IMPLICIT || flow === AUTH_FLOW_ACCESS_CODE || flow === AUTH_FLOW_PASSWORD ) &&
           ( !isAuthorized || isAuthorized && this.state.clientId) && <Row>
-            <label htmlFor="client_id">client_id:</label>
+            <label htmlFor={ `client_id_${flow}` }>client_id:</label>
             {
               isAuthorized ? <code> ****** </code>
                            : <Col tablet={10} desktop={10}>
-                               <InitializedInput id="client_id"
+                               <InitializedInput id={`client_id_${flow}`}
                                       type="text"
                                       required={ flow === AUTH_FLOW_PASSWORD }
                                       initialValue={ this.state.clientId }
@@ -213,11 +213,11 @@ export default class Oauth2 extends React.Component {
 
         {
           ( (flow === AUTH_FLOW_APPLICATION || flow === AUTH_FLOW_ACCESS_CODE || flow === AUTH_FLOW_PASSWORD) && <Row>
-            <label htmlFor="client_secret">client_secret:</label>
+            <label htmlFor={ `client_secret_${flow}` }>client_secret:</label>
             {
               isAuthorized ? <code> ****** </code>
                            : <Col tablet={10} desktop={10}>
-                               <InitializedInput id="client_secret"
+                               <InitializedInput id={ `client_secret_${flow}` }
                                       initialValue={ this.state.clientSecret }
                                       type="password"
                                       data-name="clientSecret"
diff --git a/test/e2e-cypress/e2e/features/auth-code-flow-pkce-without-secret.cy.js b/test/e2e-cypress/e2e/features/auth-code-flow-pkce-without-secret.cy.js
index 0cce470febe..205b5327641 100644
--- a/test/e2e-cypress/e2e/features/auth-code-flow-pkce-without-secret.cy.js
+++ b/test/e2e-cypress/e2e/features/auth-code-flow-pkce-without-secret.cy.js
@@ -18,7 +18,7 @@ describe("Check client_secret for OAuth2 Authorization Code flow with and withou
       .contains("authorizationCode with PKCE")
       .get(".flow")
       .contains("authorizationCode with PKCE")
-      .get("#client_secret")
+      .get("#client_secret_authorizationCode")
       .should("exist")
   })
 
@@ -41,7 +41,7 @@ describe("Check client_secret for OAuth2 Authorization Code flow with and withou
       .contains("authorizationCode")
       .get(".flow")
       .contains("authorizationCode")
-      .get("#client_secret")
+      .get("#client_secret_authorizationCode")
       .should("exist")
   })
 })
diff --git a/test/e2e-cypress/e2e/features/oauth2-flows/application.cy.js b/test/e2e-cypress/e2e/features/oauth2-flows/application.cy.js
index 653d890ef19..7820b5cceae 100644
--- a/test/e2e-cypress/e2e/features/oauth2-flows/application.cy.js
+++ b/test/e2e-cypress/e2e/features/oauth2-flows/application.cy.js
@@ -30,11 +30,11 @@ describe("OAuth2 Application flow", function() {
       .click()
 
       .get("div.modal-ux-content > div:nth-child(2)").within(() => {
-        cy.get("#client_id")
+        cy.get("#client_id_application")
           .clear()
           .type("confidentialApplication")
 
-          .get("#client_secret")
+          .get("#client_secret_application")
           .clear()
           .type("topSecret")
 
diff --git a/test/e2e-cypress/e2e/features/oauth2-flows/password.cy.js b/test/e2e-cypress/e2e/features/oauth2-flows/password.cy.js
index fb1ff54feb6..7adead541ba 100644
--- a/test/e2e-cypress/e2e/features/oauth2-flows/password.cy.js
+++ b/test/e2e-cypress/e2e/features/oauth2-flows/password.cy.js
@@ -18,11 +18,11 @@ describe("OAuth2 Password flow", function() {
       .get("#password_type")
       .select("basic")
 
-      .get("#client_id")
+      .get("#client_id_password")
       .clear()
       .type("application")
 
-      .get("#client_secret")
+      .get("#client_secret_password")
       .clear()
       .type("secret")
 
@@ -75,11 +75,11 @@ describe("OAuth2 Password flow", function() {
       .get("#password_type")
       .select("request-body")
 
-      .get("#client_id")
+      .get("#client_id_password")
       .clear()
       .type("application")
 
-      .get("#client_secret")
+      .get("#client_secret_password")
       .clear()
       .type("secret")
 
diff --git a/test/e2e-cypress/e2e/security/sequential-import-chaining.cy.js b/test/e2e-cypress/e2e/security/sequential-import-chaining.cy.js
index 90887def3ad..0e8234a9bc4 100644
--- a/test/e2e-cypress/e2e/security/sequential-import-chaining.cy.js
+++ b/test/e2e-cypress/e2e/security/sequential-import-chaining.cy.js
@@ -20,7 +20,7 @@ describe("Security: CSS Sequential Import Chaining", () => {
         cy.visit("/?url=/documents/petstore-expanded.openapi.yaml")
           .get(".scheme-container > .schemes > .auth-wrapper > .btn > span")
           .click()
-          .get("div > div > .wrapper > .block-tablet > #client_id")
+          .get("div > div > .wrapper > .block-tablet > #client_id_implicit")
           .clear()
           .type("abc")
           .should("not.have.attr", "value", "abc")
@@ -48,7 +48,7 @@ describe("Security: CSS Sequential Import Chaining", () => {
         cy.visit("/?url=/documents/petstore.swagger.yaml")
           .get(".scheme-container > .schemes > .auth-wrapper > .btn > span")
           .click()
-          .get("div > div > .wrapper > .block-tablet > #client_id")
+          .get("div > div > .wrapper > .block-tablet > #client_id_implicit")
           .clear()
           .type("abc")
           .should("not.have.attr", "value", "abc")