From 30a29c2a28beef32aa4b738544e91a7532c9c5d9 Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Thu, 25 Jun 2020 10:26:12 +0200 Subject: [PATCH 01/11] first draft for RFC to add ember-page-title in app blueprint --- text/0000-add-ember-page-title-addon.md | 43 +++++++++++++++++++++++++ 1 file changed, 43 insertions(+) create mode 100644 text/0000-add-ember-page-title-addon.md diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md new file mode 100644 index 0000000000..305693fc8d --- /dev/null +++ b/text/0000-add-ember-page-title-addon.md @@ -0,0 +1,43 @@ +- Start Date: 2020-06-24 +- Relevant Team(s): Ember CLI +- RFC PR: (after opening the RFC PR, update this with a link to it and update the file name) +- Tracking: (leave this empty) +- Authors: Benjamin Jegard + +# RFC to add ember-page-title to the default app blueprint + +## Summary + +Add https://github.com/adopted-ember-addons/ember-page-title as a default addon for the app blueprints. (addons too ?) + +## Motivation + +This RFC is part of the work made by Ember.js Accessibility Strike Team to ensure that newly created ember apps have no accessibility issues. + +Users with assistive technology rely on the page title to know if they are on the correct page of a website. +Adding this addon will provide developers a simple solution to achieve the [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) + +## Detailed design + +1. Move ember-page-title to the ember-cli org (?) (already in ember-adopted-addon org) +2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 +3. Update app blueprint to include `{{head-layout}}` on top of https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs +4. Update route blueprint to include `{{page-title "Route name"}}` on top of the route template file + +## How we teach this + +Update the "Page Title" section in [Page Template Considerations](https://guides.emberjs.com/release/accessibility/page-template-considerations) to use `ember-page-title`. + +## Drawbacks + +- An additional dependency. + +## Alternatives + +## Unresolved questions + +None + +## References + +- [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) \ No newline at end of file From 307deae5194c45104c806459afcb1035cb2f5146 Mon Sep 17 00:00:00 2001 From: Benjamin JEGARD Date: Thu, 25 Jun 2020 17:18:44 +0200 Subject: [PATCH 02/11] Use bracket invocation Co-authored-by: abhilashlr --- text/0000-add-ember-page-title-addon.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 305693fc8d..74e11b6a91 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -21,7 +21,7 @@ Adding this addon will provide developers a simple solution to achieve the [WCAG 1. Move ember-page-title to the ember-cli org (?) (already in ember-adopted-addon org) 2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 -3. Update app blueprint to include `{{head-layout}}` on top of https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs +3. Update app blueprint to include `` on top of https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs 4. Update route blueprint to include `{{page-title "Route name"}}` on top of the route template file ## How we teach this @@ -40,4 +40,4 @@ None ## References -- [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) \ No newline at end of file +- [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) From 677af23a48cc6725853109d1e12f5a20308f1940 Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Fri, 3 Jul 2020 14:36:57 +0200 Subject: [PATCH 03/11] Apply suggestions from code review Co-authored-by: Ricardo Mendes Co-authored-by: Melanie Sumner --- text/0000-add-ember-page-title-addon.md | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 74e11b6a91..48c66dd588 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -2,38 +2,42 @@ - Relevant Team(s): Ember CLI - RFC PR: (after opening the RFC PR, update this with a link to it and update the file name) - Tracking: (leave this empty) -- Authors: Benjamin Jegard +- Authors: Benjamin Jegard, Melanie Sumner, Ricardo Mendes -# RFC to add ember-page-title to the default app blueprint +# Add ember-page-title to the app blueprint ## Summary -Add https://github.com/adopted-ember-addons/ember-page-title as a default addon for the app blueprints. (addons too ?) +Add [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) to the default blueprint for new Ember apps as a way to provide improved out-of-the-box (OOB) accessibility for Ember applications. ## Motivation -This RFC is part of the work made by Ember.js Accessibility Strike Team to ensure that newly created ember apps have no accessibility issues. +This RFC is part of the work made by the Ember.js Accessibility Strike Team to ensure that newly created ember apps have no accessibility issues. Users with assistive technology rely on the page title to know if they are on the correct page of a website. Adding this addon will provide developers a simple solution to achieve the [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) ## Detailed design -1. Move ember-page-title to the ember-cli org (?) (already in ember-adopted-addon org) +1. Make [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) an official Ember addon by transferring `ember-page-title` repo to the [Ember CLI org](https://github.com/ember-cli) (it's currently in the [Adopted Ember Addons org](https://github.com/adopted-ember-addons)) 2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 -3. Update app blueprint to include `` on top of https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs -4. Update route blueprint to include `{{page-title "Route name"}}` on top of the route template file +3. Update app blueprint to include `` at the top of [application.hbs](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs) +4. Update route blueprint to include `{{page-title RouteName}}` at the top of the route template file. `RouteName` is the route name provided to the command `ember generate route` ## How we teach this -Update the "Page Title" section in [Page Template Considerations](https://guides.emberjs.com/release/accessibility/page-template-considerations) to use `ember-page-title`. +- Update the "Page Title" section in [Page Template Considerations](https://guides.emberjs.com/release/accessibility/page-template-considerations) to use `ember-page-title`. +- Update code examples in [Building Pages](https://guides.emberjs.com/release/tutorial/part-1/building-pages/) to include uses of `{{page-title}}`. Also explain that updating the page title with the current page name will help users with assistive technology locate themself on the website. ## Drawbacks -- An additional dependency. +- An additional dependency to new projects. But, no noticeable size differences it's only all +10kb of js for production builds (not gzipped, ~2kb js gzipped) +- Add an extra helper `{{page-tile}}` and a new component `` (possible name clashing) ## Alternatives +N/A + ## Unresolved questions None From d79f323c183898edf9e3fa19c7271e9247f9b1e2 Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Fri, 26 Jun 2020 14:41:46 +0200 Subject: [PATCH 04/11] Add link to route template blueprint file --- text/0000-add-ember-page-title-addon.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 48c66dd588..74a6a5c8f0 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -22,7 +22,7 @@ Adding this addon will provide developers a simple solution to achieve the [WCAG 1. Make [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) an official Ember addon by transferring `ember-page-title` repo to the [Ember CLI org](https://github.com/ember-cli) (it's currently in the [Adopted Ember Addons org](https://github.com/adopted-ember-addons)) 2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 3. Update app blueprint to include `` at the top of [application.hbs](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs) -4. Update route blueprint to include `{{page-title RouteName}}` at the top of the route template file. `RouteName` is the route name provided to the command `ember generate route` +4. Update route blueprint to include `{{page-title RouteName}}` at the top of the route [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/native-files/__root__/__templatepath__/__templatename__.hbs) (this [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/files/__root__/__templatepath__/__templatename__.hbs) too) where `RouteName` is the name of the route provided to the `ember generate route` command ## How we teach this From 9809bb173dde9f24021aba0eb4a93f6f3f3e21f3 Mon Sep 17 00:00:00 2001 From: Benjamin JEGARD Date: Fri, 3 Jul 2020 16:24:31 +0200 Subject: [PATCH 05/11] Apply suggestions from code review MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Jan Buschtöns --- text/0000-add-ember-page-title-addon.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 74a6a5c8f0..346727aa77 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -21,7 +21,7 @@ Adding this addon will provide developers a simple solution to achieve the [WCAG 1. Make [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) an official Ember addon by transferring `ember-page-title` repo to the [Ember CLI org](https://github.com/ember-cli) (it's currently in the [Adopted Ember Addons org](https://github.com/adopted-ember-addons)) 2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 -3. Update app blueprint to include `` at the top of [application.hbs](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs) +3. Update app blueprint to include `` at the top of [application.hbs](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs) as well as a helpful comment explaining what it is used for 4. Update route blueprint to include `{{page-title RouteName}}` at the top of the route [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/native-files/__root__/__templatepath__/__templatename__.hbs) (this [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/files/__root__/__templatepath__/__templatename__.hbs) too) where `RouteName` is the name of the route provided to the `ember generate route` command ## How we teach this From 03b0740e97dc4b6f529348cc9a78b3fcc4d6e743 Mon Sep 17 00:00:00 2001 From: Benjamin JEGARD Date: Fri, 17 Jul 2020 10:04:49 +0200 Subject: [PATCH 06/11] Update text/0000-add-ember-page-title-addon.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Jan Buschtöns --- text/0000-add-ember-page-title-addon.md | 1 + 1 file changed, 1 insertion(+) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 346727aa77..e89376a216 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -33,6 +33,7 @@ Adding this addon will provide developers a simple solution to achieve the [WCAG - An additional dependency to new projects. But, no noticeable size differences it's only all +10kb of js for production builds (not gzipped, ~2kb js gzipped) - Add an extra helper `{{page-tile}}` and a new component `` (possible name clashing) +- Slightly increases the learning curve. Increases the amount of code in a first-starter project, which could become overwhelming. ## Alternatives From 8b34c3f9c1e8f6039d23ef9842f6a6658481b4d4 Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Thu, 17 Sep 2020 16:49:54 +0200 Subject: [PATCH 07/11] Update "How we teach this" section --- text/0000-add-ember-page-title-addon.md | 1 + 1 file changed, 1 insertion(+) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index e89376a216..8dc8dff1cd 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -28,6 +28,7 @@ Adding this addon will provide developers a simple solution to achieve the [WCAG - Update the "Page Title" section in [Page Template Considerations](https://guides.emberjs.com/release/accessibility/page-template-considerations) to use `ember-page-title`. - Update code examples in [Building Pages](https://guides.emberjs.com/release/tutorial/part-1/building-pages/) to include uses of `{{page-title}}`. Also explain that updating the page title with the current page name will help users with assistive technology locate themself on the website. +- Update [ember-welcome-page](https://github.com/ember-cli/ember-welcome-page) addon and [WelcomePage](https://github.com/ember-cli/ember-welcome-page/blob/master/addon/templates/components/welcome-page.hbs) component to explain the contents of the fresh project a bit better. The component should explain the presence of `{{page-title}}` and link to the "Page Title" section in [Page Template Considerations](https://guides.emberjs.com/release/accessibility/page-template-considerations) ## Drawbacks From 779fd0ba3a22ea09181e153db3581a1cdf64bb2b Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Fri, 25 Sep 2020 10:47:35 +0200 Subject: [PATCH 08/11] Explain why ember-page-title and not another addon --- text/0000-add-ember-page-title-addon.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 8dc8dff1cd..531af3f2c6 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -15,7 +15,9 @@ Add [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-titl This RFC is part of the work made by the Ember.js Accessibility Strike Team to ensure that newly created ember apps have no accessibility issues. Users with assistive technology rely on the page title to know if they are on the correct page of a website. -Adding this addon will provide developers a simple solution to achieve the [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html) +Adding this addon will provide developers a simple solution to achieve the [WCAG Success Criterion 2.4.2: Page Titled](https://www.w3.org/WAI/WCAG21/Understanding/page-titled.html). + +While there're other addons that provide the same capabilities it has been decided to go with [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) because it's the most aligned with the current and future direction taken Ember, which is the template-based solution. ## Detailed design From 7a01aecd6aeda0c98891c28a6550322067402a65 Mon Sep 17 00:00:00 2001 From: BenjaminJ Date: Fri, 25 Sep 2020 10:48:44 +0200 Subject: [PATCH 09/11] Add that the addon will have to be maintained in the drawback section --- text/0000-add-ember-page-title-addon.md | 1 + 1 file changed, 1 insertion(+) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 531af3f2c6..a4a63b7275 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -37,6 +37,7 @@ While there're other addons that provide the same capabilities it has been decid - An additional dependency to new projects. But, no noticeable size differences it's only all +10kb of js for production builds (not gzipped, ~2kb js gzipped) - Add an extra helper `{{page-tile}}` and a new component `` (possible name clashing) - Slightly increases the learning curve. Increases the amount of code in a first-starter project, which could become overwhelming. +- The addon will have to be maintained by the [Ember CLI org](https://github.com/ember-cli) ## Alternatives From fbbb9fd674fc1761291ca70eb230e58679c00b99 Mon Sep 17 00:00:00 2001 From: Benjamin JEGARD Date: Tue, 6 Oct 2020 09:17:01 +0200 Subject: [PATCH 10/11] Remove references to `` ember-page-title v6 has been released and dropped ember-cli-head (which required the use of ``) --- text/0000-add-ember-page-title-addon.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index a4a63b7275..7050feed75 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -23,7 +23,6 @@ While there're other addons that provide the same capabilities it has been decid 1. Make [`ember-page-title`](https://github.com/adopted-ember-addons/ember-page-title) an official Ember addon by transferring `ember-page-title` repo to the [Ember CLI org](https://github.com/ember-cli) (it's currently in the [Adopted Ember Addons org](https://github.com/adopted-ember-addons)) 2. Add the dependency to the app blueprint here: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/package.json#L19 -3. Update app blueprint to include `` at the top of [application.hbs](https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/templates/application.hbs) as well as a helpful comment explaining what it is used for 4. Update route blueprint to include `{{page-title RouteName}}` at the top of the route [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/native-files/__root__/__templatepath__/__templatename__.hbs) (this [template.hbs](https://github.com/emberjs/ember.js/blob/master/blueprints/route/files/__root__/__templatepath__/__templatename__.hbs) too) where `RouteName` is the name of the route provided to the `ember generate route` command ## How we teach this @@ -35,7 +34,7 @@ While there're other addons that provide the same capabilities it has been decid ## Drawbacks - An additional dependency to new projects. But, no noticeable size differences it's only all +10kb of js for production builds (not gzipped, ~2kb js gzipped) -- Add an extra helper `{{page-tile}}` and a new component `` (possible name clashing) +- Add an extra helper `{{page-tile}}` (possible name clashing) - Slightly increases the learning curve. Increases the amount of code in a first-starter project, which could become overwhelming. - The addon will have to be maintained by the [Ember CLI org](https://github.com/ember-cli) From ed1e25ddc5adc5173773210429cde157957d338f Mon Sep 17 00:00:00 2001 From: Benjamin JEGARD Date: Mon, 12 Oct 2020 10:27:41 +0200 Subject: [PATCH 11/11] Fix typo --- text/0000-add-ember-page-title-addon.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/text/0000-add-ember-page-title-addon.md b/text/0000-add-ember-page-title-addon.md index 7050feed75..5894be3e43 100644 --- a/text/0000-add-ember-page-title-addon.md +++ b/text/0000-add-ember-page-title-addon.md @@ -34,7 +34,7 @@ While there're other addons that provide the same capabilities it has been decid ## Drawbacks - An additional dependency to new projects. But, no noticeable size differences it's only all +10kb of js for production builds (not gzipped, ~2kb js gzipped) -- Add an extra helper `{{page-tile}}` (possible name clashing) +- Add an extra helper `{{page-title}}` (possible name clashing) - Slightly increases the learning curve. Increases the amount of code in a first-starter project, which could become overwhelming. - The addon will have to be maintained by the [Ember CLI org](https://github.com/ember-cli)