[CST-15592] improve tests, add attributes for testing, fix wrong references

cypress/e2e/admin-add-new-modals.cy.ts

@@ -14,7 +14,7 @@ describe('Admin Add New Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-new-title').click();
 
-    cy.get('a[title="menu.section.new_community"]').click();
+    cy.get('a[data-test="menu.section.new_community"]').click();
 
     // Analyze <ds-create-community-parent-selector> for accessibility
     testA11y('ds-create-community-parent-selector');
@@ -27,7 +27,7 @@ describe('Admin Add New Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-new-title').click();
 
-    cy.get('a[title="menu.section.new_collection"]').click();
+    cy.get('a[data-test="menu.section.new_collection"]').click();
 
     // Analyze <ds-create-collection-parent-selector> for accessibility
     testA11y('ds-create-collection-parent-selector');
@@ -40,7 +40,7 @@ describe('Admin Add New Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-new-title').click();
 
-    cy.get('a[title="menu.section.new_item"]').click();
+    cy.get('a[data-test="menu.section.new_item"]').click();
 
     // Analyze <ds-create-item-parent-selector> for accessibility
     testA11y('ds-create-item-parent-selector');

cypress/e2e/admin-edit-modals.cy.ts

@@ -14,7 +14,7 @@ describe('Admin Edit Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-edit-title').click();
 
-    cy.get('a[title="menu.section.edit_community"]').click();
+    cy.get('a[data-test="menu.section.edit_community"]').click();
 
     // Analyze <ds-edit-community-selector> for accessibility
     testA11y('ds-edit-community-selector');
@@ -27,7 +27,7 @@ describe('Admin Edit Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-edit-title').click();
 
-    cy.get('a[title="menu.section.edit_collection"]').click();
+    cy.get('a[data-test="menu.section.edit_collection"]').click();
 
     // Analyze <ds-edit-collection-selector> for accessibility
     testA11y('ds-edit-collection-selector');
@@ -40,7 +40,7 @@ describe('Admin Edit Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-edit-title').click();
 
-    cy.get('a[title="menu.section.edit_item"]').click();
+    cy.get('a[data-test="menu.section.edit_item"]').click();
 
     // Analyze <ds-edit-item-selector> for accessibility
     testA11y('ds-edit-item-selector');

cypress/e2e/admin-export-modals.cy.ts

@@ -14,7 +14,7 @@ describe('Admin Export Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-export-title').click();
 
-    cy.get('a[title="menu.section.export_metadata"]').click();
+    cy.get('a[data-test="menu.section.export_metadata"]').click();
 
     // Analyze <ds-export-metadata-selector> for accessibility
     testA11y('ds-export-metadata-selector');
