test(headerbar): update functional tests

dhis2 · Nov 29, 2019 · 0c1ad2c · 0c1ad2c
1 parent bb4a7cf
commit 0c1ad2c
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 35 deletions.
diff --git a/...gration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_his_account.js b/...gration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_his_account.js
@@ -2,7 +2,7 @@ import '../common/index'
 import { Then } from 'cypress-cucumber-preprocessor/steps'
 
 Then('contains a link to the user account', () => {
-    cy.get('[data-test-id="headerbar-profile-menu-link-account"]').should(
-        'be.visible'
-    )
+    cy.get('[data-test-id="headerbar-profile-menu"] > li').should(lis => {
+        expect(lis.eq(1)).to.be.visible()
+    })
 })
diff --git a/...eaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_About_DHIS2_page.js b/...eaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_About_DHIS2_page.js
@@ -2,7 +2,7 @@ import '../common/index'
 import { Then } from 'cypress-cucumber-preprocessor/steps'
 
 Then('contains a link to the About DHIS2 page', () => {
-    cy.get('[data-test-id="headerbar-profile-menu-link-about"]').should(
-        'be.visible'
-    )
+    cy.get('[data-test-id="headerbar-profile-menu"] > li').should(lis => {
+        expect(lis.eq(3)).to.be.visible()
+    })
 })
diff --git a/...ation/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_help_page.js b/...ation/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_help_page.js
@@ -2,7 +2,7 @@ import '../common/index'
 import { Then } from 'cypress-cucumber-preprocessor/steps'
 
 Then('contains a link to the help page', () => {
-    cy.get('[data-test-id="headerbar-profile-menu-link-help"]').should(
-        'be.visible'
-    )
+    cy.get('[data-test-id="headerbar-profile-menu"] > li').should(lis => {
+        expect(lis.eq(2)).to.be.visible()
+    })
 })
diff --git a/...ration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_settings.js b/...ration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_go_to_the_settings.js
@@ -2,7 +2,7 @@ import '../common/index'
 import { Then } from 'cypress-cucumber-preprocessor/steps'
 
 Then('contains a link to the settings', () => {
-    cy.get('[data-test-id="headerbar-profile-menu-link-settings"]').should(
-        'be.visible'
-    )
+    cy.get('[data-test-id="headerbar-profile-menu"] > li').should(lis => {
+        expect(lis.eq(0)).to.be.visible()
+    })
 })
diff --git a/cypress/integration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_log_out.js b/cypress/integration/HeaderBar/The_HeaderBar_contains_a_profile_menu/The_user_can_log_out.js
@@ -2,7 +2,7 @@ import '../common/index'
 import { Then } from 'cypress-cucumber-preprocessor/steps'
 
 Then('contains a link to log out the user', () => {
-    cy.get('[data-test-id="headerbar-profile-menu-link-logout"]').should(
-        'be.visible'
-    )
+    cy.get('[data-test-id="headerbar-profile-menu"] > li').should(lis => {
+        expect(lis.eq(4)).to.be.visible()
+    })
 })
diff --git a/package.json b/package.json
@@ -39,7 +39,8 @@
         "lint:text": "d2-style text check",
         "format": "yarn format:js && yarn format:text",
         "format:js": "d2-style js apply",
-        "format:text": "d2-style text apply"
+        "format:text": "d2-style text apply",
+        "format:staged": "yarn format:js --staged && yarn format:text --staged"
     },
     "devDependencies": {
         "@babel/cli": "^7.7.4",

diff --git a/src/HeaderBar/Profile/ProfileMenu.js b/src/HeaderBar/Profile/ProfileMenu.js
@@ -28,14 +28,12 @@ const list = [
         label: i18n.t('Settings'),
         value: 'settings',
         link: `/dhis-web-user-profile/#/settings`,
-        dataTestId: 'headerbar-profile-menu-link-settings',
     },
     {
         icon: <Account className={iconStyle.className} />,
         label: i18n.t('Account'),
         value: 'account',
         link: `/dhis-web-user-profile/#/account`,
-        dataTestId: 'headerbar-profile-menu-link-account',
     },
     {
         icon: <Help className={iconStyle.className} />,
@@ -44,21 +42,18 @@ const list = [
         link:
             'https://docs.dhis2.org/master/en/user/html/dhis2_user_manual_en.html',
         nobase: true,
-        dataTestId: 'headerbar-profile-menu-link-help',
     },
     {
         icon: <Info className={iconStyle.className} />,
         label: i18n.t('About DHIS2'),
         value: 'about',
         link: `/dhis-web-user-profile/#/aboutPage`,
-        dataTestId: 'headerbar-profile-menu-link-about',
     },
     {
         icon: <Exit className={iconStyle.className} />,
         label: i18n.t('Logout'),
         value: 'logout',
         link: `/dhis-web-commons-security/logout.action`,
-        dataTestId: 'headerbar-profile-menu-link-logout',
     },
 ]
 
@@ -72,20 +67,16 @@ const ProfileContents = ({ name, email, avatar, contextPath }) => (
                 contextPath={contextPath}
             />
             <Divider margin="13px 0 7px 0" />
-            <ul>
-                {list.map(
-                    ({ label, value, icon, link, nobase, dataTestId }) => (
-                        <span key={`h-p-${value}`} data-test-id={dataTestId}>
-                            <MenuItem
-                                href={nobase ? link : `${contextPath}${link}`}
-                                key={`h-mi-${value}`}
-                                label={label}
-                                value={value}
-                                icon={icon}
-                            />
-                        </span>
-                    )
-                )}
+            <ul data-test-id="headerbar-profile-menu">
+                {list.map(({ label, value, icon, link, nobase }) => (
+                    <MenuItem
+                        href={nobase ? link : `${contextPath}${link}`}
+                        key={`h-mi-${value}`}
+                        label={label}
+                        value={value}
+                        icon={icon}
+                    />
+                ))}
             </ul>
         </div>