[MM-55274] User account menu doesn't follow standard accessible keyboard behavior (#29173)

e2e-tests/cypress/tests/integration/channels/integrations/builtin_commands/user_status_commands_spec.js

@@ -12,10 +12,10 @@
 
 describe('Integrations', () => {
     const testCases = [
-        {command: '/away', className: 'icon-clock', message: 'You are now away'},
-        {command: '/dnd', className: 'icon-minus-circle', message: 'Do Not Disturb is enabled. You will not receive desktop or mobile push notifications until Do Not Disturb is turned off.'},
-        {command: '/offline', className: 'icon-circle-outline', message: 'You are now offline'},
-        {command: '/online', className: 'icon-check-circle', message: 'You are now online'},
+        {command: '/away', className: 'userAccountMenu_awayMenuItem_icon', message: 'You are now away'},
+        {command: '/dnd', className: 'userAccountMenu_dndMenuItem_icon', message: 'Do Not Disturb is enabled. You will not receive desktop or mobile push notifications until Do Not Disturb is turned off.'},
+        {command: '/offline', className: 'userAccountMenu_offlineMenuItem_icon', message: 'You are now offline'},
+        {command: '/online', className: 'userAccountMenu_onlineMenuItem_icon', message: 'You are now online'},
     ];
 
     let offTopicUrl;
@@ -67,7 +67,7 @@ describe('Integrations', () => {
 function verifyUserStatus(testCase, isCompactMode) {
     // * Verify that the user status is as indicated
     cy.uiGetProfileHeader().
-        find('i').
+        find('svg').
         should('be.visible').
         and('have.class', testCase.className);
 

e2e-tests/cypress/tests/integration/channels/integrations/builtin_commands/user_status_spec.js

@@ -26,14 +26,14 @@ describe('Integrations', () => {
 
     it('MM-T670 /away', () => {
         // # Set online status and verify it's changed as the initial status
-        setStatus(online.name, online.profileClassName);
+        setStatus(online.name);
 
         verifyUserStatus(away);
     });
 
     it('MM-T672 /offline', () => {
         // # Set online status and verify it's changed as the initial status
-        setStatus(online.name, online.profileClassName);
+        setStatus(online.name);
 
         verifyUserStatus(offline);
 
@@ -60,17 +60,14 @@ describe('Integrations', () => {
 
     it('MM-T674 /online', () => {
         // # Set offline status and verify it's changed as the initial status
-        setStatus(offline.name, offline.className);
+        setStatus(offline.name);
 
         verifyUserStatus(online);
     });
 });
 
-function setStatus(status, icon) {
+function setStatus(status) {
     cy.apiUpdateUserStatus(status);
-    cy.uiGetProfileHeader().
-        find('i').
-        and('have.class', icon);
 }
 
 function verifyUserStatus(testCase) {
@@ -90,9 +87,7 @@ function verifyUserStatus(testCase) {
     });
 
     // * Verify status shown at user profile in LHS
-    cy.uiGetProfileHeader().
-        find('i').
-        and('have.class', testCase.profileClassName || testCase.className);
+    cy.get('#userAccountMenuButtonDescribedBy').should('exist').and('include.text', `Status is "${testCase.name.charAt(0).toUpperCase() + testCase.name.slice(1)}"`);
 
     // # Post a message
     cy.postMessage(testCase.name);