testaro 18.1.1 → 18.2.0

package/aslint/app/rules/aslint/headings-sibling-unique/headings-sibling-unique.ts

@@ -0,0 +1,63 @@
+import { TextUtility } from '../../../utils/text';
+import { CATEGORY_TYPE } from '../../../constants/categoryType';
+import { IIssueReport } from '../../../interfaces/rule-issue.interface';
+import { TranslateService } from '../../../services/translate';
+import { $accessibilityAuditRules, $severity } from '../../../constants/accessibility';
+import { AbstractRule, IAbstractRuleConfig } from '../../abstract-rule';
+
+export class HeadingsSiblingUnique extends AbstractRule {
+  protected selector: string = 'h1, h2, h3, h4, h5, h6';
+
+  protected ruleConfig: IAbstractRuleConfig = {
+    id: TextUtility.convertUnderscoresToDashes($accessibilityAuditRules.headings_sibling_unique),
+    links: [
+      {
+        content: '2.4.6 Headings and Labels (Level AA, Primary Success Criterion)',
+        url: 'http://www.w3.org/TR/WCAG20/#navigation-mechanisms-descriptive'
+      },
+      {
+        content: 'G130: Providing descriptive headings',
+        url: 'http://www.w3.org/TR/WCAG20-TECHS/G130'
+      },
+      {
+        content: 'G141: Organizing a page using headings',
+        url: 'https://www.w3.org/TR/WCAG20-TECHS/G141.html'
+      }
+    ],
+    recommendations: [],
+    severity: $severity.high,
+    type: CATEGORY_TYPE.WCAG_AA
+  };
+
+  public validate(headings: HTMLHeadingElement[]): void {
+
+    const checkForSiblings = (headingElement: HTMLHeadingElement): void => {
+      const nextElementSibling: Element | null = headingElement.nextElementSibling;
+
+      if (nextElementSibling === null) {
+        return;
+      }
+
+      if (nextElementSibling.nodeName.toLowerCase() !== headingElement.nodeName.toLowerCase()) {
+        return;
+      }
+
+      const headingText: string = typeof headingElement.textContent === 'string' ? TextUtility.safeTrim(headingElement.textContent) : '';
+      const nextElementSiblingText: string = typeof nextElementSibling.textContent === 'string' ? TextUtility.safeTrim(nextElementSibling.textContent) : '';
+
+      if (TextUtility.areStringsTheSame(headingText, nextElementSiblingText) === false) {
+        return;
+      }
+
+      const report: IIssueReport = {
+        message: TranslateService.instant('headings_sibling_unique_report_message', [headingElement.nodeName.toLowerCase(), nextElementSibling.textContent]),
+        node: headingElement,
+        ruleId: this.ruleConfig.id
+      };
+
+      this.validator.report(report);
+    };
+
+    headings.forEach(checkForSiblings);
+  }
+}

package/aslint/app/rules/aslint/horizontal-rule/horizontal-rule.documentation.md

@@ -0,0 +1,39 @@
+# horizontal-rule
+
+## Rule id
+
+`horizontal-rule`
+
+## Definition
+
+This rule determines `<hr/>` elements and gives a tip.
+
+## Purpose
+
+The `<hr/>` element adds extra "noise" and can be confusing. For example VoiceOver reads it as "dimmed collapsed on top, horizontal separator", Windows Narrator reads it as "end of line".
+
+A better option is to replace `<hr/>` with `<div>` and use CSS for styling. Alternatively, `aria-hidden="true"` or `role="presentation"` can be applied to the `<hr/>` element.
+
+## Test cases
+
+### Passed
+
+The rule passes when there are:
+
+* no `<hr/>` elements or
+* `<hr/>` use `aria-hidden="true"` or `role="presentation"`
+
+## WCAG Success Criteria
+
+Not Applicable
+
+## Best Practice
+
+Yes
+
+## User Impact
+
+* **Severity**: info
+* **Disabilities Affected**:
+  * Visual:
+    * blindness

package/aslint/app/rules/aslint/horizontal-rule/horizontal-rule.test.ts

