Skip to content

Commit 00357e3

Browse files
crisbetocrisbeto
authored
build: replace deprecated axe dependency (#21534)
The `axe-webdriverjs` package was deprecated in favor of `@axe-core/webdriverjs`. These changes switch to the new package, fix the new failures that were picked up and clean up some repetitive code.
1 parent bd88e64 commit 00357e3

File tree

12 files changed

+153
-104
lines changed

12 files changed

+153
-104
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,7 @@
8080
"@angular/platform-browser-dynamic": "^11.1.0-next.2",
8181
"@angular/platform-server": "^11.1.0-next.2",
8282
"@angular/router": "^11.1.0-next.2",
83+
"@axe-core/webdriverjs": "^4.1.0",
8384
"@bazel/bazelisk": "^1.4.0",
8485
"@bazel/buildifier": "^3.5.0",
8586
"@bazel/ibazel": "^0.14.0",
@@ -111,7 +112,6 @@
111112
"@types/stylelint": "^9.10.1",
112113
"@types/yaml": "^1.9.7",
113114
"autoprefixer": "^6.7.6",
114-
"axe-webdriverjs": "^1.1.1",
115115
"browser-sync": "^2.26.7",
116116
"chalk": "^4.1.0",
117117
"codelyzer": "^6.0.0-next.2",

‎src/e2e-app/e2e-app/e2e-app-layout.html

Lines changed: 4 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,9 @@
11
<button (click)="showLinks = !showLinks">Toggle Navigation Links</button>
22

3-
<mat-nav-list *ngIf="showLinks">
4-
<a mat-list-item [routerLink]="['block-scroll-strategy']">Block scroll strategy</a>
5-
<a mat-list-item [routerLink]="['button']">Button</a>
6-
<a mat-list-item [routerLink]="['button-toggle']">Button Toggle</a>
7-
<a mat-list-item [routerLink]="['checkbox']">Checkbox</a>
8-
<a mat-list-item [routerLink]="['component-harness']">Component Harness</a>
9-
<a mat-list-item [routerLink]="['dialog']">Dialog</a>
10-
<a mat-list-item [routerLink]="['expansion']">Expansion</a>
11-
<a mat-list-item [routerLink]="['grid-list']">Grid list</a>
12-
<a mat-list-item [routerLink]="['icon']">Icon</a>
13-
<a mat-list-item [routerLink]="['input']">Input</a>
14-
<a mat-list-item [routerLink]="['list']">List</a>
15-
<a mat-list-item [routerLink]="['menu']">Menu</a>
16-
<a mat-list-item [routerLink]="['progress-bar']">Progress bar</a>
17-
<a mat-list-item [routerLink]="['progress-spinner']">Progress Spinner</a>
18-
<a mat-list-item [routerLink]="['radio']">Radios</a>
19-
<a mat-list-item [routerLink]="['sidenav']">Sidenav</a>
20-
<a mat-list-item [routerLink]="['slide-toggle']">Slide Toggle</a>
21-
<a mat-list-item [routerLink]="['stepper']">Stepper</a>
22-
<a mat-list-item [routerLink]="['tabs']">Tabs</a>
23-
<a mat-list-item [routerLink]="['cards']">Cards</a>
24-
<a mat-list-item [routerLink]="['toolbar']">Toolbar</a>
25-
<a mat-list-item [routerLink]="['virtual-scroll']">Virtual Scroll</a>
26-
<a mat-list-item [routerLink]="['mdc-button']">MDC Button</a>
27-
<a mat-list-item [routerLink]="['mdc-card']">MDC Card</a>
28-
<a mat-list-item [routerLink]="['mdc-checkbox']">MDC Checkbox</a>
29-
<a mat-list-item [routerLink]="['mdc-chips']">MDC Chips</a>
30-
<a mat-list-item [routerLink]="['mdc-dialog']">MDC Dialog</a>
31-
<a mat-list-item [routerLink]="['mdc-input']">MDC Input</a>
32-
<a mat-list-item [routerLink]="['mdc-menu']">MDC Menu</a>
33-
<a mat-list-item [routerLink]="['mdc-radio']">MDC Radio</a>
34-
<a mat-list-item [routerLink]="['mdc-slide-toggle']">MDC Slide Toggle</a>
35-
<a mat-list-item [routerLink]="['mdc-table']">MDC Table</a>
36-
<a mat-list-item [routerLink]="['mdc-tabs']">MDC Tabs</a>
37-
<a mat-list-item [routerLink]="['mdc-progress-bar']">MDC Progress bar</a>
38-
<a mat-list-item [routerLink]="['mdc-progress-spinner']">MDC Progress spinner</a>
39-
</mat-nav-list>
40-
413
<main>
4+
<mat-nav-list *ngIf="showLinks">
5+
<a mat-list-item *ngFor="let link of navLinks" [routerLink]="[link.path]">{{link.title}}</a>
6+
</mat-nav-list>
7+
428
<ng-content></ng-content>
439
</main>

‎src/e2e-app/e2e-app/e2e-app-layout.ts

Lines changed: 39 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,5 +11,43 @@ export class Home {
1111
encapsulation: ViewEncapsulation.None,
1212
})
1313
export class E2eAppLayout {
14-
showLinks: boolean = false;
14+
showLinks = false;
15+
16+
navLinks = [
17+
{path: 'block-scroll-strategy', title: 'Block scroll strategy'},
18+
{path: 'button', title: 'Button'},
19+
{path: 'button-toggle', title: 'Button Toggle'},
20+
{path: 'checkbox', title: 'Checkbox'},
21+
{path: 'component-harness', title: 'Component Harness'},
22+
{path: 'dialog', title: 'Dialog'},
23+
{path: 'expansion', title: 'Expansion'},
24+
{path: 'grid-list', title: 'Grid list'},
25+
{path: 'icon', title: 'Icon'},
26+
{path: 'input', title: 'Input'},
27+
{path: 'list', title: 'List'},
28+
{path: 'menu', title: 'Menu'},
29+
{path: 'progress-bar', title: 'Progress bar'},
30+
{path: 'progress-spinner', title: 'Progress Spinner'},
31+
{path: 'radio', title: 'Radios'},
32+
{path: 'sidenav', title: 'Sidenav'},
33+
{path: 'slide-toggle', title: 'Slide Toggle'},
34+
{path: 'stepper', title: 'Stepper'},
35+
{path: 'tabs', title: 'Tabs'},
36+
{path: 'cards', title: 'Cards'},
37+
{path: 'toolbar', title: 'Toolbar'},
38+
{path: 'virtual-scroll', title: 'Virtual Scroll'},
39+
{path: 'mdc-button', title: 'MDC Button'},
40+
{path: 'mdc-card', title: 'MDC Card'},
41+
{path: 'mdc-checkbox', title: 'MDC Checkbox'},
42+
{path: 'mdc-chips', title: 'MDC Chips'},
43+
{path: 'mdc-dialog', title: 'MDC Dialog'},
44+
{path: 'mdc-input', title: 'MDC Input'},
45+
{path: 'mdc-menu', title: 'MDC Menu'},
46+
{path: 'mdc-radio', title: 'MDC Radio'},
47+
{path: 'mdc-slide-toggle', title: 'MDC Slide Toggle'},
48+
{path: 'mdc-table', title: 'MDC Table'},
49+
{path: 'mdc-tabs', title: 'MDC Tabs'},
50+
{path: 'mdc-progress-bar', title: 'MDC Progress bar'},
51+
{path: 'mdc-progress-spinner', title: 'MDC Progress spinner'}
52+
];
1553
}

