Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit c058c91

Browse files
SgtpluckSgtpluck
committed
Add pa11y-ci and github action
1 parent 0ac68f3 commit c058c91

13 files changed

+1087
-97
lines changed

‎.github/workflows/pa11y.yml

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
# Pulled from Daniel Mundra's blog post https://accessibility.civicactions.com/posts/automated-accessibility-testing-leveraging-github-actions-and-pa11y-ci-with-axe
2+
name: pa11y tests
3+
4+
on: [pull_request]
5+
6+
jobs:
7+
build:
8+
name: Building site and running pa11y-ci tests
9+
runs-on: ubuntu-latest
10+
11+
steps:
12+
- name: Checkout source.
13+
uses: actions/checkout@v2
14+
15+
- name: Install jekyll site dependencies.
16+
uses: ruby/setup-ruby@v1
17+
with:
18+
ruby-version: 2.7.2
19+
bundler-cache: true
20+
21+
- name: Install pa11y-ci dependencies.
22+
run: npm install
23+
24+
- name: Start up jekyll server.
25+
run: npm run start-detached
26+
27+
- name: Run pa11y-ci.
28+
run: npm run pa11y-ci:sitemap 2>&1 | tee pa11y_output.txt
29+
30+
- name: Read pa11y_output file.
31+
id: pa11y_output
32+
uses: juliangruber/read-file-action@v1
33+
with:
34+
path: ./pa11y_output.txt
35+
36+
- name: Comment on pull request.
37+
uses: thollander/actions-comment-pull-request@master
38+
with:
39+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
40+
message: '<details><summary>Pa11y testing results</summary>
41+
42+
43+
```${{ steps.pa11y_output.outputs.content }}```
44+
45+
</details>'
46+
47+
- name: Check for pa11y failures.
48+
if: contains(steps.pa11y_output.outputs.content, 'errno 2')
49+
run: |
50+
echo "::error::The site is failing accessibility tests. Please review the comment in the pull request or the pa11y-ci step in the workflow for details."
51+
exit 1

‎.pa11yci

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"defaults": {
3+
"concurrency": 4,
4+
"standard": "WCAG2AA",
5+
"runners": ["axe"]
6+
}
7+
}

‎_config.yml

+1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ exclude:
77
- Gemfile.lock
88
- LICENSE.md
99
- README.md
10+
- node_modules
1011

1112
permalink: pretty
1213

‎_includes/footer.html

+51-51
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010

1111
{% assign anchor = site.data.anchor %}
1212

13-
<section class="anchor" data-uswds="1.0">
13+
<footer class="anchor" data-uswds="1.0">
1414
{% if anchor.edit_page or (anchor.last_updated and page.last_modified_at) %}
1515
{% unless footer.type %}
1616
<div class="component-anchor-meta">
@@ -35,67 +35,67 @@
3535
</div>
3636
{% endunless %}
3737
{% endif %}
38-
<div class="component-anchor">
39-
<div class="usa-accordion">
40-
<div class="grid-container grid-container-desktop">
41-
<div class="grid-row tablet:grid-gap-4">
42-
<div class="grid-col-12">
43-
<div class="org-short">
44-
<div class="org-copy">
45-
<a href="{{ anchor.agency_url }}" title="{{ anchor.agency }}">
46-
<img src="{{site.baseurl}}/assets/images/{{ anchor.agency_logo }}" class="org-img" alt="{{ anchor.agency }} Logo"></a>
47-
{% if anchor.org_secondary_logo %}
48-
<a href="{{ anchor.org_secondary_url }}" title="{{ anchor.org_secondary }}">
49-
<img src="{{site.baseurl}}/assets/images/{{ anchor.org_secondary_logo }}" class="org-img" alt="{{ anchor.org_secondary }} Logo"></a>
50-
{% endif %}
51-
<p><a href="{{site.baseurl}}" title="{{ site.title }}">{{ site.title -}}</a> is a product of {{ anchor.agency_acronym }}&#8217;s <a href="{{ anchor.org_primary_url }}" title="{{ anchor.org_primary }}">{{ anchor.org_primary }}</a>{%if anchor.org_secondary %}, and is managed by <a href="{{ anchor.org_secondary_url }}" title="{{ anchor.org_secondary }}">{{ anchor.org_secondary }}</a>{%endif%}.</p>
38+
<div class="component-anchor">
39+
<div class="usa-accordion">
40+
<div class="grid-container grid-container-desktop">
41+
<div class="grid-row tablet:grid-gap-4">
42+
<div class="grid-col-12">
43+
<div class="org-short">
44+
<div class="org-copy">
45+
<a href="{{ anchor.agency_url }}" title="{{ anchor.agency }}">
46+
<img src="{{site.baseurl}}/assets/images/{{ anchor.agency_logo }}" class="org-img" alt="{{ anchor.agency }} Logo"></a>
47+
{% if anchor.org_secondary_logo %}
48+
<a href="{{ anchor.org_secondary_url }}" title="{{ anchor.org_secondary }}">
49+
<img src="{{site.baseurl}}/assets/images/{{ anchor.org_secondary_logo }}" class="org-img" alt="{{ anchor.org_secondary }} Logo"></a>
50+
{% endif %}
51+
<p><a href="{{site.baseurl}}" title="{{ site.title }}">{{ site.title -}}</a> is a product of {{ anchor.agency_acronym }}&#8217;s <a href="{{ anchor.org_primary_url }}" title="{{ anchor.org_primary }}">{{ anchor.org_primary }}</a>{%if anchor.org_secondary %}, and is managed by <a href="{{ anchor.org_secondary_url }}" title="{{ anchor.org_secondary }}">{{ anchor.org_secondary }}</a>{%endif%}.</p>
52+
</div>
53+
<button class="btn-learn-more usa-button usa-button--outline usa-button--inverse usa-accordion__button" aria-hidden="false" aria-expanded="false" aria-controls="org-details">
54+
<span>Learn&nbsp;more</span>
55+
</button>
5256
</div>
53-
<button class="btn-learn-more usa-button usa-button--outline usa-button--inverse usa-accordion__button" aria-hidden="false" aria-expanded="false" aria-controls="org-details">
54-
<span>Learn&nbsp;more</span>
55-
</button>
5657
</div>
5758
</div>
58-
</div>
59-
<div class="org-expanded" id="org-details" hidden>
60-
<div class="grid-row tablet:grid-gap-2">
61-
<div class="grid-col-12 tablet:grid-col-6">
62-
<div class="org-copy">
63-
{% if anchor.org_primary_bio %}
64-
<p>{{ anchor.org_primary_bio }} <a class="more" href="{{ anchor.org_primary_url }}" title="Learn more about {{ anchor.org_primary }}">Read more</a></p>
65-
{%endif %}
66-
{% if anchor.org_secondary_bio %}
67-
<p>{{ anchor.org_secondary_bio }} <a class="more" href="{{ anchor.org_secondary_url }}" title="Learn more about {{ anchor.org_secondary }}">Read more</a></p>
68-
{% endif %}
59+
<div class="org-expanded" id="org-details" hidden>
60+
<div class="grid-row tablet:grid-gap-2">
61+
<div class="grid-col-12 tablet:grid-col-6">
62+
<div class="org-copy">
63+
{% if anchor.org_primary_bio %}
64+
<p>{{ anchor.org_primary_bio }} <a class="more" href="{{ anchor.org_primary_url }}" title="Learn more about {{ anchor.org_primary }}">Read more</a></p>
65+
{%endif %}
66+
{% if anchor.org_secondary_bio %}
67+
<p>{{ anchor.org_secondary_bio }} <a class="more" href="{{ anchor.org_secondary_url }}" title="Learn more about {{ anchor.org_secondary }}">Read more</a></p>
68+
{% endif %}
69+
</div>
6970
</div>
70-
</div>
71-
<div class="grid-col-12 tablet-lg:grid-col-5 tablet-lg:grid-offset-1">
72-
<div class="org-links">
73-
<p><i class="fas fa-envelope"></i> For questions about this website, email <a href="mailto:{{ anchor.site_email }}">{{ anchor.site_email }}</a>.</p>
74-
<p>Additional information about the {{ anchor.agency }} ({{ anchor.agency_acronym }}) can be found at <a href="{{ anchor.agency_about_url }}" title="More about the {{ anchor.agency_acronym }}">{{ anchor.agency_about_url }}</a></p>
75-
<ul>
76-
<li><a href="{{ anchor.fraud_waste_abuse_url }}" title="Report fraud, waste, or abuse to the Office of the Inspector General">Report fraud, waste, or abuse to the Office of the Inspector General</a></li>
77-
<li><a href="{{ anchor.foia_request_url }}" title="Submit a Freedom of Information Act (FOIA) request">Submit a Freedom of Information Act (FOIA) request</a></li>
78-
<li><a href="{{ anchor.budget_performance_url }}" title="View budget and performance reports">View budget and performance reports</a></li>
79-
<li><a href="{{ anchor.accessibility_url }}" title="View accessibility statement">View accessibility statement</a></li>
80-
<li><a href="{{ anchor.no_fear_act_url }}" title="View No FEAR Act data">View No FEAR Act data</a></li>
81-
</ul>
71+
<div class="grid-col-12 tablet-lg:grid-col-5 tablet-lg:grid-offset-1">
72+
<div class="org-links">
73+
<p><i class="fas fa-envelope"></i> For questions about this website, email <a href="mailto:{{ anchor.site_email }}">{{ anchor.site_email }}</a>.</p>
74+
<p>Additional information about the {{ anchor.agency }} ({{ anchor.agency_acronym }}) can be found at <a href="{{ anchor.agency_about_url }}" title="More about the {{ anchor.agency_acronym }}">{{ anchor.agency_about_url }}</a></p>
75+
<ul>
76+
<li><a href="{{ anchor.fraud_waste_abuse_url }}" title="Report fraud, waste, or abuse to the Office of the Inspector General">Report fraud, waste, or abuse to the Office of the Inspector General</a></li>
77+
<li><a href="{{ anchor.foia_request_url }}" title="Submit a Freedom of Information Act (FOIA) request">Submit a Freedom of Information Act (FOIA) request</a></li>
78+
<li><a href="{{ anchor.budget_performance_url }}" title="View budget and performance reports">View budget and performance reports</a></li>
79+
<li><a href="{{ anchor.accessibility_url }}" title="View accessibility statement">View accessibility statement</a></li>
80+
<li><a href="{{ anchor.no_fear_act_url }}" title="View No FEAR Act data">View No FEAR Act data</a></li>
81+
</ul>
82+
</div>
8283
</div>
8384
</div>
8485
</div>
8586
</div>
8687
</div>
8788
</div>
88-
</div>
89-
<div class="component-anchor-support">
90-
<div class="grid-container grid-container-desktop">
91-
<div class="grid-row tablet-lg:grid-gap-2">
92-
<div class="grid-col-12">
93-
<div class="usagov">
94-
<span>Looking for U.S. government information and services?</span></p>
95-
<a class="usa-link usagov__link" href="{{ anchor.usagov_contact_url }}?ref={{ site.title }}">Visit USA.gov</a>
89+
<div class="component-anchor-support">
90+
<div class="grid-container grid-container-desktop">
91+
<div class="grid-row tablet-lg:grid-gap-2">
92+
<div class="grid-col-12">
93+
<div class="usagov">
94+
<span>Looking for U.S. government information and services?</span></p>
95+
<a class="usa-link usagov__link" href="{{ anchor.usagov_contact_url }}?ref={{ site.title }}">Visit USA.gov</a>
96+
</div>
9697
</div>
9798
</div>
9899
</div>
99100
</div>
100-
</div>
101-
</section>
101+
</footer>

‎_pages/javascript.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -142,20 +142,20 @@ When choosing a JavaScript web framework, also consider if vanilla JavaScript wo
142142
{%include components/tag-default.html %}
143143
[React](https://reactjs.org/) (sometimes styled React.js or ReactJS) is an open-source JavaScript library for creating user interfaces that aims to address challenges encountered in developing single-page applications ([Wikipedia](https://en.wikipedia.org/wiki/React_(JavaScript_library))).
144144

145-
#### When to use:
145+
### When to use:
146146
- Single page apps that requires data manipulation on the front end without a server side request/response architecture.
147147
- When there's a strong need to render JavaScript based UI on the server due to performance or accessibility reasons.
148148
- JavaScript UI that incorperates many nested components.
149149
- A UI with many components and updates that needs to be performance conscious.
150150
- When only a "view" framework is desired/required.
151151
- To ensure all front-end components conform to a single standard.
152152

153-
#### When not to use:
153+
### When not to use:
154154
- When a complex build process is not feasible. React requires transforming "jsx" files to regular JavaScript.
155155
- When developers unfamiliar with JSX and don't have time to learn.
156156
- While open source, is maintained primarily by Facebook.
157157

158-
#### Goes well with:
158+
### Goes well with:
159159
- [Redux](https://redux.js.org/) - An application state management library.
160160
- **When to use:**
161161
- When an application has complex internal state that affects how the site is rendered in realtime.
@@ -170,7 +170,7 @@ When choosing a JavaScript web framework, also consider if vanilla JavaScript wo
170170

171171
We don't work with Angular a lot ourselves, but it is a well-maintained, highly-used modern framework and we should not discourage or frown on its use by our partners. In our consulting and acquisition work, we view Angular as a solid choice for a frontend web framework, given the considerations below.
172172

173-
#### When to use:
173+
### When to use:
174174
- Sites with heavy front end, JavaScript UI interactions (single page apps) such as:
175175
- creating, updating, deleting of information without a server reload
176176
- real-time messaging platforms, such as chat or complex messaging such as email
@@ -179,20 +179,20 @@ We don't work with Angular a lot ourselves, but it is a well-maintained, highly-
179179
- When the site's design specifies a single page app architecture over classic server request and response.
180180
- When the whole site will be built with Angular to maintain front-end code consistency.
181181

182-
#### When not to use:
182+
### When not to use:
183183
- For a single or a few simple components (with the rest of the site not using Angular), instead see React or Web Components.
184184
- Exporting a module that isn't an Angular module.
185185
- If there is a strict requirement that the site should work for users that have JavaScript disabled.
186186
- If there already is an active M**V framework (Backbone, ampersand, Ember) being used on the site.
187187
- When the site's design doesn't benefit from a single page app architecture.
188188
- When the long-term maintenance dev team is very unfamiliar with Angular and don't have the resources to learn or hire for it.
189189

190-
#### Pros:
190+
### Pros:
191191
- Takes care of a lot of boilerplate code for front-end interactions.
192192
- Attempts to extend HTML itself, and was designed so less experienced devs could use it.
193193
- Being maintained and developed by Google generally means good support.
194194

195-
#### Cons:
195+
### Cons:
196196
- While open source, is maintained primarily by Google.
197197
- Has been known to implement breaking changes in major version updates.
198198
- Built with Typescript, which is not ECMA standardized (as opposed to vanilla JS or ES6).

‎_pages/license.md

+2-3
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,17 @@ subnav:
88
- text: Other information
99
href: "#other-information"
1010
---
11-
1211
As a work of the [United States government](https://www.usa.gov/), this project is in the public domain within the United States of America.
1312

1413
Additionally, we waive copyright and related rights in the work worldwide through the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/legalcode).
1514

16-
### No copyright
15+
## No copyright
1716

1817
The person who associated a work with this deed has dedicated the work to the public domain by waiving all of their rights to the work worldwide under copyright law, including all related and neighboring rights, to the extent allowed by law.
1918

2019
You can copy, modify, distribute, and perform the work, even for commercial purposes, all without asking permission.
2120

22-
### Other information
21+
## Other information
2322

2423
In no way are the patent or trademark rights of any person affected by CC0, nor are the rights that other persons may have in the work or in how the work is used, such as publicity or privacy rights.
2524

‎_pages/people.md

+7-8
Original file line numberDiff line numberDiff line change
@@ -3,28 +3,27 @@ title: Feedback Guide
33
sidenav: approach
44
sticky_sidenav: true
55
---
6-
76
Here are some attributes of giving feedback in a highly constructive way that we have learned and used over the years.
87

9-
### Timely
8+
## Timely
109
Ideally feedback, positive or negative, is given as close to the event as possible. Regular [1:1 meetings](https://handbook.18f.gov/one-on-ones/) are a great venue for delivering feedback.
1110

12-
### Evidence
11+
## Evidence
1312
Gather evidence for the feedback instead of relying on vague reports or hunches. Have concrete examples, ideally more than one for negative feedback.
1413

15-
### Behaviors
14+
## Behaviors
1615
Describe behaviors (is late to meetings) rather than traits or emotions (doesn't care about coworkers). You'll never know anyone else's thoughts, feelings, or motivations. You can observe behaviors in an objective and factual manner. This can be a hard habit change if you've built up years of giving feedback in the other way, but keep at it, it is worth switching.
1716

18-
### Results
17+
## Results
1918
When you describe a behavior, also say the result. This goes for positive and negative feedback. "When you review pull requests right away, you really help the velocity of the whole team." "When you are regularly late for meetings, the effectiveness of the rest of the meeting is reduced because the meeting leader has to repeat information or wait for you."
2019

21-
### Future Focus
20+
## Future Focus
2221
Don't dwell on the past, but focus on the future. The future can be altered, the past will never change.
2322

24-
### Top Performers
23+
## Top Performers
2524
Giving constructive feedback to a top performer is not nitpicking, it is actually some of the highest leverage work we can do. Most folks (not everyone of course) are eager to hear ways they can keep growing. We don't help folks by having no ideas for them.
2625

27-
### End of Year Assessment Guides
26+
## End of Year Assessment Guides
2827

2928
TTS, as a part of GSA, has a mature [performance management and recognition system](https://insite.gsa.gov/portal/content/500278).
3029
This includes an end-of-year performance assessment.

‎_pages/ruby.md

+1-2
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,13 @@ title: Ruby Guide
33
sidenav: languages
44
sticky_sidenav: true
55
---
6-
76
_This is a **WORK IN PROGRESS**. Help us make it better by
87
[submitting an issue](https://github.com/18F/development-guide) or joining us
98
in the [#ruby](https://18f.slack.com/messages/ruby/) channel!_
109

1110
A guide for writing and maintaining Ruby and Rails applications
1211

13-
### Style Guide
12+
## Style Guide
1413

1514
Follow the [Ruby Style Guide](https://github.com/bbatsov/ruby-style-guide) and
1615
enforce it via static analysis tools such as [Code Climate] and [Rubocop]. You

0 commit comments

Comments
 (0)