@@ -0,0 +1,66 @@
+import { HorizontalRule } from './horizontal-rule';
+import { Validator } from '../../../validator';
+import { DomUtility } from '../../../utils/dom';
+
+describe('Rules', () => {
+
+  describe('HorizontalRule', () => {
+
+    it('should indicate that class exists', () => {
+      expect(HorizontalRule).toBeDefined();
+    });
+
+    const selector: string = `hr${[
+      ':not([aria-hidden="true"])',
+      ':not([role="presentation"])'
+    ].join('')}`;
+
+    let fakeDom;
+
+    new HorizontalRule().registerValidator();
+
+    beforeEach(() => {
+      fakeDom = document.createElement('div');
+      fakeDom.id = 'fakedom';
+      document.body.appendChild(fakeDom);
+
+      Validator.reset();
+    });
+
+    afterEach(() => {
+      DomUtility.remove(document.getElementById('fakedom'));
+      fakeDom = undefined;
+    });
+
+    it('should return one report when there is an element with hr', () => {
+      fakeDom.innerHTML = '<p>Text 1</p><hr/><p>Text 2</p>';
+      const nodes: HTMLHRElement[] = DomUtility.querySelectorAllExclude(selector, fakeDom) as HTMLHRElement[];
+
+      new HorizontalRule().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(1);
+      expect(Validator.getReport('report_0').message).toBe('The <code>&lt;hr&gt;</code> element adds extra <q>noise</q> and can be confusing. For example VoiceOver reads it as <q>dimmed collapsed on top, horizontal separator</q>, Windows Narrator reads it as <q>end of line</q>. A better option is to replace <code>&lt;hr&gt;</code> with <code>&lt;div&gt;</code> and use CSS for styling. Alternatively, <code>aria-hidden=\'true\'</code> or <code>role=\'presentation\'</code> can be applied to the <code>&lt;hr&gt;</code> element.');
+      expect(Validator.getReport('report_0').node.nodeName.toLowerCase()).toBe('hr');
+      expect(Validator.getReport('report_0').ruleId).toBe('horizontal-rule');
+    });
+
+    it('should return no reports when there is no elements with hr', () => {
+      fakeDom.innerHTML = '<p>Text 1</p>hr<p>Text 2</p>';
+      const nodes: HTMLHRElement[] = DomUtility.querySelectorAllExclude(selector, fakeDom) as HTMLHRElement[];
+
+      new HorizontalRule().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(0);
+    });
+
+    it('should return no reports when there is an element hr, but with attribue aria-hidden="true" or role="presentation"', () => {
+      fakeDom.innerHTML = '<p>Text 1</p><hr aria-hidden="true"/><hr role="presentation"/><p>Text 2</p>';
+      const nodes: HTMLHRElement[] = DomUtility.querySelectorAllExclude(selector, fakeDom) as HTMLHRElement[];
+
+      new HorizontalRule().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(0);
+    });
+
+  });
+});

package/aslint/app/rules/aslint/horizontal-rule/horizontal-rule.ts

@@ -0,0 +1,37 @@
+import { CATEGORY_TYPE } from '../../../constants/categoryType';
+import { IIssueReport } from '../../../interfaces/rule-issue.interface';
+import { TextUtility } from '../../../utils/text';
+import { TranslateService } from '../../../services/translate';
+import { $accessibilityAuditRules, $severity } from '../../../constants/accessibility';
+import { AbstractRule, IAbstractRuleConfig } from '../../abstract-rule';
+
+export class HorizontalRule extends AbstractRule {
+  protected selector: string = `hr${[
+    ':not([aria-hidden="true"])',
+    ':not([role="presentation"])'
+  ].join('')}`;
+
+  protected ruleConfig: IAbstractRuleConfig = {
+    id: TextUtility.convertUnderscoresToDashes($accessibilityAuditRules.horizontal_rule),
+    links: [],
+    recommendations: [],
+    severity: $severity.info,
+    type: CATEGORY_TYPE.BEST_PRACTICE
+  };
+
+  public validate(elements: HTMLHRElement[]): void {
+    const reportHR = (element: HTMLHRElement): void => {
+      const reportMessage: string = TranslateService.instant('horizontal_rule_report_message', [TextUtility.escape('<hr>'), TextUtility.escape('<hr>'), TextUtility.escape('<div>'), TextUtility.escape('<hr>')]);
+
+      const report: IIssueReport = {
+        message: reportMessage,
+        node: element,
+        ruleId: this.ruleConfig.id
+      };
+
+      this.validator.report(report);
+    };
+
+    elements.forEach(reportHR);
+  }
+}

