From: Naman Munet <naman.munet@ibm.com>
Date: Wed, 9 Apr 2025 07:38:01 +0000 (+0530)
Subject: mgr/dashboard: rgw accounts UI e2e tests
X-Git-Tag: v20.3.0~90^2
X-Git-Url: http://git.apps.os.sepia.ceph.com/?a=commitdiff_plain;h=1edf9d5fa2be2e355799ab0f3ff20f6bda17e4ad;p=ceph.git

mgr/dashboard: rgw accounts UI e2e tests

Fixes: https://tracker.ceph.com/issues/69674

Signed-off-by: Naman Munet <naman.munet@ibm.com>
---

diff --git a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.e2e-spec.ts b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.e2e-spec.ts
new file mode 100644
index 0000000000000..3e6fe0de56423
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.e2e-spec.ts
@@ -0,0 +1,59 @@
+import { AccountsPageHelper } from './accounts.po';
+
+describe('RGW Accounts page', () => {
+  const accounts = new AccountsPageHelper();
+  const account_name = 'e2eaccount';
+
+  beforeEach(() => {
+    cy.login();
+    accounts.navigateTo();
+  });
+
+  describe('breadcrumb tests', () => {
+    it('should open and show breadcrumb', () => {
+      accounts.expectBreadcrumbText('Accounts');
+    });
+  });
+
+  describe('create, edit & delete account tests', () => {
+    it('should create account with all details', () => {
+      const account = {
+        name: account_name,
+        tenant: 'test',
+        email: 'account@test.com'
+      };
+      accounts.navigateTo('create');
+      accounts.create(account);
+    });
+
+    it('should edit account', () => {
+      const account = {
+        name: account_name,
+        tenant: 'test',
+        email: 'account@test.com',
+        max_buckets: '1000',
+        max_users: '0',
+        max_roles: '-1',
+        max_groups: '1000',
+        max_access_keys: '2'
+      };
+      accounts.edit(account);
+    });
+
+    it('should delete account', () => {
+      accounts.delete(account_name, null, null, true, false, false, false);
+    });
+  });
+
+  describe('create, edit & delete account tests', () => {
+    it('should put invalid input into account creation form and check fields are marked invalid', () => {
+      accounts.navigateTo('create');
+      accounts.invalidCreate();
+    });
+
+    it('should put invalid input into account edit form and check fields are marked invalid', () => {
+      accounts.navigateTo('create');
+      accounts.invalidEdit();
+    });
+  });
+});
diff --git a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.po.ts b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.po.ts
new file mode 100644
index 0000000000000..215507045a5d2
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/accounts.po.ts
@@ -0,0 +1,297 @@
+import { PageHelper } from '../page-helper.po';
+
+const pages = {
+  index: { url: '#/rgw/accounts', id: 'cd-rgw-user-accounts' },
+  create: { url: '#/rgw/accounts/create', id: 'cd-rgw-user-accounts-form' }
+};
+
+export class AccountsPageHelper extends PageHelper {
+  pages = pages;
+
+  columnIndex = {
+    tenant: 2,
+    account_id: 3,
+    email: 4,
+    max_users: 5,
+    max_roles: 6,
+    max_groups: 7,
+    max_buckets: 8,
+    max_access_keys: 9
+  };
+
+  @PageHelper.restrictTo(pages.create.url)
+  create(account: { name: string; email: string; tenant?: string }) {
+    // Enter in account name
+    cy.get('#acc_name').type(account.name);
+
+    if (account.tenant) {
+      // Enter tenant
+      cy.get('#tenant').type(account.tenant);
+    }
+
+    // Enter email
+    cy.get('#email').type(account.email);
+
+    // Enter max buckets
+    cy.get('input#max_buckets').should('exist').should('have.value', '1000');
+
+    cy.get('input#max_users').should('exist').should('have.value', '1000');
+
+    cy.get('input#max_roles').should('exist').should('have.value', '1000');
+
+    cy.get('input#max_groups').should('exist').should('have.value', '1000');
+
+    cy.get('input#max_access_keys').should('exist').should('have.value', '4');
+
+    // cy.find('cds-checkbox [type="checkbox"]')
+    cy.get('input#bucket_checkbox_input').check({ force: true });
+
+    cy.get('input#account_checkbox_input').check({ force: true });
+
+    // Click the create button and wait for account to be made
+    cy.contains('button', 'Create Account').click();
+
+    this.getFirstTableCell(account.name).should('have.text', account.name);
+    this.getTableRow(account.name).within(() => {
+      cy.get('td').eq(this.columnIndex.tenant).should('have.text', account.tenant);
+      cy.get('td').eq(this.columnIndex.account_id).should('not.be.empty');
+      cy.get('td').eq(this.columnIndex.email).should('have.text', account.email);
+      cy.get('td').eq(this.columnIndex.max_users).should('have.text', 1000);
+      cy.get('td').eq(this.columnIndex.max_roles).should('have.text', 1000);
+      cy.get('td').eq(this.columnIndex.max_groups).should('have.text', 1000);
+      cy.get('td').eq(this.columnIndex.max_buckets).should('have.text', 1000);
+      cy.get('td').eq(this.columnIndex.max_access_keys).should('have.text', 4);
+    });
+
+    this.getExpandCollapseElement(account.name).click().wait(1000);
+
+    cy.get('[data-testid="datatable-row-detail"]').first().as('accountDetailsTable');
+    cy.get('@accountDetailsTable').find('legend').its(0).as('accountQuota');
+    cy.get('@accountQuota').should('have.text', 'Account quota');
+    cy.get('@accountDetailsTable').find('cd-table-key-value').its(0).as('accountQuotaTable');
+    cy.get('@accountQuotaTable')
+      .find('tbody tr')
+      .first()
+      .find('td')
+      .last()
+      .should('have.text', 'Yes');
+
+    cy.get('@accountDetailsTable').find('legend').its(1).as('bucketQuota');
+    cy.get('@bucketQuota').should('have.text', 'Bucket quota');
+    cy.get('@accountDetailsTable').find('cd-table-key-value').its(1).as('bucketQuotaTable');
+    cy.get('@bucketQuotaTable')
+      .find('tbody tr')
+      .first()
+      .find('td')
+      .last()
+      .should('have.text', 'Yes');
+  }
+
+  @PageHelper.restrictTo(pages.create.url)
+  edit(account: {
+    name: string;
+    tenant: string;
+    email: string;
+    max_buckets: string;
+    max_groups: string;
+    max_access_keys: string;
+  }) {
+    this.navigateEdit(account.name, false, false, null);
+    // Enter in account name
+    cy.get('#acc_name').clear().type(account.name);
+    // Enter tenant
+    cy.get('#tenant').should('be.disabled');
+    // Enter email
+    cy.get('#email').clear().type(account.email);
+
+    // Enter max buckets
+    this.selectOption('max_buckets_mode', 'Custom');
+    cy.get('input#max_buckets').click().clear().type(account.max_buckets);
+
+    this.selectOption('max_users_mode', 'Unlimited');
+
+    this.selectOption('max_roles_mode', 'Disabled');
+
+    cy.get('input#max_groups').click().clear().type(account.max_groups);
+
+    cy.get('input#max_access_keys').click().clear().type(account.max_access_keys);
+
+    cy.get('input#bucket_checkbox_input').should('be.checked');
+    cy.get('input#bucket_quota_max_size').clear().type('1234');
+    cy.get('input#bucketunlimitedObjects_checkbox_input').uncheck({ force: true });
+    cy.get('input#bucket_quota_max_objects').clear().type('200');
+
+    cy.get('input#account_checkbox_input').should('be.checked');
+    cy.get('input#account_quota_max_size').clear().type('1234');
+    cy.get('input#accountunlimitedObjects_checkbox_input').uncheck({ force: true });
+    cy.get('input#account_quota_max_objects').clear().type('200');
+
+    // Click the create button and wait for account to be made
+    cy.contains('button', 'Edit Account').click();
+
+    this.getTableRow(account.name).within(() => {
+      cy.get('td').eq(this.columnIndex.tenant).should('have.text', account.tenant);
+      cy.get('td').eq(this.columnIndex.account_id).should('not.be.empty');
+      cy.get('td').eq(this.columnIndex.email).should('have.text', account.email);
+      cy.get('td').eq(this.columnIndex.max_users).should('have.text', 'Unlimited');
+      cy.get('td').eq(this.columnIndex.max_roles).should('have.text', 'Disabled');
+      cy.get('td').eq(this.columnIndex.max_groups).should('have.text', account.max_groups);
+      cy.get('td').eq(this.columnIndex.max_buckets).should('have.text', account.max_buckets);
+      cy.get('td')
+        .eq(this.columnIndex.max_access_keys)
+        .should('have.text', account.max_access_keys);
+    });
+    this.getExpandCollapseElement(account.name).click().wait(1000);
+
+    cy.get('[data-testid="datatable-row-detail"]').first().as('accountDetailsTable');
+    cy.get('@accountDetailsTable').find('legend').eq(0).as('accountQuota');
+    cy.get('@accountQuota').should('have.text', 'Account quota');
+    cy.get('@accountDetailsTable').find('cd-table-key-value').eq(0).as('accountQuotaTable');
+    cy.get('@accountQuotaTable').find('tbody tr').should('have.length', 3);
+    cy.get('@accountQuotaTable')
+      .find('tbody tr')
+      .first()
+      .find('td')
+      .last()
+      .should('have.text', 'Yes');
+
+    cy.get('@accountQuotaTable')
+      .find('tbody tr')
+      .eq(1)
+      .within(() => {
+        cy.get('td').first().should('have.text', 'Maximum objects');
+        cy.get('td').last().should('have.text', '200');
+      });
+
+    cy.get('@accountQuotaTable')
+      .find('tbody tr')
+      .eq(2)
+      .within(() => {
+        cy.get('td').first().should('have.text', 'Maximum size');
+        cy.get('td').last().should('have.text', '1.2 GiB');
+      });
+
+    cy.get('@accountDetailsTable').find('legend').eq(1).as('bucketQuota');
+    cy.get('@bucketQuota').should('have.text', 'Bucket quota');
+    cy.get('@accountDetailsTable').find('cd-table-key-value').eq(1).as('bucketQuotaTable');
+    cy.get('@bucketQuotaTable')
+      .find('tbody tr')
+      .first()
+      .find('td')
+      .last()
+      .should('have.text', 'Yes');
+
+    cy.get('@bucketQuotaTable')
+      .find('tbody tr')
+      .eq(1)
+      .within(() => {
+        cy.get('td').first().should('have.text', 'Maximum objects');
+        cy.get('td').last().should('have.text', 200);
+      });
+
+    cy.get('@bucketQuotaTable')
+      .find('tbody tr')
+      .eq(2)
+      .within(() => {
+        cy.get('td').first().should('have.text', 'Maximum size');
+        cy.get('td').last().should('have.text', '1.2 GiB');
+      });
+  }
+
+  invalidCreate() {
+    // Enter in account name
+    cy.get('#acc_name').type('testAccName');
+
+    // Enter email
+    cy.get('#email')
+      .type('@test')
+      .blur()
+      .should('not.have.class', 'ng-pending')
+      .should('have.class', 'ng-invalid');
+
+    cy.get('cds-text-label[for=email]')
+      .find('.cds--form-requirement')
+      .should('have.text', ' Please enter a valid email ');
+
+    cy.get('input#max_buckets').click().clear().type('0').blur();
+
+    cy.get('label[for=max_buckets]')
+      .parent()
+      .parent()
+      .should('not.have.class', 'ng-pending')
+      .should('have.class', 'ng-invalid');
+
+    cy.get('label[for=max_buckets]')
+      .parent()
+      .parent()
+      .find('.cds--form-requirement')
+      .should('have.text', 'Enter number greater than 0');
+
+    cy.get('input#bucket_checkbox_input').check({ force: true });
+    cy.get('input#bucketunlimitedObjects_checkbox_input').uncheck({ force: true });
+    cy.get('input#bucket_quota_max_objects').clear().type('-1').blur({ force: true });
+    cy.get('input#bucket_quota_max_objects')
+      .should('not.have.class', 'ng-pending')
+      .should('have.class', 'ng-invalid');
+  }
+
+  invalidEdit() {
+    this.create({ name: 'test', tenant: 'new', email: 'test@test' });
+    this.navigateEdit('test', false, false, null);
+    cy.get('#tenant').should('be.disabled');
+    // Enter email
+    cy.get('#email')
+      .type('@test')
+      .blur()
+      .should('not.have.class', 'ng-pending')
+      .should('have.class', 'ng-invalid');
+
+    cy.get('cds-text-label[for=email]')
+      .find('.cds--form-requirement')
+      .should('have.text', ' Please enter a valid email ');
+
+    cy.get('input#max_buckets').click().clear().type('0').blur();
+
+    cy.get('label[for=max_buckets]')
+      .parent()
+      .parent()
+      .should('not.have.class', 'ng-pending')
+      .should('have.class', 'ng-invalid');
+
+    cy.get('label[for=max_buckets]')
+      .parent()
+      .parent()
+      .find('.cds--form-requirement')
+      .should('have.text', 'Enter number greater than 0');
+
+    cy.get('input#bucket_checkbox_input').should('be.checked');
+    cy.get('input#bucket_quota_max_size').clear().type('0').blur();
+    cy.get('label[for=bucket_quota_max_size]')
+      .parent()
+      .parent()
+      .find('.cds--form-requirement')
+      .should('have.text', 'Enter a valid value.');
+
+    this.navigateTo();
+    this.delete('test', null, null, true, false, false, false);
+  }
+
+  // happens when users are linked to account, fn() called from users-e2e
+  invalidDelete(account_name: string, action: string) {
+    cy.intercept('DELETE', `/api/rgw/accounts/*`, {
+      statusCode: 500,
+      body: { error: 'Internal Server Error' }
+    }).as('apiRequest');
+
+    const actionUpperCase = action.charAt(0).toUpperCase() + action.slice(1);
+    this.clickRowActionButton(account_name, action);
+    cy.get('[aria-label="confirmation"]').click({ force: true });
+    cy.get('cds-modal button').contains(actionUpperCase).click({ force: true });
+    cy.wait('@apiRequest').then((interception: any) => {
+      cy.log('Intercepted request:', interception);
+    });
+    // modal should not close as API should be failing
+    cy.get('cds-modal').should('exist');
+    cy.get('@apiRequest').its('response.statusCode').should('eq', 500);
+  }
+}
diff --git a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.e2e-spec.ts b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.e2e-spec.ts
index 62060c958cad5..e42abd40d715f 100644
--- a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.e2e-spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.e2e-spec.ts
@@ -1,7 +1,9 @@
+import { AccountsPageHelper } from './accounts.po';
 import { UsersPageHelper } from './users.po';
 
 describe('RGW users page', () => {
   const users = new UsersPageHelper();
+  const accounts = new AccountsPageHelper();
   const tenant = 'e2e_000tenant';
   const user_id = 'e2e_000user_create_edit_delete';
   const user_name = tenant + '$' + user_id;
@@ -46,4 +48,52 @@ describe('RGW users page', () => {
       users.invalidEdit();
     });
   });
