v9: Fixing flaky cypress test "Macro in Grid" (umbraco#11485)

* fixed flaky macro test and updated cypress version * fixed flaky macro test and updated cypress version * Update package.json * Fixed failing tabs test * Amend magic numbers with actual wait * Update tests/Umbraco.Tests.AcceptanceTest/cypress/integration/Content/content.ts * Updated UI to click on button instead of icon * Make macro test click bottom to ensure we're not clicking on icon Co-authored-by: Nikolaj Geisle <[email protected]> (cherry picked from commit 34be464) # Conflicts: # tests/Umbraco.Tests.AcceptanceTest/cypress/integration/Tabs/tabs.ts
Nuklon · Nov 3, 2021 · a3797aa · a3797aa
1 parent 0bd82d3
commit a3797aa
Show file tree

Hide file tree

Showing 3 changed files with 556 additions and 3 deletions.
diff --git a/src/Umbraco.Tests.AcceptanceTest/cypress/integration/Content/content.ts b/src/Umbraco.Tests.AcceptanceTest/cypress/integration/Content/content.ts
@@ -766,7 +766,8 @@ context('Content', () => {
         // Click macro
         cy.get(':nth-child(4) > .umb-card-grid-item > :nth-child(1)').click();
         // Select the macro
-        cy.get('.umb-card-grid-item').contains(macroName).click();
+        cy.get(`.umb-card-grid-item[title='${macroName}']`).click('bottom');
+
 
         // Save and publish
         cy.umbracoButtonByLabelKey('buttons_saveAndPublish').click();

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.html
@@ -28,12 +28,12 @@
                             <p ng-bind="a11yInfo" role="alert"></p>
                             <ul class="umb-card-grid -three-in-row">
                                 <li ng-repeat="availableItem in macros | orderBy:'name' | filter:model.searchTerm">
-                                    <button class="btn-reset umb-card-grid-item" title="{{availableItem.name}}" ng-click="selectMacro(availableItem)">
+                                  <button class="btn-reset umb-card-grid-item" title="{{availableItem.name}}" ng-click="selectMacro(availableItem)">
                                         <span>
                                             <umb-icon icon="icon-settings-alt"></umb-icon>
                                             {{availableItem.name}}
                                         </span>
-                                    </button>
+                                  </button>
                                 </li>
                             </ul>