Skip to content

Instantly share code, notes, and snippets.

@xwipeoutx
Created October 21, 2016 00:34
Show Gist options
  • Save xwipeoutx/184ec46e96b634e2550e4e36b0d33e06 to your computer and use it in GitHub Desktop.
Save xwipeoutx/184ec46e96b634e2550e4e36b0d33e06 to your computer and use it in GitHub Desktop.
Accessibilities
(function() {
var invalidElementFinders = {
"Lists should have titles": () => Array.from(document.querySelectorAll("ul,li")).filter(el => !el.title),
"Articles should be aria-labelledby": () => Array.from(document.querySelectorAll("article")).filter(el => !el.getAttribute("aria-labelledby")),
}
var validateAccessibility = function () {
Array.from(document.querySelectorAll("*")).forEach(el => {
el.classList.remove("is-not-accessible");
if (el.problems) delete el.problems
});
Object.keys(invalidElementFinders).forEach(key => {
var invalidElements = invalidElementFinders[key]();
if (invalidElements.length) {
invalidElements.forEach(el => {
el.classList.add("is-not-accessible");
el.problems = (el.problems || []).concat(key);
});
}
});
};
setInterval(validateAccessibility, 1000);
var style = document.createElement("style");
style.innerHTML = ".is-not-accessible { background: pink !important; }";
document.head.appendChild(style);
document.addEventListener("mousedown", (ev) => {
if (ev.button !== 1)
return;
var el = ev.target;
do {
if (el.problems)
console.warn(el, el.problems);
} while (el = el.parentNode);
return false;
});
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment