Skip to content

Commit 80492cd

Browse files
committed
Add Item Edit accessibility tests. Switch Item to use to one with bitstreams. Minor updates to HTML to pass accessibility tests.
1 parent 00cb2f9 commit 80492cd

6 files changed

Lines changed: 145 additions & 9 deletions

File tree

cypress.config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export default defineConfig({
2222
// Community/collection/publication used for view/edit tests
2323
DSPACE_TEST_COMMUNITY: '0958c910-2037-42a9-81c7-dca80e3892b4',
2424
DSPACE_TEST_COLLECTION: '282164f5-d325-4740-8dd1-fa4d6d3e7200',
25-
DSPACE_TEST_ENTITY_PUBLICATION: 'e98b0f27-5c19-49a0-960d-eb6ad5287067',
25+
DSPACE_TEST_ENTITY_PUBLICATION: '6160810f-1e53-40db-81ef-f6621a727398',
2626
// Search term (should return results) used in search tests
2727
DSPACE_TEST_SEARCH_TERM: 'test',
2828
// Collection used for submission tests

cypress/e2e/item-edit.cy.ts

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
import { Options } from 'cypress-axe';
2+
import { testA11y } from 'cypress/support/utils';
3+
4+
const ITEM_EDIT_PAGE = '/items/'.concat(Cypress.env('DSPACE_TEST_ENTITY_PUBLICATION')).concat('/edit');
5+
6+
beforeEach(() => {
7+
// All tests start with visiting the Edit Item Page
8+
cy.visit(ITEM_EDIT_PAGE);
9+
10+
// This page is restricted, so we will be shown the login form. Fill it out & submit.
11+
cy.loginViaForm(Cypress.env('DSPACE_TEST_ADMIN_USER'), Cypress.env('DSPACE_TEST_ADMIN_PASSWORD'));
12+
});
13+
14+
describe('Edit Item > Edit Metadata tab', () => {
15+
it('should pass accessibility tests', () => {
16+
cy.get('a[data-test="metadata"]').click();
17+
18+
// <ds-edit-item-page> tag must be loaded
19+
cy.get('ds-edit-item-page').should('be.visible');
20+
21+
// Analyze <ds-edit-item-page> for accessibility issues
22+
testA11y('ds-edit-item-page');
23+
});
24+
});
25+
26+
describe('Edit Item > Status tab', () => {
27+
28+
it('should pass accessibility tests', () => {
29+
cy.get('a[data-test="status"]').click();
30+
31+
// <ds-item-status> tag must be loaded
32+
cy.get('ds-item-status').should('be.visible');
33+
34+
// Analyze for accessibility issues
35+
testA11y('ds-item-status');
36+
});
37+
});
38+
39+
describe('Edit Item > Bitstreams tab', () => {
40+
41+
it('should pass accessibility tests', () => {
42+
cy.get('a[data-test="bitstreams"]').click();
43+
44+
// <ds-item-bitstreams> tag must be loaded
45+
cy.get('ds-item-bitstreams').should('be.visible');
46+
47+
// Table of item bitstreams must also be loaded
48+
cy.get('div.item-bitstreams').should('be.visible');
49+
50+
// Analyze for accessibility issues
51+
testA11y('ds-item-bitstreams',
52+
{
53+
rules: {
54+
// Currently Bitstreams page loads a pagination component per Bundle
55+
// and they all use the same 'id="p-dad"'.
56+
'duplicate-id': { enabled: false },
57+
}
58+
} as Options
59+
);
60+
});
61+
});
62+
63+
describe('Edit Item > Curate tab', () => {
64+
65+
it('should pass accessibility tests', () => {
66+
cy.get('a[data-test="curate"]').click();
67+
68+
// <ds-item-curate> tag must be loaded
69+
cy.get('ds-item-curate').should('be.visible');
70+
71+
// Analyze for accessibility issues
72+
testA11y('ds-item-curate');
73+
});
74+
});
75+
76+
describe('Edit Item > Relationships tab', () => {
77+
78+
it('should pass accessibility tests', () => {
79+
cy.get('a[data-test="relationships"]').click();
80+
81+
// <ds-item-relationships> tag must be loaded
82+
cy.get('ds-item-relationships').should('be.visible');
83+
84+
// Analyze for accessibility issues
85+
testA11y('ds-item-relationships');
86+
});
87+
});
88+
89+
describe('Edit Item > Version History tab', () => {
90+
91+
it('should pass accessibility tests', () => {
92+
cy.get('a[data-test="versionhistory"]').click();
93+
94+
// <ds-item-version-history> tag must be loaded
95+
cy.get('ds-item-version-history').should('be.visible');
96+
97+
// Analyze for accessibility issues
98+
testA11y('ds-item-version-history');
99+
});
100+
});
101+
102+
describe('Edit Item > Access Control tab', () => {
103+
104+
it('should pass accessibility tests', () => {
105+
cy.get('a[data-test="access-control"]').click();
106+
107+
// <ds-item-access-control> tag must be loaded
108+
cy.get('ds-item-access-control').should('be.visible');
109+
110+
// Analyze for accessibility issues
111+
testA11y('ds-item-access-control');
112+
});
113+
});
114+
115+
describe('Edit Item > Collection Mapper tab', () => {
116+
117+
it('should pass accessibility tests', () => {
118+
cy.get('a[data-test="mapper"]').click();
119+
120+
// <ds-item-collection-mapper> tag must be loaded
121+
cy.get('ds-item-collection-mapper').should('be.visible');
122+
123+
// Analyze entire page for accessibility issues
124+
testA11y('ds-item-collection-mapper');
125+
126+
// Click on the "Map new collections" tab
127+
cy.get('li[data-test="mapTab"] a').click();
128+
129+
// Make sure search form is now visible
130+
cy.get('ds-search-form').should('be.visible');
131+
132+
// Analyze entire page (again) for accessibility issues
133+
testA11y('ds-item-collection-mapper');
134+
});
135+
});

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,33 +21,33 @@
2121
<div class="btn-group">
2222
<div class="edit-field">
2323
<div class="btn-group edit-buttons" [ngbTooltip]="isVirtual ? (dsoType + '.edit.metadata.edit.buttons.virtual' | translate) : null">
24-
<button class="btn btn-outline-primary btn-sm ng-star-inserted" id="metadata-edit-btn" *ngIf="!mdValue.editing"
24+
<button class="btn btn-outline-primary btn-sm ng-star-inserted" data-test="metadata-edit-btn" *ngIf="!mdValue.editing"
2525
[title]="dsoType + '.edit.metadata.edit.buttons.edit' | translate"
2626
ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.edit' | translate }}"
2727
[disabled]="isVirtual || mdValue.change === DsoEditMetadataChangeTypeEnum.REMOVE || (saving$ | async)" (click)="edit.emit()">
2828
<i class="fas fa-edit fa-fw"></i>
2929
</button>
30-
<button class="btn btn-outline-success btn-sm ng-star-inserted" id="metadata-confirm-btn" *ngIf="mdValue.editing"
30+
<button class="btn btn-outline-success btn-sm ng-star-inserted" data-test="metadata-confirm-btn" *ngIf="mdValue.editing"
3131
[title]="dsoType + '.edit.metadata.edit.buttons.confirm' | translate"
3232
ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.confirm' | translate }}"
3333
[disabled]="isVirtual || (saving$ | async)" (click)="confirm.emit(true)">
3434
<i class="fas fa-check fa-fw"></i>
3535
</button>
36-
<button class="btn btn-outline-danger btn-sm" id="metadata-remove-btn"
36+
<button class="btn btn-outline-danger btn-sm" data-test="metadata-remove-btn"
3737
[title]="dsoType + '.edit.metadata.edit.buttons.remove' | translate"
3838
ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.remove' | translate }}"
3939
[disabled]="isVirtual || (mdValue.change && mdValue.change !== DsoEditMetadataChangeTypeEnum.ADD) || mdValue.editing || (saving$ | async)" (click)="remove.emit()">
4040
<i class="fas fa-trash-alt fa-fw"></i>
4141
</button>
42-
<button class="btn btn-outline-warning btn-sm" id="metadata-undo-btn"
42+
<button class="btn btn-outline-warning btn-sm" data-test="metadata-undo-btn"
4343
[title]="dsoType + '.edit.metadata.edit.buttons.undo' | translate"
4444
ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.undo' | translate }}"
4545
[disabled]="isVirtual || (!mdValue.change && mdValue.reordered) || (!mdValue.change && !mdValue.editing) || (saving$ | async)" (click)="undo.emit()">
4646
<i class="fas fa-undo-alt fa-fw"></i>
4747
</button>
4848
</div>
4949
</div>
50-
<button class="btn btn-outline-secondary ds-drag-handle btn-sm" id="metadata-drag-btn" *ngVar="(isOnlyValue || (saving$ | async)) as disabled"
50+
<button class="btn btn-outline-secondary ds-drag-handle btn-sm" data-test="metadata-drag-btn" *ngVar="(isOnlyValue || (saving$ | async)) as disabled"
5151
cdkDragHandle [cdkDragHandleDisabled]="disabled" [ngClass]="{'disabled': disabled}" [disabled]="disabled"
5252
[title]="dsoType + '.edit.metadata.edit.buttons.drag' | translate"
5353
ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.drag' | translate }}">

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ describe('DsoEditMetadataValueComponent', () => {
149149
let btn: DebugElement;
150150

151151
beforeEach(() => {
152-
btn = fixture.debugElement.query(By.css(`#metadata-${name}-btn`));
152+
btn = fixture.debugElement.query(By.css(`button[data-test="metadata-${name}-btn"]`));
153153
});
154154

155155
if (exists) {

src/app/item-page/edit-item-page/edit-item-page.component.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ <h1 class="border-bottom">{{'item.edit.head' | translate}}</h1>
1010
class="nav-link"
1111
[ngClass]="{'active' : page.page === currentPage}"
1212
[routerLink]="['./' + page.page]"
13+
[attr.data-test]="page.page"
1314
role="tab">
1415
{{'item.edit.tabs.' + page.page + '.head' | translate}}
1516
</a>

src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ <h2>{{'item.edit.item-mapper.head' | translate}}</h2>
66
<p>{{'item.edit.item-mapper.description' | translate}}</p>
77

88
<ul ngbNav (navChange)="tabChange($event)" [destroyOnHide]="true" #tabs="ngbNav" class="nav-tabs">
9-
<li [ngbNavItem]="'browseTab'" role="presentation">
9+
<li [ngbNavItem]="'browseTab'" role="presentation" data-test="browseTab">
1010
<a ngbNavLink>{{'item.edit.item-mapper.tabs.browse' | translate}}</a>
1111
<ng-template ngbNavContent>
1212
<div class="mt-2">
@@ -22,7 +22,7 @@ <h2>{{'item.edit.item-mapper.head' | translate}}</h2>
2222
</div>
2323
</ng-template>
2424
</li>
25-
<li [ngbNavItem]="'mapTab'" role="presentation">
25+
<li [ngbNavItem]="'mapTab'" role="presentation" data-test="mapTab">
2626
<a ngbNavLink>{{'item.edit.item-mapper.tabs.map' | translate}}</a>
2727
<ng-template ngbNavContent>
2828
<div class="row mt-2">

0 commit comments

Comments
 (0)