Skip to content

Releases: ember-template-lint/ember-template-lint

v0.5.16

28 Sep 13:08
Compare
Choose a tag to compare

CHANGELOG

  • Fix issue with link-rel-noopener rule when using properly with a listing (i.e. rel="noopener noreferrer").
  • Add inline-link-to rule to prevent usage of inline {{link-to.
  • Add style-concatenation rule. This prevents the usage of <div style="{{make-background url}}"> (quoted value with any dynamic segments) but allows
    <div style={{make-background url}}>.

v0.5.15

28 Sep 13:07
v0.5.15
Compare
Choose a tag to compare

CHANGELOG

  • Fix issue causing <iframe> to be detected as {{#if.
  • Add link-rel-noopener rule. This rule requires that any <a target="_blank"> have a rel="noopener". This prevents the newly opened window from having access
    to the opener (and helps prevent a number of phishing attacks).

v0.5.14

08 Jun 13:33
Compare
Choose a tag to compare

CHANGELOG

  • Fix invalid-indentation rule to allow scenarios where the opening and closing elements can have no space between. For example:
<textarea
    class="form-control"
    id="job-instructions"
    rows="3"
    placeholder="Do it well"
    value={{job.instructions}}
    oninput={{action 'updateInstructions' value='target.value'}}></textarea>

If the above </textarea> had been after a newline and indented properly, the default contents of the textarea would then include that whitespace. The rule now enforces
that there be no child elements within a given block.

  • Remove a few ARIA roles that were incorrectly flagging things as interactive elements (i.e. dialog and alertdialog).

v0.5.13

05 Jun 21:36
Compare
Choose a tag to compare

CHANGELOG

  • Fix bug with invalid-interactive rule incorrectly flagging valid elements.

v0.5.12

04 Jun 14:03
v0.5.12
Compare
Choose a tag to compare

CHANGELOG

  • Change nested-interactive rule to ignore elements using tabindex when determining if a parent element is interactive. tabindex is still used
    for detecting all child elements once already inside of another interactive element.

  • Fix various issues with nested-interactive and <label>.

    • Consider <label> an interactive element.
    • Specifically handle the various edge cases of having <label><input></label>.
    • Prevent multiple interactive elements inside of a <label>.
  • Fix bugs with the invalid-indentation around escaped mustaches and raw blocks.

  • Add invalid-interactive rule (full documentation). Adding interactivity to an element that is not naturally interactive content leads to a very poor experience for users of assistive technology (i.e. screen readers). In order to ensure that screen readers can provide useful information to their users, we should add an appropriate role attribute when the underlying element would not have made that role obvious.

    This rule forbids the following:

<div {{action 'foo'}}></div>

Instead, you should add a role to the element in question so that the A/T is aware that it is interactive:

<div role="button" {{action "foo"}}></div>
  • Add img-alt-attributes rule (full documentation). An <img> without an alt attribute is essentially invisible to assistive technology (i.e. screen readers). In order to ensure that screen readers can provide useful information, we need to ensure that all <img> elements have an alt specified. See WCAG Suggestion H37.

    The rule forbids the following:

<img src="rwjblue.png">

Instead, you should write the template as:

<img src="rwjblue.png" alt="picture of Robert Jackson">

v0.5.11

19 May 23:50
Compare
Choose a tag to compare

CHANGELOG

  • Add internal helper for determining if a given element is an interactive element.
  • Update nested-interactive rule to use the new isInteractiveElement helper function.
  • Change nested-interactive configuration. Now uses an object (instead of an array). Example:
rules: {
  'nested-interactive': {
    ignoredTags: ['a', 'button'], // list of tag names to ignore
    ignoreTabindex: true, // ignore the tabindex check
    ignoreUsemapAttribute: ['img', 'object'], // ignore `usemap` check for specific tag names
    additionalInteractiveTags: ['some-custom-tag'], // not sure this is needed, but it seams neat :P
  }
}

v0.5.10

14 May 19:15
v0.5.10
Compare
Choose a tag to compare

CHANGELOG

  • Add ability to mark specific rules as pending for a module. Given the following .template-lintrc.js file, the foo/bar/baz module would have only its indentation related issues labeled as warnings:
module.exports = {
  extends: 'recommended',
  pending: [
    { moduleId: 'foo/bar/baz', only: ['block-indentation']}
  ]
}

v0.5.6

03 May 14:05
7a5afa1
Compare
Choose a tag to compare

CHANGELOG

  • Remove bare-strings from recommended configuration. See #27 for more details.

v0.5.5

03 May 12:13
2694d92
Compare
Choose a tag to compare

CHANGELOG

  • Fix invalid rule name in recommended configuration.
  • Add ability to mark files as pending in the .template-lintrc.js configuration file. When a module is listed in the pending list, it will be checked but any errors detected will be marked as warnings (and will not trigger a failing test when using ember-cli-template-lint). If there are no errors detected when checking a pending file, a new error will be triggered. The goal of this process is to allow large existing projects begin utilizing ember-template-lint / ember-cli-template-lint and slowly fix their template files to comply with the rules here. Feedback welcome on this idea/process...