From 1fc1f1c739f557f563b2adf679022d575266ccfd Mon Sep 17 00:00:00 2001 From: James Addison Date: Fri, 6 Dec 2019 00:44:54 +0000 Subject: [PATCH 01/63] core(audits): remove form-field-multiple-labels audit --- .../test/cli/__snapshots__/index-test.js.snap | 8 ---- .../test/fixtures/a11y/a11y_tester.html | 6 --- .../form-field-multiple-labels.js | 43 ------------------- lighthouse-core/config/default-config.js | 2 - lighthouse-core/lib/i18n/locales/en-US.json | 9 ---- lighthouse-core/lib/i18n/locales/en-XL.json | 9 ---- lighthouse-core/test/results/sample_v2.json | 31 +------------ proto/sample_v2_round_trip.json | 25 +---------- 8 files changed, 2 insertions(+), 131 deletions(-) delete mode 100644 lighthouse-core/audits/accessibility/form-field-multiple-labels.js diff --git a/lighthouse-cli/test/cli/__snapshots__/index-test.js.snap b/lighthouse-cli/test/cli/__snapshots__/index-test.js.snap index 087a030dc0cc..e0a50b9fd856 100644 --- a/lighthouse-cli/test/cli/__snapshots__/index-test.js.snap +++ b/lighthouse-cli/test/cli/__snapshots__/index-test.js.snap @@ -210,9 +210,6 @@ Object { Object { "path": "accessibility/duplicate-id-aria", }, - Object { - "path": "accessibility/form-field-multiple-labels", - }, Object { "path": "accessibility/frame-title", }, @@ -520,11 +517,6 @@ Object { "id": "duplicate-id-aria", "weight": 10, }, - Object { - "group": "a11y-names-labels", - "id": "form-field-multiple-labels", - "weight": 2, - }, Object { "group": "a11y-names-labels", "id": "frame-title", diff --git a/lighthouse-cli/test/fixtures/a11y/a11y_tester.html b/lighthouse-cli/test/fixtures/a11y/a11y_tester.html index fe60f652f489..33fd74ed09ac 100644 --- a/lighthouse-cli/test/fixtures/a11y/a11y_tester.html +++ b/lighthouse-cli/test/fixtures/a11y/a11y_tester.html @@ -117,12 +117,6 @@
-

form-field-multiple-labels

-
- - - -

frame-title

diff --git a/lighthouse-core/audits/accessibility/form-field-multiple-labels.js b/lighthouse-core/audits/accessibility/form-field-multiple-labels.js deleted file mode 100644 index 89b40363c72e..000000000000 --- a/lighthouse-core/audits/accessibility/form-field-multiple-labels.js +++ /dev/null @@ -1,43 +0,0 @@ -/** - * @license Copyright 2019 Google Inc. All Rights Reserved. - * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 - * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. - */ -'use strict'; - -/** - * @fileoverview Ensures no form field has multiple label elements. - * See base class in axe-audit.js for audit() implementation. - */ - -const AxeAudit = require('./axe-audit.js'); -const i18n = require('../../lib/i18n/i18n.js'); - -const UIStrings = { - /** Title of an accesibility audit that checks if any form fields have multiple label elements. This title is descriptive of the successful state and is shown to users when no user action is required. */ - title: 'No form fields have multiple labels', - /** Title of an accesibility audit that checks if any form fields have multiple label elements. This title is descriptive of the failing state and is shown to users when there is a failure that needs to be addressed. */ - failureTitle: 'Form fields have multiple labels', - /** Description of a Lighthouse audit that tells the user *why* they should try to pass. This is displayed after a user expands the section to see more. No character length limits. 'Learn More' becomes link text to additional documentation. */ - description: 'Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/).', -}; - -const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings); - -class FormFieldMultipleLabels extends AxeAudit { - /** - * @return {LH.Audit.Meta} - */ - static get meta() { - return { - id: 'form-field-multiple-labels', - title: str_(UIStrings.title), - failureTitle: str_(UIStrings.failureTitle), - description: str_(UIStrings.description), - requiredArtifacts: ['Accessibility'], - }; - } -} - -module.exports = FormFieldMultipleLabels; -module.exports.UIStrings = UIStrings; diff --git a/lighthouse-core/config/default-config.js b/lighthouse-core/config/default-config.js index cc909cad4f3b..8d9834b4f0a2 100644 --- a/lighthouse-core/config/default-config.js +++ b/lighthouse-core/config/default-config.js @@ -239,7 +239,6 @@ const defaultConfig = { 'accessibility/document-title', 'accessibility/duplicate-id-active', 'accessibility/duplicate-id-aria', - 'accessibility/form-field-multiple-labels', 'accessibility/frame-title', 'accessibility/heading-order', 'accessibility/html-has-lang', @@ -458,7 +457,6 @@ const defaultConfig = { {id: 'document-title', weight: 3, group: 'a11y-names-labels'}, {id: 'duplicate-id-active', weight: 3, group: 'a11y-navigation'}, {id: 'duplicate-id-aria', weight: 10, group: 'a11y-aria'}, - {id: 'form-field-multiple-labels', weight: 2, group: 'a11y-names-labels'}, {id: 'frame-title', weight: 3, group: 'a11y-names-labels'}, {id: 'heading-order', weight: 2, group: 'a11y-navigation'}, {id: 'html-has-lang', weight: 3, group: 'a11y-language'}, diff --git a/lighthouse-core/lib/i18n/locales/en-US.json b/lighthouse-core/lib/i18n/locales/en-US.json index 0749575b3b9a..e5ab6a28a3db 100644 --- a/lighthouse-core/lib/i18n/locales/en-US.json +++ b/lighthouse-core/lib/i18n/locales/en-US.json @@ -191,15 +191,6 @@ "lighthouse-core/audits/accessibility/duplicate-id-aria.js | title": { "message": "ARIA IDs are unique" }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | description": { - "message": "Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/)." - }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | failureTitle": { - "message": "Form fields have multiple labels" - }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | title": { - "message": "No form fields have multiple labels" - }, "lighthouse-core/audits/accessibility/frame-title.js | description": { "message": "Screen reader users rely on frame titles to describe the contents of frames. [Learn more](https://web.dev/frame-title/)." }, diff --git a/lighthouse-core/lib/i18n/locales/en-XL.json b/lighthouse-core/lib/i18n/locales/en-XL.json index a4f6b755ec5b..58e6034114e9 100644 --- a/lighthouse-core/lib/i18n/locales/en-XL.json +++ b/lighthouse-core/lib/i18n/locales/en-XL.json @@ -191,15 +191,6 @@ "lighthouse-core/audits/accessibility/duplicate-id-aria.js | title": { "message": "ÂŔÎÁ ÎD́ŝ ár̂é ûńîq́ûé" }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | description": { - "message": "F̂ór̂ḿ f̂íêĺd̂ś ŵít̂h́ m̂úl̂t́îṕl̂é l̂áb̂él̂ś ĉán̂ b́ê ćôńf̂úŝín̂ǵl̂ý âńn̂óûńĉéd̂ b́ŷ áŝśîśt̂ív̂é t̂éĉh́n̂ól̂óĝíêś l̂ík̂é ŝćr̂éêń r̂éâd́êŕŝ ẃĥíĉh́ ûśê éît́ĥér̂ t́ĥé f̂ír̂śt̂, t́ĥé l̂áŝt́, ôŕ âĺl̂ óf̂ t́ĥé l̂áb̂él̂ś. [L̂éâŕn̂ ḿôŕê](https://web.dev/form-field-multiple-labels/)." - }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | failureTitle": { - "message": "F̂ór̂ḿ f̂íêĺd̂ś ĥáv̂é m̂úl̂t́îṕl̂é l̂áb̂él̂ś" - }, - "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | title": { - "message": "N̂ó f̂ór̂ḿ f̂íêĺd̂ś ĥáv̂é m̂úl̂t́îṕl̂é l̂áb̂él̂ś" - }, "lighthouse-core/audits/accessibility/frame-title.js | description": { "message": "Ŝćr̂éêń r̂éâd́êŕ ûśêŕŝ ŕêĺŷ ón̂ f́r̂ám̂é t̂ít̂ĺêś t̂ó d̂éŝćr̂íb̂é t̂h́ê ćôńt̂én̂t́ŝ óf̂ f́r̂ám̂éŝ. [Ĺêár̂ń m̂ór̂é](https://web.dev/frame-title/)." }, diff --git a/lighthouse-core/test/results/sample_v2.json b/lighthouse-core/test/results/sample_v2.json index 09d0e637e6c9..09325d8d0224 100644 --- a/lighthouse-core/test/results/sample_v2.json +++ b/lighthouse-core/test/results/sample_v2.json @@ -1797,18 +1797,6 @@ "items": [] } }, - "form-field-multiple-labels": { - "id": "form-field-multiple-labels", - "title": "No form fields have multiple labels", - "description": "Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/).", - "score": 1, - "scoreDisplayMode": "binary", - "details": { - "type": "table", - "headings": [], - "items": [] - } - }, "frame-title": { "id": "frame-title", "title": "`` or ` diff --git a/lighthouse-cli/test/smokehouse/test-definitions/a11y/expectations.js b/lighthouse-cli/test/smokehouse/test-definitions/a11y/expectations.js index f98006bdbbd0..2cd1367a9aee 100644 --- a/lighthouse-cli/test/smokehouse/test-definitions/a11y/expectations.js +++ b/lighthouse-cli/test/smokehouse/test-definitions/a11y/expectations.js @@ -312,6 +312,23 @@ const expectations = [ ], }, }, + 'form-field-multiple-labels': { + score: 0, + details: { + items: [ + { + node: { + 'type': 'node', + 'selector': '#form-field-multiple-labels', + 'path': '2,HTML,1,BODY,35,SECTION,2,INPUT', + 'snippet': '', + 'explanation': 'Fix all of the following:\n Multiple label elements is not widely supported in assistive technologies', + 'nodeLabel': 'input', + }, + }, + ], + }, + }, 'frame-title': { score: 0, details: { @@ -336,7 +353,7 @@ const expectations = [ node: { 'type': 'node', 'selector': 'h3', - 'path': '2,HTML,1,BODY,37,SECTION,1,H3', + 'path': '2,HTML,1,BODY,39,SECTION,1,H3', 'snippet': '

sub-sub-header

', 'explanation': 'Fix any of the following:\n Heading order invalid', 'nodeLabel': 'sub-sub-header', diff --git a/lighthouse-core/audits/accessibility/form-field-multiple-labels.js b/lighthouse-core/audits/accessibility/form-field-multiple-labels.js new file mode 100644 index 000000000000..89b40363c72e --- /dev/null +++ b/lighthouse-core/audits/accessibility/form-field-multiple-labels.js @@ -0,0 +1,43 @@ +/** + * @license Copyright 2019 Google Inc. All Rights Reserved. + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. + */ +'use strict'; + +/** + * @fileoverview Ensures no form field has multiple label elements. + * See base class in axe-audit.js for audit() implementation. + */ + +const AxeAudit = require('./axe-audit.js'); +const i18n = require('../../lib/i18n/i18n.js'); + +const UIStrings = { + /** Title of an accesibility audit that checks if any form fields have multiple label elements. This title is descriptive of the successful state and is shown to users when no user action is required. */ + title: 'No form fields have multiple labels', + /** Title of an accesibility audit that checks if any form fields have multiple label elements. This title is descriptive of the failing state and is shown to users when there is a failure that needs to be addressed. */ + failureTitle: 'Form fields have multiple labels', + /** Description of a Lighthouse audit that tells the user *why* they should try to pass. This is displayed after a user expands the section to see more. No character length limits. 'Learn More' becomes link text to additional documentation. */ + description: 'Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/).', +}; + +const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings); + +class FormFieldMultipleLabels extends AxeAudit { + /** + * @return {LH.Audit.Meta} + */ + static get meta() { + return { + id: 'form-field-multiple-labels', + title: str_(UIStrings.title), + failureTitle: str_(UIStrings.failureTitle), + description: str_(UIStrings.description), + requiredArtifacts: ['Accessibility'], + }; + } +} + +module.exports = FormFieldMultipleLabels; +module.exports.UIStrings = UIStrings; diff --git a/lighthouse-core/config/default-config.js b/lighthouse-core/config/default-config.js index 8d9834b4f0a2..cc909cad4f3b 100644 --- a/lighthouse-core/config/default-config.js +++ b/lighthouse-core/config/default-config.js @@ -239,6 +239,7 @@ const defaultConfig = { 'accessibility/document-title', 'accessibility/duplicate-id-active', 'accessibility/duplicate-id-aria', + 'accessibility/form-field-multiple-labels', 'accessibility/frame-title', 'accessibility/heading-order', 'accessibility/html-has-lang', @@ -457,6 +458,7 @@ const defaultConfig = { {id: 'document-title', weight: 3, group: 'a11y-names-labels'}, {id: 'duplicate-id-active', weight: 3, group: 'a11y-navigation'}, {id: 'duplicate-id-aria', weight: 10, group: 'a11y-aria'}, + {id: 'form-field-multiple-labels', weight: 2, group: 'a11y-names-labels'}, {id: 'frame-title', weight: 3, group: 'a11y-names-labels'}, {id: 'heading-order', weight: 2, group: 'a11y-navigation'}, {id: 'html-has-lang', weight: 3, group: 'a11y-language'}, diff --git a/lighthouse-core/lib/i18n/locales/en-US.json b/lighthouse-core/lib/i18n/locales/en-US.json index e5ab6a28a3db..0749575b3b9a 100644 --- a/lighthouse-core/lib/i18n/locales/en-US.json +++ b/lighthouse-core/lib/i18n/locales/en-US.json @@ -191,6 +191,15 @@ "lighthouse-core/audits/accessibility/duplicate-id-aria.js | title": { "message": "ARIA IDs are unique" }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | description": { + "message": "Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/)." + }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | failureTitle": { + "message": "Form fields have multiple labels" + }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | title": { + "message": "No form fields have multiple labels" + }, "lighthouse-core/audits/accessibility/frame-title.js | description": { "message": "Screen reader users rely on frame titles to describe the contents of frames. [Learn more](https://web.dev/frame-title/)." }, diff --git a/lighthouse-core/lib/i18n/locales/en-XL.json b/lighthouse-core/lib/i18n/locales/en-XL.json index 58e6034114e9..a4f6b755ec5b 100644 --- a/lighthouse-core/lib/i18n/locales/en-XL.json +++ b/lighthouse-core/lib/i18n/locales/en-XL.json @@ -191,6 +191,15 @@ "lighthouse-core/audits/accessibility/duplicate-id-aria.js | title": { "message": "ÂŔÎÁ ÎD́ŝ ár̂é ûńîq́ûé" }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | description": { + "message": "F̂ór̂ḿ f̂íêĺd̂ś ŵít̂h́ m̂úl̂t́îṕl̂é l̂áb̂él̂ś ĉán̂ b́ê ćôńf̂úŝín̂ǵl̂ý âńn̂óûńĉéd̂ b́ŷ áŝśîśt̂ív̂é t̂éĉh́n̂ól̂óĝíêś l̂ík̂é ŝćr̂éêń r̂éâd́êŕŝ ẃĥíĉh́ ûśê éît́ĥér̂ t́ĥé f̂ír̂śt̂, t́ĥé l̂áŝt́, ôŕ âĺl̂ óf̂ t́ĥé l̂áb̂él̂ś. [L̂éâŕn̂ ḿôŕê](https://web.dev/form-field-multiple-labels/)." + }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | failureTitle": { + "message": "F̂ór̂ḿ f̂íêĺd̂ś ĥáv̂é m̂úl̂t́îṕl̂é l̂áb̂él̂ś" + }, + "lighthouse-core/audits/accessibility/form-field-multiple-labels.js | title": { + "message": "N̂ó f̂ór̂ḿ f̂íêĺd̂ś ĥáv̂é m̂úl̂t́îṕl̂é l̂áb̂él̂ś" + }, "lighthouse-core/audits/accessibility/frame-title.js | description": { "message": "Ŝćr̂éêń r̂éâd́êŕ ûśêŕŝ ŕêĺŷ ón̂ f́r̂ám̂é t̂ít̂ĺêś t̂ó d̂éŝćr̂íb̂é t̂h́ê ćôńt̂én̂t́ŝ óf̂ f́r̂ám̂éŝ. [Ĺêár̂ń m̂ór̂é](https://web.dev/frame-title/)." }, diff --git a/lighthouse-core/test/report/html/renderer/category-renderer-test.js b/lighthouse-core/test/report/html/renderer/category-renderer-test.js index 72f9f78d629a..b46136484d82 100644 --- a/lighthouse-core/test/report/html/renderer/category-renderer-test.js +++ b/lighthouse-core/test/report/html/renderer/category-renderer-test.js @@ -242,7 +242,7 @@ describe('CategoryRenderer', () => { const categoryDOM = renderer.render(category, sampleResults.categoryGroups); const gauge = categoryDOM.querySelector('.lh-gauge__percentage'); - assert.equal(gauge.textContent.trim(), '65', 'score is 0-100'); + assert.equal(gauge.textContent.trim(), '66', 'score is 0-100'); const score = categoryDOM.querySelector('.lh-category-header'); const value = categoryDOM.querySelector('.lh-gauge__percentage'); diff --git a/lighthouse-core/test/report/proto-test.js b/lighthouse-core/test/report/proto-test.js index 308f3b9f4e14..4425924c7992 100644 --- a/lighthouse-core/test/report/proto-test.js +++ b/lighthouse-core/test/report/proto-test.js @@ -56,6 +56,15 @@ describe('round trip JSON comparison to everything', () => { beforeEach(() => { processedLHR = preprocessor.processForProto(sampleJson); + + // Proto conversion turns empty summaries into null. This is OK, + // and is handled in the PSI roundtrip just fine, but messes up the easy + // jest sub-object matcher. So, we put the empty object back in its place. + for (const audit of Object.values(roundTripJson.audits)) { + if (audit.details && audit.details.summary === null) { + audit.details.summary = {}; + } + } }); it('has the same JSON overall', () => { diff --git a/lighthouse-core/test/results/sample_v2.json b/lighthouse-core/test/results/sample_v2.json index 2824329043f5..09d0e637e6c9 100644 --- a/lighthouse-core/test/results/sample_v2.json +++ b/lighthouse-core/test/results/sample_v2.json @@ -1797,6 +1797,18 @@ "items": [] } }, + "form-field-multiple-labels": { + "id": "form-field-multiple-labels", + "title": "No form fields have multiple labels", + "description": "Form fields with multiple labels can be confusingly announced by assistive technologies like screen readers which use either the first, the last, or all of the labels. [Learn more](https://web.dev/form-field-multiple-labels/).", + "score": 1, + "scoreDisplayMode": "binary", + "details": { + "type": "table", + "headings": [], + "items": [] + } + }, "frame-title": { "id": "frame-title", "title": "`` or `