@@ -27,7 +27,7 @@ describe('Admin Export Modals', () => {
     // Click on entry of menu
     cy.get('#admin-menu-section-export-title').click();
 
-    cy.get('a[title="menu.section.export_batch"]').click();
+    cy.get('a[data-test="menu.section.export_batch"]').click();
 
     // Analyze <ds-export-batch-selector> for accessibility
     testA11y('ds-export-batch-selector');

cypress/e2e/admin-search-page.cy.ts

@@ -12,6 +12,9 @@ describe('Admin Search Page', () => {
     cy.get('ds-admin-search-page').should('be.visible');
     // At least one search result should be displayed
     cy.get('[data-test="list-object"]').should('be.visible');
+    // Click each filter toggle to open *every* filter
+    // (As we want to scan filter section for accessibility issues as well)
+    cy.get('[data-test="filter-toggle"]').click({ multiple: true });
     // Analyze <ds-admin-search-page> for accessibility issues
     testA11y('ds-admin-search-page');
   });

cypress/e2e/admin-workflow-page.cy.ts

@@ -12,6 +12,9 @@ describe('Admin Workflow Page', () => {
     cy.get('ds-admin-workflow-page').should('be.visible');
     // At least one search result should be displayed
     cy.get('[data-test="list-object"]').should('be.visible');
+    // Click each filter toggle to open *every* filter
+    // (As we want to scan filter section for accessibility issues as well)
+    cy.get('[data-test="filter-toggle"]').click({ multiple: true });
     // Analyze <ds-admin-workflow-page> for accessibility issues
     testA11y('ds-admin-workflow-page');
   });

cypress/e2e/bulk-access.cy.ts

@@ -11,6 +11,11 @@ describe('Bulk Access', () => {
   it('should pass accessibility tests', () => {
     // Page must first be visible
     cy.get('ds-bulk-access').should('be.visible');
+    // At least one search result should be displayed
+    cy.get('[data-test="list-object"]').should('be.visible');
+    // Click each filter toggle to open *every* filter
+    // (As we want to scan filter section for accessibility issues as well)
+    cy.get('[data-test="filter-toggle"]').click({ multiple: true });
     // Analyze <ds-bulk-access> for accessibility issues
     testA11y('ds-bulk-access', {
       rules: {
@@ -18,6 +23,8 @@ describe('Bulk Access', () => {
         // Seem to require updating ng-bootstrap and https://github.com/DSpace/dspace-angular/issues/2216
         'aria-required-children': { enabled: false },
         'nested-interactive': { enabled: false },
+        // Card titles fail this test currently
+        'heading-order': { enabled: false },
       },
     } as Options);
   });

cypress/e2e/health-page.cy.ts

@@ -1,13 +1,14 @@
 import { testA11y } from 'cypress/support/utils';
 import { Options } from 'cypress-axe';
 
-describe('Health Page', () => {
+
 beforeEach(() => {
   // Must login as an Admin to see the page
   cy.visit('/health');
   cy.loginViaForm(Cypress.env('DSPACE_TEST_ADMIN_USER'), Cypress.env('DSPACE_TEST_ADMIN_PASSWORD'));
 });
 
+describe('Health Page > Status Tab', () => {
   it('should pass accessibility tests', () => {
     // Page must first be visible
     cy.get('ds-health-page').should('be.visible');
@@ -22,3 +23,21 @@ describe('Health Page', () => {
     } as Options);
   });
 });
+
+describe('Health Page > Info Tab', () => {
+  it('should pass accessibility tests', () => {
+    // Page must first be visible
+    cy.get('ds-health-page').should('be.visible');
+    cy.get('a[data-test="health-page.info-tab"]').click();
+
+    // Analyze <ds-health-page> for accessibility issues
+    testA11y('ds-health-page', {
+      rules: {
+        // All panels are accordians & fail "aria-required-children" and "nested-interactive".
+        // Seem to require updating ng-bootstrap and https://github.com/DSpace/dspace-angular/issues/2216
+        'aria-required-children': { enabled: false },
+        'nested-interactive': { enabled: false },
+      },
+    } as Options);
+  });
+});

src/app/health-page/health-page.component.html

@@ -3,7 +3,7 @@
   <div *ngIf="(healthResponse | async) && (healthInfoResponse | async)">
     <ul ngbNav #nav="ngbNav" [activeId]="'status'" class="nav-tabs">
       <li [ngbNavItem]="'status'" role="presentation">
-        <a ngbNavLink>{{'health-page.status-tab' | translate}}</a>
+        <a data-test="health-page.status-tab" ngbNavLink>{{'health-page.status-tab' | translate}}</a>
         <ng-template ngbNavContent>
           <div id="status">
             <ds-health-panel [healthResponse]="(healthResponse | async)"></ds-health-panel>
@@ -11,7 +11,7 @@
         </ng-template>
       </li>
       <li [ngbNavItem]="'info'" role="presentation">
-        <a ngbNavLink>{{'health-page.info-tab' | translate}}</a>
+        <a data-test="health-page.info-tab" ngbNavLink>{{'health-page.info-tab' | translate}}</a>
         <ng-template ngbNavContent>
           <div id="info">
             <ds-health-info [healthInfoResponse]="(healthInfoResponse | async)"></ds-health-info>

src/app/shared/menu/menu-item/onclick-menu-item.component.html

@@ -6,5 +6,6 @@
    (click)="activate($event)"
    (keyup.space)="activate($event)"
    (keyup.enter)="activate($event)"
+   [attr.data-test]="item.text"
 >{{item.text | translate}}</a>
-<span *ngIf="item.disabled" class="nav-item nav-link disabled">{{item.text | translate}}</span>
+<span *ngIf="item.disabled" [attr.data-test]="item.text" class="nav-item nav-link disabled">{{item.text | translate}}</span>