Fix user menu popover initials bgColor (#4163)

SAP · Feb 27, 2025 · 455850d · 455850d
1 parent ee8736e
commit 455850d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/core/src/Authorization.svelte b/core/src/Authorization.svelte
@@ -173,16 +173,13 @@
       <div class="fd-user-menu__header">
         {#if userInfo.picture}
           <span
-            class="fd-avatar fd-avatar--xl fd-avatar--circle fd-avatar--thumbnail fd-user-menu__avatar"
+            class="fd-avatar fd-avatar--l fd-avatar--circle fd-avatar--thumbnail fd-user-menu__avatar"
             aria-label="Avatar"
             data-testid="luigi-topnav-profile-avatar"
             style="background-image:url('{userInfo.picture}')"
           />
         {:else}
-          <span
-            class="fd-avatar fd-avatar--xl fd-avatar--circle fd-avatar--thumbnail fd-user-menu__avatar"
-            aria-label="Avatar"
-          >
+          <span class="fd-avatar fd-avatar--l fd-avatar--circle fd-user-menu__avatar" aria-label="Avatar">
             {userInfo.initials ? userInfo.initials : ''}
           </span>
         {/if}

diff --git a/test/e2e-test-application/cypress/e2e/tests/0-js-test-app/js-test-app-theming.cy.js b/test/e2e-test-application/cypress/e2e/tests/0-js-test-app/js-test-app-theming.cy.js
@@ -635,6 +635,7 @@ describe('JS-TEST-APP 2', () => {
         }
       };
     });
+
     it('Initials background color with sap horizon and Fiori3 with profileType Fiori3', () => {
       cy.visitTestApp('/home/one', newConfig);
       cy.get('#app[configversion="sapHorizon"]');
@@ -659,6 +660,13 @@ describe('JS-TEST-APP 2', () => {
         const bgColor = getComputedStyle($el[0]).getPropertyValue('background-color').trim();
         expect(bgColor).to.equal('rgb(209, 239, 255)');
       });
+
+      cy.get('[data-testid="luigi-topnav-profile-initials"]').click();
+      cy.get('.lui-user-menu-fiori .fd-user-menu__avatar').should('have.class', 'fd-avatar--l');
+      cy.get('.lui-user-menu-fiori .fd-user-menu__avatar').then(($el) => {
+        const bgColor = getComputedStyle($el[0]).getPropertyValue('background-color').trim();
+        expect(bgColor).to.equal('rgb(209, 239, 255)');
+      });
     });
   });
 });