+
+  describe('link user with account test', () => {
+    let account_id: string;
+    const user_id = 'account_user';
+    const account = {
+      name: 'test_account',
+      email: 'test@test',
+      tenant: 'tenanted_acc'
+    };
+
+    it('should create an account and store account_id', () => {
+      accounts.navigateTo('create');
+      accounts.create(account);
+      accounts.navigateTo();
+      accounts
+        .getTableRow(account.name)
+        .find('td')
+        .eq(3)
+        .invoke('text')
+        .then((acc_id: string) => {
+          cy.log(acc_id);
+          account_id = acc_id;
+        });
+    });
+
+    it('should link user with account', () => {
+      users.navigateTo();
+      users.navigateTo('create');
+      users.linkAccount(account_id, account.name, user_id, account.tenant);
+    });
+
+    it('should make user as root account user', () => {
+      users.navigateTo();
+      users.makeRootAccount(account.name, user_id, account.tenant);
+    });
+
+    it('should not delete account if users are linked to it', () => {
+      accounts.navigateTo();
+      accounts.invalidDelete(account.name, 'delete');
+    });
+
+    it('should delete user and account', () => {
+      users.navigateTo();
+      users.delete(`${account.tenant}$${user_id}`, null, null, true, false, false, true);
+      accounts.navigateTo();
+      accounts.delete(account.name, null, null, true, false, false, false);
+    });
+  });
 });