‎src/e2e-app/mdc-progress-bar/mdc-progress-bar-e2e.html

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,17 @@
1-
<mat-progress-bar mode="determinate" [value]="determinateValue"></mat-progress-bar>
2-
<mat-progress-bar mode="buffer" [value]="bufferValue"></mat-progress-bar>
3-
<mat-progress-bar mode="query"></mat-progress-bar>
4-
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
1+
<mat-progress-bar
2+
aria-label="Determinate progress bar"
3+
mode="determinate"
4+
[value]="determinateValue"></mat-progress-bar>
5+
6+
<mat-progress-bar
7+
aria-label="Buffer progress bar"
8+
mode="buffer"
9+
[value]="bufferValue"></mat-progress-bar>
10+
11+
<mat-progress-bar
12+
aria-label="Query progress bar"
13+
mode="query"></mat-progress-bar>
14+
15+
<mat-progress-bar
16+
aria-label="Determinate progress bar"
17+
mode="indeterminate"></mat-progress-bar>

‎src/e2e-app/mdc-progress-spinner/mdc-progress-spinner-e2e.html

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1-
<mat-progress-spinner [value]="value" [strokeWidth]="strokeWidth"></mat-progress-spinner>
2-
<mat-progress-spinner mode="indeterminate" [diameter]="diameter"></mat-progress-spinner>
3-
<mat-spinner></mat-spinner>
1+
<mat-progress-spinner
2+
aria-label="Determinate progress spinner"
3+
[value]="value"
4+
[strokeWidth]="strokeWidth"></mat-progress-spinner>
5+
6+
<mat-progress-spinner
7+
aria-label="Indeterminate progress spinner"
8+
mode="indeterminate"
9+
[diameter]="diameter"></mat-progress-spinner>
10+
11+
<mat-spinner aria-label="Shorthand indeterminate progress spinner"></mat-spinner>