package/aslint/app/rules/aslint/incorrect-technique-for-hiding-content/incorrect-technique-for-hiding-content.documentation.md

@@ -0,0 +1,36 @@
+# incorrect-technique-for-hiding-content
+
+## Rule id
+
+`incorrect-technique-for-hiding-content`
+
+## Definition
+
+This rule determines if there is defined style `text-indent` with the value so that the element is being positioned out of the viewport.
+
+## Purpose
+
+The technique e.g. `text-indent: -10000px` is still being used to hide the content visually. However, the downside of that technique is that the screen reader focus follows that and it gets out of the visible area.
+
+**Tip**: to avoid that use tecnique that hides the content visually, but does not move the element outside of the visible viewport. Example: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
+
+## Test cases
+
+### Passed
+
+The rule passes when there is no defined style `text-indent` that hides the content outside of viewport.
+
+## WCAG Success Criteria
+
+Not Applicable
+
+## Best Practice
+
+Yes
+
+## User Impact
+
+* **Severity**: info
+* **Disabilities Affected**:
+  * Visual:
+    * keyboard users

package/aslint/app/rules/aslint/incorrect-technique-for-hiding-content/incorrect-technique-for-hiding-content.test.ts

@@ -0,0 +1,113 @@
+import { DomUtility } from '../../../utils/dom';
+import { Validator } from '../../../validator';
+import { IncorrectTechniqueForHidingContent } from './incorrect-technique-for-hiding-content';
+
+describe('Rules', () => {
+
+  describe('IncorrectTechniqueForHidingContent', () => {
+
+    it('should indicate that class exists', () => {
+      expect(IncorrectTechniqueForHidingContent).toBeDefined();
+    });
+
+    let fakeDom;
+
+    new IncorrectTechniqueForHidingContent().registerValidator();
+
+    beforeEach(() => {
+      fakeDom = document.createElement('div');
+      fakeDom.id = 'fakedom';
+      document.body.appendChild(fakeDom);
+
+      Validator.reset();
+    });
+
+    afterEach(() => {
+      DomUtility.remove(document.getElementById('fakedom'));
+      fakeDom = undefined;
+    });
+
+    // Note: untestable until https://github.com/facebook/jest/issues/11291 gets resolved
+
+    /*
+     *
+     *it('should return 1 report when there is an element with defined style text-indent: -1000px;', () => {
+     *  fakeDom.innerHTML = '<p style="text-indent: -1000px">Example text</p>';
+     *  const nodes: HTMLParagraphElement[] = DomUtility.querySelectorAllExclude('p', fakeDom) as HTMLParagraphElement[];
+     *
+     *  new IncorrectTechniqueForHidingContent().validate(nodes);
+     *
+     *  expect(Object.keys(Validator.getReports()).length).toBe(1);
+     *  expect(Validator.getReport('report_0').message).toBe('CSS technique <code>text-indent: -1000px </code> is used to hide text. However, it causes problems for right-to-left language and also keep focus for screen reader outside of visible area.');
+     *  expect(Validator.getReport('report_0').node.nodeName.toLowerCase()).toBe('p');
+     *  expect(Validator.getReport('report_0').ruleId).toBe('incorrect-technique-for-hiding-content');
+     *});
+     *
+     *it('should return 1 report when there is an element with defined style text-indent: 1000px;', () => {
+     *  fakeDom.innerHTML = '<p style="text-indent: 1000px">Example text</p>';
+     *  const nodes: HTMLParagraphElement[] = DomUtility.querySelectorAllExclude('p', fakeDom) as HTMLParagraphElement[];
+     *
+     *  new IncorrectTechniqueForHidingContent().validate(nodes);
+     *
+     *  expect(Object.keys(Validator.getReports()).length).toBe(1);
+     *  expect(Validator.getReport('report_0').message).toBe('CSS technique <code>text-indent: 1000px </code> is used to hide text. However, it causes problems for right-to-left language and also keep focus for screen reader outside of visible area.');
+     *  expect(Validator.getReport('report_0').node.nodeName.toLowerCase()).toBe('p');
+     *  expect(Validator.getReport('report_0').ruleId).toBe('incorrect-technique-for-hiding-content');
+     *});
+     *
+     *it('should return no report when there is an element with no defined style text-indent', () => {
+     *  fakeDom.innerHTML = '<p>Example text</p>';
+     *  const nodes: HTMLParagraphElement[] = DomUtility.querySelectorAllExclude('p', fakeDom) as HTMLParagraphElement[];
+     *
+     *  new IncorrectTechniqueForHidingContent().validate(nodes);
+     *
+     *  expect(Object.keys(Validator.getReports()).length).toBe(0);
+     *});
+     *
+     *it('should return no report when there is an element with defined style text-indent that doesn\'t move content outside of visible area', () => {
+     *  const createMockDiv = (width, height) => {
+     *    const div = document.createElement('div');
+     *
+     *    Object.assign(div.style, {
+     *      height: `${height}px`,
+     *      width: `${width}px`
+     *    });
+     *
+     *    div.getBoundingClientRect = () => {
+     *      return {
+     *        bottom: height,
+     *        height,
+     *        left: 0,
+     *        right: width,
+     *        toJSON: () => { },
+     *        top: 0,
+     *        width,
+     *        x: 0,
+     *        y: 0
+     *      };
+     *    };
+     *
+     *    return div;
+     *  };
+     *
+     *  const div = createMockDiv(100, 100);
+     *
+     *  div.innerText = 'Example text';
+     *  div.style.textIndent = '-1rem';
+     *
+     *  fakeDom.appendChild(div);
+     *
+     *  const nodes: HTMLDivElement[] = DomUtility.querySelectorAllExclude('div', fakeDom) as HTMLDivElement[];
+     *
+     *  global.innerHeight = 500;
+     *  global.innerWidth = 500;
+     *
+     *  new IncorrectTechniqueForHidingContent().validate(nodes);
+     *
+     *  expect(Object.keys(Validator.getReports()).length).toBe(0);
+     *});
+     *
+     */
+
+  });
+});