diff --git a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.po.ts b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.po.ts
index 5b3be4c41016b..a90c81e5e5aae 100644
--- a/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.po.ts
+++ b/src/pybind/mgr/dashboard/frontend/cypress/e2e/rgw/users.po.ts
@@ -166,4 +166,93 @@ export class UsersPageHelper extends PageHelper {
     cy.get('input#secret_key').should('exist');
     cy.get('cds-modal').should('exist');
   }
+
+  linkAccount(account_id: string, account_name: string, user_id: string, tenant: string) {
+    const fullname = 'test_acc_user';
+    const selection_name = 'link_account';
+    const username = tenant + '$' + user_id;
+    // creating this user to edit for this test
+    this.create(tenant, user_id, fullname, 'user@test', '1000');
+    this.navigateEdit(username);
+
+    cy.get(`select[id=${selection_name}]`).should('exist');
+    cy.get(`select[id=${selection_name}]`).select(account_id);
+    cy.get(`select[id=${selection_name}] option:checked`).should(
+      'have.text',
+      `${account_name} - ${tenant}`
+    );
+    cy.contains('button', 'Edit User').click();
+
+    this.getTableRow(tenant + '$' + user_id).as('AccountUser');
+    cy.get('@AccountUser').find('td').eq(3).should('have.text', `${account_name}`);
+
+    // check table details if we have all the details there
+    this.getExpandCollapseElement(username).should('be.visible').click();
+    // check the Account Details section
+    cy.get('legend').should('contain.text', 'Account Details');
+    cy.get('table#accountsDetails').scrollIntoView();
+    cy.wait(500);
+    cy.get('table#accountsDetails').find('tbody tr').should('have.length', 4);
+    cy.get('table#accountsDetails').within(() => {
+      cy.get('tr')
+        .eq(0)
+        .within(() => {
+          cy.wait(500);
+          cy.get('td').eq(0).should('have.text', 'Account ID');
+          cy.get('td').eq(1).should('have.text', account_id);
+        });
+      cy.get('tr')
+        .eq(1)
+        .within(() => {
+          cy.wait(500);
+          cy.get('td').eq(0).should('have.text', 'Name');
+          cy.get('td').eq(1).should('have.text', account_name);
+        });
+      cy.get('tr')
+        .eq(2)
+        .within(() => {
+          cy.wait(500);
+          cy.get('td').eq(0).should('have.text', 'Tenant');
+          cy.get('td').eq(1).should('have.text', tenant);
+        });
+      cy.get('tr')
+        .eq(3)
+        .within(() => {
+          cy.wait(500);
+          cy.get('td').eq(0).should('have.text', 'User type');
+          cy.get('td').eq(1).should('have.text', 'rgw user');
+        });
+    });
+  }
+
+  makeRootAccount(account_name: string, user_id: string, tenant: string) {
+    const selection_name = 'link_account';
+    const username = tenant + '$' + user_id;
+    this.navigateEdit(username);
+    cy.get(`select[id=${selection_name}]`).should('exist').should('be.disabled');
+    cy.get(`select[id=${selection_name}] option:checked`).should(
+      'have.text',
+      `${account_name} - ${tenant}`
+    );
+    cy.get('input#account_root_user_input').check({ force: true });
+
+    cy.contains('button', 'Edit User').click();
+
+    // check table details if we have all the details there
+    this.getExpandCollapseElement(username).should('be.visible').click();
+    // check the Account Details section
+    cy.get('legend').should('contain.text', 'Account Details');
+    cy.get('table#accountsDetails').scrollIntoView();
+    cy.wait(500);
+    cy.get('table#accountsDetails').find('tbody tr').should('have.length', 4);
+    cy.get('table#accountsDetails').within(() => {
+      cy.get('tr')
+        .eq(3)
+        .within(() => {
+          cy.wait(500);
+          cy.get('td').eq(0).should('have.text', 'User type');
+          cy.get('td').eq(1).should('have.text', 'Account root user');
+        });
+    });
+  }
 }
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-accounts-form/rgw-user-accounts-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-accounts-form/rgw-user-accounts-form.component.html
index 3856c42a8e6c9..7233732e63f8b 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-accounts-form/rgw-user-accounts-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-accounts-form/rgw-user-accounts-form.component.html
@@ -225,14 +225,16 @@
       </div>
     </ng-template>
     <!-- Enabled -->
