input-requires-label should ignore type=hidden fields #866
Closed
Description
Describe the bug
I'm using the API to lint some remote pages and saw this error/warning message in my local logfile:
{
"type": "warning",
"message": "No matching [ label ] tag found.",
"raw": "<input type=\"hidden\" name=\"scannedEmailId\" value=\"\">",
"evidence": " <input type=\"hidden\" name=\"scannedEmailId\" value=\"\">",
"line": 122,
"col": 21,
"rule": {
"id": "input-requires-label",
"description": "All [ input ] tags must have a corresponding [ label ] tag. ",
"link": "https://github.com/thedaviddias/HTMLHint/wiki/input-requires-label"
}
},But I don't think the rule should be displaying that warning for type=hidden fields since that doesn't entirely make sense.
<input type="hidden" name="scannedEmailId" value="">
<!--
"rule": {
"id": "input-requires-label",
"description": "All [ input ] tags must have a corresponding [ label ] tag. ",
"link": "https://github.com/thedaviddias/HTMLHint/wiki/input-requires-label"
}
-->To Reproduce
// index.mjs
import fs from "node:fs/promises";
import axios from "axios";
import {HTMLHint} from "htmlhint";
const allRules = await fs.readFile("./.htmlhintrc").then(res => JSON.parse(res));
// NOTE: My attempt at scraping+filtering all the undocumented rules.
// const DISABLED_RULES = [
// "attr-sorted",
// "attr-value-not-empty",
// "attr-value-single-quotes",
// "attr-whitespace",
// "empty-tag-not-self-closed",
// "head-script-disabled",
// "href-abs-or-rel",
// "script-disabled",
// "space-tab-mixed-disabled",
// "tag-self-close",
// "tags-check",
// ];
//
// const allRules = Object.keys(HTMLHint.rules).reduce((obj={}, name="") => {
// obj[name] = !DISABLED_RULES.includes(name);
// return obj;
// }, {});
await getPage("https://monitor.firefox.com/");
await getPage("https://monitor.firefox.com/breaches/");
await getPage("https://monitor.firefox.com/breach-details/linkedin/");
async function getPage(url) {
const { data: html } = await axios.get(url);
const res = HTMLHint.verify(html, allRules || HTMLHint.defaultRuleset);
console.log(JSON.stringify({
url,
results: res
}, null, 2));
}And my .htmlhintrc file looks like this:
{
"alt-require": true,
"attr-lowercase": true,
"attr-no-duplication": true,
"attr-no-unnecessary-whitespace": true,
"attr-sorted": false,
"attr-unsafe-chars": true,
"attr-value-double-quotes": true,
"attr-value-not-empty": false,
"attr-value-single-quotes": false,
"attr-whitespace": false,
"doctype-first": true,
"doctype-html5": true,
"empty-tag-not-self-closed": false,
"head-script-disabled": false,
"href-abs-or-rel": false,
"html-lang-require": true,
"id-class-ad-disabled": true,
"id-class-value": true,
"id-unique": true,
"inline-script-disabled": true,
"inline-style-disabled": true,
"input-requires-label": true,
"script-disabled": false,
"space-tab-mixed-disabled": false,
"spec-char-escape": true,
"src-not-empty": true,
"style-disabled": true,
"tag-pair": true,
"tag-self-close": false,
"tagname-lowercase": true,
"tagname-specialchars": true,
"tags-check": false,
"title-require": true
}Expected behavior
<input type="hidden"> fields shouldn't display a warning if there isn't an associated <label>.
Screenshots
n/a
Desktop (please complete the following information):
- OS: macOS
- Browser: Node 17
- Version: n/a
Additional context
Add any other context about the problem here.