package/aslint/app/rules/aslint/incorrect-technique-for-hiding-content/incorrect-technique-for-hiding-content.ts

@@ -0,0 +1,103 @@
+import { Css } from '../../../utils/css';
+import { CATEGORY_TYPE } from '../../../constants/categoryType';
+import { IIssueReport } from '../../../interfaces/rule-issue.interface';
+import { TextUtility } from '../../../utils/text';
+import { TranslateService } from '../../../services/translate';
+import { $accessibilityAuditRules, $severity } from '../../../constants/accessibility';
+import { AbstractRule, IAbstractRuleConfig } from '../../abstract-rule';
+import { DomUtility } from '../../../utils/dom';
+import { ObjectUtility } from '../../../utils/object';
+
+export class IncorrectTechniqueForHidingContent extends AbstractRule {
+  protected selector: string = `*${[
+    ':root',
+    'head',
+    'title',
+    'style',
+    'script',
+    'noscript',
+    'meta',
+    'link',
+    'br',
+    'hr',
+    'object',
+    'path',
+    'g',
+    'desc',
+    'filter',
+    'img',
+    'input',
+    'iframe',
+    'code',
+    'defs',
+    ':empty'
+  ].map((i: string): string => {
+    return `:not(${i})`;
+  }).join('')}`;
+
+  protected ruleConfig: IAbstractRuleConfig = {
+    id: TextUtility.convertUnderscoresToDashes($accessibilityAuditRules.incorrect_technique_for_hiding_content),
+    links: [
+      {
+        content: 'Hiding Content for Accessibility',
+        url: 'https://snook.ca/archives/html_and_css/hiding-content-for-accessibility'
+      }
+    ],
+    recommendations: [],
+    severity: $severity.high,
+    type: CATEGORY_TYPE.BEST_PRACTICE
+  };
+
+  public validate(elements: HTMLElement[]): void {
+
+    if (ObjectUtility.isHostMethod(document, 'getSelection') === false && ObjectUtility.isHostMethod(document, 'createRange') === false) {
+      return;
+    }
+
+    const reportNode = (element: HTMLElement): void => {
+      const styles: CSSStyleDeclaration | null = Css.getComputedStyle(element);
+
+      if (styles === null) {
+        return;
+      }
+
+      const textIndentValue: string = styles.getPropertyValue('text-indent');
+      const indent: number = Number(textIndentValue.replace(/[^0-9]/g, ''));
+
+      if (indent === 0) {
+        return;
+      }
+
+      const selection: Selection | null = document.getSelection();
+
+      if (selection === null) {
+        return;
+      }
+
+      const range: Range = document.createRange();
+
+      range.selectNodeContents(element);
+
+      selection.removeAllRanges();
+      selection.addRange(range);
+
+      for (let i: number = 0; i < selection.rangeCount; i += 1) {
+        if (DomUtility.isRangeOffPage(selection.getRangeAt(i))) {
+          const reportMessage: string = TranslateService.instant('incorrect_technique_for_hiding_content_report_message', [textIndentValue]);
+
+          const report: IIssueReport = {
+            message: reportMessage,
+            node: element,
+            ruleId: this.ruleConfig.id
+          };
+
+          this.validator.report(report);
+
+          return;
+        }
+      }
+    };
+
+    elements.forEach(reportNode);
+  }
+}

