Skip to content

Commit c665367

Browse files
IsaDCIsaDC
authored
Create updated tests for APG design pattern example: Alert (#685)
* Update timestamped example directory and references.csv * Remove previous APG example * Example: update page title and remove 'Related Links' nav and similar example links, as well as 'Accessibility Features', 'Keyboard Support', 'Role, Property, State, and Tabindex Attributes' and source code sections and footer nav * Fix typo in references.csv * Generate .html source files with scripts automatically Co-authored-by: IsaDC <IsaDC@users.noreply.github.com>
1 parent c16567f commit c665367

File tree

5 files changed

+41
-41
lines changed

5 files changed

+41
-41
lines changed

‎tests/alert/data/references.csv

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ refId,value
22
author,Isabel Del Castillo
33
authorEmail,isa.delcastillo5@gmail.com
44
title,Alert Example
5-
reference,reference/2021-10-15_143458/alert.html
5+
reference,reference/2022-4-8_144013/alert.html
66
designPattern,https://w3c.github.io/aria-practices/#alert
77
example,https://w3c.github.io/aria-practices/examples/alert/alert.html
88
alert,https://w3c.github.io/aria/#alert

‎tests/alert/reference/2021-10-15_143458/alert.html renamed to ‎tests/alert/reference/2022-4-8_144013/alert.html

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,37 @@
1-
<!DOCTYPE html>
2-
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<title>Alert Example</title>
6-
7-
<!-- js and css for this example. -->
8-
<link href="css/alert.css" rel="stylesheet">
9-
<script src="js/alert.js" type="text/javascript"></script>
10-
</head>
11-
<body>
12-
<main>
13-
<h1>Alert Example</h1>
14-
<p>
15-
The below example demonstrates the <a href="https://w3c.github.io/#alert">design pattern for alert</a>.
16-
Activating the <q>Trigger Alert</q> button causes a message to be inserted into the example alert element.
17-
</p>
18-
<section>
19-
<div class="example-header">
20-
<h2 id="ex_label">Example</h2>
21-
</div>
22-
<div role="separator" id="ex_start_sep" aria-labelledby="ex_start_sep ex_label" aria-label="Start of"></div>
23-
<div id="ex1">
24-
<button type="button" id="alert-trigger">Trigger Alert</button>
25-
26-
<div id="example" role="alert"></div>
27-
28-
<!-- The following script element contains the content that will be inserted into the alert element. -->
29-
<script type="text/template" id="alert-template">
30-
<p>Hello</p>
31-
</script>
32-
</div>
33-
<div role="separator" id="ex_end_sep" aria-labelledby="ex_end_sep ex_label" aria-label="End of"></div>
34-
</section>
35-
</main>
36-
</body>
37-
</html>
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Alert Example</title>
6+
7+
<!-- js and css for this example. -->
8+
<link href="css/alert.css" rel="stylesheet">
9+
<script src="js/alert.js" type="text/javascript"></script>
10+
</head>
11+
<body>
12+
<main>
13+
<h1>Alert Example</h1>
14+
<p>
15+
The below example demonstrates the <a href="https://w3c.github.io/#alert">design pattern for alert</a>.
16+
Activating the <q>Trigger Alert</q> button causes a message to be inserted into the example alert element.
17+
</p>
18+
<section>
19+
<div class="example-header">
20+
<h2 id="ex_label">Example</h2>
21+
</div>
22+
<div role="separator" id="ex_start_sep" aria-labelledby="ex_start_sep ex_label" aria-label="Start of"></div>
23+
<div id="ex1">
24+
<button type="button" id="alert-trigger">Trigger Alert</button>
25+
26+
<div id="example" role="alert"></div>
27+
28+
<!-- The following script element contains the content that will be inserted into the alert element. -->
29+
<script type="text/template" id="alert-template">
30+
<p>Hello</p>
31+
</script>
32+
</div>
33+
<div role="separator" id="ex_end_sep" aria-labelledby="ex_end_sep ex_label" aria-label="End of"></div>
34+
</section>
35+
</main>
36+
</body>
37+
</html>

‎tests/alert/reference/2021-10-15_143458/alert.setFocusOnButton.html renamed to ‎tests/alert/reference/2022-4-8_144013/alert.setFocusOnButton.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8" />
4+
<meta charset="utf-8">
55
<title>Alert Example</title>
66

77
<!-- js and css for this example. -->

‎tests/alert/reference/2021-10-15_143458/css/alert.css renamed to ‎tests/alert/reference/2022-4-8_144013/css/alert.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
[role="alert"] {
22
padding: 10px;
3-
border: 2px solid hsl(206, 74%, 54%);
3+
border: 2px solid hsl(206deg 74% 54%);
44
border-radius: 4px;
5-
background: hsl(206, 74%, 90%);
5+
background: hsl(206deg 74% 90%);
66
}
77

88
[role="alert"]:empty {

‎tests/alert/reference/2021-10-15_143458/js/alert.js renamed to ‎tests/alert/reference/2022-4-8_144013/js/alert.js

File renamed without changes.

0 commit comments

Comments
 (0)