-    <cds-checkbox [formControlName]="formControl.enabled">
+    <cds-checkbox [formControlName]="formControl.enabled"
+                  [id]="quotaType+'_checkbox'">
       Enabled
     </cds-checkbox >
     <div class="quota-sub-block"
          *ngIf="accountForm.controls[formControl.enabled].value">
       <!-- Unlimited size -->
       <cds-checkbox *ngIf="accountForm.controls[formControl.enabled].value"
-                    [formControlName]="formControl.unlimitedSize">
+                    [formControlName]="formControl.unlimitedSize"
+                    [id]="quotaType+'unlimitedSize_checkbox'">
                     Unlimited size
       </cds-checkbox>
       <!-- Maximum size -->
@@ -263,7 +265,8 @@
       </div>
       <!-- Unlimited objects -->
       <cds-checkbox *ngIf="accountForm.controls[formControl.enabled].value"
-                    [formControlName]="formControl.unlimitedObjects">
+                    [formControlName]="formControl.unlimitedObjects"
+                    [id]="quotaType+'unlimitedObjects_checkbox'">
                     Unlimited objects
       </cds-checkbox>
     <!-- Maximum objects -->
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
index e0defa08fb89d..8d05bb3b314bb 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
@@ -90,7 +90,8 @@
 
     <ng-container *ngIf="selection.account && selection.account?.id">
       <legend i18n>Account Details</legend>
-      <table class="cds--data-table--sort cds--data-table--no-border cds--data-table cds--data-table--md">
+      <table class="cds--data-table--sort cds--data-table--no-border cds--data-table cds--data-table--md"
+             id="accountsDetails">
         <tbody>
           <tr>
             <td i18n
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
index 053a30f0c581b..58a6fee7eedd1 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-form/rgw-user-form.component.html
@@ -12,6 +12,7 @@
       <div class="form-item">
         <cds-select label="Link Account"
                     i18n-label
+                    id="link_account"
                     for="link_account"
                     formControlName="account_id"
                     [invalid]="userForm.controls.account_id.invalid && userForm.controls.account_id.dirty"
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-list/rgw-user-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-list/rgw-user-list.component.html
index 44c0017a9f39d..361a1e30b6622 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-list/rgw-user-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-list/rgw-user-list.component.html
@@ -50,7 +50,5 @@
   <cds-tooltip [description]="row.account?.name ? (row.type === 'root' ? 'Account root user' :'') : ''"
                [align]="'top'"
                i18n-description
-               i18n>
-    {{row.account?.name}}
-  </cds-tooltip>
+               i18n>{{row.account?.name}}</cds-tooltip>
 </ng-template>