chore: update HeaderBar tests

- update data-test ids and classes used to retrieve components - update test titles/scenarios to account for apps, shortcuts and commands
dhis2 · Oct 25, 2024 · 0579262 · 0579262
1 parent 83243dd
commit 0579262
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 14 deletions.
diff --git a/components/header-bar/src/features/the_headerbar_contains_a_menu_to_all_apps/common.js b/components/header-bar/src/features/the_headerbar_contains_a_menu_to_all_apps/common.js
diff --git a/...erbar_contains_a_menu_to_all_apps.feature → ...o_all_apps_shortcuts_and_commands.feature b/...erbar_contains_a_menu_to_all_apps.feature → ...o_all_apps_shortcuts_and_commands.feature
@@ -1,14 +1,14 @@
-Feature: The HeaderBar contains a menu to all apps
+Feature: The HeaderBar contains a menu to all apps, shortcuts, and commands
 
     Scenario: The HeaderBar contains a menu icon
         Given the HeaderBar loads without an error
         Then the HeaderBar displays a menu icon
 
     Scenario: The menu is closed by default
         Given the HeaderBar loads without an error
-        Then the HeaderBar dos not display the app menu
+        Then the HeaderBar does not display the command palette
 
-    Scenario: The user will be offered a menu with apps
+    Scenario: The user will be offered a menu with apps, shortcuts and commands
         Given the HeaderBar loads without an error
         When the user clicks on the menu icons
         Then the menu opens
@@ -18,4 +18,4 @@ Feature: The HeaderBar contains a menu to all apps
         Given the HeaderBar loads without an error
         When the user opens the menu
         And the user clicks outside of the menu
-        Then the HeaderBar dos not display the app menu
+        Then the HeaderBar does not display the command palette
diff --git a/...r/src/features/the_headerbar_contains_a_menu_to_all_apps_shortcuts_and_commands/common.js b/...r/src/features/the_headerbar_contains_a_menu_to_all_apps_shortcuts_and_commands/common.js
@@ -0,0 +1,5 @@
+import { Then } from '@badeball/cypress-cucumber-preprocessor'
+
+Then('the HeaderBar does not display the command palette', () => {
+    cy.get('[data-test="headerbar-menu"]').should('not.exist')
+})
diff --git a/...nu_closes_when_the_user_clicks_outside.js → ...nu_closes_when_the_user_clicks_outside.js b/...nu_closes_when_the_user_clicks_outside.js → ...nu_closes_when_the_user_clicks_outside.js
@@ -5,5 +5,5 @@ When('the user opens the menu', () => {
 })
 
 When('the user clicks outside of the menu', () => {
-    cy.get('[data-test="headerbar-title"]').click()
+    cy.get('.backdrop').click({ force: true })
 })
diff --git a/...pps/the_headerbar_contains_a_menu_icon.js → ...nds/the_headerbar_contains_a_menu_icon.js b/...pps/the_headerbar_contains_a_menu_icon.js → ...nds/the_headerbar_contains_a_menu_icon.js
diff --git a/...ser_will_be_offered_a_menu_with_5_apps.js → ...ed_a_menu_with_8_apps_and_actions_menu.js b/...ser_will_be_offered_a_menu_with_5_apps.js → ...ed_a_menu_with_8_apps_and_actions_menu.js
@@ -5,12 +5,14 @@ When('the user clicks on the menu icons', () => {
 })
 
 Then('the menu opens', () => {
-    cy.get('[data-test="headerbar-apps-menu"]').should('be.visible')
+    cy.get('[data-test="headerbar-menu"]').should('be.visible')
 })
 
 Then('contains items with links', () => {
-    cy.get('[data-test="headerbar-apps-menu-list"]')
+    cy.get('[data-test="headerbar-top-apps-list"]')
         .find('a')
         .its('length')
         .should('be.greaterThan', 0)
+
+    cy.get('[data-test="headerbar-actions-menu"]').should('exist')
 })
diff --git a/...rch_should_escape_regexp_character/the_modules_do_not_contain_items_with_special_chars.js b/...rch_should_escape_regexp_character/the_modules_do_not_contain_items_with_special_chars.js
@@ -17,7 +17,8 @@ Given(/no app name contains a (.*)/, (character) => {
 })
 
 Then('no results should be shown', () => {
-    cy.get('[data-test="headerbar-apps-menu-list"] > a > div').should(
+    cy.get('[data-test="headerbar-list"] > a > .text-content .title').should(
         'not.exist'
     )
+    cy.get('[data-test="headerbar-empty-search"]').should('exist')
 })
diff --git a/...rch_should_escape_regexp_character/the_user_searches_for_an_app_with_a_regex_character.js b/...rch_should_escape_regexp_character/the_user_searches_for_an_app_with_a_regex_character.js
@@ -18,7 +18,7 @@ Given(/some app names contain a (.*)/, (character) => {
 })
 
 Then(/only apps with (.*) in their name should be shown/, (character) => {
-    cy.get('[data-test="headerbar-apps-menu-list"] > a > div').should(
+    cy.get('[data-test="headerbar-list"] > a .text-content .title').should(
         ($modules) => {
             $modules.each((index, module) => {
                 const displayName = Cypress.$(module).text()