‎src/e2e-app/progress-bar/progress-bar-e2e.html

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,17 @@
1-
<mat-progress-bar mode="determinate" [value]="determinateValue"></mat-progress-bar>
2-
<mat-progress-bar mode="buffer" [value]="bufferValue"></mat-progress-bar>
3-
<mat-progress-bar mode="query"></mat-progress-bar>
4-
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
1+
<mat-progress-bar
2+
aria-label="Determinate progress bar"
3+
mode="determinate"
4+
[value]="determinateValue"></mat-progress-bar>
5+
6+
<mat-progress-bar
7+
aria-label="Buffer progress bar"
8+
mode="buffer"
9+
[value]="bufferValue"></mat-progress-bar>
10+
11+
<mat-progress-bar
12+
aria-label="Query progress bar"
13+
mode="query"></mat-progress-bar>
14+
15+
<mat-progress-bar
16+
aria-label="Determinate progress bar"
17+
mode="indeterminate"></mat-progress-bar>

‎src/e2e-app/progress-spinner/progress-spinner-e2e.html

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1-
<mat-progress-spinner [value]="57"></mat-progress-spinner>
2-
<mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
3-
<mat-spinner></mat-spinner>
1+
<mat-progress-spinner
2+
aria-label="Determinate progress spinner"
3+
[value]="57"></mat-progress-spinner>
4+
5+
<mat-progress-spinner
6+
aria-label="Indeterminate progress spinner"
7+
mode="indeterminate"></mat-progress-spinner>
8+
9+
<mat-spinner aria-label="Shorthand indeterminate progress spinner"></mat-spinner>

‎src/e2e-app/protractor.conf.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,13 @@ exports.config = {
1818

1919
// Disable color contrast checks since the final colors will vary based on the theme.
2020
{id: 'color-contrast', enabled: false},
21+
22+
// Don't require all content to be inside landmarks since some tests depend on the
23+
// page layout and moving this around can break them.
24+
{id: 'region', enabled: false},
25+
26+
// Don't require at least one `<h1>` since we don't have any content.
27+
{id: 'page-has-heading-one', enabled: false}
2128
]
2229
}
2330
],

‎src/e2e-app/test_suite.bzl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ def e2e_test_suite(name, data = [], tags = ["e2e"], deps = []):
66
configuration = "//src/e2e-app:protractor.conf.js",
77
data = [
88
"//tools/axe-protractor",
9-
"@npm//axe-webdriverjs",
9+
"@npm//@axe-core/webdriverjs",
1010
] + data,
1111
on_prepare = "//src/e2e-app:start-devserver.js",
1212
server = "//src/e2e-app:devserver",

‎src/e2e-app/virtual-scroll/virtual-scroll-e2e.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<section class="demo-virtual-scroll-uniform-size">
22
<h3>Uniform size</h3>
3-
<cdk-virtual-scroll-viewport class="demo-viewport" autosize>
3+
<cdk-virtual-scroll-viewport class="demo-viewport" autosize tabindex="0">
44
<div *cdkVirtualFor="let size of uniformItems; let i = index; let odd = odd" class="demo-item"
55
[style.height.px]="size" [class.demo-odd]="odd" [attr.data-index]="i">
66
Uniform Item #{{i}} - ({{size}}px)
@@ -10,7 +10,7 @@ <h3>Uniform size</h3>
1010

1111
<section class="demo-virtual-scroll-variable-size">
1212
<h3>Random size</h3>
13-
<cdk-virtual-scroll-viewport class="demo-viewport" autosize>
13+
<cdk-virtual-scroll-viewport class="demo-viewport" autosize tabindex="0">
1414
<div *cdkVirtualFor="let size of variableItems; let i = index; let odd = odd" class="demo-item"
1515
[style.height.px]="size" [class.demo-odd]="odd" [attr.data-index]="i">
1616
Variable Item #{{i}} - ({{size}}px)

0 commit comments

Comments
 (0)