Fix heading order issue with item page & update accessibility tests to prove it now passes

This commit is contained in:
Tim Donohue
2023-08-29 11:44:03 -05:00
parent 339ed63734
commit ba244bf6b1
4 changed files with 17 additions and 12 deletions

View File

@@ -1,4 +1,3 @@
import { Options } from 'cypress-axe';
import { TEST_ENTITY_PUBLICATION } from 'cypress/support/e2e'; import { TEST_ENTITY_PUBLICATION } from 'cypress/support/e2e';
import { testA11y } from 'cypress/support/utils'; import { testA11y } from 'cypress/support/utils';
@@ -19,13 +18,16 @@ describe('Item Page', () => {
cy.get('ds-item-page').should('be.visible'); cy.get('ds-item-page').should('be.visible');
// Analyze <ds-item-page> for accessibility issues // Analyze <ds-item-page> for accessibility issues
// Disable heading-order checks until it is fixed testA11y('ds-item-page');
testA11y('ds-item-page', });
{
rules: { it('should pass accessibility tests on full item page', () => {
'heading-order': { enabled: false } cy.visit(ENTITYPAGE + '/full');
}
} as Options // <ds-full-item-page> tag must be loaded
); cy.get('ds-full-item-page').should('be.visible');
// Analyze <ds-full-item-page> for accessibility issues
testA11y('ds-full-item-page');
}); });
}); });

View File

@@ -1,6 +1,6 @@
<h2 class="item-page-title-field"> <h1 class="item-page-title-field">
<div *ngIf="item.firstMetadataValue('dspace.entity.type') as type" class="d-inline"> <div *ngIf="item.firstMetadataValue('dspace.entity.type') as type" class="d-inline">
{{ type.toLowerCase() + '.page.titleprefix' | translate }} {{ type.toLowerCase() + '.page.titleprefix' | translate }}
</div> </div>
<span class="dont-break-out">{{ dsoNameService.getName(item) }}</span> <span class="dont-break-out">{{ dsoNameService.getName(item) }}</span>
</h2> </h1>

View File

@@ -1,5 +1,5 @@
<div class="simple-view-element" [class.d-none]="hideIfNoTextContent && content.textContent.trim().length === 0"> <div class="simple-view-element" [class.d-none]="hideIfNoTextContent && content.textContent.trim().length === 0">
<h5 class="simple-view-element-header" *ngIf="label">{{ label }}</h5> <h2 class="simple-view-element-header" *ngIf="label">{{ label }}</h2>
<div #content class="simple-view-element-body"> <div #content class="simple-view-element-body">
<ng-content></ng-content> <ng-content></ng-content>
</div> </div>

View File

@@ -2,4 +2,7 @@
.simple-view-element { .simple-view-element {
margin-bottom: 15px; margin-bottom: 15px;
} }
.simple-view-element-header {
font-size: 1.25rem;
}
} }