package/aslint/app/rules/aslint/invalid-attribute-dir-value/invalid-attribute-dir-value.documentation.md

@@ -0,0 +1,34 @@
+# invalid-attribute-dir-value
+
+## Rule id
+
+`invalid-attribute-dir-value`
+
+## Definition
+
+This rule determines if a given attribute `dir` have the correct value: `rtl`, `ltr` or `auto`.
+
+## Purpose
+
+The dir global attribute is an enumerated attribute that indicates the directionality of the element's text. To avoid unexpected behaviour the value of `dir` should be correct and should contains one of following string: `rtl`, `ltr` or `auto`.
+
+## Test cases
+
+### Passed
+
+The rule passes when there is no `dir` attribute with value other than `rtl`, `ltr` or `auto`.
+
+## WCAG Success Criteria
+
+Not Applicable
+
+## Best Practice
+
+Yes
+
+## User Impact
+
+* **Severity**: info
+* **Disabilities Affected**:
+  * Visual:
+    * blindness

package/aslint/app/rules/aslint/invalid-attribute-dir-value/invalid-attribute-dir-value.test.ts

@@ -0,0 +1,82 @@
+import { InvalidAttributeDirValue } from './invalid-attribute-dir-value';
+import { Validator } from '../../../validator';
+import { DomUtility } from '../../../utils/dom';
+
+describe('Rules', () => {
+
+  describe('InvalidAttributeDirValue', () => {
+
+    it('should indicate that class exists', () => {
+      expect(InvalidAttributeDirValue).toBeDefined();
+    });
+
+    let fakeDom;
+
+    new InvalidAttributeDirValue().registerValidator();
+
+    beforeEach(() => {
+      fakeDom = document.createElement('div');
+      fakeDom.id = 'fakedom';
+      document.body.appendChild(fakeDom);
+
+      Validator.reset();
+    });
+
+    afterEach(() => {
+      DomUtility.remove(document.getElementById('fakedom'));
+      fakeDom = undefined;
+    });
+
+    it('should return correct data for dir with wrong attribute value', () => {
+      fakeDom.innerHTML = '<p dir="wrong">Wrong attribute</p>';
+      const nodes = DomUtility.querySelectorAllExclude('[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])', fakeDom) as HTMLElement[];
+
+      new InvalidAttributeDirValue().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(1);
+      expect(Validator.getReport('report_0').message).toBe('Attribute <code>dir</code> has invalid value <code>wrong</code>.');
+      expect(Validator.getReport('report_0').node.nodeName.toLowerCase()).toBe('p');
+      expect(Validator.getReport('report_0').ruleId).toBe('invalid-attribute-dir-value');
+    });
+
+    it('should return correct data for dir with empty attribute value', () => {
+      fakeDom.innerHTML = '<p dir>Wrong attribute</p>';
+      const nodes = DomUtility.querySelectorAllExclude('[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])', fakeDom) as HTMLElement[];
+
+      new InvalidAttributeDirValue().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(1);
+      expect(Validator.getReport('report_0').message).toBe('Attribute <code>dir</code> has invalid value <code></code>.');
+      expect(Validator.getReport('report_0').node.nodeName.toLowerCase()).toBe('p');
+      expect(Validator.getReport('report_0').ruleId).toBe('invalid-attribute-dir-value');
+    });
+
+    it('should return no reports in case of dir is ltr', () => {
+      fakeDom.innerHTML = '<p dir="ltr">Left to right(English)</p>';
+      const nodes = DomUtility.querySelectorAllExclude('[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])', fakeDom) as HTMLElement[];
+
+      new InvalidAttributeDirValue().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(0);
+    });
+
+    it('should return no reports in case of dir is rtl', () => {
+      fakeDom.innerHTML = '<p dir="rtl">Right to left(Arabic)</p>';
+      const nodes = DomUtility.querySelectorAllExclude('[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])', fakeDom) as HTMLElement[];
+
+      new InvalidAttributeDirValue().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(0);
+    });
+
+    it('should return no reports in case of dir is auto', () => {
+      fakeDom.innerHTML = '<p dir="auto">Auto</p>';
+      const nodes = DomUtility.querySelectorAllExclude('[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])', fakeDom) as HTMLElement[];
+
+      new InvalidAttributeDirValue().validate(nodes);
+
+      expect(Object.keys(Validator.getReports()).length).toBe(0);
+    });
+
+  });
+});

