Skip to content

Commit

Permalink
App Maintenance (#218)
Browse files Browse the repository at this point in the history
* Updated app to current
  • Loading branch information
MelSumner authored Jun 15, 2021
1 parent 3dee04c commit 4b82c02
Show file tree
Hide file tree
Showing 38 changed files with 14,073 additions and 22,400 deletions.
1 change: 0 additions & 1 deletion .editorconfig
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@

root = true


[*]
end_of_line = lf
charset = utf-8
Expand Down
1 change: 1 addition & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
# misc
/coverage/
!.*
.eslintcache

# ember-try
/.node_modules.ember-try/
Expand Down
34 changes: 15 additions & 19 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,52 +7,48 @@ module.exports = {
ecmaVersion: 2018,
sourceType: 'module',
ecmaFeatures: {
legacyDecorators: true
}
legacyDecorators: true,
},
},
plugins: [
'ember'
],
plugins: ['ember'],
extends: [
'eslint:recommended',
'plugin:ember/recommended'
'plugin:ember/recommended',
'plugin:prettier/recommended',
],
env: {
browser: true
},
rules: {
'ember/no-jquery': 'error'
browser: true,
},
rules: {},
overrides: [
// node files
{
files: [
'.eslintrc.js',
'.prettierrc.js',
'.template-lintrc.js',
'ember-cli-build.js',
'index.js',
'testem.js',
'blueprints/*/index.js',
'config/**/*.js',
'tests/dummy/config/**/*.js'
'tests/dummy/config/**/*.js',
],
excludedFiles: [
'addon/**',
'addon-test-support/**',
'app/**',
'tests/dummy/app/**'
'tests/dummy/app/**',
],
parserOptions: {
sourceType: 'script'
sourceType: 'script',
},
env: {
browser: false,
node: true
node: true,
},
plugins: ['node'],
rules: Object.assign({}, require('eslint-plugin-node').configs.recommended.rules, {
// add your custom rules and overrides for node files here
})
}
]
extends: ['plugin:node/recommended'],
},
],
};
63 changes: 32 additions & 31 deletions .github/workflows/main.yml
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ on:
branches:
- master
tags:
- '*'
- "*"
pull_request: {}

jobs:
Expand All @@ -14,18 +14,18 @@ jobs:
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v1
- uses: actions/setup-node@v1
with:
node-version: 10.x
- name: install yarn
run: npm install -g yarn
- name: install dependencies
run: yarn install
- name: lint
run: yarn lint:js
- name: test
run: yarn test
- uses: actions/checkout@v1
- uses: actions/setup-node@v1
with:
node-version: 12.x
- name: install yarn
run: npm install -g yarn
- name: install dependencies
run: yarn install
- name: lint
run: yarn lint:js
- name: test
run: yarn test

try-scenarios:
name: ember-try
Expand All @@ -37,23 +37,24 @@ jobs:
strategy:
matrix:
ember-try-scenario:
- ember-lts-3.12
- ember-lts-3.16
- ember-release
- ember-beta
- ember-canary
- ember-default
- ember-lts-3.16
- ember-lts-3.20
- ember-release
- ember-beta
- ember-canary
- 'ember-default-with-jquery'
- 'ember-classic'

steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 12.x
- name: install yarn
run: npm install -g yarn
- name: install dependencies
run: yarn install
- name: test
env:
EMBER_TRY_SCENARIO: ${{ matrix.ember-try-scenario }}
run: node_modules/.bin/ember try:one $EMBER_TRY_SCENARIO
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 12.x
- name: install yarn
run: npm install -g yarn
- name: install dependencies
run: yarn install
- name: test
env:
EMBER_TRY_SCENARIO: ${{ matrix.ember-try-scenario }}
run: node_modules/.bin/ember try:one $EMBER_TRY_SCENARIO
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
/.env*
/.pnp*
/.sass-cache
/.eslintcache
/connect.lock
/coverage/
/libpeerconnection.log
Expand Down
3 changes: 3 additions & 0 deletions .npmignore
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,13 @@
/.editorconfig
/.ember-cli
/.env*
/.eslintcache
/.eslintignore
/.eslintrc.js
/.git/
/.gitignore
/.prettierignore
/.prettierrc.js
/.template-lintrc.js
/.travis.yml
/.watchmanconfig
Expand Down
21 changes: 21 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# unconventional js
/blueprints/*/files/
/vendor/

# compiled output
/dist/
/tmp/

# dependencies
/bower_components/
/node_modules/

# misc
/coverage/
!.*
.eslintcache

# ember-try
/.node_modules.ember-try/
/bower.json.ember-try
/package.json.ember-try
5 changes: 5 additions & 0 deletions .prettierrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
'use strict';

module.exports = {
singleQuote: true,
};
2 changes: 1 addition & 1 deletion .template-lintrc.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
'use strict';

module.exports = {
extends: 'octane'
extends: 'recommended',
};
15 changes: 8 additions & 7 deletions .travis.yml
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@ language: node_js
node_js:
# we recommend testing addons with the same minimum supported node version as Ember CLI
# so that your addon works for all apps
- "10"
- "12"

dist: trusty
dist: xenial

addons:
chrome: stable
Expand Down Expand Up @@ -35,26 +35,27 @@ jobs:
- stage: "Tests"
name: "Tests"
script:
- npm run lint:hbs
- npm run lint:js
- npm test
- npm run lint
- npm run test:ember

- stage: "Additional Tests"
name: "Floating Dependencies"
install:
- npm install --no-package-lock
script:
- npm test
- npm run test:ember

# we recommend new addons test the current and previous LTS
# as well as latest stable release (bonus points to beta/canary)
- env: EMBER_TRY_SCENARIO=ember-lts-3.12
- env: EMBER_TRY_SCENARIO=ember-lts-3.16
- env: EMBER_TRY_SCENARIO=ember-lts-3.20
- env: EMBER_TRY_SCENARIO=ember-release
- env: EMBER_TRY_SCENARIO=ember-beta
- env: EMBER_TRY_SCENARIO=ember-canary
- env: EMBER_TRY_SCENARIO=ember-default-with-jquery
- env: EMBER_TRY_SCENARIO=ember-classic
- env: EMBER_TRY_SCENARIO=embroider-safe
- env: EMBER_TRY_SCENARIO=embroider-optimized

script:
- node_modules/.bin/ember try:one $EMBER_TRY_SCENARIO
5 changes: 2 additions & 3 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,8 @@

## Linting

* `npm run lint:hbs`
* `npm run lint:js`
* `npm run lint:js -- --fix`
* `npm run lint`
* `npm run lint:fix`

## Running tests

Expand Down
2 changes: 1 addition & 1 deletion LICENSE.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
The MIT License (MIT)

Copyright (c) 2019
Copyright (c) 2021

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

Expand Down
22 changes: 15 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,22 @@

## What This Addon Does

This addon does two things:
This addon does three things:
1. it adds a message to the page to let the screen reader user know that the route has changed and regular page navigation can resume (it is similar to [https://github.com/ember-a11y/a11y-announcer](https://github.com/ember-a11y/a11y-announcer) but does not use `aria-live`).
2. It moves the focus to that message for the screen reader user, effectively resetting focus in Ember apps (similar to how a native web page/site works).
3. It provides a bypass mechanism so the user can skip to the page's primary content (see https://www.w3.org/TR/WCAG20-TECHS/G1.html). You can opt out of this if you want (see the `Options` section for available options).

## Why This Addon is Needed

Single-Page Applications(SPAs) use `pushState` to allow portions of the page to be updated or replaced without a whole new page being rendered. While this was a positive gain for performance on the web, it has made an entire type of web app not accessible (usable) for folks who depend on assistive technology(such as screen-readers) to use the web. With the prolific rise of JavaScript frameworks as the tool of choice for building modern web applications, screen-reader users have become increasingly left out of many experiences of the modern web that have become necessary for everyday life, such as online banking, paying bills, and ordering products and services.
Single-Page Applications(SPAs) use `pushState` to allow portions of the page to be updated or replaced without a whole new page being rendered. While this was a positive gain for performance on the web, it has made an entire type of web app not accessible (usable) for folks who depend on assistive technology(such as screen-readers) to use the web. With the prolific rise of JavaScript frameworks as the tool of choice for building modern web applications, screen-reader users have become increasingly left out of many experiences of the modern web that have become necessary for everyday life, such as online banking, paying bills, and ordering products and services.

Since `pushState` does nothing to inform the browser--and, by extent, the screen reader--that new content is present, the screen-reader user has no way of knowing that new content exists, or that navigation to a new page was successful. Additionally, focus remains where it was, instead of being reset in a predictable fashion.

## FAQs
## FAQs

### What about async data loading?

Async data can be loaded as it normally would be. Since this addon does not use `aria-live`, it won't interfere with or compete with other loading states. This will only give the user with a screen reader a message that the route (URL) has changed, and place the focus where they expect it to be (reset to the top left of the page).
Async data can be loaded as it normally would be. Since this addon does not use `aria-live`, it won't interfere with or compete with other loading states. This will only give the user with a screen reader a message that the route (URL) has changed, and place the focus where they expect it to be (reset to the top left of the page).

### What if I want to put focus somewhere specific in the app flow?

Expand All @@ -32,9 +33,9 @@ Since this will run before other content, focus can be programmatically moved by
Compatibility
------------------------------------------------------------------------------

* Ember.js v3.12 or above
* Ember CLI v2.13 or above
* Node.js v10 or above
* Ember.js v3.26 or above
* Ember CLI v3.26 or above
* Node.js v12 or above

Installation
------------------------------------------------------------------------------
Expand All @@ -48,6 +49,13 @@ Usage

Insert `<NavigationNarrator/>` into your application.hbs file, preferably inside of a `<header>` element.

Options
------------------------------------------------------------------------------
`skipLink` - pass `{{false}}` if you do not want to implement a skip link.
`skipTo` - pass a specific element ID that should receive focus on skip.
`skipText` - customize the text passed in the skip link. Defaults to "Skip to main content".
`navigationText` - customize the text passed as the navigation message. Defaults to "The page navigation is complete. You may now navigate the page content as you wish."

Contributing
------------------------------------------------------------------------------

Expand Down
18 changes: 18 additions & 0 deletions addon/components/navigation-narrator.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<div
tabindex="-1"
class="ember-sr-only {{if this.isFocusable 'ember-sr-only-focusable'}}"
id="ember-a11y-refocus-nav-message"
>
{{this.navigationText}}
</div>
{{#if this.skipLink}}
<a
href={{this.skipTo}}
class="ember-a11y-refocus-skip-link {{if this.isSkipLinkFocused 'active'}}"
{{on 'focus' this.handleSkipLinkFocus}}
{{on 'blur' this.handleSkipLinkFocus}}
id="ember-a11y-refocus-skip-link"
>
{{this.skipText}}
</a>
{{/if}}
Loading

0 comments on commit 4b82c02

Please sign in to comment.