E21 when `.active` class used without the `checked`

[Federico-G]

PROBLEM:

I have this when my page loads:

<div class="btn-group form-control-radio" data-toggle="buttons" id="tipo">
    <label class="btn btn-default">
        <input type="radio" name="var_tipo" autocomplete="off" value="tipo1">Tipo1
    </label>
    <label class="btn btn-default">
        <input type="radio" name="var_tipo" autocomplete="off" value="tipo2">Tipo2
    </label>
</div>

This don't cause any errors, but when I click in one of them, the label now has the class .active which causes E21 error(https://github.com/twbs/bootlint/wiki/E021). I don't know if I'm making something wrong or if it's a bug. I read the docs and the examples are only with "checked" with no .active but no vise-versa.

DOCS:

.active class used without the checked attribute (or vice-versa) in a button group using the button.js plugin

Wrong:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary">
    <input type="checkbox" checked /> Option 1 (pre-checked)
  </label>
  <label class="btn btn-primary active">
    <input type="checkbox" /> Option 2 (not pre-checked)
  </label>
</div>

Right:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="checkbox" checked /> Option 1 (pre-checked)
  </label>
  <label class="btn btn-primary">
    <input type="checkbox" /> Option 2 (not pre-checked)
  </label>
</div>

[cvrebert]

Unless you're seeing the widget misbehave somehow, you're fine; the error is a false-positive. Probably the E021 code should use :checked instead of [checked] in its selectors, assuming that works properly in Cheerio. Bootlint was originally designed to check the initial rendered HTML of a webpage, rather than the live DOM after having interacted with the webpage. Although there's no philosophical reason not to make it work in both cases if feasible.