package/aslint/app/rules/aslint/invalid-attribute-dir-value/invalid-attribute-dir-value.ts

@@ -0,0 +1,44 @@
+import { CATEGORY_TYPE } from '../../../constants/categoryType';
+import { IIssueReport } from '../../../interfaces/rule-issue.interface';
+import { TextUtility } from '../../../utils/text';
+import { TranslateService } from '../../../services/translate';
+import { $accessibilityAuditRules, $severity } from '../../../constants/accessibility';
+import { AbstractRule, IAbstractRuleConfig } from '../../abstract-rule';
+
+export class InvalidAttributeDirValue extends AbstractRule {
+  protected selector: string = '[dir]:not([dir="rtl"]):not([dir="ltr"]):not([dir="auto"])';
+  protected ruleConfig: IAbstractRuleConfig = {
+    id: TextUtility.convertUnderscoresToDashes($accessibilityAuditRules.invalid_attribute_dir_value),
+    links: [
+      {
+        content: 'H56: Using the dir attribute on an inline element to resolve problems with nested directional runs',
+        url: 'https://www.w3.org/TR/WCAG20-TECHS/H56.html'
+      }
+    ],
+    recommendations: [],
+    severity: $severity.critical,
+    type: CATEGORY_TYPE.BEST_PRACTICE
+  };
+
+  public validate(elements: HTMLElement[]): void {
+    const checkValue = (element: HTMLElement): void => {
+      const dirAttribute: string | null = element.getAttribute('dir');
+
+      if (dirAttribute === null) {
+        return;
+      }
+
+      const reportMessage: string = TranslateService.instant('invalid_attribute_dir_value_report_message', [TextUtility.escape(dirAttribute)]);
+
+      const report: IIssueReport = {
+        message: reportMessage,
+        node: element,
+        ruleId: this.ruleConfig.id
+      };
+
+      this.validator.report(report);
+    };
+
+    elements.forEach(checkValue);
+  }
+}

package/aslint/app/rules/aslint/label-duplicated-content-title/label-duplicated-content-title.documentation.md

@@ -0,0 +1,40 @@
+# label-duplicated-content-title
+
+## Rule id
+
+`label-duplicated-content-title`
+
+## Definition
+
+This rule determines if a given element `<label>` contains attribute `title` with the same accessible name.
+
+## Purpose
+
+Let's examine following example:
+
+`<label for="example" title="This is an example">This is an example</label>`
+
+Assuming screen reader can read `title`<sup>*</sup>. In above case then `This is an example` will be read twice. To avoid that this rule helps to find such cases.
+
+`*` - by default, for example, VoiceOver doesn't read `title` until Hints are turned on.
+
+## Test cases
+
+### Passed
+
+The rule passes when there is no `<label>` with an attribute `title` that contains same content as `<label>`'s accessible name.
+
+## WCAG Success Criteria
+
+Not Applicable
+
+## Best Practice
+
+Yes
+
+## User Impact
+
+* **Severity**: info
+* **Disabilities Affected**:
+  * Visual:
+    * blindness