Snippet StoreFind CSS and JS snippets and create your own collection to use in Polypane.

{"id":"A11y-tools.com: Misc.json-0-0","name":"1-Click De-crapulator","description":"Click on any part of a web page, get the basic HTML with all the bloaty crap removed!","language":"javascript","executionMode":"activate","content":"(function(){javascript:!function(){let e=[\"alt\",\"autocomplete\",\"for\",\"href\",\"id\",\"lang\",\"name\",\"role\",\"src\",\"tabindex\",\"target\",\"value\",\"aria-activedescendant\",\"aria-atomic\",\"aria-checked\",\"aria-current\",\"aria-owns\",\"aria-controls\",\"aria-describedby\",\"aria-disabled\",\"aria-hidden\",\"aria-invalid\",\"aria-label\",\"aria-labelledby\",\"aria-level\",\"aria-live\",\"aria-modal\",\"aria-pressed\",\"aria-readonly\",\"aria-required\",\"aria-selected\",\"aria-sort\",\"aria-valuemax\",\"aria-valuemin\",\"aria-valuenow\",\"aria-valuetext\"],t=null,a=!1,r=[],n=null;function i(){r.forEach(e=>{null===e.originalTabIndex?e.element.removeAttribute(\"tabindex\"):e.element.setAttribute(\"tabindex\",e.originalTabIndex)}),r=[]}function l(){t=null,a=!1,(n=document.createElement(\"div\")).setAttribute(\"role\",\"status\"),n.setAttribute(\"aria-live\",\"polite\"),n.setAttribute(\"id\",\"decrapulator-status\"),n.style.cssText=`position: absolute !important;width: 1px !important;height: 1px !important;padding: 0 !important;margin: -1px !important;overflow: hidden !important;clip: rect(0, 0, 0, 0) !important;white-space: nowrap !important;border: 0 !important;`,document.body.appendChild(n);if(!document.getElementById(\"decrapulator-selection-style\")){let e=document.createElement(\"style\");e.id=\"decrapulator-selection-style\",e.textContent=`.current-selection {outline: 2px solid red !important;}`,document.head.appendChild(e)}let r=document.getElementById(\"xpath-panel\");r&&r.remove();let i=document.createElement(\"div\");i.id=\"xpath-panel\",i.style.cssText=`position: fixed;top: 10px;right: 10px;background: rgba(0, 0, 0, 0.9);color: white;padding: 10px;border-radius: 5px;font-family: monospace;font-size: 12px;z-index: 10000;max-width: 400px;word-wrap: break-word;display: none;box-shadow: 0 2px 10px rgba(0,0,0,0.3);pointer-events: none;`,document.body.appendChild(i),document.addEventListener(\"mousemove\",m,!0),document.addEventListener(\"mouseout\",h,!0),document.addEventListener(\"click\",f,!0),document.addEventListener(\"keydown\",u,!0),document.body.style.cursor=\"crosshair\",n&&(n.textContent=\"Element selection mode active. Use mouse to hover or arrow keys to navigate, Enter to select.\")}function o(e,a,r){t&&t.classList.remove(\"current-selection\"),t=e,e&&(e.classList.add(\"current-selection\"),function e(t,a,r){let n=document.getElementById(\"xpath-panel\");if(!t||\"xpath-panel\"===t.id||!n)return;let i=function e(t){if(\"\"!==t.id)return'//*[@id=\"'+t.id+'\"]';if(t===document.body)return\"/html/body\";let a=0,r=t.parentNode.childNodes;for(let n=0;n<r.length;n++){let i=r[n];if(i===t)return e(t.parentNode)+\"/\"+t.tagName.toLowerCase()+\"[\"+(a+1)+\"]\";1===i.nodeType&&i.tagName===t.tagName&&a++}}(t),l=t.className?` class=\"${t.className}\"`:\"\",o=t.id?` id=\"${t.id}\"`:\"\",d=t.outerHTML.substring(0,200)+(t.outerHTML.length>200?\"...\":\"\");n.replaceChildren();let s=document.createElement(\"ul\"),c=document.createElement(\"li\"),p=document.createElement(\"strong\");p.textContent=\"XPath:\",p.setAttribute(\"id\",\"xpath-label\"),c.appendChild(p),c.appendChild(document.createTextNode(` ${i}`)),s.appendChild(c);let u=document.createElement(\"li\"),m=document.createElement(\"strong\");m.textContent=\"Tag:\",m.setAttribute(\"id\",\"tag-label\"),u.appendChild(m),u.appendChild(document.createTextNode(` ${t.tagName.toLowerCase()}${o}${l}`)),s.appendChild(u);let h=document.createElement(\"li\"),f=document.createElement(\"strong\");f.textContent=\"HTML:\",f.setAttribute(\"id\",\"html-label\"),h.appendChild(f),h.appendChild(document.createTextNode(` ${d}`)),s.appendChild(h);let b=document.createElement(\"li\"),$=document.createElement(\"small\");$.style.color=\"#ccc\",$.textContent=\"Use arrow keys to navigate, ENTER to select\",b.appendChild($),s.appendChild(b),n.appendChild(s),n.style.display=\"block\",void 0!==a&&void 0!==r&&function e(t,a){let r=document.getElementById(\"xpath-panel\");if(!r)return;let n=r.getBoundingClientRect(),i=window.innerWidth,l=window.innerHeight,o=t+20,d=a+20;o+n.width>i&&(o=t-n.width-20),d+n.height>l&&(d=a-n.height-20),o=Math.max(10,Math.min(o,i-n.width-10)),d=Math.max(10,Math.min(d,l-n.height-10)),r.style.left=o+\"px\",r.style.top=d+\"px\",r.style.right=\"auto\"}(a,r)}(e,a,r),function e(t){if(!n||!t)return;let a=\"\";if(t.getAttribute(\"aria-label\"))a=t.getAttribute(\"aria-label\");else if(t.getAttribute(\"aria-labelledby\")){let r=t.getAttribute(\"aria-labelledby\"),i=document.getElementById(r);i&&(a=i.textContent.trim())}else t.alt?a=t.alt:t.title?a=t.title:(a=t.textContent.trim()).length>100&&(a=a.substring(0,100)+\"...\");!a&&(a=`${t.tagName.toLowerCase()} element`,t.id?a+=` with id \"${t.id}\"`:t.className&&(a+=` with class \"${t.className.split(\" \")[0]}\"`)),n.textContent=`Selected: ${a}`}(e))}function d(e){var t;let a=(t=e).replace(/<!--[\\s\\S]*?-->/g,\"\");a=a.replace(/>\\s+</g,\"><\").replace(/\\s+/g,\" \").trim();let r=\"\",n=0,i=a.split(/(<\\/?[^>]+>)/);for(let l=0;l<i.length;l++){let o=i[l].trim();if(o){if(o.startsWith(\"</\"))n--,r+=\" \".repeat(Math.max(0,n))+o+\"\\n\";else if(o.startsWith(\"<\")){r+=\" \".repeat(n)+o;let d=o.endsWith(\"/>\")||/^<(area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)\\b/i.test(o);!d&&n++,r+=\"\\n\"}else o.length>0&&(r+=\" \".repeat(n)+o+\"\\n\")}}return r.trim()}function s(){t&&(t.classList.remove(\"current-selection\"),t=null),n&&n.parentNode&&(n.parentNode.removeChild(n),n=null);let e=document.getElementById(\"xpath-panel\");e&&e.remove();let a=document.getElementById(\"decrapulator-selection-style\");a&&a.remove(),document.removeEventListener(\"mousemove\",m,!0),document.removeEventListener(\"mouseout\",h,!0),document.removeEventListener(\"click\",f,!0),document.removeEventListener(\"keydown\",u,!0),document.body.style.cursor=\"\"}let c=\"\";function p(){let a=t;if(!a||\"xpath-panel\"===a.id||a===document.head||a.closest(\"head\"))return;n&&(n.textContent=\"Element selected and processing...\"),c=a.outerHTML;let o=function t(a){let r=a.cloneNode(!0),n=new Set,i=[\"for\",\"aria-labelledby\",\"aria-describedby\",\"aria-controls\",\"aria-owns\",\"aria-activedescendant\"];return!function e(t){1===t.nodeType&&(i.forEach(e=>{let a=t.getAttribute(e);if(a){let r=a.trim().split(/\\s+/);r.forEach(e=>{e&&n.add(e)})}}),[...t.childNodes].forEach(t=>{e(t)}))}(r),!function t(a){if(1===a.nodeType){if(\"style\"===a.tagName.toLowerCase()){a.remove();return}if(\"svg\"===a.tagName.toLowerCase()){for(;a.firstChild;)a.removeChild(a.firstChild);a.appendChild(document.createTextNode(\"...\"));let r=[...a.attributes];r.forEach(t=>{let r=t.name.toLowerCase(),i=e.includes(r);\"id\"===r&&(i=n.has(t.value)),i||a.removeAttribute(t.name)});return}if(a.getAttribute(\"src\")){let i=a.getAttribute(\"src\");i.length>50&&a.setAttribute(\"src\",i.substring(0,50)+\"...\")}if(a.getAttribute(\"href\")){let l=a.getAttribute(\"href\");l.length>50&&a.setAttribute(\"href\",l.substring(0,50)+\"...\")}let o=[...a.attributes];o.forEach(t=>{let r=t.name.toLowerCase(),i=e.includes(r);\"id\"===r&&(i=n.has(t.value)),\"type\"===r&&\"input\"===a.tagName.toLowerCase()&&(i=!0),i||a.removeAttribute(t.name)}),[...a.childNodes].forEach(e=>{t(e)})}}(r),r}(a);!function e(t){s(),function e(){let t=document.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), details, summary, iframe, object, embed, area[href], audio[controls], video[controls]');r=[],t.forEach(e=>{let t=e.hasAttribute(\"tabindex\")?e.getAttribute(\"tabindex\"):null;r.push({element:e,originalTabIndex:t}),e.setAttribute(\"tabindex\",\"-1\")})}();let a=document.createElement(\"div\");a.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 10001;`;let n=a.attachShadow({mode:\"closed\"}),o=document.createElement(\"style\");o.textContent=`:host {all: initial;}.overlay {position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background: rgba(0, 0, 0, 0.5);display: flex;align-items: center;justify-content: center;z-index: 10001;}.dialog * {color:white;}.dialog {font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;background: #332726;border: 2px solid #333;border-radius: 10px;padding: 20px;max-width: 80vw;max-height: 80vh;box-shadow: 0 4px 20px rgba(0,0,0,0.3);display: flex;flex-direction: column;}.title {margin: 0 0 10px 0;font-family: Arial, sans-serif;font-size: 18px;font-weight: bold;}.textarea {width: 600px;height: 400px;font-family: 'Courier New', monospace;font-size: 12px;border: 1px solid #ccc;padding: 10px;resize: both;box-sizing: border-box;line-height:1.5;color:#332726;}textarea::selection {background:#1a1413;color:white;}.button-container {display: flex;gap: 10px;margin-top: 10px;}.button {padding: 8px 2em;background: #333;color: white;border: 2px solid white;border-radius: 5px;cursor: pointer;font-family: Arial, sans-serif;position:relative;}.button:hover {background: #555;}.button:focus {outline: 2px solid #007acc;outline-offset: 2px;}.button[aria-pressed=true] {background:#7e082b;}.button[aria-pressed=true]:before {position:absolute;left:0.6em;top:0;transform:translateY(50%);content:\"✓\";}#decrap-link {padding:0.5em 0;}strong#xpath-label {color:yellow!important}strong#tag-label {color:yellow!important}strong#html-label {color:yellow!important}`;let p=document.createElement(\"div\");p.className=\"overlay\";let u=document.createElement(\"div\");u.className=\"dialog\",u.setAttribute(\"role\",\"dialog\"),u.setAttribute(\"aria-modal\",\"true\");let m=document.createElement(\"h3\");m.className=\"title\",m.setAttribute(\"id\",\"decrapulator-dialog\"),m.textContent=\"Here's your 1-Click De-crapulated HTML Output\",u.setAttribute(\"aria-labelledby\",\"decrapulator-dialog\");let h=document.createElement(\"textarea\");h.className=\"textarea\",h.setAttribute(\"aria-labelledby\",\"decrapulator-dialog\");let f=document.createElement(\"textarea\");f.className=\"textarea\",f.setAttribute(\"aria-label\",\"Original source markup\"),f.setAttribute(\"hidden\",\"hidden\"),function e(t){function a(e){let t=e.tagName.toLowerCase();if(\"div\"!==t&&\"span\"!==t)return!1;let r=e.textContent.trim();if(r.length>0)return!1;let n=!1;for(let i of e.children){let l=i.tagName.toLowerCase();if(\"div\"!==l&&\"span\"!==l||!a(i)){n=!0;break}}return!n}return function e(t){let r=Array.from(t.children);for(let n of r)e(n);let i=Array.from(t.children);for(let l of i)a(l)&&t.removeChild(l)}(t),t}(t);let b=d(t.outerHTML),$=[\"Simplified HTML (with some attributes/features removed for clarity):\",\"\",\"```html\",b,\"```\"].join(\"\\n\");try{h.value=$}catch(g){h.textContent=$}let x=document.createElement(\"div\");x.setAttribute(\"id\",\"decrap-link\");let y=document.createElement(\"a\");y.textContent=\"Visit the full-fat (ugh) De-crapulator\",y.setAttribute(\"href\",\"https://a11y-tools.com/markup-de-crapulator/\"),x.appendChild(y);let v=document.createElement(\"div\");v.className=\"button-container\";let C=document.createElement(\"button\");C.className=\"button\",C.textContent=\"Close\";let E=document.createElement(\"button\");E.className=\"button\",E.textContent=\"Pick again\";let w=document.createElement(\"button\");w.className=\"button\",w.textContent=\"Flatten\";let _=document.createElement(\"button\");function A(){document.body.removeChild(a),document.removeEventListener(\"keydown\",N),i()}function N(e){\"Escape\"===e.key&&(e.preventDefault(),e.stopPropagation(),A())}_.className=\"button\",_.textContent=\"Show original\",_.setAttribute(\"aria-pressed\",\"false\"),u.appendChild(m),u.appendChild(h),u.appendChild(f),u.appendChild(x),v.appendChild(C),v.appendChild(E),v.appendChild(w),v.appendChild(_),u.appendChild(v),p.appendChild(u),n.appendChild(o),n.appendChild(p),document.body.appendChild(a),document.addEventListener(\"keydown\",N),C.onclick=A,E.onclick=function e(){document.body.removeChild(a),document.removeEventListener(\"keydown\",N),i(),l()},w.onclick=function e(){let a=t.cloneNode(!0);!function e(t){function a(e){let t=e.tagName.toLowerCase();if(\"div\"!==t&&\"span\"!==t||e.attributes.length>0)return!1;let a=Array.from(e.children),r=!1;for(let n of e.childNodes)if(n.nodeType===Node.TEXT_NODE&&n.textContent.trim().length>0){r=!0;break}return(!r||!(a.length>0))&&1===a.length}return function e(t){let r=Array.from(t.children);for(let n of r)e(n);let i=Array.from(t.children);for(let l of i)if(a(l)){let o=l.children[0];t.replaceChild(o,l),e(t);break}}(t),t}(a);let r=d(a.outerHTML),n=[\"Simplified HTML (with some attributes/features removed for clarity):\",\"\",\"```html\",r,\"```\"].join(\"\\n\");try{h.value=n}catch(i){h.textContent=n}h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10),w.disabled=!0,w.textContent=\"Flattened\",w.style.opacity=\"0.6\",w.style.cursor=\"default\"},_.onclick=function e(){let t=d(c),a=[\"Original markup (indented):\",\"\",\"```html\",t,\"```\"].join(\"\\n\");try{f.value=a}catch(r){f.textContent=a}\"false\"===_.getAttribute(\"aria-pressed\")?(h.setAttribute(\"hidden\",\"hidden\"),f.removeAttribute(\"hidden\"),_.setAttribute(\"aria-pressed\",\"true\"),f.focus(),f.select(),setTimeout(()=>{f.scrollTop=0},10)):(f.setAttribute(\"hidden\",\"hidden\"),h.removeAttribute(\"hidden\"),_.setAttribute(\"aria-pressed\",\"false\"),h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10))},p.onclick=e=>{e.target===p&&A()},h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10)}(o)}function u(e){if(\"Escape\"===e.key){e.preventDefault(),e.stopPropagation(),s(),n&&(n.textContent=\"Element selection cancelled.\");return}if(t){if(\"Enter\"===e.key){e.preventDefault(),e.stopPropagation(),p();return}if([\"ArrowUp\",\"ArrowDown\",\"ArrowLeft\",\"ArrowRight\"].includes(e.key)){switch(e.preventDefault(),e.stopPropagation(),a=!0,e.key){case\"ArrowUp\":!function e(){if(!t||!t.parentElement)return;let a=t.parentElement;(a!==document.body&&a!==document.documentElement||t!==document.body)&&o(a)}();break;case\"ArrowDown\":!function e(){if(!t)return;let a=function e(t){let a=t.firstChild;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}(t);a&&o(a)}();break;case\"ArrowLeft\":!function e(){if(!t)return;let a=function e(t){let a=t.previousSibling;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.previousSibling;return a}(t);a&&o(a)}();break;case\"ArrowRight\":!function e(){if(!t)return;let a=function e(t){let a=t.nextSibling;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}(t);a&&o(a)}()}setTimeout(()=>{a=!1},100)}}}function m(e){if(a)return;let t=e.target;\"xpath-panel\"!==t.id&&o(t,e.clientX,e.clientY)}function h(e){if(!a&&t===e.target){t&&(t.classList.remove(\"current-selection\"),t=null);let r=document.getElementById(\"xpath-panel\");r&&(r.style.display=\"none\"),n&&(n.textContent=\"\")}}function f(e){e.preventDefault(),e.stopPropagation(),p()}l()}()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"A11y-tools.com: Misc.","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Misc.json","download":{"name":"1-Click De-crapulator","language":"javascript","executionMode":"activate","content":"(function(){javascript:!function(){let e=[\"alt\",\"autocomplete\",\"for\",\"href\",\"id\",\"lang\",\"name\",\"role\",\"src\",\"tabindex\",\"target\",\"value\",\"aria-activedescendant\",\"aria-atomic\",\"aria-checked\",\"aria-current\",\"aria-owns\",\"aria-controls\",\"aria-describedby\",\"aria-disabled\",\"aria-hidden\",\"aria-invalid\",\"aria-label\",\"aria-labelledby\",\"aria-level\",\"aria-live\",\"aria-modal\",\"aria-pressed\",\"aria-readonly\",\"aria-required\",\"aria-selected\",\"aria-sort\",\"aria-valuemax\",\"aria-valuemin\",\"aria-valuenow\",\"aria-valuetext\"],t=null,a=!1,r=[],n=null;function i(){r.forEach(e=>{null===e.originalTabIndex?e.element.removeAttribute(\"tabindex\"):e.element.setAttribute(\"tabindex\",e.originalTabIndex)}),r=[]}function l(){t=null,a=!1,(n=document.createElement(\"div\")).setAttribute(\"role\",\"status\"),n.setAttribute(\"aria-live\",\"polite\"),n.setAttribute(\"id\",\"decrapulator-status\"),n.style.cssText=`position: absolute !important;width: 1px !important;height: 1px !important;padding: 0 !important;margin: -1px !important;overflow: hidden !important;clip: rect(0, 0, 0, 0) !important;white-space: nowrap !important;border: 0 !important;`,document.body.appendChild(n);if(!document.getElementById(\"decrapulator-selection-style\")){let e=document.createElement(\"style\");e.id=\"decrapulator-selection-style\",e.textContent=`.current-selection {outline: 2px solid red !important;}`,document.head.appendChild(e)}let r=document.getElementById(\"xpath-panel\");r&&r.remove();let i=document.createElement(\"div\");i.id=\"xpath-panel\",i.style.cssText=`position: fixed;top: 10px;right: 10px;background: rgba(0, 0, 0, 0.9);color: white;padding: 10px;border-radius: 5px;font-family: monospace;font-size: 12px;z-index: 10000;max-width: 400px;word-wrap: break-word;display: none;box-shadow: 0 2px 10px rgba(0,0,0,0.3);pointer-events: none;`,document.body.appendChild(i),document.addEventListener(\"mousemove\",m,!0),document.addEventListener(\"mouseout\",h,!0),document.addEventListener(\"click\",f,!0),document.addEventListener(\"keydown\",u,!0),document.body.style.cursor=\"crosshair\",n&&(n.textContent=\"Element selection mode active. Use mouse to hover or arrow keys to navigate, Enter to select.\")}function o(e,a,r){t&&t.classList.remove(\"current-selection\"),t=e,e&&(e.classList.add(\"current-selection\"),function e(t,a,r){let n=document.getElementById(\"xpath-panel\");if(!t||\"xpath-panel\"===t.id||!n)return;let i=function e(t){if(\"\"!==t.id)return'//*[@id=\"'+t.id+'\"]';if(t===document.body)return\"/html/body\";let a=0,r=t.parentNode.childNodes;for(let n=0;n<r.length;n++){let i=r[n];if(i===t)return e(t.parentNode)+\"/\"+t.tagName.toLowerCase()+\"[\"+(a+1)+\"]\";1===i.nodeType&&i.tagName===t.tagName&&a++}}(t),l=t.className?` class=\"${t.className}\"`:\"\",o=t.id?` id=\"${t.id}\"`:\"\",d=t.outerHTML.substring(0,200)+(t.outerHTML.length>200?\"...\":\"\");n.replaceChildren();let s=document.createElement(\"ul\"),c=document.createElement(\"li\"),p=document.createElement(\"strong\");p.textContent=\"XPath:\",p.setAttribute(\"id\",\"xpath-label\"),c.appendChild(p),c.appendChild(document.createTextNode(` ${i}`)),s.appendChild(c);let u=document.createElement(\"li\"),m=document.createElement(\"strong\");m.textContent=\"Tag:\",m.setAttribute(\"id\",\"tag-label\"),u.appendChild(m),u.appendChild(document.createTextNode(` ${t.tagName.toLowerCase()}${o}${l}`)),s.appendChild(u);let h=document.createElement(\"li\"),f=document.createElement(\"strong\");f.textContent=\"HTML:\",f.setAttribute(\"id\",\"html-label\"),h.appendChild(f),h.appendChild(document.createTextNode(` ${d}`)),s.appendChild(h);let b=document.createElement(\"li\"),$=document.createElement(\"small\");$.style.color=\"#ccc\",$.textContent=\"Use arrow keys to navigate, ENTER to select\",b.appendChild($),s.appendChild(b),n.appendChild(s),n.style.display=\"block\",void 0!==a&&void 0!==r&&function e(t,a){let r=document.getElementById(\"xpath-panel\");if(!r)return;let n=r.getBoundingClientRect(),i=window.innerWidth,l=window.innerHeight,o=t+20,d=a+20;o+n.width>i&&(o=t-n.width-20),d+n.height>l&&(d=a-n.height-20),o=Math.max(10,Math.min(o,i-n.width-10)),d=Math.max(10,Math.min(d,l-n.height-10)),r.style.left=o+\"px\",r.style.top=d+\"px\",r.style.right=\"auto\"}(a,r)}(e,a,r),function e(t){if(!n||!t)return;let a=\"\";if(t.getAttribute(\"aria-label\"))a=t.getAttribute(\"aria-label\");else if(t.getAttribute(\"aria-labelledby\")){let r=t.getAttribute(\"aria-labelledby\"),i=document.getElementById(r);i&&(a=i.textContent.trim())}else t.alt?a=t.alt:t.title?a=t.title:(a=t.textContent.trim()).length>100&&(a=a.substring(0,100)+\"...\");!a&&(a=`${t.tagName.toLowerCase()} element`,t.id?a+=` with id \"${t.id}\"`:t.className&&(a+=` with class \"${t.className.split(\" \")[0]}\"`)),n.textContent=`Selected: ${a}`}(e))}function d(e){var t;let a=(t=e).replace(/<!--[\\s\\S]*?-->/g,\"\");a=a.replace(/>\\s+</g,\"><\").replace(/\\s+/g,\" \").trim();let r=\"\",n=0,i=a.split(/(<\\/?[^>]+>)/);for(let l=0;l<i.length;l++){let o=i[l].trim();if(o){if(o.startsWith(\"</\"))n--,r+=\" \".repeat(Math.max(0,n))+o+\"\\n\";else if(o.startsWith(\"<\")){r+=\" \".repeat(n)+o;let d=o.endsWith(\"/>\")||/^<(area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)\\b/i.test(o);!d&&n++,r+=\"\\n\"}else o.length>0&&(r+=\" \".repeat(n)+o+\"\\n\")}}return r.trim()}function s(){t&&(t.classList.remove(\"current-selection\"),t=null),n&&n.parentNode&&(n.parentNode.removeChild(n),n=null);let e=document.getElementById(\"xpath-panel\");e&&e.remove();let a=document.getElementById(\"decrapulator-selection-style\");a&&a.remove(),document.removeEventListener(\"mousemove\",m,!0),document.removeEventListener(\"mouseout\",h,!0),document.removeEventListener(\"click\",f,!0),document.removeEventListener(\"keydown\",u,!0),document.body.style.cursor=\"\"}let c=\"\";function p(){let a=t;if(!a||\"xpath-panel\"===a.id||a===document.head||a.closest(\"head\"))return;n&&(n.textContent=\"Element selected and processing...\"),c=a.outerHTML;let o=function t(a){let r=a.cloneNode(!0),n=new Set,i=[\"for\",\"aria-labelledby\",\"aria-describedby\",\"aria-controls\",\"aria-owns\",\"aria-activedescendant\"];return!function e(t){1===t.nodeType&&(i.forEach(e=>{let a=t.getAttribute(e);if(a){let r=a.trim().split(/\\s+/);r.forEach(e=>{e&&n.add(e)})}}),[...t.childNodes].forEach(t=>{e(t)}))}(r),!function t(a){if(1===a.nodeType){if(\"style\"===a.tagName.toLowerCase()){a.remove();return}if(\"svg\"===a.tagName.toLowerCase()){for(;a.firstChild;)a.removeChild(a.firstChild);a.appendChild(document.createTextNode(\"...\"));let r=[...a.attributes];r.forEach(t=>{let r=t.name.toLowerCase(),i=e.includes(r);\"id\"===r&&(i=n.has(t.value)),i||a.removeAttribute(t.name)});return}if(a.getAttribute(\"src\")){let i=a.getAttribute(\"src\");i.length>50&&a.setAttribute(\"src\",i.substring(0,50)+\"...\")}if(a.getAttribute(\"href\")){let l=a.getAttribute(\"href\");l.length>50&&a.setAttribute(\"href\",l.substring(0,50)+\"...\")}let o=[...a.attributes];o.forEach(t=>{let r=t.name.toLowerCase(),i=e.includes(r);\"id\"===r&&(i=n.has(t.value)),\"type\"===r&&\"input\"===a.tagName.toLowerCase()&&(i=!0),i||a.removeAttribute(t.name)}),[...a.childNodes].forEach(e=>{t(e)})}}(r),r}(a);!function e(t){s(),function e(){let t=document.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), details, summary, iframe, object, embed, area[href], audio[controls], video[controls]');r=[],t.forEach(e=>{let t=e.hasAttribute(\"tabindex\")?e.getAttribute(\"tabindex\"):null;r.push({element:e,originalTabIndex:t}),e.setAttribute(\"tabindex\",\"-1\")})}();let a=document.createElement(\"div\");a.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 10001;`;let n=a.attachShadow({mode:\"closed\"}),o=document.createElement(\"style\");o.textContent=`:host {all: initial;}.overlay {position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background: rgba(0, 0, 0, 0.5);display: flex;align-items: center;justify-content: center;z-index: 10001;}.dialog * {color:white;}.dialog {font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;background: #332726;border: 2px solid #333;border-radius: 10px;padding: 20px;max-width: 80vw;max-height: 80vh;box-shadow: 0 4px 20px rgba(0,0,0,0.3);display: flex;flex-direction: column;}.title {margin: 0 0 10px 0;font-family: Arial, sans-serif;font-size: 18px;font-weight: bold;}.textarea {width: 600px;height: 400px;font-family: 'Courier New', monospace;font-size: 12px;border: 1px solid #ccc;padding: 10px;resize: both;box-sizing: border-box;line-height:1.5;color:#332726;}textarea::selection {background:#1a1413;color:white;}.button-container {display: flex;gap: 10px;margin-top: 10px;}.button {padding: 8px 2em;background: #333;color: white;border: 2px solid white;border-radius: 5px;cursor: pointer;font-family: Arial, sans-serif;position:relative;}.button:hover {background: #555;}.button:focus {outline: 2px solid #007acc;outline-offset: 2px;}.button[aria-pressed=true] {background:#7e082b;}.button[aria-pressed=true]:before {position:absolute;left:0.6em;top:0;transform:translateY(50%);content:\"✓\";}#decrap-link {padding:0.5em 0;}strong#xpath-label {color:yellow!important}strong#tag-label {color:yellow!important}strong#html-label {color:yellow!important}`;let p=document.createElement(\"div\");p.className=\"overlay\";let u=document.createElement(\"div\");u.className=\"dialog\",u.setAttribute(\"role\",\"dialog\"),u.setAttribute(\"aria-modal\",\"true\");let m=document.createElement(\"h3\");m.className=\"title\",m.setAttribute(\"id\",\"decrapulator-dialog\"),m.textContent=\"Here's your 1-Click De-crapulated HTML Output\",u.setAttribute(\"aria-labelledby\",\"decrapulator-dialog\");let h=document.createElement(\"textarea\");h.className=\"textarea\",h.setAttribute(\"aria-labelledby\",\"decrapulator-dialog\");let f=document.createElement(\"textarea\");f.className=\"textarea\",f.setAttribute(\"aria-label\",\"Original source markup\"),f.setAttribute(\"hidden\",\"hidden\"),function e(t){function a(e){let t=e.tagName.toLowerCase();if(\"div\"!==t&&\"span\"!==t)return!1;let r=e.textContent.trim();if(r.length>0)return!1;let n=!1;for(let i of e.children){let l=i.tagName.toLowerCase();if(\"div\"!==l&&\"span\"!==l||!a(i)){n=!0;break}}return!n}return function e(t){let r=Array.from(t.children);for(let n of r)e(n);let i=Array.from(t.children);for(let l of i)a(l)&&t.removeChild(l)}(t),t}(t);let b=d(t.outerHTML),$=[\"Simplified HTML (with some attributes/features removed for clarity):\",\"\",\"```html\",b,\"```\"].join(\"\\n\");try{h.value=$}catch(g){h.textContent=$}let x=document.createElement(\"div\");x.setAttribute(\"id\",\"decrap-link\");let y=document.createElement(\"a\");y.textContent=\"Visit the full-fat (ugh) De-crapulator\",y.setAttribute(\"href\",\"https://a11y-tools.com/markup-de-crapulator/\"),x.appendChild(y);let v=document.createElement(\"div\");v.className=\"button-container\";let C=document.createElement(\"button\");C.className=\"button\",C.textContent=\"Close\";let E=document.createElement(\"button\");E.className=\"button\",E.textContent=\"Pick again\";let w=document.createElement(\"button\");w.className=\"button\",w.textContent=\"Flatten\";let _=document.createElement(\"button\");function A(){document.body.removeChild(a),document.removeEventListener(\"keydown\",N),i()}function N(e){\"Escape\"===e.key&&(e.preventDefault(),e.stopPropagation(),A())}_.className=\"button\",_.textContent=\"Show original\",_.setAttribute(\"aria-pressed\",\"false\"),u.appendChild(m),u.appendChild(h),u.appendChild(f),u.appendChild(x),v.appendChild(C),v.appendChild(E),v.appendChild(w),v.appendChild(_),u.appendChild(v),p.appendChild(u),n.appendChild(o),n.appendChild(p),document.body.appendChild(a),document.addEventListener(\"keydown\",N),C.onclick=A,E.onclick=function e(){document.body.removeChild(a),document.removeEventListener(\"keydown\",N),i(),l()},w.onclick=function e(){let a=t.cloneNode(!0);!function e(t){function a(e){let t=e.tagName.toLowerCase();if(\"div\"!==t&&\"span\"!==t||e.attributes.length>0)return!1;let a=Array.from(e.children),r=!1;for(let n of e.childNodes)if(n.nodeType===Node.TEXT_NODE&&n.textContent.trim().length>0){r=!0;break}return(!r||!(a.length>0))&&1===a.length}return function e(t){let r=Array.from(t.children);for(let n of r)e(n);let i=Array.from(t.children);for(let l of i)if(a(l)){let o=l.children[0];t.replaceChild(o,l),e(t);break}}(t),t}(a);let r=d(a.outerHTML),n=[\"Simplified HTML (with some attributes/features removed for clarity):\",\"\",\"```html\",r,\"```\"].join(\"\\n\");try{h.value=n}catch(i){h.textContent=n}h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10),w.disabled=!0,w.textContent=\"Flattened\",w.style.opacity=\"0.6\",w.style.cursor=\"default\"},_.onclick=function e(){let t=d(c),a=[\"Original markup (indented):\",\"\",\"```html\",t,\"```\"].join(\"\\n\");try{f.value=a}catch(r){f.textContent=a}\"false\"===_.getAttribute(\"aria-pressed\")?(h.setAttribute(\"hidden\",\"hidden\"),f.removeAttribute(\"hidden\"),_.setAttribute(\"aria-pressed\",\"true\"),f.focus(),f.select(),setTimeout(()=>{f.scrollTop=0},10)):(f.setAttribute(\"hidden\",\"hidden\"),h.removeAttribute(\"hidden\"),_.setAttribute(\"aria-pressed\",\"false\"),h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10))},p.onclick=e=>{e.target===p&&A()},h.focus(),h.select(),setTimeout(()=>{h.scrollTop=0},10)}(o)}function u(e){if(\"Escape\"===e.key){e.preventDefault(),e.stopPropagation(),s(),n&&(n.textContent=\"Element selection cancelled.\");return}if(t){if(\"Enter\"===e.key){e.preventDefault(),e.stopPropagation(),p();return}if([\"ArrowUp\",\"ArrowDown\",\"ArrowLeft\",\"ArrowRight\"].includes(e.key)){switch(e.preventDefault(),e.stopPropagation(),a=!0,e.key){case\"ArrowUp\":!function e(){if(!t||!t.parentElement)return;let a=t.parentElement;(a!==document.body&&a!==document.documentElement||t!==document.body)&&o(a)}();break;case\"ArrowDown\":!function e(){if(!t)return;let a=function e(t){let a=t.firstChild;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}(t);a&&o(a)}();break;case\"ArrowLeft\":!function e(){if(!t)return;let a=function e(t){let a=t.previousSibling;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.previousSibling;return a}(t);a&&o(a)}();break;case\"ArrowRight\":!function e(){if(!t)return;let a=function e(t){let a=t.nextSibling;for(;a&&a.nodeType!==Node.ELEMENT_NODE;)a=a.nextSibling;return a}(t);a&&o(a)}()}setTimeout(()=>{a=!1},100)}}}function m(e){if(a)return;let t=e.target;\"xpath-panel\"!==t.id&&o(t,e.clientX,e.clientY)}function h(e){if(!a&&t===e.target){t&&(t.classList.remove(\"current-selection\"),t=null);let r=document.getElementById(\"xpath-panel\");r&&(r.style.display=\"none\"),n&&(n.textContent=\"\")}}function f(e){e.preventDefault(),e.stopPropagation(),p()}l()}()})()","description":"Click on any part of a web page, get the basic HTML with all the bloaty crap removed!","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"A11y-tools.com: Hidden content.json-0-2","name":"Blackout","description":"Redacts all parts of a page that will be hidden to AT users.","language":"javascript","executionMode":"activate","content":"(function(){function processAriaHiddenElements(){let e={FOCUSABLE_TAGS:[\"a\",\"button\",\"input\",\"select\",\"textarea\",\"video\",\"audio\"],PULSE_ANIMATION_ID:\"pulse-outline-styles\",PULSE_CLASS:\"pulse-outline\",DEFAULT_PULSE_COLOR:\"red\"};!function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"blackoutStyles\"),t.textContent=`.a11y-tools-blackout {background:black!important;color:black!important;opacity:1!important;outline:5px solid black!important;}`,document.head.appendChild(t)}(),document.addEventListener(\"keydown\",function(e){\"q\"===e.key&&(e.preventDefault(),function e(){let t=document.querySelectorAll(\".a11y-tools-blackout\");Array.from(t).forEach(e=>{e.classList.remove(\"a11y-tools-blackout\"),e.classList.remove(\"pulse-outline\")});let o=document.querySelector(\"#blackoutStyles\");o&&o.remove()}())}),function t(){let o=document.querySelectorAll('[aria-hidden=\"true\"]');({create(e,t){let o=document.getElementById(e);o&&o.remove();let l=document.createElement(\"style\");return l.type=\"text/css\",l.id=e,l.textContent=t,document.head.appendChild(l),l},remove(e){let t=document.getElementById(e);t&&t.remove()}}).create(e.PULSE_ANIMATION_ID,`@keyframes pulse-outline {0%, 100% { outline-width: 2px; outline-offset: 0px; }50% { outline-width: 5px; outline-offset: 5px; }}.${e.PULSE_CLASS} {outline: 2px solid red!important;outline-offset: 0px;outline-color: red;animation: pulse-outline 5s ease-in-out infinite;}.${e.PULSE_CLASS}:hover {animation-play-state: paused;}`),o.forEach(t=>{var o;(function e(t){t.classList.add(\"a11y-tools-blackout\")})(t),o=t,(e.FOCUSABLE_TAGS.includes(o.tagName.toLowerCase())||o.tabIndex>0||0===o.tabIndex)&&(t.classList.add(e.PULSE_CLASS),console.warn(\"Focusable Aria-Hidden Element:\",t))})}()}processAriaHiddenElements()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Content"],"folderName":"Hidden content","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Hidden content.json","download":{"name":"Blackout","language":"javascript","executionMode":"activate","content":"(function(){function processAriaHiddenElements(){let e={FOCUSABLE_TAGS:[\"a\",\"button\",\"input\",\"select\",\"textarea\",\"video\",\"audio\"],PULSE_ANIMATION_ID:\"pulse-outline-styles\",PULSE_CLASS:\"pulse-outline\",DEFAULT_PULSE_COLOR:\"red\"};!function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"blackoutStyles\"),t.textContent=`.a11y-tools-blackout {background:black!important;color:black!important;opacity:1!important;outline:5px solid black!important;}`,document.head.appendChild(t)}(),document.addEventListener(\"keydown\",function(e){\"q\"===e.key&&(e.preventDefault(),function e(){let t=document.querySelectorAll(\".a11y-tools-blackout\");Array.from(t).forEach(e=>{e.classList.remove(\"a11y-tools-blackout\"),e.classList.remove(\"pulse-outline\")});let o=document.querySelector(\"#blackoutStyles\");o&&o.remove()}())}),function t(){let o=document.querySelectorAll('[aria-hidden=\"true\"]');({create(e,t){let o=document.getElementById(e);o&&o.remove();let l=document.createElement(\"style\");return l.type=\"text/css\",l.id=e,l.textContent=t,document.head.appendChild(l),l},remove(e){let t=document.getElementById(e);t&&t.remove()}}).create(e.PULSE_ANIMATION_ID,`@keyframes pulse-outline {0%, 100% { outline-width: 2px; outline-offset: 0px; }50% { outline-width: 5px; outline-offset: 5px; }}.${e.PULSE_CLASS} {outline: 2px solid red!important;outline-offset: 0px;outline-color: red;animation: pulse-outline 5s ease-in-out infinite;}.${e.PULSE_CLASS}:hover {animation-play-state: paused;}`),o.forEach(t=>{var o;(function e(t){t.classList.add(\"a11y-tools-blackout\")})(t),o=t,(e.FOCUSABLE_TAGS.includes(o.tagName.toLowerCase())||o.tabIndex>0||0===o.tabIndex)&&(t.classList.add(e.PULSE_CLASS),console.warn(\"Focusable Aria-Hidden Element:\",t))})}()}processAriaHiddenElements()})()","description":"Redacts all parts of a page that will be hidden to AT users.","author":"Ian Lloyd","categories":["Accessibility","Content"]}}

{"id":"A11y-tools.com: Hidden content.json-0-0","name":"Check New Window Links","description":"Finds links that open in new window with warning.","language":"javascript","executionMode":"activate","content":"(function(){function checkNewWindowLinks(){function e(e,t){let n=window.getComputedStyle(e,t),i=n.getPropertyValue(\"content\");return\"none\"===i||\"\"===i?null:i.replace(/['\"]/g,\"\")}function t(t){let n=\"\",i=e(t,\"::before\"),o=e(t,\"::after\");i&&(n+=i+\" \");let r=t.querySelector('svg[role=\"img\"]');r&&r.hasAttribute(\"aria-label\")&&(n+=r.getAttribute(\"aria-label\")+\" \");let a=t.querySelector('svg[role=\"img\"] title');if(a&&(n+=a.textContent+\" \"),t.hasAttribute(\"aria-label\")&&(n+=t.getAttribute(\"aria-label\")+\" \"),t.hasAttribute(\"aria-labelledby\")){let l=t.getAttribute(\"aria-labelledby\").split(\" \"),s=l.map(e=>document.getElementById(e)?.textContent||\"\").join(\" \");s&&(n+=s+\" \")}let d=t.querySelectorAll(\".visually-hidden, .sr-only\");d.forEach(e=>{n+=e.textContent+\" \"});let p=document.createTreeWalker(t,NodeFilter.SHOW_TEXT,{acceptNode:function(e){return e.parentElement.closest(\"svg\")||e.parentElement.classList.contains(\"visually-hidden\")||e.parentElement.classList.contains(\"sr-only\")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT}});for(;p.nextNode();)n+=p.currentNode.textContent+\" \";let c=t.querySelectorAll(\"img\");return c.forEach(e=>{e.hasAttribute(\"alt\")&&(n+=e.getAttribute(\"alt\")+\" \")}),o&&(n+=o+\" \"),n.trim()}function n(e,t){let n=e=>e.toLowerCase().replace(/\\s+/g,\" \").trim(),i=n(e),o=[];for(let r of t){let a=n(r);if(i===a)continue;let l=[i,i.replace(\"oppens\",\"opens\"),i.replace(\"anew\",\"a new\"),i.replace(\"ttab\",\"tab\"),i.replace(/\\s+/g,\"\")],s=[a,a.replace(/\\s+/g,\"\")];for(let d of l)for(let p of s)if(d.includes(p)||p.includes(d)){o.push(r);break}}return o}function i(e,t){let n=e.toLowerCase();return!(n.includes(\"oppens\")||n.includes(\"anew\")||n.includes(\"ttab\"))&&t.some(e=>{let t=e.toLowerCase();return n===t||n.includes(t)})}function o(e){for(var t=e;t&&1!==t.nodeType;)t=t.parentNode;if(!t)return!1;var n=window.getComputedStyle(t);return\"none\"===n.display||\"hidden\"===n.visibility||\"0\"===n.opacity||t.hasAttribute(\"aria-hidden\")||\"0px\"===n.fontSize||\"-9999px\"===n.textIndent||\"transparent\"===n.color||\"absolute\"===n.position&&(\"rect(0px, 0px, 0px, 0px)\"===n.clip||\"inset(50%)\"===n.clipPath)||t.classList.contains(\"visually-hidden\")}(r=document.createElement(\"style\")).setAttribute(\"id\",\"appStyles\"),r.textContent=`.linkNewWindowNoWarning,.linkNewWindowGood,.linkNewWindowTitleHint,.linkNewWindowAlmostMatch {outline-offset:4px;}* .linkNewWindowNoWarning:before,* .linkNewWindowGood:before,* .linkNewWindowTitleHint:before,* .linkNewWindowAlmostMatch:before {color:white!important;padding:3px;display:inline-block;margin-right:5px;font-size:10px;}* .linkNewWindowNoWarning {outline:3px solid red!important;outline-color:red!important;}* .linkNewWindowNoWarning:before {background-color:red!important;content:\"BAD\"!important;}* .linkNewWindowGood {outline:3px solid green!important;outline-color:green!important;}* .linkNewWindowGood:before {background-color:green!important;content:\"GOOD\"!important;}* .linkNewWindowTitleHint {outline:3px dotted purple!important;outline-color:purple!important;}* .linkNewWindowTitleHint:before {background-color:purple!important;content:\"IN TITLE\"!important;}* .linkNewWindowAlmostMatch {outline:3px dashed red!important;outline-color:red!important;}* .linkNewWindowAlmostMatch:before {background-color:red!important;content:\"ALMOST\"!important;}`,document.head.appendChild(r);for(var r,a=0,l=0,s=[],d=[],p={en:[\"opens in a new window\",\"opens in new window\",\"open in a new window\",\"open in new window\",\"open - new window\",\"opens in new tab\",\"opens in a new tab\",\"new window\",\"external link\"],es:[\"se abre en una nueva ventana\",\"abre en nueva ventana\",\"nueva ventana\",\"enlace externo\"],fr:[\"s'ouvre dans une nouvelle fen\\xeatre\",\"nouvelle fen\\xeatre\",\"lien externe\"],de:[\"\\xf6ffnet in einem neuen fenster\",\"\\xf6ffnet sich in einem neuen fenster\",\"neues fenster\",\"externer link\"]},c=function e(){var t=document.documentElement.lang;if(t)return t.toLowerCase().split(\"-\")[0];var n=document.querySelector('meta[http-equiv=\"content-language\"]');return n?n.getAttribute(\"content\").toLowerCase().split(\"-\")[0]:\"en\"}(),u=document.querySelectorAll('a[target=\"_blank\"],a[target=\"_top\"]'),w=u.length,h=0;h<u.length;h++){var g=u[h],f=g.getAttribute(\"title\")||\"\";f.toLowerCase();var b=!1,m=!1,k=!1,v=\"\",N=p[c]?p[c].concat(p.en):p.en,y=t(g);if(i(y,N))b=!0,v=y;else{var x=n(y,N);x.length>0?(k=!0,d.push({text:y,similarTo:x,type:\"accessible name\"})):f&&i(f,N)&&(m=!0,v=f)}var W=g.getAttribute(\"title\")||\"\",A='Link has an accessible name of \"'+y+'\"';g.title=W?W+\". \"+A:A,b?(g.classList.add(\"linkNewWindowGood\"),-1===s.indexOf(v)&&s.push(v)):k?(g.classList.add(\"linkNewWindowAlmostMatch\"),a++):(m?(g.classList.add(\"linkNewWindowTitleHint\"),l++):g.classList.add(\"linkNewWindowNoWarning\"),a++)}if(0!==w){var $=\"en\"!==c?\"\\n\\nDocument language detected as: \"+c.toUpperCase()+\". Both \"+c.toUpperCase()+\" and EN phrases were checked.\":\"\\n\\nDocument language detected as: EN\",L=l>0?\"\\n\\n\"+l+\" links had the phrase in the title attribute only (highlighted in purple). These phrases may not be perceived by assistive technology users.\":\"\",C=s.length>0?\"\\n\\nMatched phrases found:\\n\"+s.join(\"\\n\"):\"\",T=\"\";if(d.length>0){T=\"\\n\\nPotential similar phrases found (not exact matches):\\n\";for(var E=0;E<d.length;E++){var S=d[E];T+='- \"'+S.text+'\" ('+S.type+\") similar to: \"+S.similarTo.join(\", \")+\"\\n\"}}alert(a+\" links found that open in new window but have no warning provided for assistive technology users (highlighted with red outline on page).\"+$+L+C+T)}else alert('No links have target=\"_blank\" on this page')}checkNewWindowLinks()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Content"],"folderName":"Hidden content","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Hidden content.json","download":{"name":"Check New Window Links","language":"javascript","executionMode":"activate","content":"(function(){function checkNewWindowLinks(){function e(e,t){let n=window.getComputedStyle(e,t),i=n.getPropertyValue(\"content\");return\"none\"===i||\"\"===i?null:i.replace(/['\"]/g,\"\")}function t(t){let n=\"\",i=e(t,\"::before\"),o=e(t,\"::after\");i&&(n+=i+\" \");let r=t.querySelector('svg[role=\"img\"]');r&&r.hasAttribute(\"aria-label\")&&(n+=r.getAttribute(\"aria-label\")+\" \");let a=t.querySelector('svg[role=\"img\"] title');if(a&&(n+=a.textContent+\" \"),t.hasAttribute(\"aria-label\")&&(n+=t.getAttribute(\"aria-label\")+\" \"),t.hasAttribute(\"aria-labelledby\")){let l=t.getAttribute(\"aria-labelledby\").split(\" \"),s=l.map(e=>document.getElementById(e)?.textContent||\"\").join(\" \");s&&(n+=s+\" \")}let d=t.querySelectorAll(\".visually-hidden, .sr-only\");d.forEach(e=>{n+=e.textContent+\" \"});let p=document.createTreeWalker(t,NodeFilter.SHOW_TEXT,{acceptNode:function(e){return e.parentElement.closest(\"svg\")||e.parentElement.classList.contains(\"visually-hidden\")||e.parentElement.classList.contains(\"sr-only\")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT}});for(;p.nextNode();)n+=p.currentNode.textContent+\" \";let c=t.querySelectorAll(\"img\");return c.forEach(e=>{e.hasAttribute(\"alt\")&&(n+=e.getAttribute(\"alt\")+\" \")}),o&&(n+=o+\" \"),n.trim()}function n(e,t){let n=e=>e.toLowerCase().replace(/\\s+/g,\" \").trim(),i=n(e),o=[];for(let r of t){let a=n(r);if(i===a)continue;let l=[i,i.replace(\"oppens\",\"opens\"),i.replace(\"anew\",\"a new\"),i.replace(\"ttab\",\"tab\"),i.replace(/\\s+/g,\"\")],s=[a,a.replace(/\\s+/g,\"\")];for(let d of l)for(let p of s)if(d.includes(p)||p.includes(d)){o.push(r);break}}return o}function i(e,t){let n=e.toLowerCase();return!(n.includes(\"oppens\")||n.includes(\"anew\")||n.includes(\"ttab\"))&&t.some(e=>{let t=e.toLowerCase();return n===t||n.includes(t)})}function o(e){for(var t=e;t&&1!==t.nodeType;)t=t.parentNode;if(!t)return!1;var n=window.getComputedStyle(t);return\"none\"===n.display||\"hidden\"===n.visibility||\"0\"===n.opacity||t.hasAttribute(\"aria-hidden\")||\"0px\"===n.fontSize||\"-9999px\"===n.textIndent||\"transparent\"===n.color||\"absolute\"===n.position&&(\"rect(0px, 0px, 0px, 0px)\"===n.clip||\"inset(50%)\"===n.clipPath)||t.classList.contains(\"visually-hidden\")}(r=document.createElement(\"style\")).setAttribute(\"id\",\"appStyles\"),r.textContent=`.linkNewWindowNoWarning,.linkNewWindowGood,.linkNewWindowTitleHint,.linkNewWindowAlmostMatch {outline-offset:4px;}* .linkNewWindowNoWarning:before,* .linkNewWindowGood:before,* .linkNewWindowTitleHint:before,* .linkNewWindowAlmostMatch:before {color:white!important;padding:3px;display:inline-block;margin-right:5px;font-size:10px;}* .linkNewWindowNoWarning {outline:3px solid red!important;outline-color:red!important;}* .linkNewWindowNoWarning:before {background-color:red!important;content:\"BAD\"!important;}* .linkNewWindowGood {outline:3px solid green!important;outline-color:green!important;}* .linkNewWindowGood:before {background-color:green!important;content:\"GOOD\"!important;}* .linkNewWindowTitleHint {outline:3px dotted purple!important;outline-color:purple!important;}* .linkNewWindowTitleHint:before {background-color:purple!important;content:\"IN TITLE\"!important;}* .linkNewWindowAlmostMatch {outline:3px dashed red!important;outline-color:red!important;}* .linkNewWindowAlmostMatch:before {background-color:red!important;content:\"ALMOST\"!important;}`,document.head.appendChild(r);for(var r,a=0,l=0,s=[],d=[],p={en:[\"opens in a new window\",\"opens in new window\",\"open in a new window\",\"open in new window\",\"open - new window\",\"opens in new tab\",\"opens in a new tab\",\"new window\",\"external link\"],es:[\"se abre en una nueva ventana\",\"abre en nueva ventana\",\"nueva ventana\",\"enlace externo\"],fr:[\"s'ouvre dans une nouvelle fen\\xeatre\",\"nouvelle fen\\xeatre\",\"lien externe\"],de:[\"\\xf6ffnet in einem neuen fenster\",\"\\xf6ffnet sich in einem neuen fenster\",\"neues fenster\",\"externer link\"]},c=function e(){var t=document.documentElement.lang;if(t)return t.toLowerCase().split(\"-\")[0];var n=document.querySelector('meta[http-equiv=\"content-language\"]');return n?n.getAttribute(\"content\").toLowerCase().split(\"-\")[0]:\"en\"}(),u=document.querySelectorAll('a[target=\"_blank\"],a[target=\"_top\"]'),w=u.length,h=0;h<u.length;h++){var g=u[h],f=g.getAttribute(\"title\")||\"\";f.toLowerCase();var b=!1,m=!1,k=!1,v=\"\",N=p[c]?p[c].concat(p.en):p.en,y=t(g);if(i(y,N))b=!0,v=y;else{var x=n(y,N);x.length>0?(k=!0,d.push({text:y,similarTo:x,type:\"accessible name\"})):f&&i(f,N)&&(m=!0,v=f)}var W=g.getAttribute(\"title\")||\"\",A='Link has an accessible name of \"'+y+'\"';g.title=W?W+\". \"+A:A,b?(g.classList.add(\"linkNewWindowGood\"),-1===s.indexOf(v)&&s.push(v)):k?(g.classList.add(\"linkNewWindowAlmostMatch\"),a++):(m?(g.classList.add(\"linkNewWindowTitleHint\"),l++):g.classList.add(\"linkNewWindowNoWarning\"),a++)}if(0!==w){var $=\"en\"!==c?\"\\n\\nDocument language detected as: \"+c.toUpperCase()+\". Both \"+c.toUpperCase()+\" and EN phrases were checked.\":\"\\n\\nDocument language detected as: EN\",L=l>0?\"\\n\\n\"+l+\" links had the phrase in the title attribute only (highlighted in purple). These phrases may not be perceived by assistive technology users.\":\"\",C=s.length>0?\"\\n\\nMatched phrases found:\\n\"+s.join(\"\\n\"):\"\",T=\"\";if(d.length>0){T=\"\\n\\nPotential similar phrases found (not exact matches):\\n\";for(var E=0;E<d.length;E++){var S=d[E];T+='- \"'+S.text+'\" ('+S.type+\") similar to: \"+S.similarTo.join(\", \")+\"\\n\"}}alert(a+\" links found that open in new window but have no warning provided for assistive technology users (highlighted with red outline on page).\"+$+L+C+T)}else alert('No links have target=\"_blank\" on this page')}checkNewWindowLinks()})()","description":"Finds links that open in new window with warning.","author":"Ian Lloyd","categories":["Accessibility","Content"]}}

{"id":"Alwaystwisted.com: Component Checker.json-0-0","name":"Component Checker","description":"Identify which elements use your design system classes","language":"javascript","executionMode":"activate","content":"/*Edit this prefix to the prefix used by your own design system */\nconst PREFIX = \"vf-\";\n\n(function(){const prefix=PREFIX;if(prefix===null||prefix===''){return;}const elementsWithPrefix=document.querySelectorAll('*[class*=\\''+prefix+'\\']');const allElements=document.querySelectorAll('*');elementsWithPrefix.forEach(el=>{el.style.outline='2px solid green';el.style.position='relative';});allElements.forEach(el=>{if(![...el.classList].some(cls=>cls.startsWith(prefix))){el.style.outline='4px solid red';el.style.position='relative';}});})();","author":"Stuart Robson","authorUrl":"https://www.alwaystwisted.com","categories":["Design systems"],"folderName":null,"folderDescription":null,"sourceFile":"Alwaystwisted.com: Component Checker.json","download":{"name":"Component Checker","language":"javascript","executionMode":"activate","content":"/*Edit this prefix to the prefix used by your own design system */\nconst PREFIX = \"vf-\";\n\n(function(){const prefix=PREFIX;if(prefix===null||prefix===''){return;}const elementsWithPrefix=document.querySelectorAll('*[class*=\\''+prefix+'\\']');const allElements=document.querySelectorAll('*');elementsWithPrefix.forEach(el=>{el.style.outline='2px solid green';el.style.position='relative';});allElements.forEach(el=>{if(![...el.classList].some(cls=>cls.startsWith(prefix))){el.style.outline='4px solid red';el.style.position='relative';}});})();","description":"Identify which elements use your design system classes","author":"Stuart Robson","categories":["Design systems"]}}

{"id":"A11y-tools.com: Diagnostics.json-0-0","name":"Element Inspector","description":"Hover over any element and get a super simple summary of its tagname, role, accessible name and XPATH.","language":"javascript","executionMode":"activate","content":"(function(){function elementInspector(){!function e(){let t=document.createElement(\"style\");t.textContent=`#element-inspector-panel {position: absolute;background-color: rgba(0, 0, 0, 0.9);outline:4px solid rgba(255, 255, 255, 0.9);;color: #ffffff;border-radius: 4px;padding: 8px 12px;font-family: monospace;font-size: 16px;line-height: 1.5;z-index: 10000;pointer-events: none;max-width: 500px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);display: none;}#element-inspector-panel dl,#element-inspector-panel dd,#element-inspector-panel dt {padding:0;margin:0;}#element-inspector-panel dd {margin-bottom:0.5em;}#element-inspector-panel dt {font-weight:bold;}#element-inspector-panel dd {padding-left:1em;overflow-wrap:anywhere;}#element-inspector-highlight{position: absolute;border: 2px solid #ff6700;background-color: rgba(255, 103, 0, 0.2);pointer-events: none;z-index: 9999;display: none;}#element-inspector-panel .HTML-el {color:orange;}#element-inspector-panel .aria-attribs {color:yellow;}#element-inspector-panel .role {color:#e98cef;}#element-inspector-panel .accname {color:#FF8B5D;}#element-inspector-panel .focusable {color:white;}#element-inspector-panel .xpath {color:lime;}#inspector-notification {position: fixed;top: 10px;right: 10px;background-color: rgba(0, 0, 0, 0.7);color: white;padding: 8px 12px;border-radius: 4px;font-family: sans-serif;font-size: 16px;z-index: 10001;transition: opacity 0.5s;}`,document.head.appendChild(t)}();let e=()=>{let e=document.createElement(\"div\");return e.id=\"element-inspector-panel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},t=e=>{try{let t={name:\"\",source:\"\"};if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"aria-labelledby\")){let n=e.getAttribute(\"aria-labelledby\").split(/\\s+/),l=[];for(let i of n){let a=document.getElementById(i);a&&l.push(a.textContent.trim())}if(l.length>0)return t.name=l.join(\" \"),t.source=\"aria-labelledby\",t}let o=\"svg\"===e.tagName.toLowerCase()?e:e.closest(\"svg\");if(o){if(e!==o){if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"aria-labelledby\")){let s=e.getAttribute(\"aria-labelledby\").split(/\\s+/),c=[];for(let d of s){let u=document.getElementById(d);u&&c.push(u.textContent.trim())}if(c.length>0)return t.name=c.join(\" \"),t.source=\"aria-labelledby\",t}let p=Array.from(e.children).find(e=>\"title\"===e.tagName.toLowerCase());if(p&&p.textContent.trim())return t.name=p.textContent.trim(),t.source=\"SVG <title> (child)\",t}let g=o.querySelector(\"title\");if(g&&g.textContent.trim())return t.name=g.textContent.trim(),t.source=\"SVG <title>\",t;let m=o.querySelector(\"desc\");if(m&&m.textContent.trim())return t.name=m.textContent.trim(),t.source=\"SVG <desc>\",t}if(\"IMG\"===e.tagName&&e.hasAttribute(\"alt\"))return t.name=e.getAttribute(\"alt\"),t.source=\"alt\",t;if(\"BUTTON\"===e.tagName||\"A\"===e.tagName){let h=e.querySelectorAll(\"svg\");if(h.length>0)for(let f of h){let b=f.querySelector(\"title\");if(b&&b.textContent.trim())return t.name=b.textContent.trim(),t.source=\"SVG <title> (child element)\",t;if(f.hasAttribute(\"aria-label\"))return t.name=f.getAttribute(\"aria-label\"),t.source=\"SVG aria-label (child element)\",t}let $=e.querySelectorAll(\"img[alt]\");if($.length>0)for(let y of $){let E=y.getAttribute(\"alt\");if(E&&\"\"!==E.trim())return t.name=E,t.source=\"img alt (child element)\",t}if(\"\"===e.textContent.trim()){if(h.length>0)return t.name=\"Unlabeled SVG\",t.source=\"missing SVG label\",t;let x=e.querySelectorAll(\"img\");if(x.length>0)return t.name=\"Unlabeled image\",t.source=\"missing image alt\",t}let A=e.textContent.trim();if(A)return t.name=A,t.source=\"text content\",t}if(\"CANVAS\"===e.tagName&&e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(\"INPUT\"===e.tagName||\"TEXTAREA\"===e.tagName||\"SELECT\"===e.tagName){if(e.id){let N=document.querySelector(`label[for=\"${e.id}\"]`);if(N)return t.name=N.textContent,t.source=\"label element\",t}if(e.placeholder)return t.name=e.placeholder,t.source=\"placeholder\",t}if(e.title)return t.name=e.title,t.source=\"title\",t;if(\"img\"===e.getAttribute(\"role\")){if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"alt\"))return t.name=e.getAttribute(\"alt\"),t.source=\"alt\",t}if(\"FIGURE\"===e.tagName){let T=e.querySelector(\"figcaption\");if(T)return t.name=T.textContent.trim(),t.source=\"figcaption\",t}return t.name=r(e),t.name?t.source=\"text content\":(t.name=\"No accessible name\",t.source=\"\"),t}catch(C){return console.warn(\"Error getting accessible name:\",C),{name:\"Error retrieving name\",source:\"\"}}},r=e=>{try{if(0===e.childNodes.length||1===e.childNodes.length&&e.childNodes[0].nodeType===Node.TEXT_NODE)return e.textContent.trim();let t=\"\",n=!1;for(let l=0;l<e.childNodes.length;l++){let i=e.childNodes[l];if(i.nodeType===Node.TEXT_NODE){let a=i.textContent.trim();a&&(n&&t.length>0&&(t+=\" \"),t+=a,n=!0)}else if(i.nodeType===Node.ELEMENT_NODE){let o=window.getComputedStyle(i),s=\"block\"===o.display||\"flex\"===o.display||\"grid\"===o.display,c=r(i);c?((s||\"LI\"===i.tagName)&&t.length>0&&(t+=\" \"),t+=c,s&&l<e.childNodes.length-1&&(t+=\" \"),n=!0):n=!1}}return t.trim().replace(/\\s+/g,\" \")}catch(d){return console.warn(\"Error getting formatted text content:\",d),e.textContent.trim()}},n=e=>{try{if(e.hasAttribute(\"tabindex\"))return parseInt(e.getAttribute(\"tabindex\"))>=0;return[\"A\",\"BUTTON\",\"INPUT\",\"SELECT\",\"TEXTAREA\",\"DETAILS\",\"SUMMARY\",\"IFRAME\",\"OBJECT\",\"EMBED\",\"AUDIO\",\"VIDEO\"].includes(e.tagName)&&!e.disabled&&\"none\"!==e.style.display&&\"hidden\"!==e.style.visibility}catch(t){return console.warn(\"Error checking focusability:\",t),!1}};function l(e){let t=e.match(/\\d+/g);return t?3===t.length?\"#\"+t.map(e=>{let t=parseInt(e).toString(16);return 1===t.length?\"0\"+t:t}).join(\"\"):4===t.length?\"#\"+t.slice(0,3).map(e=>{let t=parseInt(e).toString(16);return 1===t.length?\"0\"+t:t}).join(\"\"):null:null}function i(e){let t=/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(e);if(!t)return 0;let[r,n,l]=[parseInt(t[1],16)/255,parseInt(t[2],16)/255,parseInt(t[3],16)/255],i=[r,n,l].map(e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return .2126*i[0]+.7152*i[1]+.0722*i[2]}function a(e){try{let t=window.getComputedStyle(e),r=t.color,n=t.backgroundColor,a=l(r),o=l(n),s=[];if(a&&o){let c=function e(t,r){let n=i(t),l=i(r);return(Math.max(n,l)+.05)/(Math.min(n,l)+.05)}(a,o);s.push({type:\"Text Contrast\",colors:`${r} on ${n}`,ratio:c.toFixed(2),passed:c>=4.5?\"✅ WCAG AA\":\"❌ WCAG Fail\"})}let d=t.borderColor;return l(d),s}catch(u){return console.warn(\"Error checking color contrast:\",u),[]}}let o=e=>{try{if(e.hasAttribute(\"role\"))return e.getAttribute(\"role\");let t={A:(()=>{let t=e.hasAttribute(\"href\")&&(\"_blank\"===e.getAttribute(\"target\")||\"_new\"===e.getAttribute(\"target\")),r=e.hasAttribute(\"href\")?\"link\":\"generic\";return t?`${r} (opens in new window)`:r})(),ARTICLE:\"article\",ASIDE:\"complementary\",BUTTON:\"button\",DETAILS:\"group\",DIALOG:\"dialog\",DIV:\"generic\",FOOTER:\"contentinfo\",FORM:\"form\",H1:\"heading\",H2:\"heading\",H3:\"heading\",H4:\"heading\",H5:\"heading\",H6:\"heading\",HEADER:\"banner\",IMG:e.hasAttribute(\"alt\")&&\"\"===e.getAttribute(\"alt\")?\"presentation\":\"img\",INPUT:(()=>{let t=e.type&&e.type.toLowerCase();switch(t){case\"button\":case\"submit\":case\"reset\":return\"button\";case\"checkbox\":return\"checkbox\";case\"radio\":return\"radio\";case\"range\":return\"slider\";case\"search\":return\"searchbox\";default:return\"textbox\"}})(),LI:\"listitem\",MAIN:\"main\",NAV:\"navigation\",OL:\"list\",OPTION:\"option\",PROGRESS:\"progressbar\",SECTION:\"region\",SELECT:\"combobox\",TABLE:\"table\",TEXTAREA:\"textbox\",UL:\"list\"};return t[e.tagName]||\"generic\"}catch(r){return console.warn(\"Error getting element role:\",r),\"generic\"}},s=e=>{try{let t=e.attributes,r=[];for(let n=0;n<t.length;n++){let l=t[n];l.name.startsWith(\"aria-\")&&r.push(`${l.name}=\"${l.value}\"`)}return r}catch(i){return console.warn(\"Error getting ARIA attributes:\",i),[]}},c=e=>{try{if(!e)return\"\";if(\"HTML\"===e.tagName)return\"/HTML[1]\";if(e===document.body)return\"/HTML[1]/BODY[1]\";let t=0,r=e.parentNode.childNodes;for(let n=0;n<r.length;n++){let l=r[n];if(l===e)return c(e.parentNode)+\"/\"+e.tagName+\"[\"+(t+1)+\"]\";1===l.nodeType&&l.tagName===e.tagName&&t++}return\"\"}catch(i){return console.warn(\"Error getting XPath:\",i),\"Error retrieving XPath\"}},d=e=>{try{if(!e||!h(e)){console.warn(\"No valid element selected for logging\");return}console.group(\"Element Details\"),console.log(\"XPATH:\",c(e)),console.log(\"outerHTML:\",e.outerHTML),console.groupEnd();let t=document.createElement(\"div\");t.id=\"inspector-notification\",t.setAttribute(\"role\",\"status\"),document.body.appendChild(t),setTimeout(function e(){t.textContent=\"Element details logged to console\"},500),setTimeout(()=>{t.style.opacity=\"0\",setTimeout(()=>{t&&t.parentNode&&t.parentNode.removeChild(t)},500)},2e3)}catch(r){console.warn(\"Error logging element details:\",r)}},u=null,p=null,g=()=>{let e=document.createElement(\"div\");return e.id=\"element-inspector-highlight\",document.body.appendChild(e),e},m=()=>{try{if(!u||!p)return;let e=u.getBoundingClientRect();p.style.left=`${window.scrollX+e.left}px`,p.style.top=`${window.scrollY+e.top}px`,p.style.width=`${e.width}px`,p.style.height=`${e.height}px`,p.style.display=\"block\"}catch(t){console.warn(\"Error updating highlight:\",t),p&&(p.style.display=\"none\")}},h=e=>{try{return e&&1===e.nodeType&&e.tagName&&\"element-inspector-panel\"!==e.id&&\"element-inspector-highlight\"!==e.id&&\"inspector-notification\"!==e.id}catch(t){return!1}},f=e=>{try{let r=document.getElementById(\"element-inspector-panel\");if(!r||!e||!h(e))return;u=e,m();let l=o(e),i=t(e),a=i.name,d=i.source,p=n(e),g=c(e),f=s(e),b=`<dl><dt class=\"HTML-el\">Element:</dt> <dd class=\"HTML-el\">&lt;${e.tagName.toLowerCase()}&gt;</dd><dt class=\"role\">Role:</dt> <dd class=\"role\">${l}</dd>`;d?b+=`<dt class=\"accname\">Accessible Name (from ${d}):</dt> <dd class=\"accname\">${a.substring(0,200)}${a.length>200?\"...\":\"\"}</dd>`:b+=`<dt class=\"accname\">Accessible Name:</dt> <dd class=\"accname\">${a.substring(0,200)}${a.length>200?\"...\":\"\"}</dd>`,b+=`<dt class=\"focusable\">Keyboard Focusable:</dt> <dd class=\"focusable\">${p?\"✅ Yes\":\"❌ No\"}</dd>`,b+=`<dt class=\"xpath\">XPath:</dt> <dd class=\"xpath\">${g}</dd>`,f.length>0&&(b+='<dt class=\"aria-attribs\">ARIA Attributes:</dt>',b+='<dd class=\"aria-attribs\">',b+='<ul style=\"margin: 0; padding-left: 16px;\">',f.forEach(e=>{b+=`<li>${e}</li>`}),b+=\"</ul>\",b+=\"</dd>\"),b+=\"</dl>\",r.innerHTML=b,r.style.display=\"block\";let $=window.innerWidth,y=window.innerHeight,E=e.getBoundingClientRect(),x=r.getBoundingClientRect(),A=x.width,N=x.height,T,C;T=E.right+10+A<=$?E.right+10:E.left-A-10>=0?E.left-A-10:Math.max(10,$-A-10),C=E.top+N<=y?E.top:Math.max(10,y-N-10),r.style.left=`${T+window.scrollX}px`,r.style.top=`${C+window.scrollY}px`}catch(_){console.warn(\"Error updating inspector panel:\",_);let v=document.getElementById(\"element-inspector-panel\");v&&(v.innerHTML=`<div><strong>Error inspecting element</strong></div><div>There was an error inspecting this element. This may be due to browser extension conflicts.</div><div>Try navigating to a different element.</div>`,v.style.display=\"block\")}},b=e=>{try{let t=e();return h(t)?t:null}catch(r){return console.warn(\"Error navigating to element:\",r),null}},$=e=>{try{if(\"element-inspector-panel\"===e.target.id||\"element-inspector-highlight\"===e.target.id||\"inspector-notification\"===e.target.id)return;f(e.target),x&&u!==e.target&&(x=!1)}catch(t){console.warn(\"Error in mouse over handler:\",t)}},y=e=>{try{let t=e.key;if(\"q\"===t||\"Q\"===t){N(),e.preventDefault();return}if(\"c\"===t||\"C\"===t){u&&(d(u),e.preventDefault());return}if(!u){A();return}x||A();let r=null;switch(t){case\"ArrowUp\":(r=b(()=>u.parentElement))&&(f(r),e.preventDefault());break;case\"ArrowDown\":(r=b(()=>u.firstElementChild))&&(f(r),e.preventDefault());break;case\"ArrowLeft\":(r=b(()=>u.previousElementSibling))&&(f(r),e.preventDefault());break;case\"ArrowRight\":(r=b(()=>u.nextElementSibling))&&(f(r),e.preventDefault())}}catch(n){console.warn(\"Error in keyboard navigation:\",n)}},E=e=>{try{if(e&&e.relatedTarget&&(\"element-inspector-panel\"===e.relatedTarget.id||\"element-inspector-highlight\"===e.relatedTarget.id))return;let t=document.getElementById(\"element-inspector-panel\");t&&(t.style.display=\"none\"),p&&(p.style.display=\"none\"),(!x||u&&e.relatedTarget!==u)&&(u=null)}catch(r){console.warn(\"Error hiding inspector panel:\",r)}},x=!1,A=()=>{try{x=!0,u&&h(u)||(u=document.body,f(u))}catch(e){console.warn(\"Error entering keyboard mode:\",e)}},N=()=>{try{document.removeEventListener(\"mouseover\",$),document.removeEventListener(\"mouseout\",E),document.removeEventListener(\"keydown\",y);let e=document.getElementById(\"element-inspector-panel\");e&&e.parentNode&&e.parentNode.removeChild(e),p&&p.parentNode&&p.parentNode.removeChild(p),u=null,p=null,x=!1;let t=document.createElement(\"div\");t.id=\"inspector-notification\",t.textContent=\"Element Inspector turned off\",t.style.cssText=`position: fixed;top: 10px;right: 10px;background-color: rgba(0, 0, 0, 0.7);color: white;padding: 8px 12px;border-radius: 4px;font-family: sans-serif;font-size: 16px;z-index: 1000000000000;transition: opacity 0.5s;`,document.body.appendChild(t),setTimeout(()=>{t.style.opacity=\"0\",setTimeout(()=>{t&&t.parentNode&&t.parentNode.removeChild(t)},500)},3e3),console.log(\"Element Inspector stopped permanently.\")}catch(r){console.error(\"Error stopping inspector:\",r),[\"element-inspector-panel\",\"element-inspector-highlight\",\"inspector-notification\"].forEach(e=>{let t=document.getElementById(e);t&&t.parentNode&&t.parentNode.removeChild(t)})}};(()=>{try{document.querySelector(\"#element-inspector-panel\")&&document.querySelector(\"#element-inspector-panel\").remove(),document.querySelector(\"#element-inspector-highlight\")&&document.querySelector(\"#element-inspector-highlight\").remove(),e(),p=g(),document.addEventListener(\"mouseover\",$),document.addEventListener(\"mouseout\",E),document.addEventListener(\"keydown\",y),console.log('Element Inspector initialized. Hover over elements to see details. Use arrow keys to navigate the DOM. Press \"C\" to log element details to console. Press \"Q\" to stop.')}catch(t){console.error(\"Error initializing element inspector:\",t),alert(\"Failed to initialize Element Inspector. Check the console for details.\")}})()}elementInspector()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Diagnostics","Inspection"],"folderName":"Diagnostics","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Diagnostics.json","download":{"name":"Element Inspector","language":"javascript","executionMode":"activate","content":"(function(){function elementInspector(){!function e(){let t=document.createElement(\"style\");t.textContent=`#element-inspector-panel {position: absolute;background-color: rgba(0, 0, 0, 0.9);outline:4px solid rgba(255, 255, 255, 0.9);;color: #ffffff;border-radius: 4px;padding: 8px 12px;font-family: monospace;font-size: 16px;line-height: 1.5;z-index: 10000;pointer-events: none;max-width: 500px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);display: none;}#element-inspector-panel dl,#element-inspector-panel dd,#element-inspector-panel dt {padding:0;margin:0;}#element-inspector-panel dd {margin-bottom:0.5em;}#element-inspector-panel dt {font-weight:bold;}#element-inspector-panel dd {padding-left:1em;overflow-wrap:anywhere;}#element-inspector-highlight{position: absolute;border: 2px solid #ff6700;background-color: rgba(255, 103, 0, 0.2);pointer-events: none;z-index: 9999;display: none;}#element-inspector-panel .HTML-el {color:orange;}#element-inspector-panel .aria-attribs {color:yellow;}#element-inspector-panel .role {color:#e98cef;}#element-inspector-panel .accname {color:#FF8B5D;}#element-inspector-panel .focusable {color:white;}#element-inspector-panel .xpath {color:lime;}#inspector-notification {position: fixed;top: 10px;right: 10px;background-color: rgba(0, 0, 0, 0.7);color: white;padding: 8px 12px;border-radius: 4px;font-family: sans-serif;font-size: 16px;z-index: 10001;transition: opacity 0.5s;}`,document.head.appendChild(t)}();let e=()=>{let e=document.createElement(\"div\");return e.id=\"element-inspector-panel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},t=e=>{try{let t={name:\"\",source:\"\"};if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"aria-labelledby\")){let n=e.getAttribute(\"aria-labelledby\").split(/\\s+/),l=[];for(let i of n){let a=document.getElementById(i);a&&l.push(a.textContent.trim())}if(l.length>0)return t.name=l.join(\" \"),t.source=\"aria-labelledby\",t}let o=\"svg\"===e.tagName.toLowerCase()?e:e.closest(\"svg\");if(o){if(e!==o){if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"aria-labelledby\")){let s=e.getAttribute(\"aria-labelledby\").split(/\\s+/),c=[];for(let d of s){let u=document.getElementById(d);u&&c.push(u.textContent.trim())}if(c.length>0)return t.name=c.join(\" \"),t.source=\"aria-labelledby\",t}let p=Array.from(e.children).find(e=>\"title\"===e.tagName.toLowerCase());if(p&&p.textContent.trim())return t.name=p.textContent.trim(),t.source=\"SVG <title> (child)\",t}let g=o.querySelector(\"title\");if(g&&g.textContent.trim())return t.name=g.textContent.trim(),t.source=\"SVG <title>\",t;let m=o.querySelector(\"desc\");if(m&&m.textContent.trim())return t.name=m.textContent.trim(),t.source=\"SVG <desc>\",t}if(\"IMG\"===e.tagName&&e.hasAttribute(\"alt\"))return t.name=e.getAttribute(\"alt\"),t.source=\"alt\",t;if(\"BUTTON\"===e.tagName||\"A\"===e.tagName){let h=e.querySelectorAll(\"svg\");if(h.length>0)for(let f of h){let b=f.querySelector(\"title\");if(b&&b.textContent.trim())return t.name=b.textContent.trim(),t.source=\"SVG <title> (child element)\",t;if(f.hasAttribute(\"aria-label\"))return t.name=f.getAttribute(\"aria-label\"),t.source=\"SVG aria-label (child element)\",t}let $=e.querySelectorAll(\"img[alt]\");if($.length>0)for(let y of $){let E=y.getAttribute(\"alt\");if(E&&\"\"!==E.trim())return t.name=E,t.source=\"img alt (child element)\",t}if(\"\"===e.textContent.trim()){if(h.length>0)return t.name=\"Unlabeled SVG\",t.source=\"missing SVG label\",t;let x=e.querySelectorAll(\"img\");if(x.length>0)return t.name=\"Unlabeled image\",t.source=\"missing image alt\",t}let A=e.textContent.trim();if(A)return t.name=A,t.source=\"text content\",t}if(\"CANVAS\"===e.tagName&&e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(\"INPUT\"===e.tagName||\"TEXTAREA\"===e.tagName||\"SELECT\"===e.tagName){if(e.id){let N=document.querySelector(`label[for=\"${e.id}\"]`);if(N)return t.name=N.textContent,t.source=\"label element\",t}if(e.placeholder)return t.name=e.placeholder,t.source=\"placeholder\",t}if(e.title)return t.name=e.title,t.source=\"title\",t;if(\"img\"===e.getAttribute(\"role\")){if(e.hasAttribute(\"aria-label\"))return t.name=e.getAttribute(\"aria-label\"),t.source=\"aria-label\",t;if(e.hasAttribute(\"alt\"))return t.name=e.getAttribute(\"alt\"),t.source=\"alt\",t}if(\"FIGURE\"===e.tagName){let T=e.querySelector(\"figcaption\");if(T)return t.name=T.textContent.trim(),t.source=\"figcaption\",t}return t.name=r(e),t.name?t.source=\"text content\":(t.name=\"No accessible name\",t.source=\"\"),t}catch(C){return console.warn(\"Error getting accessible name:\",C),{name:\"Error retrieving name\",source:\"\"}}},r=e=>{try{if(0===e.childNodes.length||1===e.childNodes.length&&e.childNodes[0].nodeType===Node.TEXT_NODE)return e.textContent.trim();let t=\"\",n=!1;for(let l=0;l<e.childNodes.length;l++){let i=e.childNodes[l];if(i.nodeType===Node.TEXT_NODE){let a=i.textContent.trim();a&&(n&&t.length>0&&(t+=\" \"),t+=a,n=!0)}else if(i.nodeType===Node.ELEMENT_NODE){let o=window.getComputedStyle(i),s=\"block\"===o.display||\"flex\"===o.display||\"grid\"===o.display,c=r(i);c?((s||\"LI\"===i.tagName)&&t.length>0&&(t+=\" \"),t+=c,s&&l<e.childNodes.length-1&&(t+=\" \"),n=!0):n=!1}}return t.trim().replace(/\\s+/g,\" \")}catch(d){return console.warn(\"Error getting formatted text content:\",d),e.textContent.trim()}},n=e=>{try{if(e.hasAttribute(\"tabindex\"))return parseInt(e.getAttribute(\"tabindex\"))>=0;return[\"A\",\"BUTTON\",\"INPUT\",\"SELECT\",\"TEXTAREA\",\"DETAILS\",\"SUMMARY\",\"IFRAME\",\"OBJECT\",\"EMBED\",\"AUDIO\",\"VIDEO\"].includes(e.tagName)&&!e.disabled&&\"none\"!==e.style.display&&\"hidden\"!==e.style.visibility}catch(t){return console.warn(\"Error checking focusability:\",t),!1}};function l(e){let t=e.match(/\\d+/g);return t?3===t.length?\"#\"+t.map(e=>{let t=parseInt(e).toString(16);return 1===t.length?\"0\"+t:t}).join(\"\"):4===t.length?\"#\"+t.slice(0,3).map(e=>{let t=parseInt(e).toString(16);return 1===t.length?\"0\"+t:t}).join(\"\"):null:null}function i(e){let t=/^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(e);if(!t)return 0;let[r,n,l]=[parseInt(t[1],16)/255,parseInt(t[2],16)/255,parseInt(t[3],16)/255],i=[r,n,l].map(e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return .2126*i[0]+.7152*i[1]+.0722*i[2]}function a(e){try{let t=window.getComputedStyle(e),r=t.color,n=t.backgroundColor,a=l(r),o=l(n),s=[];if(a&&o){let c=function e(t,r){let n=i(t),l=i(r);return(Math.max(n,l)+.05)/(Math.min(n,l)+.05)}(a,o);s.push({type:\"Text Contrast\",colors:`${r} on ${n}`,ratio:c.toFixed(2),passed:c>=4.5?\"✅ WCAG AA\":\"❌ WCAG Fail\"})}let d=t.borderColor;return l(d),s}catch(u){return console.warn(\"Error checking color contrast:\",u),[]}}let o=e=>{try{if(e.hasAttribute(\"role\"))return e.getAttribute(\"role\");let t={A:(()=>{let t=e.hasAttribute(\"href\")&&(\"_blank\"===e.getAttribute(\"target\")||\"_new\"===e.getAttribute(\"target\")),r=e.hasAttribute(\"href\")?\"link\":\"generic\";return t?`${r} (opens in new window)`:r})(),ARTICLE:\"article\",ASIDE:\"complementary\",BUTTON:\"button\",DETAILS:\"group\",DIALOG:\"dialog\",DIV:\"generic\",FOOTER:\"contentinfo\",FORM:\"form\",H1:\"heading\",H2:\"heading\",H3:\"heading\",H4:\"heading\",H5:\"heading\",H6:\"heading\",HEADER:\"banner\",IMG:e.hasAttribute(\"alt\")&&\"\"===e.getAttribute(\"alt\")?\"presentation\":\"img\",INPUT:(()=>{let t=e.type&&e.type.toLowerCase();switch(t){case\"button\":case\"submit\":case\"reset\":return\"button\";case\"checkbox\":return\"checkbox\";case\"radio\":return\"radio\";case\"range\":return\"slider\";case\"search\":return\"searchbox\";default:return\"textbox\"}})(),LI:\"listitem\",MAIN:\"main\",NAV:\"navigation\",OL:\"list\",OPTION:\"option\",PROGRESS:\"progressbar\",SECTION:\"region\",SELECT:\"combobox\",TABLE:\"table\",TEXTAREA:\"textbox\",UL:\"list\"};return t[e.tagName]||\"generic\"}catch(r){return console.warn(\"Error getting element role:\",r),\"generic\"}},s=e=>{try{let t=e.attributes,r=[];for(let n=0;n<t.length;n++){let l=t[n];l.name.startsWith(\"aria-\")&&r.push(`${l.name}=\"${l.value}\"`)}return r}catch(i){return console.warn(\"Error getting ARIA attributes:\",i),[]}},c=e=>{try{if(!e)return\"\";if(\"HTML\"===e.tagName)return\"/HTML[1]\";if(e===document.body)return\"/HTML[1]/BODY[1]\";let t=0,r=e.parentNode.childNodes;for(let n=0;n<r.length;n++){let l=r[n];if(l===e)return c(e.parentNode)+\"/\"+e.tagName+\"[\"+(t+1)+\"]\";1===l.nodeType&&l.tagName===e.tagName&&t++}return\"\"}catch(i){return console.warn(\"Error getting XPath:\",i),\"Error retrieving XPath\"}},d=e=>{try{if(!e||!h(e)){console.warn(\"No valid element selected for logging\");return}console.group(\"Element Details\"),console.log(\"XPATH:\",c(e)),console.log(\"outerHTML:\",e.outerHTML),console.groupEnd();let t=document.createElement(\"div\");t.id=\"inspector-notification\",t.setAttribute(\"role\",\"status\"),document.body.appendChild(t),setTimeout(function e(){t.textContent=\"Element details logged to console\"},500),setTimeout(()=>{t.style.opacity=\"0\",setTimeout(()=>{t&&t.parentNode&&t.parentNode.removeChild(t)},500)},2e3)}catch(r){console.warn(\"Error logging element details:\",r)}},u=null,p=null,g=()=>{let e=document.createElement(\"div\");return e.id=\"element-inspector-highlight\",document.body.appendChild(e),e},m=()=>{try{if(!u||!p)return;let e=u.getBoundingClientRect();p.style.left=`${window.scrollX+e.left}px`,p.style.top=`${window.scrollY+e.top}px`,p.style.width=`${e.width}px`,p.style.height=`${e.height}px`,p.style.display=\"block\"}catch(t){console.warn(\"Error updating highlight:\",t),p&&(p.style.display=\"none\")}},h=e=>{try{return e&&1===e.nodeType&&e.tagName&&\"element-inspector-panel\"!==e.id&&\"element-inspector-highlight\"!==e.id&&\"inspector-notification\"!==e.id}catch(t){return!1}},f=e=>{try{let r=document.getElementById(\"element-inspector-panel\");if(!r||!e||!h(e))return;u=e,m();let l=o(e),i=t(e),a=i.name,d=i.source,p=n(e),g=c(e),f=s(e),b=`<dl><dt class=\"HTML-el\">Element:</dt> <dd class=\"HTML-el\">&lt;${e.tagName.toLowerCase()}&gt;</dd><dt class=\"role\">Role:</dt> <dd class=\"role\">${l}</dd>`;d?b+=`<dt class=\"accname\">Accessible Name (from ${d}):</dt> <dd class=\"accname\">${a.substring(0,200)}${a.length>200?\"...\":\"\"}</dd>`:b+=`<dt class=\"accname\">Accessible Name:</dt> <dd class=\"accname\">${a.substring(0,200)}${a.length>200?\"...\":\"\"}</dd>`,b+=`<dt class=\"focusable\">Keyboard Focusable:</dt> <dd class=\"focusable\">${p?\"✅ Yes\":\"❌ No\"}</dd>`,b+=`<dt class=\"xpath\">XPath:</dt> <dd class=\"xpath\">${g}</dd>`,f.length>0&&(b+='<dt class=\"aria-attribs\">ARIA Attributes:</dt>',b+='<dd class=\"aria-attribs\">',b+='<ul style=\"margin: 0; padding-left: 16px;\">',f.forEach(e=>{b+=`<li>${e}</li>`}),b+=\"</ul>\",b+=\"</dd>\"),b+=\"</dl>\",r.innerHTML=b,r.style.display=\"block\";let $=window.innerWidth,y=window.innerHeight,E=e.getBoundingClientRect(),x=r.getBoundingClientRect(),A=x.width,N=x.height,T,C;T=E.right+10+A<=$?E.right+10:E.left-A-10>=0?E.left-A-10:Math.max(10,$-A-10),C=E.top+N<=y?E.top:Math.max(10,y-N-10),r.style.left=`${T+window.scrollX}px`,r.style.top=`${C+window.scrollY}px`}catch(_){console.warn(\"Error updating inspector panel:\",_);let v=document.getElementById(\"element-inspector-panel\");v&&(v.innerHTML=`<div><strong>Error inspecting element</strong></div><div>There was an error inspecting this element. This may be due to browser extension conflicts.</div><div>Try navigating to a different element.</div>`,v.style.display=\"block\")}},b=e=>{try{let t=e();return h(t)?t:null}catch(r){return console.warn(\"Error navigating to element:\",r),null}},$=e=>{try{if(\"element-inspector-panel\"===e.target.id||\"element-inspector-highlight\"===e.target.id||\"inspector-notification\"===e.target.id)return;f(e.target),x&&u!==e.target&&(x=!1)}catch(t){console.warn(\"Error in mouse over handler:\",t)}},y=e=>{try{let t=e.key;if(\"q\"===t||\"Q\"===t){N(),e.preventDefault();return}if(\"c\"===t||\"C\"===t){u&&(d(u),e.preventDefault());return}if(!u){A();return}x||A();let r=null;switch(t){case\"ArrowUp\":(r=b(()=>u.parentElement))&&(f(r),e.preventDefault());break;case\"ArrowDown\":(r=b(()=>u.firstElementChild))&&(f(r),e.preventDefault());break;case\"ArrowLeft\":(r=b(()=>u.previousElementSibling))&&(f(r),e.preventDefault());break;case\"ArrowRight\":(r=b(()=>u.nextElementSibling))&&(f(r),e.preventDefault())}}catch(n){console.warn(\"Error in keyboard navigation:\",n)}},E=e=>{try{if(e&&e.relatedTarget&&(\"element-inspector-panel\"===e.relatedTarget.id||\"element-inspector-highlight\"===e.relatedTarget.id))return;let t=document.getElementById(\"element-inspector-panel\");t&&(t.style.display=\"none\"),p&&(p.style.display=\"none\"),(!x||u&&e.relatedTarget!==u)&&(u=null)}catch(r){console.warn(\"Error hiding inspector panel:\",r)}},x=!1,A=()=>{try{x=!0,u&&h(u)||(u=document.body,f(u))}catch(e){console.warn(\"Error entering keyboard mode:\",e)}},N=()=>{try{document.removeEventListener(\"mouseover\",$),document.removeEventListener(\"mouseout\",E),document.removeEventListener(\"keydown\",y);let e=document.getElementById(\"element-inspector-panel\");e&&e.parentNode&&e.parentNode.removeChild(e),p&&p.parentNode&&p.parentNode.removeChild(p),u=null,p=null,x=!1;let t=document.createElement(\"div\");t.id=\"inspector-notification\",t.textContent=\"Element Inspector turned off\",t.style.cssText=`position: fixed;top: 10px;right: 10px;background-color: rgba(0, 0, 0, 0.7);color: white;padding: 8px 12px;border-radius: 4px;font-family: sans-serif;font-size: 16px;z-index: 1000000000000;transition: opacity 0.5s;`,document.body.appendChild(t),setTimeout(()=>{t.style.opacity=\"0\",setTimeout(()=>{t&&t.parentNode&&t.parentNode.removeChild(t)},500)},3e3),console.log(\"Element Inspector stopped permanently.\")}catch(r){console.error(\"Error stopping inspector:\",r),[\"element-inspector-panel\",\"element-inspector-highlight\",\"inspector-notification\"].forEach(e=>{let t=document.getElementById(e);t&&t.parentNode&&t.parentNode.removeChild(t)})}};(()=>{try{document.querySelector(\"#element-inspector-panel\")&&document.querySelector(\"#element-inspector-panel\").remove(),document.querySelector(\"#element-inspector-highlight\")&&document.querySelector(\"#element-inspector-highlight\").remove(),e(),p=g(),document.addEventListener(\"mouseover\",$),document.addEventListener(\"mouseout\",E),document.addEventListener(\"keydown\",y),console.log('Element Inspector initialized. Hover over elements to see details. Use arrow keys to navigate the DOM. Press \"C\" to log element details to console. Press \"Q\" to stop.')}catch(t){console.error(\"Error initializing element inspector:\",t),alert(\"Failed to initialize Element Inspector. Check the console for details.\")}})()}elementInspector()})()","description":"Hover over any element and get a super simple summary of its tagname, role, accessible name and XPATH.","author":"Ian Lloyd","categories":["Accessibility","Diagnostics","Inspection"]}}

{"id":"A11y-tools.com: Misc (non a11y-related).json-0-0","name":"Get All Links in Selected Area","description":"Copies all link details in selected area of a page (drag to select).","language":"javascript","executionMode":"activate","content":"(function(){(()=>{let e=document.createElement(\"style\");e.textContent=`\n    #link-picker-overlay {\n      position: fixed; inset: 0; z-index: 999999;\n      cursor: crosshair;\n    }\n    #link-picker-selection {\n      position: fixed; z-index: 9999999;\n      border: 2px solid #3b82f6;\n      background: rgba(59,130,246,0.15);\n      pointer-events: none;\n      display: none;\n    }\n    #link-picker-toast {\n      position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);\n      background: #1e293b; color: #f1f5f9; padding: 10px 20px;\n      border-radius: 8px; font: 14px/1.5 monospace; z-index: 99999999;\n      box-shadow: 0 4px 20px rgba(0,0,0,0.4); pointer-events: none;\n    }\n  `,document.head.appendChild(e);let t=document.createElement(\"div\");t.id=\"link-picker-overlay\",document.body.appendChild(t);let o=document.createElement(\"div\");o.id=\"link-picker-selection\",document.body.appendChild(o);let l=document.createElement(\"div\");l.id=\"link-picker-toast\",l.textContent=\"\\uD83D\\uDD17 Drag to select an area and harvest links. Press Esc to cancel.\",document.body.appendChild(l);let i,n,r=!1,c=(e,t)=>({x:e+window.scrollX,y:t+window.scrollY}),a=(e,t,l,i)=>{let n=Math.min(e,l)-window.scrollX,r=Math.min(t,i)-window.scrollY,c=Math.abs(l-e),a=Math.abs(i-t);Object.assign(o.style,{display:\"block\",left:n+\"px\",top:r+\"px\",width:c+\"px\",height:a+\"px\"})},s=()=>{t.remove(),o.remove(),e.remove(),l.remove()},d=(e,t,o,l,i)=>{let n=Math.min(t,l),r=Math.max(t,l),c=Math.min(o,i),a=Math.max(o,i);return e.left<r&&e.right>n&&e.top<a&&e.bottom>c},p=(e,t,o,l)=>{let i=new Map;return document.querySelectorAll(\"a[href]\").forEach(n=>{let r=n.getBoundingClientRect(),c={left:r.left+window.scrollX,right:r.right+window.scrollX,top:r.top+window.scrollY,bottom:r.bottom+window.scrollY};if(!d(c,e,t,o,l))return;let a=n.href.trim(),s=(n.textContent||n.getAttribute(\"aria-label\")||n.getAttribute(\"title\")||\"(no text)\").trim().replace(/\\s+/g,\" \");a&&!i.has(a)&&i.set(a,s)}),i};t.addEventListener(\"mousedown\",e=>{r=!0;let t=c(e.clientX,e.clientY);i=t.x,n=t.y,o.style.display=\"none\"}),t.addEventListener(\"mousemove\",e=>{if(!r)return;let t=c(e.clientX,e.clientY);a(i,n,t.x,t.y)}),t.addEventListener(\"mouseup\",e=>{if(!r)return;r=!1;let t=c(e.clientX,e.clientY),o=p(i,n,t.x,t.y);if(s(),0===o.size){console.log(\"%c\\uD83D\\uDD17 Link Picker — No links found in selection.\",\"color:#f87171;font-weight:bold;\");return}console.group(`%c🔗 Link Picker — ${o.size} unique link(s) found`,\"color:#3b82f6;font-weight:bold;font-size:14px;\"),o.forEach((e,t)=>{console.log(`%c${e}\n%c${t}`,\"color:#f1f5f9;font-weight:bold;\",\"color:#94a3b8;\")}),console.groupEnd();let l=[...o.entries()].map(([e,t])=>`${t} — ${e}`).join(\"\\n\");console.log(\"%cPlain list (copy-friendly):\",\"color:#64748b;font-style:italic;\"),console.log(l),navigator.clipboard.writeText(l).then(()=>{console.log(\"%c✅ Results also copied to clipboard.\",\"color:#4ade80;font-weight:bold;\")}).catch(e=>{console.warn(\"Clipboard write failed:\",e)})}),document.addEventListener(\"keydown\",e=>{\"Escape\"===e.key&&(s(),console.log(\"%c\\uD83D\\uDD17 Link Picker cancelled.\",\"color:#94a3b8;\"))})})();})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML","Links","Debugging"],"folderName":null,"folderDescription":null,"sourceFile":"A11y-tools.com: Misc (non a11y-related).json","download":{"name":"Get All Links in Selected Area","language":"javascript","executionMode":"activate","content":"(function(){(()=>{let e=document.createElement(\"style\");e.textContent=`\n    #link-picker-overlay {\n      position: fixed; inset: 0; z-index: 999999;\n      cursor: crosshair;\n    }\n    #link-picker-selection {\n      position: fixed; z-index: 9999999;\n      border: 2px solid #3b82f6;\n      background: rgba(59,130,246,0.15);\n      pointer-events: none;\n      display: none;\n    }\n    #link-picker-toast {\n      position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);\n      background: #1e293b; color: #f1f5f9; padding: 10px 20px;\n      border-radius: 8px; font: 14px/1.5 monospace; z-index: 99999999;\n      box-shadow: 0 4px 20px rgba(0,0,0,0.4); pointer-events: none;\n    }\n  `,document.head.appendChild(e);let t=document.createElement(\"div\");t.id=\"link-picker-overlay\",document.body.appendChild(t);let o=document.createElement(\"div\");o.id=\"link-picker-selection\",document.body.appendChild(o);let l=document.createElement(\"div\");l.id=\"link-picker-toast\",l.textContent=\"\\uD83D\\uDD17 Drag to select an area and harvest links. Press Esc to cancel.\",document.body.appendChild(l);let i,n,r=!1,c=(e,t)=>({x:e+window.scrollX,y:t+window.scrollY}),a=(e,t,l,i)=>{let n=Math.min(e,l)-window.scrollX,r=Math.min(t,i)-window.scrollY,c=Math.abs(l-e),a=Math.abs(i-t);Object.assign(o.style,{display:\"block\",left:n+\"px\",top:r+\"px\",width:c+\"px\",height:a+\"px\"})},s=()=>{t.remove(),o.remove(),e.remove(),l.remove()},d=(e,t,o,l,i)=>{let n=Math.min(t,l),r=Math.max(t,l),c=Math.min(o,i),a=Math.max(o,i);return e.left<r&&e.right>n&&e.top<a&&e.bottom>c},p=(e,t,o,l)=>{let i=new Map;return document.querySelectorAll(\"a[href]\").forEach(n=>{let r=n.getBoundingClientRect(),c={left:r.left+window.scrollX,right:r.right+window.scrollX,top:r.top+window.scrollY,bottom:r.bottom+window.scrollY};if(!d(c,e,t,o,l))return;let a=n.href.trim(),s=(n.textContent||n.getAttribute(\"aria-label\")||n.getAttribute(\"title\")||\"(no text)\").trim().replace(/\\s+/g,\" \");a&&!i.has(a)&&i.set(a,s)}),i};t.addEventListener(\"mousedown\",e=>{r=!0;let t=c(e.clientX,e.clientY);i=t.x,n=t.y,o.style.display=\"none\"}),t.addEventListener(\"mousemove\",e=>{if(!r)return;let t=c(e.clientX,e.clientY);a(i,n,t.x,t.y)}),t.addEventListener(\"mouseup\",e=>{if(!r)return;r=!1;let t=c(e.clientX,e.clientY),o=p(i,n,t.x,t.y);if(s(),0===o.size){console.log(\"%c\\uD83D\\uDD17 Link Picker — No links found in selection.\",\"color:#f87171;font-weight:bold;\");return}console.group(`%c🔗 Link Picker — ${o.size} unique link(s) found`,\"color:#3b82f6;font-weight:bold;font-size:14px;\"),o.forEach((e,t)=>{console.log(`%c${e}\n%c${t}`,\"color:#f1f5f9;font-weight:bold;\",\"color:#94a3b8;\")}),console.groupEnd();let l=[...o.entries()].map(([e,t])=>`${t} — ${e}`).join(\"\\n\");console.log(\"%cPlain list (copy-friendly):\",\"color:#64748b;font-style:italic;\"),console.log(l),navigator.clipboard.writeText(l).then(()=>{console.log(\"%c✅ Results also copied to clipboard.\",\"color:#4ade80;font-weight:bold;\")}).catch(e=>{console.warn(\"Clipboard write failed:\",e)})}),document.addEventListener(\"keydown\",e=>{\"Escape\"===e.key&&(s(),console.log(\"%c\\uD83D\\uDD17 Link Picker cancelled.\",\"color:#94a3b8;\"))})})();})()","description":"Copies all link details in selected area of a page (drag to select).","author":"Ian Lloyd","categories":["HTML","Links","Debugging"]}}

{"id":"A11y-tools.com: Misc.json-0-3","name":"Get Table Data","description":"Extrapolates table data and spews it into the console for easy copy/paste.","language":"javascript","executionMode":"activate","content":"(function(){function getTableData(){function e(e){t(),e.style.outline=\"3px solid #007bff\",e.style.outlineOffset=\"2px\",e.scrollIntoView({behavior:\"smooth\",block:\"center\"})}function t(){let e=document.getElementsByTagName(\"table\");Array.from(e).forEach(e=>{e.style.outline=\"\",e.style.outlineOffset=\"\"})}function n(e,t){return e.padEnd(t,\" \")}function o(e){let t=document.getElementById(\"table-selector-notification\");t&&t.remove();let o=document.getElementById(\"table-selector-dialog\");o&&(o.close(),o.remove()),setTimeout(function(){let t=Array.from(e.rows[0].cells),o=t.map((e,t)=>`${t+1} - ${e.textContent.trim()}`).join(\"\\n\"),i=prompt(`Available columns:\\n${o}\\nWhich columns do you want? (Enter numbers separated by commas or spaces. Can be in different order than table column order)`);if(i){let a=i.split(/[\\s,]+/).map(e=>parseInt(e.trim())).filter(t=>!isNaN(t)&&t>0&&t<=e.rows[0].cells.length);a.length>0?(function e(t,o){let l=function e(t,n){let o={},l=Array.from(t.rows);n.forEach(e=>{let t=l[0].cells[e-1].textContent.trim();o[e]=t.length});for(let r=1;r<l.length;r++)n.forEach(e=>{let t=l[r].cells[e-1].textContent.trim();o[e]=Math.max(o[e]||0,t.length)});return o}(t,o),r=Array.from(t.rows),i=[],a=o.map(e=>{let t=r[0].cells[e-1].textContent.trim();return n(t,l[e])});i.push(a.join(\" | \")),i.push(\"-\".repeat(i[0].length));for(let s=1;s<r.length;s++){let c=o.map(e=>{let t=r[s].cells[e-1].textContent.trim();return n(t,l[e])});i.push(c.join(\" | \"))}let d=i.join(\"\\n\");return console.log(d),confirm(\"VIEW CONSOLE for the formatted output\\n\\nWant to copy the output to the clipboard too?\")&&function e(t){navigator.clipboard.writeText(t).then(function(){console.log(\"Text successfully copied to clipboard\")}).catch(function(e){console.error(\"Failed to copy text: \",e)})}(d),d}(e,a),document.removeEventListener(\"click\",l),document.removeEventListener(\"keypress\",r)):alert(\"Please enter valid column numbers\")}},200)}function l(e){let t=function e(t){let n=t;for(;n&&\"TABLE\"!==n.tagName;)n=n.parentElement;return n}(e.target);t&&o(t)}function r(n){\"k\"===n.key.toLowerCase()&&function n(){let l=document.getElementsByTagName(\"table\");if(0===l.length){alert(\"No tables found on the page\");return}let r=function e(){let n=document.createElement(\"dialog\");n.id=\"table-selector-dialog\",n.style.cssText=`padding: 20px;border-radius: 8px;border: 1px solid #ccc;`;let o=document.createElement(\"button\");return o.textContent=\"CLOSE\",o.style.cssText=`position: absolute;right: 10px;top: 10px;background: none;border: none;font-size: 24px;cursor: pointer;padding: 5px;`,o.onclick=()=>{n.close(),n.remove()},n.appendChild(o),n.addEventListener(\"close\",()=>{t(),n.remove()}),n}(),i=document.createElement(\"div\");i.innerHTML='<h2 style=\"margin-bottom: 20px;\">Available Tables</h2>',Array.from(l).forEach((n,l)=>{let r=n.querySelector(\"caption\")?.textContent,a=function e(t){let n=t.previousElementSibling;for(;n;){if(/^H[1-6]$/.test(n.tagName))return n.textContent;n=n.previousElementSibling}return null}(n),s=r||a||`Table ${l+1}`,c=document.createElement(\"div\");c.style.cssText=\"margin-bottom: 15px; padding: 10px; border: 1px solid #eee; border-radius: 4px;\",c.classList.add(\"tableEntry\");let d=document.createElement(\"button\");d.textContent=\"Select this table\",d.onclick=()=>o(n),[c,d].forEach(o=>{o.addEventListener(\"mouseenter\",()=>e(n)),o.addEventListener(\"mouseleave\",t),o.addEventListener(\"focus\",()=>e(n)),o.addEventListener(\"blur\",t)}),c.innerHTML=`<h2>${s}</h2><p>Columns: ${n.rows[0].cells.length}</p>`,c.appendChild(d),i.appendChild(c)}),r.appendChild(i),document.body.appendChild(r),r.showModal()}()}console.clear(),!function e(){let t=document.createElement(\"div\");return t.setAttribute(\"role\",\"status\"),t.id=\"table-selector-notification\",document.body.appendChild(t),t}(),setTimeout(function e(){let t=document.getElementById(\"table-selector-notification\");t.textContent=\"Press K to list tables, or click to select a table\",t.style.cssText=`position: fixed;top: 20px;right: 20px;background-color: rgba(0, 0, 0, 0.8);color: white;padding: 10px 20px;border-radius: 5px;font-family: Arial, sans-serif;font-size: 14px;z-index: 10000;pointer-events: none;`},300),function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"a11yToolsStyles\"),t.textContent=`#table-selector-dialog {max-width:50%;}#table-selector-dialog .tableEntry button {background-color: #007bff;color: white;border: none;padding: 5px 10px;border-radius: 4px;cursor: pointer;}#table-selector-dialog .tableEntry h2 {margin:0;}#table-selector-dialog button:focus {outline:2px solid #007bff;outline-offset:4px;}`,document.head.appendChild(t)}(),document.addEventListener(\"click\",l),document.addEventListener(\"keypress\",r)}getTableData()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML","Data Extraction"],"folderName":"A11y-tools.com: Misc.","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Misc.json","download":{"name":"Get Table Data","language":"javascript","executionMode":"activate","content":"(function(){function getTableData(){function e(e){t(),e.style.outline=\"3px solid #007bff\",e.style.outlineOffset=\"2px\",e.scrollIntoView({behavior:\"smooth\",block:\"center\"})}function t(){let e=document.getElementsByTagName(\"table\");Array.from(e).forEach(e=>{e.style.outline=\"\",e.style.outlineOffset=\"\"})}function n(e,t){return e.padEnd(t,\" \")}function o(e){let t=document.getElementById(\"table-selector-notification\");t&&t.remove();let o=document.getElementById(\"table-selector-dialog\");o&&(o.close(),o.remove()),setTimeout(function(){let t=Array.from(e.rows[0].cells),o=t.map((e,t)=>`${t+1} - ${e.textContent.trim()}`).join(\"\\n\"),i=prompt(`Available columns:\\n${o}\\nWhich columns do you want? (Enter numbers separated by commas or spaces. Can be in different order than table column order)`);if(i){let a=i.split(/[\\s,]+/).map(e=>parseInt(e.trim())).filter(t=>!isNaN(t)&&t>0&&t<=e.rows[0].cells.length);a.length>0?(function e(t,o){let l=function e(t,n){let o={},l=Array.from(t.rows);n.forEach(e=>{let t=l[0].cells[e-1].textContent.trim();o[e]=t.length});for(let r=1;r<l.length;r++)n.forEach(e=>{let t=l[r].cells[e-1].textContent.trim();o[e]=Math.max(o[e]||0,t.length)});return o}(t,o),r=Array.from(t.rows),i=[],a=o.map(e=>{let t=r[0].cells[e-1].textContent.trim();return n(t,l[e])});i.push(a.join(\" | \")),i.push(\"-\".repeat(i[0].length));for(let s=1;s<r.length;s++){let c=o.map(e=>{let t=r[s].cells[e-1].textContent.trim();return n(t,l[e])});i.push(c.join(\" | \"))}let d=i.join(\"\\n\");return console.log(d),confirm(\"VIEW CONSOLE for the formatted output\\n\\nWant to copy the output to the clipboard too?\")&&function e(t){navigator.clipboard.writeText(t).then(function(){console.log(\"Text successfully copied to clipboard\")}).catch(function(e){console.error(\"Failed to copy text: \",e)})}(d),d}(e,a),document.removeEventListener(\"click\",l),document.removeEventListener(\"keypress\",r)):alert(\"Please enter valid column numbers\")}},200)}function l(e){let t=function e(t){let n=t;for(;n&&\"TABLE\"!==n.tagName;)n=n.parentElement;return n}(e.target);t&&o(t)}function r(n){\"k\"===n.key.toLowerCase()&&function n(){let l=document.getElementsByTagName(\"table\");if(0===l.length){alert(\"No tables found on the page\");return}let r=function e(){let n=document.createElement(\"dialog\");n.id=\"table-selector-dialog\",n.style.cssText=`padding: 20px;border-radius: 8px;border: 1px solid #ccc;`;let o=document.createElement(\"button\");return o.textContent=\"CLOSE\",o.style.cssText=`position: absolute;right: 10px;top: 10px;background: none;border: none;font-size: 24px;cursor: pointer;padding: 5px;`,o.onclick=()=>{n.close(),n.remove()},n.appendChild(o),n.addEventListener(\"close\",()=>{t(),n.remove()}),n}(),i=document.createElement(\"div\");i.innerHTML='<h2 style=\"margin-bottom: 20px;\">Available Tables</h2>',Array.from(l).forEach((n,l)=>{let r=n.querySelector(\"caption\")?.textContent,a=function e(t){let n=t.previousElementSibling;for(;n;){if(/^H[1-6]$/.test(n.tagName))return n.textContent;n=n.previousElementSibling}return null}(n),s=r||a||`Table ${l+1}`,c=document.createElement(\"div\");c.style.cssText=\"margin-bottom: 15px; padding: 10px; border: 1px solid #eee; border-radius: 4px;\",c.classList.add(\"tableEntry\");let d=document.createElement(\"button\");d.textContent=\"Select this table\",d.onclick=()=>o(n),[c,d].forEach(o=>{o.addEventListener(\"mouseenter\",()=>e(n)),o.addEventListener(\"mouseleave\",t),o.addEventListener(\"focus\",()=>e(n)),o.addEventListener(\"blur\",t)}),c.innerHTML=`<h2>${s}</h2><p>Columns: ${n.rows[0].cells.length}</p>`,c.appendChild(d),i.appendChild(c)}),r.appendChild(i),document.body.appendChild(r),r.showModal()}()}console.clear(),!function e(){let t=document.createElement(\"div\");return t.setAttribute(\"role\",\"status\"),t.id=\"table-selector-notification\",document.body.appendChild(t),t}(),setTimeout(function e(){let t=document.getElementById(\"table-selector-notification\");t.textContent=\"Press K to list tables, or click to select a table\",t.style.cssText=`position: fixed;top: 20px;right: 20px;background-color: rgba(0, 0, 0, 0.8);color: white;padding: 10px 20px;border-radius: 5px;font-family: Arial, sans-serif;font-size: 14px;z-index: 10000;pointer-events: none;`},300),function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"a11yToolsStyles\"),t.textContent=`#table-selector-dialog {max-width:50%;}#table-selector-dialog .tableEntry button {background-color: #007bff;color: white;border: none;padding: 5px 10px;border-radius: 4px;cursor: pointer;}#table-selector-dialog .tableEntry h2 {margin:0;}#table-selector-dialog button:focus {outline:2px solid #007bff;outline-offset:4px;}`,document.head.appendChild(t)}(),document.addEventListener(\"click\",l),document.addEventListener(\"keypress\",r)}getTableData()})()","description":"Extrapolates table data and spews it into the console for easy copy/paste.","author":"Ian Lloyd","categories":["HTML","Data Extraction"]}}

{"id":"A11y-tools.com: Form.json-0-1","name":"Grouped Fields","description":"Finds grouped fields (radios, checkboxes etc) and reveals how the accessible name for the group is derived.","language":"javascript","executionMode":"activate","content":"(function(){function outlineGroupedFIelds(){let o=0;function e(e,r){e.classList.add(\"a11y-tools-groupedEl\"),e.classList.add(`a11y-tools-group-color-${r}`),o++}function r(o,e,r){let l=document.createElement(\"span\");l.innerHTML=e,l.classList.add(\"a11y-tools-group-description\"),l.classList.add(`a11y-tools-group-description-background-${r}`);let t=o.parentNode;t.insertBefore(l,o)}var l=document.querySelectorAll(\"fieldset\");console.log(l),Array.from(l).forEach(o=>{e(o,1),o.querySelector(\"legend\")&&r(o,\"Group label (from fieldset > legend): <br><br>'\"+o.querySelector(\"legend\").textContent+\"'\",1)}),Array.from(document.querySelectorAll(\"[role=group][aria-label],[role=radiogroup][aria-label],[role=region][aria-label],nav[aria-label]\")).forEach(o=>{console.log(o);let l=\"none\";o.getAttribute(\"role\")&&(l=o.getAttribute(\"role\").toLowerCase()),\"nav\"===o.tagName.toLowerCase()&&(l=\"navigation\"),e(o,2),r(o,\"Group label (from [role=\"+l+\"][aria-label]): <br><br>'\"+o.getAttribute(\"aria-label\")+\"'\",2)}),Array.from(document.querySelectorAll(\"[role=group][aria-labelledby],[role=radiogroup][aria-labelledby],[role=region][aria-labelledby],nav[aria-labelledby]\")).forEach(o=>{let l=\"none\";o.getAttribute(\"role\")&&(l=o.getAttribute(\"role\").toLowerCase()),\"nav\"===o.tagName.toLowerCase()&&(l=\"navigation\"),e(o,3);let t=\"Source for aria-labelledby is missing/broken\";document.querySelector(\"#\"+o.getAttribute(\"aria-labelledby\"))&&(t=document.querySelector(\"#\"+o.getAttribute(\"aria-labelledby\")).textContent),r(o,\"Group label (from [role=\"+l+\"][aria-labelledby]): <br><br>'\"+t+\"'\",3)});let t=document.querySelectorAll(\".a11y-tools-group-description+.a11y-tools-group-description\");Array.from(t).forEach(o=>{o.remove()}),0===o&&alert(\"No grouped fields found on this page\"),!function o(){let e=document.createElement(\"style\");e.setAttribute(\"id\",\"groupedElStyles\"),e.textContent=`.a11y-tools-groupedEl {box-shadow: 0px 0px 0px 10px white;outline-offset: 5px;}.a11y-tools-group-color-1 {outline: 3px solid #662e2e;}.a11y-tools-group-color-2 {outline: 3px solid #66482e;}.a11y-tools-group-color-3 {outline: 3px solid #662e43;}.a11y-tools-group-description {display:inline-block;margin:20px 0 5px -10px;padding:5px;font-weight:bold;font-size:18px;color:white;}.a11y-tools-group-description-background-1 {background:#662e2e;}.a11y-tools-group-description-background-2 {background:#66482e;}.a11y-tools-group-description-background-3 {background:#662e43;}`,document.head.appendChild(e)}(),document.addEventListener(\"keydown\",function(o){\"q\"===o.key&&(o.preventDefault(),function o(){let e=document.querySelectorAll(\".a11y-tools-group-description\");Array.from(e).forEach(o=>{o.remove()});let r=document.querySelectorAll(`.a11y-tools-groupedEl,.a11y-tools-group-color-1,.a11y-tools-group-color-2,.a11y-tools-group-color-3,.a11y-tools-group-description,.a11y-tools-group-description-background-1,.a11y-tools-group-description-background-2,.a11y-tools-group-description-background-3`);Array.from(r).forEach(o=>{o.classList.remove(\".a11y-tools-groupedEl\"),o.classList.remove(\".a11y-tools-group-color-1\"),o.classList.remove(\".a11y-tools-group-color-2\"),o.classList.remove(\".a11y-tools-group-color-3\")});let l=document.querySelector(\"#groupedElStyles\");l&&l.remove()}())})}outlineGroupedFIelds()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Forms"],"folderName":"Forms","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Form.json","download":{"name":"Grouped Fields","language":"javascript","executionMode":"activate","content":"(function(){function outlineGroupedFIelds(){let o=0;function e(e,r){e.classList.add(\"a11y-tools-groupedEl\"),e.classList.add(`a11y-tools-group-color-${r}`),o++}function r(o,e,r){let l=document.createElement(\"span\");l.innerHTML=e,l.classList.add(\"a11y-tools-group-description\"),l.classList.add(`a11y-tools-group-description-background-${r}`);let t=o.parentNode;t.insertBefore(l,o)}var l=document.querySelectorAll(\"fieldset\");console.log(l),Array.from(l).forEach(o=>{e(o,1),o.querySelector(\"legend\")&&r(o,\"Group label (from fieldset > legend): <br><br>'\"+o.querySelector(\"legend\").textContent+\"'\",1)}),Array.from(document.querySelectorAll(\"[role=group][aria-label],[role=radiogroup][aria-label],[role=region][aria-label],nav[aria-label]\")).forEach(o=>{console.log(o);let l=\"none\";o.getAttribute(\"role\")&&(l=o.getAttribute(\"role\").toLowerCase()),\"nav\"===o.tagName.toLowerCase()&&(l=\"navigation\"),e(o,2),r(o,\"Group label (from [role=\"+l+\"][aria-label]): <br><br>'\"+o.getAttribute(\"aria-label\")+\"'\",2)}),Array.from(document.querySelectorAll(\"[role=group][aria-labelledby],[role=radiogroup][aria-labelledby],[role=region][aria-labelledby],nav[aria-labelledby]\")).forEach(o=>{let l=\"none\";o.getAttribute(\"role\")&&(l=o.getAttribute(\"role\").toLowerCase()),\"nav\"===o.tagName.toLowerCase()&&(l=\"navigation\"),e(o,3);let t=\"Source for aria-labelledby is missing/broken\";document.querySelector(\"#\"+o.getAttribute(\"aria-labelledby\"))&&(t=document.querySelector(\"#\"+o.getAttribute(\"aria-labelledby\")).textContent),r(o,\"Group label (from [role=\"+l+\"][aria-labelledby]): <br><br>'\"+t+\"'\",3)});let t=document.querySelectorAll(\".a11y-tools-group-description+.a11y-tools-group-description\");Array.from(t).forEach(o=>{o.remove()}),0===o&&alert(\"No grouped fields found on this page\"),!function o(){let e=document.createElement(\"style\");e.setAttribute(\"id\",\"groupedElStyles\"),e.textContent=`.a11y-tools-groupedEl {box-shadow: 0px 0px 0px 10px white;outline-offset: 5px;}.a11y-tools-group-color-1 {outline: 3px solid #662e2e;}.a11y-tools-group-color-2 {outline: 3px solid #66482e;}.a11y-tools-group-color-3 {outline: 3px solid #662e43;}.a11y-tools-group-description {display:inline-block;margin:20px 0 5px -10px;padding:5px;font-weight:bold;font-size:18px;color:white;}.a11y-tools-group-description-background-1 {background:#662e2e;}.a11y-tools-group-description-background-2 {background:#66482e;}.a11y-tools-group-description-background-3 {background:#662e43;}`,document.head.appendChild(e)}(),document.addEventListener(\"keydown\",function(o){\"q\"===o.key&&(o.preventDefault(),function o(){let e=document.querySelectorAll(\".a11y-tools-group-description\");Array.from(e).forEach(o=>{o.remove()});let r=document.querySelectorAll(`.a11y-tools-groupedEl,.a11y-tools-group-color-1,.a11y-tools-group-color-2,.a11y-tools-group-color-3,.a11y-tools-group-description,.a11y-tools-group-description-background-1,.a11y-tools-group-description-background-2,.a11y-tools-group-description-background-3`);Array.from(r).forEach(o=>{o.classList.remove(\".a11y-tools-groupedEl\"),o.classList.remove(\".a11y-tools-group-color-1\"),o.classList.remove(\".a11y-tools-group-color-2\"),o.classList.remove(\".a11y-tools-group-color-3\")});let l=document.querySelector(\"#groupedElStyles\");l&&l.remove()}())})}outlineGroupedFIelds()})()","description":"Finds grouped fields (radios, checkboxes etc) and reveals how the accessible name for the group is derived.","author":"Ian Lloyd","categories":["Accessibility","Forms"]}}

{"id":"Alwaystwisted.com: Inline CSS Inspector.json-0-0","name":"Inline CSS Inspector","description":"Displays all inline CSS styles in the document head and style blocks in the page","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var styles=Array.from(d.head.getElementsByTagName('style')).filter(s=>!s.hasAttribute('data-styled')&&!s.hasAttribute('data-emotion'));var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var html='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>Inline CSS in HEAD</h3>';if(styles.length===0){html+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No inline CSS found in the HEAD element.</div>';}else{html+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+styles.length+'</strong> style blocks:</div>';styles.forEach(function(style,index){var cssText=style.textContent.trim().replace(/}/g,'}\\n').replace(/{/g,' {\\n  ').replace(/;/g,';\\n  ');html+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:#06a!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'>Style Block #'+(index+1)+' <span style=\\'color:#777!important;font-weight:normal!important;font-size:12px!important;\\'>('+cssText.length+' characters)</span></div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;max-height:300px!important;\\'>'+cssText.replace(/</g,'<').replace(/>/g,'>')+'</pre></div>';});}html+='<div id=\\'inline-css-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=html;d.body.appendChild(c);document.getElementById('inline-css-close-btn').addEventListener('click',function(){c.remove();});})();","author":"Stuart Robson","authorUrl":"https://www.alwaystwisted.com","categories":["CSS"],"folderName":null,"folderDescription":null,"sourceFile":"Alwaystwisted.com: Inline CSS Inspector.json","download":{"name":"Inline CSS Inspector","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var styles=Array.from(d.head.getElementsByTagName('style')).filter(s=>!s.hasAttribute('data-styled')&&!s.hasAttribute('data-emotion'));var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var html='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>Inline CSS in HEAD</h3>';if(styles.length===0){html+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No inline CSS found in the HEAD element.</div>';}else{html+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+styles.length+'</strong> style blocks:</div>';styles.forEach(function(style,index){var cssText=style.textContent.trim().replace(/}/g,'}\\n').replace(/{/g,' {\\n  ').replace(/;/g,';\\n  ');html+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:#06a!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'>Style Block #'+(index+1)+' <span style=\\'color:#777!important;font-weight:normal!important;font-size:12px!important;\\'>('+cssText.length+' characters)</span></div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;max-height:300px!important;\\'>'+cssText.replace(/</g,'<').replace(/>/g,'>')+'</pre></div>';});}html+='<div id=\\'inline-css-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=html;d.body.appendChild(c);document.getElementById('inline-css-close-btn').addEventListener('click',function(){c.remove();});})();","description":"Displays all inline CSS styles in the document head and style blocks in the page","author":"Stuart Robson","categories":["CSS"]}}

{"id":"Alwaystwisted.com: Inline Element Styles Inspector.json-0-0","name":"Inline Element Styles Inspector","description":"Scans the entire page for HTML elements that have inline ⁠style attributes and displays a comprehensive report.","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var elements=Array.from(d.querySelectorAll('*')).filter(function(el){return el.hasAttribute('style')&&el.getAttribute('style').trim()!=='';});var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var h='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>Inline Style Inspector</h3>';if(elements.length===0){h+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No elements with inline styles found on this page.</div>';}else{h+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+elements.length+'</strong> elements with inline styles:</div>';for(var i=0;i<elements.length;i++){var el=elements[i];var tag=el.tagName.toLowerCase();var identifier='';if(el.id)identifier+=' id=\\''+el.id+'\\'';if(el.className)identifier+=' class=\\''+el.className+'\\'';var domPath=[];var currentEl=el;var depth=0;while(currentEl&&currentEl!==document.body&&domPath.length<3){var name=currentEl.tagName.toLowerCase();if(currentEl.id)name+='#'+currentEl.id;domPath.unshift(name);currentEl=currentEl.parentElement;depth++;}h+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:#06a!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'><'+tag+identifier+'> <span style=\\'color:#777!important;font-weight:normal!important;font-size:12px!important;\\'>(#'+(i+1)+', Depth: '+depth+')</span></div><div style=\\'color:#666!important;font:12px monospace!important;margin-bottom:5px!important;\\'>'+domPath.join(' > ')+'</div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;\\'>'+el.getAttribute('style').replace(/</g,'<').replace(/>/g,'>')+'</pre></div>';}}h+='<div id=\\'inline-styles-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=h;d.body.appendChild(c);document.getElementById('inline-styles-close-btn').addEventListener('click',function(){c.remove();});})();","author":"Stuart Robson","authorUrl":"https://www.alwaystwisted.com","categories":["CSS"],"folderName":null,"folderDescription":null,"sourceFile":"Alwaystwisted.com: Inline Element Styles Inspector.json","download":{"name":"Inline Element Styles Inspector","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var elements=Array.from(d.querySelectorAll('*')).filter(function(el){return el.hasAttribute('style')&&el.getAttribute('style').trim()!=='';});var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var h='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>Inline Style Inspector</h3>';if(elements.length===0){h+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No elements with inline styles found on this page.</div>';}else{h+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+elements.length+'</strong> elements with inline styles:</div>';for(var i=0;i<elements.length;i++){var el=elements[i];var tag=el.tagName.toLowerCase();var identifier='';if(el.id)identifier+=' id=\\''+el.id+'\\'';if(el.className)identifier+=' class=\\''+el.className+'\\'';var domPath=[];var currentEl=el;var depth=0;while(currentEl&&currentEl!==document.body&&domPath.length<3){var name=currentEl.tagName.toLowerCase();if(currentEl.id)name+='#'+currentEl.id;domPath.unshift(name);currentEl=currentEl.parentElement;depth++;}h+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:#06a!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'><'+tag+identifier+'> <span style=\\'color:#777!important;font-weight:normal!important;font-size:12px!important;\\'>(#'+(i+1)+', Depth: '+depth+')</span></div><div style=\\'color:#666!important;font:12px monospace!important;margin-bottom:5px!important;\\'>'+domPath.join(' > ')+'</div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;\\'>'+el.getAttribute('style').replace(/</g,'<').replace(/>/g,'>')+'</pre></div>';}}h+='<div id=\\'inline-styles-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=h;d.body.appendChild(c);document.getElementById('inline-styles-close-btn').addEventListener('click',function(){c.remove();});})();","description":"Scans the entire page for HTML elements that have inline ⁠style attributes and displays a comprehensive report.","author":"Stuart Robson","categories":["CSS"]}}

{"id":"A11y-tools.com: DOM manipulation.json-0-2","name":"Isolator","description":"Isolate any part of the page with a single click (also keyboard-operable).","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";function getXpath(e){let t=\"\",o=e;for(;o&&o.parentNode;){if(!o.tagName){o=o.parentNode;continue}let n=o.tagName.toLowerCase(),r=o.parentNode,i=r.querySelectorAll(`:scope > ${n}`),l=i.length>1?`[${Array.from(i).indexOf(o)+1}]`:\"\";t=t?`${n}${l}/${t}`:`${n}${l}`,o=r}return`//${t}`}function getElementHTML(e){if(!e)return\"\";let t=e.cloneNode(!1),o=t.outerHTML;if(o=o.replace(/</g,\"&lt;\").replace(/>/g,\"&gt;\"),e.childNodes.length>0){let n=e.tagName.toLowerCase(),r=`&lt;/${n}&gt;`;o=(o=(o=(o=o.replace(r,`...${r}`)).replace(\" isolatorHighlight\",\"\")).replace(\"isolatorHighlight\",\"\")).replace(' class=\" \"',\"\")}return o}function isolate(){let e={currentEl:null,preventClicks:!0,hasRun:!1},t=(()=>{let e=document.createElement(\"div\");return e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e})();function o(o,n=!0,r=!1){if(!o)return;e.currentEl&&e.currentEl.classList.remove(\"isolatorHighlight\"),e.currentEl=o,n&&!e.hasRun&&o.classList.add(\"isolatorHighlight\");let i=getXpath(o),l=getElementHTML(o),a=`<div class=\"xpath\">${i}</div>`;a+=`<div class=\"html\">${l}</div>`,(r||!e.hasRun)&&(a+='<div class=\"instruction\">Press ENTER to isolate this element</div>'),t.innerHTML=a}let n={ArrowUp(t){t.preventDefault(),e.currentEl?.parentNode?.tagName!==\"HTML\"&&o(e.currentEl.parentNode,!0,!0)},ArrowLeft(t){t.preventDefault(),o(e.currentEl?.previousElementSibling)},ArrowRight(t){t.preventDefault(),o(e.currentEl?.nextElementSibling)},ArrowDown(t){t.preventDefault();let n=Array.from(e.currentEl?.childNodes||[]).find(e=>1===e.nodeType);o(n)},Enter(t){t.preventDefault(),e.currentEl?.click()}};document.addEventListener(\"keydown\",e=>{let t=n[e.key];t&&t(e)}),document.querySelectorAll(\"*\").forEach(t=>{t.addEventListener(\"click\",n=>{if(e.preventClicks){var r;n.preventDefault(),e.hasRun=\"HTML\"===t.tagName,e.preventClicks=!e.hasRun,r=t,e.hasRun||\"HTML\"===r.parentNode.tagName||Array.from(r.parentNode.childNodes).filter(e=>e!==r).forEach(e=>e.remove()),document.body.classList.add(\"a11y-tools-isolator-has-run\"),o(t)}}),t.addEventListener(\"mouseover\",e=>{e.stopPropagation(),o(t)}),t.addEventListener(\"mouseout\",()=>{e.currentEl?.classList.remove(\"isolatorHighlight\")})}),function e(){let t=document.createElement(\"style\");t.textContent=`.isolatorHighlight {outline: 4px solid black !important;outline-offset: -4px !important;box-shadow: 0px 0px 0px 4px #fff;}#infoPanel {z-index: 1000;font-size: 16px;background: rgba(0,0,0,0.9);color: #fff;font-weight: bold;padding: 15px;position: fixed;bottom: 20px;left: 20px;font-family: 'Courier New', monospace;visibility: hidden;max-width: calc(100vw - 40px);border-radius: 8px;line-height: 1.4;}#infoPanel:not(:empty) {visibility: visible;}#infoPanel .xpath {color: lime;margin-bottom: 8px;overflow-x: auto;white-space: nowrap;}#infoPanel .html {color: #87CEEB;margin-bottom: 8px;overflow-x: auto;white-space: nowrap;}#infoPanel .instruction {color: #FFD700;font-size: 14px;}`,document.head.appendChild(t)}(),t.innerHTML='<div class=\"instruction\">Isolator started. Click on element you want to isolate in the DOM</div>'}isolate()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"DOM manipulation","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: DOM manipulation.json","download":{"name":"Isolator","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";function getXpath(e){let t=\"\",o=e;for(;o&&o.parentNode;){if(!o.tagName){o=o.parentNode;continue}let n=o.tagName.toLowerCase(),r=o.parentNode,i=r.querySelectorAll(`:scope > ${n}`),l=i.length>1?`[${Array.from(i).indexOf(o)+1}]`:\"\";t=t?`${n}${l}/${t}`:`${n}${l}`,o=r}return`//${t}`}function getElementHTML(e){if(!e)return\"\";let t=e.cloneNode(!1),o=t.outerHTML;if(o=o.replace(/</g,\"&lt;\").replace(/>/g,\"&gt;\"),e.childNodes.length>0){let n=e.tagName.toLowerCase(),r=`&lt;/${n}&gt;`;o=(o=(o=(o=o.replace(r,`...${r}`)).replace(\" isolatorHighlight\",\"\")).replace(\"isolatorHighlight\",\"\")).replace(' class=\" \"',\"\")}return o}function isolate(){let e={currentEl:null,preventClicks:!0,hasRun:!1},t=(()=>{let e=document.createElement(\"div\");return e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e})();function o(o,n=!0,r=!1){if(!o)return;e.currentEl&&e.currentEl.classList.remove(\"isolatorHighlight\"),e.currentEl=o,n&&!e.hasRun&&o.classList.add(\"isolatorHighlight\");let i=getXpath(o),l=getElementHTML(o),a=`<div class=\"xpath\">${i}</div>`;a+=`<div class=\"html\">${l}</div>`,(r||!e.hasRun)&&(a+='<div class=\"instruction\">Press ENTER to isolate this element</div>'),t.innerHTML=a}let n={ArrowUp(t){t.preventDefault(),e.currentEl?.parentNode?.tagName!==\"HTML\"&&o(e.currentEl.parentNode,!0,!0)},ArrowLeft(t){t.preventDefault(),o(e.currentEl?.previousElementSibling)},ArrowRight(t){t.preventDefault(),o(e.currentEl?.nextElementSibling)},ArrowDown(t){t.preventDefault();let n=Array.from(e.currentEl?.childNodes||[]).find(e=>1===e.nodeType);o(n)},Enter(t){t.preventDefault(),e.currentEl?.click()}};document.addEventListener(\"keydown\",e=>{let t=n[e.key];t&&t(e)}),document.querySelectorAll(\"*\").forEach(t=>{t.addEventListener(\"click\",n=>{if(e.preventClicks){var r;n.preventDefault(),e.hasRun=\"HTML\"===t.tagName,e.preventClicks=!e.hasRun,r=t,e.hasRun||\"HTML\"===r.parentNode.tagName||Array.from(r.parentNode.childNodes).filter(e=>e!==r).forEach(e=>e.remove()),document.body.classList.add(\"a11y-tools-isolator-has-run\"),o(t)}}),t.addEventListener(\"mouseover\",e=>{e.stopPropagation(),o(t)}),t.addEventListener(\"mouseout\",()=>{e.currentEl?.classList.remove(\"isolatorHighlight\")})}),function e(){let t=document.createElement(\"style\");t.textContent=`.isolatorHighlight {outline: 4px solid black !important;outline-offset: -4px !important;box-shadow: 0px 0px 0px 4px #fff;}#infoPanel {z-index: 1000;font-size: 16px;background: rgba(0,0,0,0.9);color: #fff;font-weight: bold;padding: 15px;position: fixed;bottom: 20px;left: 20px;font-family: 'Courier New', monospace;visibility: hidden;max-width: calc(100vw - 40px);border-radius: 8px;line-height: 1.4;}#infoPanel:not(:empty) {visibility: visible;}#infoPanel .xpath {color: lime;margin-bottom: 8px;overflow-x: auto;white-space: nowrap;}#infoPanel .html {color: #87CEEB;margin-bottom: 8px;overflow-x: auto;white-space: nowrap;}#infoPanel .instruction {color: #FFD700;font-size: 14px;}`,document.head.appendChild(t)}(),t.innerHTML='<div class=\"instruction\">Isolator started. Click on element you want to isolate in the DOM</div>'}isolate()})()","description":"Isolate any part of the page with a single click (also keyboard-operable).","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"Alwaystwisted.com: No-JS Toggle.json-0-0","name":"JS/No-JS Toggle","description":"Toggles between the js and no-js classes on the HTML element.","language":"javascript","executionMode":"activate","content":"(function(){var htmlElement=document.documentElement;if(htmlElement.classList.contains('js')){htmlElement.classList.remove('js');htmlElement.classList.add('no-js');}else{htmlElement.classList.remove('no-js');htmlElement.classList.add('js');}})();","author":"Stuart Robson","authorUrl":"https://www.alwaystwisted.com","categories":["JavaScript"],"folderName":null,"folderDescription":null,"sourceFile":"Alwaystwisted.com: No-JS Toggle.json","download":{"name":"JS/No-JS Toggle","language":"javascript","executionMode":"activate","content":"(function(){var htmlElement=document.documentElement;if(htmlElement.classList.contains('js')){htmlElement.classList.remove('js');htmlElement.classList.add('no-js');}else{htmlElement.classList.remove('no-js');htmlElement.classList.add('js');}})();","description":"Toggles between the js and no-js classes on the HTML element.","author":"Stuart Robson","categories":["JavaScript"]}}

{"id":"lang outliner.json-0-0","name":"Lang outliner","description":"Show all areas with a set language","language":"css","executionMode":"load","content":"[lang] {\n  outline: 2px solid rgba(71, 128, 180, 1);\n}\n[lang]::before {\n  content: attr(lang);\n  display: block;\n  position: absolute;\n  color: black;\n  background: rgba(71, 128, 180, 1);\n  padding: 0.5em;\n  font-family: monospace;\n}\n","author":"Polypane","authorUrl":null,"categories":["Accessibility","Language"],"folderName":null,"folderDescription":null,"sourceFile":"lang outliner.json","download":{"name":"Lang outliner","language":"css","executionMode":"load","content":"[lang] {\n  outline: 2px solid rgba(71, 128, 180, 1);\n}\n[lang]::before {\n  content: attr(lang);\n  display: block;\n  position: absolute;\n  color: black;\n  background: rgba(71, 128, 180, 1);\n  padding: 0.5em;\n  font-family: monospace;\n}\n","description":"Show all areas with a set language","author":"Polypane","categories":["Accessibility","Language"]}}

{"id":"A11y-tools.com: Assistive tech.json-0-1","name":"Live Region Watcher","description":"Keeps track of changes to any live region (visible and hidden).","language":"javascript","executionMode":"activate","content":"(function(){function watchLiveRegions(){const config = { childList: true, subtree: true, characterData: true };const callback = function(mutationsList, observer) {for(let mutation of mutationsList) {console.log(\"---\");console.log(\"Live region changed:\", mutation.target.getAttribute(\"id\"));if (mutation.type === 'childList') {console.log('A child node has been added or removed.');} else if (mutation.type === 'subtree') {console.log('The subtree was modified.');} else if (mutation.type === 'characterData') {console.log('The text content of a node has changed.');}console.log(\"Inner content:\", mutation.target.innerHTML);}};var a = document.createElement(\"style\"),b;document.head.appendChild(a);b = a.sheet;b.insertRule(\".identified-live-region {outline:4px solid red;outline-offset:4px;}\", 0);const observer = new MutationObserver(callback);const allLiveRegions = document.querySelectorAll(\"[role=alert],[role=log],[role=marquee],[role=status],[aria-live]\");if (allLiveRegions.length>0) {alert(allLiveRegions.length + \" live regions found. Open Dev Tools > Console for details\");console.log(\"Live regions found:\");Array.from(allLiveRegions).forEach(liveRegion => {liveRegion.classList.add(\"identified-live-region\");observer.observe(liveRegion, config);console.log(\"id:\", liveRegion.getAttribute(\"id\"));console.log(\"role:\", liveRegion.getAttribute(\"role\"));console.log(\"aria-live:\", liveRegion.getAttribute(\"aria-live\"));console.log(\"aria-atomic:\", liveRegion.getAttribute(\"aria-atomic\"));console.log(\"aria-relevant:\", liveRegion.getAttribute(\"aria-relevant\"));console.log(\"Inner content:\", liveRegion.innerHTML);console.log(\"================================================\");});console.log(\"Changes to live region content will update below as they happen.\");} else {alert(\"No live regions found on this page\");}}watchLiveRegions()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Assistive technology"],"folderName":"Assistive tech","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Assistive tech.json","download":{"name":"Live Region Watcher","language":"javascript","executionMode":"activate","content":"(function(){function watchLiveRegions(){const config = { childList: true, subtree: true, characterData: true };const callback = function(mutationsList, observer) {for(let mutation of mutationsList) {console.log(\"---\");console.log(\"Live region changed:\", mutation.target.getAttribute(\"id\"));if (mutation.type === 'childList') {console.log('A child node has been added or removed.');} else if (mutation.type === 'subtree') {console.log('The subtree was modified.');} else if (mutation.type === 'characterData') {console.log('The text content of a node has changed.');}console.log(\"Inner content:\", mutation.target.innerHTML);}};var a = document.createElement(\"style\"),b;document.head.appendChild(a);b = a.sheet;b.insertRule(\".identified-live-region {outline:4px solid red;outline-offset:4px;}\", 0);const observer = new MutationObserver(callback);const allLiveRegions = document.querySelectorAll(\"[role=alert],[role=log],[role=marquee],[role=status],[aria-live]\");if (allLiveRegions.length>0) {alert(allLiveRegions.length + \" live regions found. Open Dev Tools > Console for details\");console.log(\"Live regions found:\");Array.from(allLiveRegions).forEach(liveRegion => {liveRegion.classList.add(\"identified-live-region\");observer.observe(liveRegion, config);console.log(\"id:\", liveRegion.getAttribute(\"id\"));console.log(\"role:\", liveRegion.getAttribute(\"role\"));console.log(\"aria-live:\", liveRegion.getAttribute(\"aria-live\"));console.log(\"aria-atomic:\", liveRegion.getAttribute(\"aria-atomic\"));console.log(\"aria-relevant:\", liveRegion.getAttribute(\"aria-relevant\"));console.log(\"Inner content:\", liveRegion.innerHTML);console.log(\"================================================\");});console.log(\"Changes to live region content will update below as they happen.\");} else {alert(\"No live regions found on this page\");}}watchLiveRegions()})()","description":"Keeps track of changes to any live region (visible and hidden).","author":"Ian Lloyd","categories":["Assistive technology"]}}

{"id":"A11y-tools.com: Misc.json-0-2","name":"Look up HTML Reference","description":"Provides a quick and easy way to look up HTML references on WhatWG and MDN reference, then copy the URL as markdown/HTML More details about 'Look up HTML Reference'","language":"javascript","executionMode":"activate","content":"(function(){let wwg=\"https://html.spec.whatwg.org/multipage\",mdn=\"https://developer.mozilla.org/en-US/docs/Web\",el=\"HTML element\",att=\"HTML attribute\",a=\"ARIA attribute\",noMdnEntry=\"‼️ No page exists for this at MDN\";function lookUpHTML(){if(console.clear(),!window.htmlData){console.error(\"HTML data not loaded. Make sure data-source.js is included before this script.\"),alert(\"HTML data not available. Please ensure the extension is properly installed.\");return}let e=window.htmlData,t=document.getElementById(\"a11y-tools-shadow-host\");if(t){let l=document.querySelectorAll('[aria-hidden=\"true\"]');l.forEach(e=>{e!==t&&e.removeAttribute(\"aria-hidden\")});let r=document.querySelectorAll('[tabindex=\"-1\"]');r.forEach(e=>{e.removeAttribute(\"tabindex\")}),document.body.removeChild(t)}let n=document.activeElement,i=null,o=-1,m=[],d=null,c=document.createElement(\"div\");c.setAttribute(\"id\",\"a11y-tools-shadow-host\"),c.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9999;pointer-events: none;`;let s=c.attachShadow({mode:\"closed\"}),g=\"\",w=!1;\"undefined\"!=typeof openInSidebar&&openInSidebar&&(w=!0,g=`#a11y-tools-data-lookup {width: 100%;height: 100%;max-width: none;max-height: none;top:0;bottom:0;outline:0;border:0;}#data-list {max-height: 70vh;}`);let h=document.createElement(\"style\");h.textContent=`/* Reset all default styles */*, *::before, *::after {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;box-sizing: border-box;line-height: 1;}/* Basic styling for all elements */* {font-family: Arial, sans-serif;color: inherit;background: transparent;text-decoration: none;list-style: none;}/* Specific component styles */#a11y-tools-modal-backdrop {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 9999;pointer-events: all;}#a11y-tools-data-lookup {background: white;background: #e4efe4;color: black;position: fixed;top: 2em;left: 50%;transform: translate(-50%, 0);border: 2px solid #333;padding: 20px;box-shadow: 0 4px 20px rgba(0,0,0,0.5);z-index: 10000;font-family: Arial, sans-serif;max-width: 90vw;width: 60em;max-height: 80vh;overflow: hidden;display: flex;flex-direction: column;pointer-events: all;}#a11y-tools-data-lookup h1 {margin: 0 0 15px 0;color: #333;font-size: 20px;font-weight: bold;line-height: 1.2;}#a11y-tools-data-lookup input[type=\"text\"] {background: white;color: black;width: 100%;padding: 12px;border: 2px solid #235f20;font-size: 16px;margin-bottom: 16px;box-sizing: border-box;border-radius: 5px;}#a11y-tools-data-lookup input[type=\"text\"]:focus {outline: 3px solid #235f20;outline-offset: 3px;}#a11y-tools-data-lookup button {border-radius: 5px;}#a11y-tools-data-lookup button:focus {outline: 3px solid #235f20;outline-offset: 3px;}.search-hint {font-size: 12px;color: #666;margin-bottom: 10px;line-height: 1.3;}#data-list:empty {display:none!important;}#data-list {max-height: 300px;overflow-y: auto;border: 1px solid #ccc;margin: 0 0 15px 0;padding: 0;list-style: none;background: #f9f9f9;}#data-list li {padding: 10px;cursor: pointer;border-bottom: 1px solid #eee;background: white;line-height: 1.4;}#data-list li:hover,#data-list li.hover {background: #0f380d;}#data-list li:hover *,#data-list li.hover * {color: white!important;}#selection-made {border: 1px solid #235f20;padding: 10px;margin-bottom: 15px;background: #f2fff0;display: none;border-radius: 3px;}#selection-made strong {display: block;margin-bottom: 5px;font-weight: bold;}.selection-text {font-family: monospace;font-size: 14px;line-height: 1.3;}#selection-made:focus {outline: 3px solid #235f20;outline-offset: 3px;}.buttons-container {display: none;gap: 10px;flex-wrap: wrap;}.action-button {background: #235f20;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin: 5px 5px 5px 0;border-radius: 3px;}.action-button:hover {background: #0f380d;}.secondary-button {background: #666;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin-top: 10px;border-radius: 3px;}.secondary-button:hover {background: #444;}.category {color:white;background:gray;padding:0.2em;font-size:0.8em;border-radius:5px;outline:1px solid white;}.element {background:#173b4e;}.attribute {background:#295f19;}.ARIA {background:#65395b;}/* Radio button options styling */.radio-options {display: none;border: 1px solid #235f20;padding: 10px;margin-bottom: 15px;background: #f2fff0;border-radius: 3px;}.radio-options fieldset {border: none;margin: 0;padding: 0;}.radio-options legend {font-weight: bold;margin-bottom: 8px;color: #235f20;font-size: 14px;}.radio-options-container {display: flex;gap: 20px;flex-wrap: wrap;}.radio-option {margin: 0;display: flex;align-items: center;gap: 8px;}.radio-option input[type=\"radio\"] {width: auto;margin: 0;padding: 0;border: none;background: none;font-size: inherit;}.radio-option input[type=\"radio\"]:focus {outline: 2px solid #235f20;outline-offset: 2px;}.radio-option label {cursor: pointer;font-size: 14px;line-height: 1.3;color: #333;}/* Notification panel styles */#notification-panel {position: fixed;bottom: 20px;left: 20px;right: 20px;background: #2d5016;color: white;padding: 15px 20px;border-radius: 8px;border: 2px solid #4a7c2a;box-shadow: 0 4px 12px rgba(0,0,0,0.3);z-index: 10001;width:calc(100%-40px);font-family: Arial, sans-serif;font-size: 14px;line-height: 1.4;opacity: 0;transform: translateX(100%);pointer-events: all;}#notification-panel.show {opacity: 1;transform: translateX(0);}#notification-panel .notification-title {font-weight: bold;margin-bottom: 8px;color: #a8d982;}#notification-panel .notification-content {font-family: monospace;background: rgba(255,255,255,0.1);padding: 8px;border-radius: 4px;border: 1px solid rgba(255,255,255,0.2);word-break: break-all;}${g}`;let U=[],y=Array.from(document.body.children);y.forEach(e=>{e!==c&&(U.push({element:e,originalAriaHidden:e.getAttribute(\"aria-hidden\")}),e.setAttribute(\"aria-hidden\",\"true\"))});let u=Array.from(document.querySelectorAll('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex=\"-1\"]), [contenteditable]')),b=[];u.forEach(e=>{b.push({element:e,originalTabIndex:e.getAttribute(\"tabindex\")}),e.setAttribute(\"tabindex\",\"-1\")});let p=document.createElement(\"div\");p.setAttribute(\"id\",\"a11y-tools-modal-backdrop\");let A=document.createElement(\"div\");w||(A.setAttribute(\"role\",\"dialog\"),A.setAttribute(\"aria-modal\",\"true\")),A.setAttribute(\"id\",\"a11y-tools-data-lookup\"),A.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\");let f=document.createElement(\"h1\");f.textContent=\"Look up HTML reference\",f.setAttribute(\"id\",\"a11y-tools-lookup-dialog-header\");let R=document.createElement(\"input\");R.type=\"text\",R.placeholder=\"Type to search/filter\",R.setAttribute(\"spellcheck\",\"false\"),R.setAttribute(\"role\",\"combobox\"),R.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),R.setAttribute(\"aria-controls\",\"data-list\"),R.setAttribute(\"aria-expanded\",\"false\"),R.setAttribute(\"aria-autocomplete\",\"list\"),R.setAttribute(\"aria-describedby\",\"search-hint\");let M=document.createElement(\"ul\");M.setAttribute(\"role\",\"listbox\"),M.setAttribute(\"tabindex\",\"0\"),M.setAttribute(\"id\",\"data-list\"),M.setAttribute(\"aria-label\",\"HTML elements\");let L=document.createElement(\"div\");L.setAttribute(\"id\",\"selection-made\"),L.setAttribute(\"tabindex\",\"-1\");let T=document.createElement(\"strong\");T.textContent=\"Selected:\";let N=document.createElement(\"div\");N.className=\"selection-text\",L.appendChild(T),L.appendChild(N);let E=document.createElement(\"div\");E.className=\"buttons-container\";let H=document.createElement(\"div\");H.setAttribute(\"id\",\"notification-panel\"),H.setAttribute(\"role\",\"status\"),H.setAttribute(\"aria-live\",\"polite\");let x=document.createElement(\"div\");x.className=\"notification-title\";let $=document.createElement(\"div\");function v(e,t){d&&clearTimeout(d),x.textContent=e,$.textContent=t,H.classList.add(\"show\"),d=setTimeout(()=>{H.classList.remove(\"show\")},5e3)}$.className=\"notification-content\",H.appendChild(x),H.appendChild($);let k=[{text:\"Copy MDN page URL as Markdown Link (1)\",key:\"1\",action:\"MDNpageMarkdown\"},{text:\"Copy MDN page URL as HTML Link (2)\",key:\"2\",action:\"MDNpageHtml\"},{text:\"Go to MDN ref page (3)\",key:\"3\",action:\"gotoMDNpage\"},{text:\"Copy HTML spec URL as Markdown Link (4)\",key:\"4\",action:\"HTMLspecMarkdown\"},{text:\"Copy HTML spec URL as HTML Link (5)\",key:\"5\",action:\"HTMLspecHtml\"},{text:\"Go to HTML spec page (6)\",key:\"6\",action:\"gotoHTMLspec\"},],_=document.createElement(\"button\");_.textContent=\"Close (Escape)\",_.className=\"secondary-button\";let I=document.createElement(\"button\");function C(){d&&clearTimeout(d),U.forEach(({element:e,originalAriaHidden:t})=>{null===t?e.removeAttribute(\"aria-hidden\"):e.setAttribute(\"aria-hidden\",t)}),b.forEach(({element:e,originalTabIndex:t})=>{null===t?e.removeAttribute(\"tabindex\"):e.setAttribute(\"tabindex\",t)}),document.body.removeChild(c),n.focus()}function D(e){let t=A.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"])'),l=t[0],r=t[t.length-1];\"Tab\"===e.key&&(e.shiftKey?s.activeElement===l&&(e.preventDefault(),r.focus()):s.activeElement===r&&(e.preventDefault(),l.focus()))}function z(){}function S(t){if(m=e.filter(e=>{if(0===t.length)return!0;let l=e.title.toLowerCase(),r=t.toLowerCase(),n=l.match(/[a-z0-9]+/g)||[],i=r.match(/[a-z0-9]+/g)||[];return 0!==i.length&&i.every(e=>n.some(t=>t.startsWith(e)))}),M.innerHTML=\"\",o=-1,R.setAttribute(\"aria-expanded\",m.length>0?\"true\":\"false\"),0===m.length){let l=document.createElement(\"li\");l.textContent=\"No HTML element or attribute found that matches this filtering\",l.style.cssText=\"padding: 10px; color: #666; font-style: italic;\",M.appendChild(l);return}m.forEach((e,t)=>{let l=document.createElement(\"li\");l.setAttribute(\"role\",\"option\"),l.setAttribute(\"id\",`option-${t}`);let r=e.category,n=e.title.replace(\"<\",\"&lt;\").replace(\">\",\"&gt;\");l.innerHTML='<span style=\"font-weight:bold\">'+n+' <span class=\"category '+r+'\">'+e.category+\"</span></span>\",l.dataset.index=t,l.dataset.whatwgUrl=e.whatwgUrl,l.dataset.title=e.title,l.onmouseenter=()=>{o=t,B()},l.onclick=()=>F(e),M.appendChild(l)})}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase();console.log(\"Debug - Title:\",e),console.log(\"Debug - Query:\",t);let n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(console.log(\"Debug - Title words:\",n),console.log(\"Debug - Query words:\",i),0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(console.log(\"Debug - Starts with match:\",o),o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\"),d=m.includes(i[0]);return console.log(\"Debug - Concatenated title:\",m),console.log(\"Debug - Concat match:\",d),d}return console.log(\"Debug - Final result: false\"),!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase();console.log(\"Debug - Title:\",e),console.log(\"Debug - Query:\",t);let n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(console.log(\"Debug - Title words:\",n),console.log(\"Debug - Query words:\",i),0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(console.log(\"Debug - Starts with match:\",o),o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\"),d=m.includes(i[0]);return console.log(\"Debug - Concatenated title:\",m),console.log(\"Debug - Concat match:\",d),d}return console.log(\"Debug - Final result: false\"),!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\");return m.includes(i[0])}return!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));return!!o||q(n,i)}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.includes(e)));return!!o||j(n,i)||q(l,i)}function j(e,t){return t.every(t=>e.some(e=>e.includes(t)||e.length>=2&&t.includes(e)))}function q(e,t){let l=e.replace(/\\s+/g,\"\");return t.every(e=>!!l.includes(e)||e.length>=2&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.includes(e)));return!!o||j(n,i)||q(l,i)}function j(e,t){return t.every(t=>e.some(e=>e.includes(t)||t.includes(e)))}function q(e,t){let l=e.replace(/\\s+/g,\"\");return t.every(e=>!!l.includes(e)||e.length>=2&&l.includes(e))}function B(){let e=M.querySelectorAll('li[role=\"option\"]');e.forEach((e,t)=>{t===o?(e.classList.add(\"hover\"),R.setAttribute(\"aria-activedescendant\",e.id),e.scrollIntoView({block:\"nearest\"})):e.classList.remove(\"hover\")})}function F(e){M.setAttribute(\"tabindex\",\"-1\"),i=e;let t=e.title;N.textContent=t,L.style.display=\"block\",L.focus(),function e(t){E.innerHTML=\"\";let l=\"attribute\"===t.category||\"ARIA\"===t.category,r=l?k.slice(0,3):k;r.forEach(e=>{let t=document.createElement(\"button\");t.textContent=e.text,t.className=\"action-button\",t.onclick=()=>W(e.action),E.appendChild(t)})}(e),E.style.display=\"flex\",I.style.display=\"block\",R.value=t,M.innerHTML=\"\",R.setAttribute(\"aria-expanded\",\"false\")}function W(e){if(!i)return;let t=i.title,l;switch(e){case\"HTMLspecMarkdown\":l=`[WhatWG - ${t} ${i.category}](${i.whatwgUrl})`;break;case\"HTMLspecHtml\":l=`<a href=\"${i.whatwgUrl}\">WhatWG: ${t} ${i.category}</a>`;break;case\"gotoHTMLspec\":window.open(i.whatwgUrl,\"_blank\");return;case\"MDNpageMarkdown\":l=`[MDN - ${t} ${i.category}](${i.mdnUrl})`;break;case\"MDNpageHtml\":l=`<a href=\"${i.mdnUrl}\">MDN: ${t} ${i.category}</a>`;break;case\"gotoMDNpage\":window.open(i.mdnUrl,\"_blank\");return}navigator.clipboard.writeText(l).then(()=>{v(\"Copied to clipboard!\",l)}).catch(()=>{console.log(l),v(\"Could not copy to clipboard\",\"Details pasted to console\")})}I.textContent=\"Start again\",I.className=\"secondary-button\",_.addEventListener(\"click\",C),I.addEventListener(\"click\",function e(){M.setAttribute(\"tabindex\",\"0\"),L.style.display=\"none\",E.style.display=\"none\",I.style.display=\"none\",R.value=\"\",i=null,o=-1,S(\"\"),R.focus()}),p.addEventListener(\"click\",e=>{e.target===p&&C()}),R.oninput=e=>{i&&(i=null,o=-1,L.style.display=\"none\",E.style.display=\"none\",I.style.display=\"none\",M.setAttribute(\"tabindex\",\"0\")),S(e.target.value)},R.onfocus=e=>{i&&setTimeout(()=>{R.select()},0)},R.onkeydown=e=>{D(e);let t=M.querySelectorAll('li[role=\"option\"]');switch(e.key){case\"ArrowDown\":e.preventDefault(),o<t.length-1&&(o++,B());break;case\"ArrowUp\":e.preventDefault(),o>0&&(o--,B());break;case\"Enter\":e.preventDefault(),o>=0&&m[o]&&F(m[o]);break;case\"Escape\":w||(e.preventDefault(),C())}},A.addEventListener(\"keydown\",e=>{if(D(e),\"Escape\"!==e.key||w||(e.preventDefault(),C()),i&&e.key>=\"1\"&&e.key<=\"6\"&&s.activeElement!==R){let t=parseInt(e.key),l=\"attribute\"===i.category||\"ARIA attribute\"===i.category;(!l||!(t>3))&&(e.preventDefault(),W([\"MDNpageMarkdown\",\"MDNpageHtml\",\"gotoMDNpage\",\"HTMLspecMarkdown\",\"HTMLspecHtml\",\"gotoHTMLspec\"][t-1]))}}),A.appendChild(f),A.appendChild(R),A.appendChild(M),A.appendChild(L),A.appendChild(E),A.appendChild(I),I.style.display=\"none\",\"undefined\"==typeof openInSidebar&&A.appendChild(_),p.appendChild(A),p.appendChild(H),s.appendChild(h),s.appendChild(p),document.body.appendChild(c),R.focus(),S(\"\")}window.htmlData=[{whatwgUrl:wwg+\"/text-level-semantics.html#the-a-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/a\",title:\"`a` (Anchor)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-abbr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/abbr\",title:\"`abbr` (Abbreviation)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-address-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/address\",title:\"`address` (Contact Address)\",category:el},{whatwgUrl:wwg+\"/image-maps.html#the-area-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/area\",title:\"`area` (Image Map Area)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-article-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/article\",title:\"`article` (Article Contents)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-aside-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/aside\",title:\"`aside` (Aside)\",category:el},{whatwgUrl:wwg+\"/media.html#the-audio-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/audio\",title:\"`audio` (Embed Audio)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-b-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/b\",title:\"`b` (Bring Attention To)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-base-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/base\",title:\"`base` (Document Base URL)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-bdi-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/bdi\",title:\"`bdi` (Bidirectional Isolate)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-bdo-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/bdo\",title:\"`bdo` (Bidirectional Text Override)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-blockquote-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/blockquote\",title:\"`blockquote` (Block Quotation)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-body-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/body\",title:\"`body` (Document Body)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-br-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/br\",title:\"`br` (Line Break)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-button-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/button\",title:\"`button` (Button)\",category:el},{whatwgUrl:wwg+\"/canvas.html#the-canvas-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/canvas\",title:\"`canvas` (Graphics Canvas)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-caption-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/caption\",title:\"`caption` (Table Caption)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-cite-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/cite\",title:\"`cite` (Citation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-code-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/code\",title:\"`code` (Inline Code)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-col-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/col\",title:\"`col` (Table Column)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-colgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/colgroup\",title:\"`colgroup` (Table Column Group)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-data-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/data\",title:\"`data` (Data)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-datalist-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/datalist\",title:\"`datalist` (HTML Data List)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dd-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dd\",title:\"`dd` (Description Details)\",category:el},{whatwgUrl:wwg+\"/edits.html#the-del-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/del\",title:\"`del` (Deleted Text)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-details-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/details\",title:\"`details` (Details disclosure)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-dfn-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dfn\",title:\"`dfn` (Definition)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-dialog-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dialog\",title:\"`dialog` (Dialog)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-div-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/div\",title:\"`div` (Content Division)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dl-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dl\",title:\"`dl` (Description List)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dt-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dt\",title:\"`dt` (Description Term)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-em-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/em\",title:\"`em` (Emphasis)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-embed-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/embed\",title:\"`embed` (Embed External Content)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-fieldset-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/fieldset\",title:\"`fieldset` (Field Set)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-figcaption-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/figcaption\",title:\"`figcaption` (Figure Caption)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-figure-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/figure\",title:\"`figure` (Figure with Optional Caption)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-footer-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/footer\",title:\"`footer` (Footer)\",category:el},{whatwgUrl:wwg+\"/forms.html#the-form-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/form\",title:\"`form` (Form)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-head-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/head\",title:\"`head` (Document Metadata (Header))\",category:el},{whatwgUrl:wwg+\"/sections.html#the-header-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/header\",title:\"`header` (Header)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-hgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/hgroup\",title:\"`hgroup` (Heading Group)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-hr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/hr\",title:\"`hr` (Thematic Break (Horizontal Rule))\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-html-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/html\",title:\"`html` (HTML Document / Root)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-i-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/i\",title:\"`i` (Idiomatic Text)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-iframe-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe\",title:\"`iframe` (Inline Frame)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-img-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/img\",title:\"`img` (Image Embed)\",category:el},{whatwgUrl:wwg+\"/input.html#the-input-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/input\",title:\"`input` (HTML Input)\",category:el},{whatwgUrl:wwg+\"/edits.html#the-ins-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ins\",title:\"`ins` (Inserted Text)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-kbd-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/kbd\",title:\"`kbd` (Keyboard Input)\",category:el},{whatwgUrl:wwg+\"/forms.html#the-label-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/label\",title:\"`label` (Label)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-legend-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/legend\",title:\"`legend` (Field Set Legend)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-li-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/li\",title:\"`li` (List Item)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-link-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/link\",title:\"`link` (External Resource Link)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-main-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/main\",title:\"`main` (Main)\",category:el},{whatwgUrl:wwg+\"/image-maps.html#the-map-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/map\",title:\"`map` (Image Map)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-mark-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/mark\",title:\"`mark` (Mark Text)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-menu-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/menu\",title:\"`menu` (Menu)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-meta-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta\",title:\"`meta` (metadata)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-meter-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter\",title:\"`meter` (HTML Meter)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-nav-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/nav\",title:\"`nav` (Navigation Section)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-noscript-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/noscript\",title:\"`noscript` (Noscript)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-object-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/object\",title:\"`object` (External Object)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-ol-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol\",title:\"`ol` (Ordered List)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-optgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/optgroup\",title:\"`optgroup` (Option Group)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-option-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/option\",title:\"`option` (HTML Option)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-output-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/output\",title:\"`output` (Output)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-p-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/p\",title:\"`p` (Paragraph)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-param-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/param\",title:\"`param` (Object Parameter)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-picture-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/picture\",title:\"`picture` (Picture)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-pre-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/pre\",title:\"`pre` (Preformatted Text)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-progress-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/progress\",title:\"`progress` (Progress Indicator)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-q-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/q\",title:\"`q` (Inline Quotation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-rp-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/rp\",title:\"`rp` (Ruby Fallback Parenthesis)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-rt-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/rt\",title:\"`rt` (Ruby Text)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-ruby-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ruby\",title:\"`ruby` (Ruby Annotation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-s-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/s\",title:\"`s` (Strikethrough)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-samp-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/samp\",title:\"`samp` (Sample Output)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-script-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/script\",title:\"`script` (Script)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-section-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/section\",title:\"`section` (Generic Section)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-select-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/select\",title:\"`select` (HTML Select)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-slot-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/slot\",title:\"`slot` (Web Component Slot)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-small-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/small\",title:\"`small` (Side Comment)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-source-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/source\",title:\"`source` (Media or Image Source)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-span-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/span\",title:\"`span` (Content Span)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-strong-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/strong\",title:\"`strong` (Strong Importance)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-style-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/style\",title:\"`style` (Style Information)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-summary-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/summary\",title:\"`summary` (Disclosure Summary)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-table-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/table\",title:\"`table` (Table)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tbody-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tbody\",title:\"`tbody` (Table Body)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-td-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/td\",title:\"`td` (Table Data Cell)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-template-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/template\",title:\"`template` (Content Template)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-textarea-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea\",title:\"`textarea` (Textarea)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tfoot-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tfoot\",title:\"`tfoot` (Table Foot)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-th-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/th\",title:\"`th` (Table Header)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-thead-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/thead\",title:\"`thead` (Table Head)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-time-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/time\",title:\"`time` ((Date) Time)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-title-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/title\",title:\"`title` (Document Title)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tr\",title:\"`tr` (Table Row)\",category:el},{whatwgUrl:wwg+\"/media.html#the-track-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/track\",title:\"`track` (Embed Text Track)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-u-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/u\",title:\"`u` (Unarticulated Annotation (Underline))\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-ul-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ul\",title:\"`ul` (Unordered List)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-var-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/var\",title:\"`var` (Variable)\",category:el},{whatwgUrl:wwg+\"/media.html#the-video-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/video\",title:\"`video` (Video Embed)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-wbr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/wb\",title:\"`wbr` (Line Break Opportunity)\",category:el},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/accept\",title:\"`accept`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#accept-charset\",title:\"`accept-charset`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/accesskey\",title:\"`accesskey`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#allow\",title:\"`action`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#actionallow\",title:\"`actionallow`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/link#as\",title:\"`as`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#async\",title:\"`async`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/autocapitalize\",title:\"`autocapitalize`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/autocomplete\",title:\"`autocomplete`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/capture\",title:\"`capture`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta#charset\",title:\"`charset`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/input#checked\",title:\"`checked`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/class\",title:\"`class`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#cols\",title:\"`cols`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/content\",title:\"`content`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/contenteditable\",title:\"`contenteditable`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/area#coords\",title:\"`coords`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/crossorigin\",title:\"`crossorigin`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/API/HTMLIFrameElement/csp\",title:\"`csp`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/object#data\",title:\"`data`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/data-*\",title:\"`data-*`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/img#decoding\",title:\"`decoding`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#default\",title:\"`default`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#defer\",title:\"`defer`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/dir\",title:\"`dir`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/dirname\",title:\"`dirname`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/disabled\",title:\"`disabled`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/draggable\",title:\"`draggable`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#enctype\",title:\"`enctype`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/enterkeyhint\",title:\"`enterkeyhint`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/elementtiming\",title:\"`elementtiming`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/for\",title:\"`for`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/hidden\",title:\"`hidden`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#high\",title:\"`high`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta/http-equiv\",title:\"`http-equiv`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/id\",title:\"`id`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Security/Subresource_Integrity\",title:\"`integrity`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/img#ismap\",title:\"`ismap`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/itemprop\",title:\"`itemprop`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#kind\",title:\"`kind`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/lang\",title:\"`lang`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#language\",title:\"`language`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/input#list\",title:\"`list`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#low\",title:\"`low`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/max\",title:\"`max`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/maxlength\",title:\"`maxlength`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/minlength\",title:\"`minlength`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#method\",title:\"`method`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/min\",title:\"`min`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/multiple\",title:\"`multiple`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#novalidate\",title:\"`novalidate`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#optimum\",title:\"`optimum`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/pattern\",title:\"`pattern`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/a#ping\",title:\"`ping`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/placeholder\",title:\"`placeholder`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/video#playsinline\",title:\"`playsinline`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/video#poster\",title:\"`poster`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/readonly\",title:\"`readonly`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/rel\",title:\"`rel`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/required\",title:\"`required`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol#reversed\",title:\"`reversed`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Roles\",title:\"`role`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#rows\",title:\"`rows`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe#sandbox\",title:\"`sandbox`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/th#scope\",title:\"`scope`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/option#selected\",title:\"`selected`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/size\",title:\"`size`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/slot\",title:\"`slot`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/spellcheck\",title:\"`spellcheck`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe#srcdoc\",title:\"`srcdoc`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#srclang\",title:\"`srclang`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol#start\",title:\"`start`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/step\",title:\"`step`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/style\",title:\"`style`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/table#summary\",title:\"`summary`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/tabindex\",title:\"`tabindex`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/title\",title:\"`title`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/translate\",title:\"`translate`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#wrap\",title:\"`wrap`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-activedescendant\",title:\"`aria-activedescendant`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-atomic\",title:\"`aria-atomic`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-autocomplete\",title:\"`aria-autocomplete`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-busy\",title:\"`aria-busy`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-checked\",title:\"`aria-checked`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colcount\",title:\"`aria-colcount`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colindex\",title:\"`aria-colindex`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colspan\",title:\"`aria-colspan`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-controls\",title:\"`aria-controls`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-current\",title:\"`aria-current`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-describedby\",title:\"`aria-describedby`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-description\",title:\"`aria-description`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-details\",title:\"`aria-details`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-disabled\",title:\"`aria-disabled`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-dropeffect\",title:\"`aria-dropeffect`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-errormessage\",title:\"`aria-errormessage`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-expanded\",title:\"`aria-expanded`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-flowto\",title:\"`aria-flowto`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-grabbed\",title:\"`aria-grabbed`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-haspopup\",title:\"`aria-haspopup`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-hidden\",title:\"`aria-hidden`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-invalid\",title:\"`aria-invalid`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-keyshortcuts\",title:\"`aria-keyshortcuts`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-label\",title:\"`aria-label`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-labelledby\",title:\"`aria-labelledby`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-level\",title:\"`aria-level`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-live\",title:\"`aria-live`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-modal\",title:\"`aria-modal`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-multiline\",title:\"`aria-multiline`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-multiselectable\",title:\"`aria-multiselectable`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-orientation\",title:\"`aria-orientation`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-owns\",title:\"`aria-owns`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-placeholder\",title:\"`aria-placeholder`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-posinset\",title:\"`aria-posinset`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-pressed\",title:\"`aria-pressed`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-readonly\",title:\"`aria-readonly`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-relevant\",title:\"`aria-relevant`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-required\",title:\"`aria-required`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-roledescription\",title:\"`aria-roledescription`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowcount\",title:\"`aria-rowcount`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowindex\",title:\"`aria-rowindex`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowspan\",title:\"`aria-rowspan`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-selected\",title:\"`aria-selected`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-setsize\",title:\"`aria-setsize`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-sort\",title:\"`aria-sort`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuemax\",title:\"`aria-valuemax`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuemin\",title:\"`aria-valuemin`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuenow\",title:\"`aria-valuenow`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuetext\",title:\"`aria-valuetext`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`alt`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`autoplay`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`background`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`bgcolor`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`border`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`cite`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`color`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`colspan`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`controls`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`datetime`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`download`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`form`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formaction`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formenctype`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formmethod`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formnovalidate`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formtarget`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`headers`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`height`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`href`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`hreflang`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`inputmode`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`label`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`loading`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`loop`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`media`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`muted`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`name`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`open`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`preload`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`referrerpolicy`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`rowspan`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`shape`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`sizes`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`span`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`src`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`srcset`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`target`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`type`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`usemap`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`value`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`width`\"+noMdnEntry,category:att},],lookUpHTML()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"A11y-tools.com: Misc.","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Misc.json","download":{"name":"Look up HTML Reference","language":"javascript","executionMode":"activate","content":"(function(){let wwg=\"https://html.spec.whatwg.org/multipage\",mdn=\"https://developer.mozilla.org/en-US/docs/Web\",el=\"HTML element\",att=\"HTML attribute\",a=\"ARIA attribute\",noMdnEntry=\"‼️ No page exists for this at MDN\";function lookUpHTML(){if(console.clear(),!window.htmlData){console.error(\"HTML data not loaded. Make sure data-source.js is included before this script.\"),alert(\"HTML data not available. Please ensure the extension is properly installed.\");return}let e=window.htmlData,t=document.getElementById(\"a11y-tools-shadow-host\");if(t){let l=document.querySelectorAll('[aria-hidden=\"true\"]');l.forEach(e=>{e!==t&&e.removeAttribute(\"aria-hidden\")});let r=document.querySelectorAll('[tabindex=\"-1\"]');r.forEach(e=>{e.removeAttribute(\"tabindex\")}),document.body.removeChild(t)}let n=document.activeElement,i=null,o=-1,m=[],d=null,c=document.createElement(\"div\");c.setAttribute(\"id\",\"a11y-tools-shadow-host\"),c.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9999;pointer-events: none;`;let s=c.attachShadow({mode:\"closed\"}),g=\"\",w=!1;\"undefined\"!=typeof openInSidebar&&openInSidebar&&(w=!0,g=`#a11y-tools-data-lookup {width: 100%;height: 100%;max-width: none;max-height: none;top:0;bottom:0;outline:0;border:0;}#data-list {max-height: 70vh;}`);let h=document.createElement(\"style\");h.textContent=`/* Reset all default styles */*, *::before, *::after {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;box-sizing: border-box;line-height: 1;}/* Basic styling for all elements */* {font-family: Arial, sans-serif;color: inherit;background: transparent;text-decoration: none;list-style: none;}/* Specific component styles */#a11y-tools-modal-backdrop {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 9999;pointer-events: all;}#a11y-tools-data-lookup {background: white;background: #e4efe4;color: black;position: fixed;top: 2em;left: 50%;transform: translate(-50%, 0);border: 2px solid #333;padding: 20px;box-shadow: 0 4px 20px rgba(0,0,0,0.5);z-index: 10000;font-family: Arial, sans-serif;max-width: 90vw;width: 60em;max-height: 80vh;overflow: hidden;display: flex;flex-direction: column;pointer-events: all;}#a11y-tools-data-lookup h1 {margin: 0 0 15px 0;color: #333;font-size: 20px;font-weight: bold;line-height: 1.2;}#a11y-tools-data-lookup input[type=\"text\"] {background: white;color: black;width: 100%;padding: 12px;border: 2px solid #235f20;font-size: 16px;margin-bottom: 16px;box-sizing: border-box;border-radius: 5px;}#a11y-tools-data-lookup input[type=\"text\"]:focus {outline: 3px solid #235f20;outline-offset: 3px;}#a11y-tools-data-lookup button {border-radius: 5px;}#a11y-tools-data-lookup button:focus {outline: 3px solid #235f20;outline-offset: 3px;}.search-hint {font-size: 12px;color: #666;margin-bottom: 10px;line-height: 1.3;}#data-list:empty {display:none!important;}#data-list {max-height: 300px;overflow-y: auto;border: 1px solid #ccc;margin: 0 0 15px 0;padding: 0;list-style: none;background: #f9f9f9;}#data-list li {padding: 10px;cursor: pointer;border-bottom: 1px solid #eee;background: white;line-height: 1.4;}#data-list li:hover,#data-list li.hover {background: #0f380d;}#data-list li:hover *,#data-list li.hover * {color: white!important;}#selection-made {border: 1px solid #235f20;padding: 10px;margin-bottom: 15px;background: #f2fff0;display: none;border-radius: 3px;}#selection-made strong {display: block;margin-bottom: 5px;font-weight: bold;}.selection-text {font-family: monospace;font-size: 14px;line-height: 1.3;}#selection-made:focus {outline: 3px solid #235f20;outline-offset: 3px;}.buttons-container {display: none;gap: 10px;flex-wrap: wrap;}.action-button {background: #235f20;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin: 5px 5px 5px 0;border-radius: 3px;}.action-button:hover {background: #0f380d;}.secondary-button {background: #666;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin-top: 10px;border-radius: 3px;}.secondary-button:hover {background: #444;}.category {color:white;background:gray;padding:0.2em;font-size:0.8em;border-radius:5px;outline:1px solid white;}.element {background:#173b4e;}.attribute {background:#295f19;}.ARIA {background:#65395b;}/* Radio button options styling */.radio-options {display: none;border: 1px solid #235f20;padding: 10px;margin-bottom: 15px;background: #f2fff0;border-radius: 3px;}.radio-options fieldset {border: none;margin: 0;padding: 0;}.radio-options legend {font-weight: bold;margin-bottom: 8px;color: #235f20;font-size: 14px;}.radio-options-container {display: flex;gap: 20px;flex-wrap: wrap;}.radio-option {margin: 0;display: flex;align-items: center;gap: 8px;}.radio-option input[type=\"radio\"] {width: auto;margin: 0;padding: 0;border: none;background: none;font-size: inherit;}.radio-option input[type=\"radio\"]:focus {outline: 2px solid #235f20;outline-offset: 2px;}.radio-option label {cursor: pointer;font-size: 14px;line-height: 1.3;color: #333;}/* Notification panel styles */#notification-panel {position: fixed;bottom: 20px;left: 20px;right: 20px;background: #2d5016;color: white;padding: 15px 20px;border-radius: 8px;border: 2px solid #4a7c2a;box-shadow: 0 4px 12px rgba(0,0,0,0.3);z-index: 10001;width:calc(100%-40px);font-family: Arial, sans-serif;font-size: 14px;line-height: 1.4;opacity: 0;transform: translateX(100%);pointer-events: all;}#notification-panel.show {opacity: 1;transform: translateX(0);}#notification-panel .notification-title {font-weight: bold;margin-bottom: 8px;color: #a8d982;}#notification-panel .notification-content {font-family: monospace;background: rgba(255,255,255,0.1);padding: 8px;border-radius: 4px;border: 1px solid rgba(255,255,255,0.2);word-break: break-all;}${g}`;let U=[],y=Array.from(document.body.children);y.forEach(e=>{e!==c&&(U.push({element:e,originalAriaHidden:e.getAttribute(\"aria-hidden\")}),e.setAttribute(\"aria-hidden\",\"true\"))});let u=Array.from(document.querySelectorAll('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex=\"-1\"]), [contenteditable]')),b=[];u.forEach(e=>{b.push({element:e,originalTabIndex:e.getAttribute(\"tabindex\")}),e.setAttribute(\"tabindex\",\"-1\")});let p=document.createElement(\"div\");p.setAttribute(\"id\",\"a11y-tools-modal-backdrop\");let A=document.createElement(\"div\");w||(A.setAttribute(\"role\",\"dialog\"),A.setAttribute(\"aria-modal\",\"true\")),A.setAttribute(\"id\",\"a11y-tools-data-lookup\"),A.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\");let f=document.createElement(\"h1\");f.textContent=\"Look up HTML reference\",f.setAttribute(\"id\",\"a11y-tools-lookup-dialog-header\");let R=document.createElement(\"input\");R.type=\"text\",R.placeholder=\"Type to search/filter\",R.setAttribute(\"spellcheck\",\"false\"),R.setAttribute(\"role\",\"combobox\"),R.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),R.setAttribute(\"aria-controls\",\"data-list\"),R.setAttribute(\"aria-expanded\",\"false\"),R.setAttribute(\"aria-autocomplete\",\"list\"),R.setAttribute(\"aria-describedby\",\"search-hint\");let M=document.createElement(\"ul\");M.setAttribute(\"role\",\"listbox\"),M.setAttribute(\"tabindex\",\"0\"),M.setAttribute(\"id\",\"data-list\"),M.setAttribute(\"aria-label\",\"HTML elements\");let L=document.createElement(\"div\");L.setAttribute(\"id\",\"selection-made\"),L.setAttribute(\"tabindex\",\"-1\");let T=document.createElement(\"strong\");T.textContent=\"Selected:\";let N=document.createElement(\"div\");N.className=\"selection-text\",L.appendChild(T),L.appendChild(N);let E=document.createElement(\"div\");E.className=\"buttons-container\";let H=document.createElement(\"div\");H.setAttribute(\"id\",\"notification-panel\"),H.setAttribute(\"role\",\"status\"),H.setAttribute(\"aria-live\",\"polite\");let x=document.createElement(\"div\");x.className=\"notification-title\";let $=document.createElement(\"div\");function v(e,t){d&&clearTimeout(d),x.textContent=e,$.textContent=t,H.classList.add(\"show\"),d=setTimeout(()=>{H.classList.remove(\"show\")},5e3)}$.className=\"notification-content\",H.appendChild(x),H.appendChild($);let k=[{text:\"Copy MDN page URL as Markdown Link (1)\",key:\"1\",action:\"MDNpageMarkdown\"},{text:\"Copy MDN page URL as HTML Link (2)\",key:\"2\",action:\"MDNpageHtml\"},{text:\"Go to MDN ref page (3)\",key:\"3\",action:\"gotoMDNpage\"},{text:\"Copy HTML spec URL as Markdown Link (4)\",key:\"4\",action:\"HTMLspecMarkdown\"},{text:\"Copy HTML spec URL as HTML Link (5)\",key:\"5\",action:\"HTMLspecHtml\"},{text:\"Go to HTML spec page (6)\",key:\"6\",action:\"gotoHTMLspec\"},],_=document.createElement(\"button\");_.textContent=\"Close (Escape)\",_.className=\"secondary-button\";let I=document.createElement(\"button\");function C(){d&&clearTimeout(d),U.forEach(({element:e,originalAriaHidden:t})=>{null===t?e.removeAttribute(\"aria-hidden\"):e.setAttribute(\"aria-hidden\",t)}),b.forEach(({element:e,originalTabIndex:t})=>{null===t?e.removeAttribute(\"tabindex\"):e.setAttribute(\"tabindex\",t)}),document.body.removeChild(c),n.focus()}function D(e){let t=A.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"])'),l=t[0],r=t[t.length-1];\"Tab\"===e.key&&(e.shiftKey?s.activeElement===l&&(e.preventDefault(),r.focus()):s.activeElement===r&&(e.preventDefault(),l.focus()))}function z(){}function S(t){if(m=e.filter(e=>{if(0===t.length)return!0;let l=e.title.toLowerCase(),r=t.toLowerCase(),n=l.match(/[a-z0-9]+/g)||[],i=r.match(/[a-z0-9]+/g)||[];return 0!==i.length&&i.every(e=>n.some(t=>t.startsWith(e)))}),M.innerHTML=\"\",o=-1,R.setAttribute(\"aria-expanded\",m.length>0?\"true\":\"false\"),0===m.length){let l=document.createElement(\"li\");l.textContent=\"No HTML element or attribute found that matches this filtering\",l.style.cssText=\"padding: 10px; color: #666; font-style: italic;\",M.appendChild(l);return}m.forEach((e,t)=>{let l=document.createElement(\"li\");l.setAttribute(\"role\",\"option\"),l.setAttribute(\"id\",`option-${t}`);let r=e.category,n=e.title.replace(\"<\",\"&lt;\").replace(\">\",\"&gt;\");l.innerHTML='<span style=\"font-weight:bold\">'+n+' <span class=\"category '+r+'\">'+e.category+\"</span></span>\",l.dataset.index=t,l.dataset.whatwgUrl=e.whatwgUrl,l.dataset.title=e.title,l.onmouseenter=()=>{o=t,B()},l.onclick=()=>F(e),M.appendChild(l)})}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase();console.log(\"Debug - Title:\",e),console.log(\"Debug - Query:\",t);let n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(console.log(\"Debug - Title words:\",n),console.log(\"Debug - Query words:\",i),0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(console.log(\"Debug - Starts with match:\",o),o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\"),d=m.includes(i[0]);return console.log(\"Debug - Concatenated title:\",m),console.log(\"Debug - Concat match:\",d),d}return console.log(\"Debug - Final result: false\"),!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase();console.log(\"Debug - Title:\",e),console.log(\"Debug - Query:\",t);let n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(console.log(\"Debug - Title words:\",n),console.log(\"Debug - Query words:\",i),0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(console.log(\"Debug - Starts with match:\",o),o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\"),d=m.includes(i[0]);return console.log(\"Debug - Concatenated title:\",m),console.log(\"Debug - Concat match:\",d),d}return console.log(\"Debug - Final result: false\"),!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b[a-z0-9]+\\b/g)||[],i=r.match(/\\b[a-z0-9]+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));if(o)return!0;if(1===i.length&&i[0].length>=4){let m=n.join(\"\");return m.includes(i[0])}return!1}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.startsWith(e)));return!!o||q(n,i)}function j(e,t){return!1}function q(e,t){let l=e.join(\"\");return t.every(e=>e.length>=3&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.includes(e)));return!!o||j(n,i)||q(l,i)}function j(e,t){return t.every(t=>e.some(e=>e.includes(t)||e.length>=2&&t.includes(e)))}function q(e,t){let l=e.replace(/\\s+/g,\"\");return t.every(e=>!!l.includes(e)||e.length>=2&&l.includes(e))}function G(e,t){let l=e.toLowerCase(),r=t.toLowerCase(),n=l.match(/\\b\\w+\\b/g)||[],i=r.match(/\\b\\w+\\b/g)||[];if(0===i.length)return!1;let o=i.every(e=>n.some(t=>t.includes(e)));return!!o||j(n,i)||q(l,i)}function j(e,t){return t.every(t=>e.some(e=>e.includes(t)||t.includes(e)))}function q(e,t){let l=e.replace(/\\s+/g,\"\");return t.every(e=>!!l.includes(e)||e.length>=2&&l.includes(e))}function B(){let e=M.querySelectorAll('li[role=\"option\"]');e.forEach((e,t)=>{t===o?(e.classList.add(\"hover\"),R.setAttribute(\"aria-activedescendant\",e.id),e.scrollIntoView({block:\"nearest\"})):e.classList.remove(\"hover\")})}function F(e){M.setAttribute(\"tabindex\",\"-1\"),i=e;let t=e.title;N.textContent=t,L.style.display=\"block\",L.focus(),function e(t){E.innerHTML=\"\";let l=\"attribute\"===t.category||\"ARIA\"===t.category,r=l?k.slice(0,3):k;r.forEach(e=>{let t=document.createElement(\"button\");t.textContent=e.text,t.className=\"action-button\",t.onclick=()=>W(e.action),E.appendChild(t)})}(e),E.style.display=\"flex\",I.style.display=\"block\",R.value=t,M.innerHTML=\"\",R.setAttribute(\"aria-expanded\",\"false\")}function W(e){if(!i)return;let t=i.title,l;switch(e){case\"HTMLspecMarkdown\":l=`[WhatWG - ${t} ${i.category}](${i.whatwgUrl})`;break;case\"HTMLspecHtml\":l=`<a href=\"${i.whatwgUrl}\">WhatWG: ${t} ${i.category}</a>`;break;case\"gotoHTMLspec\":window.open(i.whatwgUrl,\"_blank\");return;case\"MDNpageMarkdown\":l=`[MDN - ${t} ${i.category}](${i.mdnUrl})`;break;case\"MDNpageHtml\":l=`<a href=\"${i.mdnUrl}\">MDN: ${t} ${i.category}</a>`;break;case\"gotoMDNpage\":window.open(i.mdnUrl,\"_blank\");return}navigator.clipboard.writeText(l).then(()=>{v(\"Copied to clipboard!\",l)}).catch(()=>{console.log(l),v(\"Could not copy to clipboard\",\"Details pasted to console\")})}I.textContent=\"Start again\",I.className=\"secondary-button\",_.addEventListener(\"click\",C),I.addEventListener(\"click\",function e(){M.setAttribute(\"tabindex\",\"0\"),L.style.display=\"none\",E.style.display=\"none\",I.style.display=\"none\",R.value=\"\",i=null,o=-1,S(\"\"),R.focus()}),p.addEventListener(\"click\",e=>{e.target===p&&C()}),R.oninput=e=>{i&&(i=null,o=-1,L.style.display=\"none\",E.style.display=\"none\",I.style.display=\"none\",M.setAttribute(\"tabindex\",\"0\")),S(e.target.value)},R.onfocus=e=>{i&&setTimeout(()=>{R.select()},0)},R.onkeydown=e=>{D(e);let t=M.querySelectorAll('li[role=\"option\"]');switch(e.key){case\"ArrowDown\":e.preventDefault(),o<t.length-1&&(o++,B());break;case\"ArrowUp\":e.preventDefault(),o>0&&(o--,B());break;case\"Enter\":e.preventDefault(),o>=0&&m[o]&&F(m[o]);break;case\"Escape\":w||(e.preventDefault(),C())}},A.addEventListener(\"keydown\",e=>{if(D(e),\"Escape\"!==e.key||w||(e.preventDefault(),C()),i&&e.key>=\"1\"&&e.key<=\"6\"&&s.activeElement!==R){let t=parseInt(e.key),l=\"attribute\"===i.category||\"ARIA attribute\"===i.category;(!l||!(t>3))&&(e.preventDefault(),W([\"MDNpageMarkdown\",\"MDNpageHtml\",\"gotoMDNpage\",\"HTMLspecMarkdown\",\"HTMLspecHtml\",\"gotoHTMLspec\"][t-1]))}}),A.appendChild(f),A.appendChild(R),A.appendChild(M),A.appendChild(L),A.appendChild(E),A.appendChild(I),I.style.display=\"none\",\"undefined\"==typeof openInSidebar&&A.appendChild(_),p.appendChild(A),p.appendChild(H),s.appendChild(h),s.appendChild(p),document.body.appendChild(c),R.focus(),S(\"\")}window.htmlData=[{whatwgUrl:wwg+\"/text-level-semantics.html#the-a-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/a\",title:\"`a` (Anchor)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-abbr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/abbr\",title:\"`abbr` (Abbreviation)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-address-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/address\",title:\"`address` (Contact Address)\",category:el},{whatwgUrl:wwg+\"/image-maps.html#the-area-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/area\",title:\"`area` (Image Map Area)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-article-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/article\",title:\"`article` (Article Contents)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-aside-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/aside\",title:\"`aside` (Aside)\",category:el},{whatwgUrl:wwg+\"/media.html#the-audio-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/audio\",title:\"`audio` (Embed Audio)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-b-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/b\",title:\"`b` (Bring Attention To)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-base-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/base\",title:\"`base` (Document Base URL)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-bdi-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/bdi\",title:\"`bdi` (Bidirectional Isolate)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-bdo-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/bdo\",title:\"`bdo` (Bidirectional Text Override)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-blockquote-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/blockquote\",title:\"`blockquote` (Block Quotation)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-body-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/body\",title:\"`body` (Document Body)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-br-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/br\",title:\"`br` (Line Break)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-button-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/button\",title:\"`button` (Button)\",category:el},{whatwgUrl:wwg+\"/canvas.html#the-canvas-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/canvas\",title:\"`canvas` (Graphics Canvas)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-caption-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/caption\",title:\"`caption` (Table Caption)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-cite-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/cite\",title:\"`cite` (Citation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-code-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/code\",title:\"`code` (Inline Code)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-col-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/col\",title:\"`col` (Table Column)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-colgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/colgroup\",title:\"`colgroup` (Table Column Group)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-data-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/data\",title:\"`data` (Data)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-datalist-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/datalist\",title:\"`datalist` (HTML Data List)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dd-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dd\",title:\"`dd` (Description Details)\",category:el},{whatwgUrl:wwg+\"/edits.html#the-del-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/del\",title:\"`del` (Deleted Text)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-details-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/details\",title:\"`details` (Details disclosure)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-dfn-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dfn\",title:\"`dfn` (Definition)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-dialog-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dialog\",title:\"`dialog` (Dialog)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-div-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/div\",title:\"`div` (Content Division)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dl-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dl\",title:\"`dl` (Description List)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-dt-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/dt\",title:\"`dt` (Description Term)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-em-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/em\",title:\"`em` (Emphasis)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-embed-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/embed\",title:\"`embed` (Embed External Content)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-fieldset-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/fieldset\",title:\"`fieldset` (Field Set)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-figcaption-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/figcaption\",title:\"`figcaption` (Figure Caption)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-figure-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/figure\",title:\"`figure` (Figure with Optional Caption)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-footer-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/footer\",title:\"`footer` (Footer)\",category:el},{whatwgUrl:wwg+\"/forms.html#the-form-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/form\",title:\"`form` (Form)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-head-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/head\",title:\"`head` (Document Metadata (Header))\",category:el},{whatwgUrl:wwg+\"/sections.html#the-header-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/header\",title:\"`header` (Header)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-hgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/hgroup\",title:\"`hgroup` (Heading Group)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-hr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/hr\",title:\"`hr` (Thematic Break (Horizontal Rule))\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-html-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/html\",title:\"`html` (HTML Document / Root)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-i-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/i\",title:\"`i` (Idiomatic Text)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-iframe-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe\",title:\"`iframe` (Inline Frame)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-img-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/img\",title:\"`img` (Image Embed)\",category:el},{whatwgUrl:wwg+\"/input.html#the-input-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/input\",title:\"`input` (HTML Input)\",category:el},{whatwgUrl:wwg+\"/edits.html#the-ins-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ins\",title:\"`ins` (Inserted Text)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-kbd-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/kbd\",title:\"`kbd` (Keyboard Input)\",category:el},{whatwgUrl:wwg+\"/forms.html#the-label-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/label\",title:\"`label` (Label)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-legend-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/legend\",title:\"`legend` (Field Set Legend)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-li-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/li\",title:\"`li` (List Item)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-link-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/link\",title:\"`link` (External Resource Link)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-main-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/main\",title:\"`main` (Main)\",category:el},{whatwgUrl:wwg+\"/image-maps.html#the-map-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/map\",title:\"`map` (Image Map)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-mark-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/mark\",title:\"`mark` (Mark Text)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-menu-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/menu\",title:\"`menu` (Menu)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-meta-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta\",title:\"`meta` (metadata)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-meter-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter\",title:\"`meter` (HTML Meter)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-nav-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/nav\",title:\"`nav` (Navigation Section)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-noscript-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/noscript\",title:\"`noscript` (Noscript)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-object-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/object\",title:\"`object` (External Object)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-ol-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol\",title:\"`ol` (Ordered List)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-optgroup-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/optgroup\",title:\"`optgroup` (Option Group)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-option-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/option\",title:\"`option` (HTML Option)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-output-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/output\",title:\"`output` (Output)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-p-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/p\",title:\"`p` (Paragraph)\",category:el},{whatwgUrl:wwg+\"/iframe-embed-object.html#the-param-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/param\",title:\"`param` (Object Parameter)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-picture-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/picture\",title:\"`picture` (Picture)\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-pre-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/pre\",title:\"`pre` (Preformatted Text)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-progress-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/progress\",title:\"`progress` (Progress Indicator)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-q-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/q\",title:\"`q` (Inline Quotation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-rp-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/rp\",title:\"`rp` (Ruby Fallback Parenthesis)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-rt-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/rt\",title:\"`rt` (Ruby Text)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-ruby-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ruby\",title:\"`ruby` (Ruby Annotation)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-s-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/s\",title:\"`s` (Strikethrough)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-samp-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/samp\",title:\"`samp` (Sample Output)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-script-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/script\",title:\"`script` (Script)\",category:el},{whatwgUrl:wwg+\"/sections.html#the-section-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/section\",title:\"`section` (Generic Section)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-select-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/select\",title:\"`select` (HTML Select)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-slot-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/slot\",title:\"`slot` (Web Component Slot)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-small-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/small\",title:\"`small` (Side Comment)\",category:el},{whatwgUrl:wwg+\"/embedded-content.html#the-source-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/source\",title:\"`source` (Media or Image Source)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-span-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/span\",title:\"`span` (Content Span)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-strong-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/strong\",title:\"`strong` (Strong Importance)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-style-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/style\",title:\"`style` (Style Information)\",category:el},{whatwgUrl:wwg+\"/interactive-elements.html#the-summary-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/summary\",title:\"`summary` (Disclosure Summary)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-table-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/table\",title:\"`table` (Table)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tbody-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tbody\",title:\"`tbody` (Table Body)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-td-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/td\",title:\"`td` (Table Data Cell)\",category:el},{whatwgUrl:wwg+\"/scripting.html#the-template-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/template\",title:\"`template` (Content Template)\",category:el},{whatwgUrl:wwg+\"/form-elements.html#the-textarea-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea\",title:\"`textarea` (Textarea)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tfoot-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tfoot\",title:\"`tfoot` (Table Foot)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-th-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/th\",title:\"`th` (Table Header)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-thead-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/thead\",title:\"`thead` (Table Head)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-time-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/time\",title:\"`time` ((Date) Time)\",category:el},{whatwgUrl:wwg+\"/semantics.html#the-title-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/title\",title:\"`title` (Document Title)\",category:el},{whatwgUrl:wwg+\"/tables.html#the-tr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/tr\",title:\"`tr` (Table Row)\",category:el},{whatwgUrl:wwg+\"/media.html#the-track-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/track\",title:\"`track` (Embed Text Track)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-u-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/u\",title:\"`u` (Unarticulated Annotation (Underline))\",category:el},{whatwgUrl:wwg+\"/grouping-content.html#the-ul-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/ul\",title:\"`ul` (Unordered List)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-var-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/var\",title:\"`var` (Variable)\",category:el},{whatwgUrl:wwg+\"/media.html#the-video-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/video\",title:\"`video` (Video Embed)\",category:el},{whatwgUrl:wwg+\"/text-level-semantics.html#the-wbr-element\",mdnUrl:mdn+\"/HTML/Reference/Elements/wb\",title:\"`wbr` (Line Break Opportunity)\",category:el},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/accept\",title:\"`accept`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#accept-charset\",title:\"`accept-charset`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/accesskey\",title:\"`accesskey`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#allow\",title:\"`action`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#actionallow\",title:\"`actionallow`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/link#as\",title:\"`as`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#async\",title:\"`async`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/autocapitalize\",title:\"`autocapitalize`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/autocomplete\",title:\"`autocomplete`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/capture\",title:\"`capture`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta#charset\",title:\"`charset`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/input#checked\",title:\"`checked`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/class\",title:\"`class`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#cols\",title:\"`cols`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/content\",title:\"`content`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/contenteditable\",title:\"`contenteditable`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/area#coords\",title:\"`coords`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/crossorigin\",title:\"`crossorigin`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/API/HTMLIFrameElement/csp\",title:\"`csp`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/object#data\",title:\"`data`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/data-*\",title:\"`data-*`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/img#decoding\",title:\"`decoding`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#default\",title:\"`default`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#defer\",title:\"`defer`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/dir\",title:\"`dir`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/dirname\",title:\"`dirname`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/disabled\",title:\"`disabled`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/draggable\",title:\"`draggable`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#enctype\",title:\"`enctype`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/enterkeyhint\",title:\"`enterkeyhint`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/elementtiming\",title:\"`elementtiming`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/for\",title:\"`for`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/hidden\",title:\"`hidden`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#high\",title:\"`high`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meta/http-equiv\",title:\"`http-equiv`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/id\",title:\"`id`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Security/Subresource_Integrity\",title:\"`integrity`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/img#ismap\",title:\"`ismap`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/itemprop\",title:\"`itemprop`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#kind\",title:\"`kind`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/lang\",title:\"`lang`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/script#language\",title:\"`language`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/input#list\",title:\"`list`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#low\",title:\"`low`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/max\",title:\"`max`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/maxlength\",title:\"`maxlength`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/minlength\",title:\"`minlength`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#method\",title:\"`method`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/min\",title:\"`min`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/multiple\",title:\"`multiple`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/form#novalidate\",title:\"`novalidate`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/meter#optimum\",title:\"`optimum`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/pattern\",title:\"`pattern`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/a#ping\",title:\"`ping`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/placeholder\",title:\"`placeholder`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/video#playsinline\",title:\"`playsinline`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/video#poster\",title:\"`poster`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/readonly\",title:\"`readonly`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/rel\",title:\"`rel`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/required\",title:\"`required`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol#reversed\",title:\"`reversed`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Roles\",title:\"`role`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#rows\",title:\"`rows`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe#sandbox\",title:\"`sandbox`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/th#scope\",title:\"`scope`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/option#selected\",title:\"`selected`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/size\",title:\"`size`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/slot\",title:\"`slot`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/spellcheck\",title:\"`spellcheck`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/iframe#srcdoc\",title:\"`srcdoc`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/track#srclang\",title:\"`srclang`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/ol#start\",title:\"`start`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Attributes/step\",title:\"`step`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/style\",title:\"`style`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/table#summary\",title:\"`summary`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/tabindex\",title:\"`tabindex`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/title\",title:\"`title`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Global_attributes/translate\",title:\"`translate`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/HTML/Reference/Elements/textarea#wrap\",title:\"`wrap`\",category:att},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-activedescendant\",title:\"`aria-activedescendant`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-atomic\",title:\"`aria-atomic`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-autocomplete\",title:\"`aria-autocomplete`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-busy\",title:\"`aria-busy`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-checked\",title:\"`aria-checked`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colcount\",title:\"`aria-colcount`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colindex\",title:\"`aria-colindex`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-colspan\",title:\"`aria-colspan`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-controls\",title:\"`aria-controls`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-current\",title:\"`aria-current`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-describedby\",title:\"`aria-describedby`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-description\",title:\"`aria-description`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-details\",title:\"`aria-details`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-disabled\",title:\"`aria-disabled`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-dropeffect\",title:\"`aria-dropeffect`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-errormessage\",title:\"`aria-errormessage`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-expanded\",title:\"`aria-expanded`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-flowto\",title:\"`aria-flowto`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-grabbed\",title:\"`aria-grabbed`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-haspopup\",title:\"`aria-haspopup`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-hidden\",title:\"`aria-hidden`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-invalid\",title:\"`aria-invalid`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-keyshortcuts\",title:\"`aria-keyshortcuts`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-label\",title:\"`aria-label`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-labelledby\",title:\"`aria-labelledby`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-level\",title:\"`aria-level`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-live\",title:\"`aria-live`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-modal\",title:\"`aria-modal`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-multiline\",title:\"`aria-multiline`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-multiselectable\",title:\"`aria-multiselectable`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-orientation\",title:\"`aria-orientation`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-owns\",title:\"`aria-owns`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-placeholder\",title:\"`aria-placeholder`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-posinset\",title:\"`aria-posinset`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-pressed\",title:\"`aria-pressed`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-readonly\",title:\"`aria-readonly`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-relevant\",title:\"`aria-relevant`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-required\",title:\"`aria-required`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-roledescription\",title:\"`aria-roledescription`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowcount\",title:\"`aria-rowcount`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowindex\",title:\"`aria-rowindex`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-rowspan\",title:\"`aria-rowspan`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-selected\",title:\"`aria-selected`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-setsize\",title:\"`aria-setsize`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-sort\",title:\"`aria-sort`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuemax\",title:\"`aria-valuemax`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuemin\",title:\"`aria-valuemin`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuenow\",title:\"`aria-valuenow`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:mdn+\"/Accessibility/ARIA/Reference/Attributes/aria-valuetext\",title:\"`aria-valuetext`\",category:a},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`alt`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`autoplay`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`background`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`bgcolor`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`border`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`cite`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`color`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`colspan`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`controls`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`datetime`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`download`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`form`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formaction`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formenctype`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formmethod`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formnovalidate`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`formtarget`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`headers`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`height`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`href`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`hreflang`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`inputmode`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`label`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`loading`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`loop`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`media`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`muted`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`name`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`open`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`preload`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`referrerpolicy`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`rowspan`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`shape`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`sizes`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`span`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`src`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`srcset`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`target`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`type`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`usemap`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`value`\"+noMdnEntry,category:att},{whatwgUrl:\"N/A\",mdnUrl:\"N/A\",title:\"`width`\"+noMdnEntry,category:att},],lookUpHTML()})()","description":"Provides a quick and easy way to look up HTML references on WhatWG and MDN reference, then copy the URL as markdown/HTML More details about 'Look up HTML Reference'","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"A11y-tools.com: Misc.json-0-1","name":"Look up WCAG Success Criteria","description":"A simple lookup tool that lets you search WCAG SCs by their name or number. Also provides filtering options. Copy the SC as a link in various formats.","language":"javascript","executionMode":"activate","content":"(function(){javascript:!function(){let e=\"Perceivable\",t=\"Operable\",n=\"Understandable\",r=\"Robust\",i=\"https://www.w3.org/TR/WCAG22/\";if(window.wcagData=[{url:i+\"#non-text-content\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html\",title:\"WCAG 2.2 Success Criterion 1.1.1 Non-text Content\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-only-and-video-only-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-only-and-video-only-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.1 Audio-only and Video-only (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#captions-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/captions-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.2 Captions (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-description-or-media-alternative-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-description-or-media-alternative-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.3 Audio Description or Media Alternative (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#captions-live\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/captions-live.html\",title:\"WCAG 2.2 Success Criterion 1.2.4 Captions (Live)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#audio-description-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-description-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.5 Audio Description (Prerecorded)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#sign-language-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/sign-language-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.6 Sign Language (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#extended-audio-description-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/extended-audio-description-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.7 Extended Audio Description (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#media-alternative-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/media-alternative-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.8 Media Alternative (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#audio-only-live\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-only-live.html\",title:\"WCAG 2.2 Success Criterion 1.2.9 Audio-only (Live)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#info-and-relationships\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html\",title:\"WCAG 2.2 Success Criterion 1.3.1 Info and Relationships\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#meaningful-sequence\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/meaningful-sequence.html\",title:\"WCAG 2.2 Success Criterion 1.3.2 Meaningful Sequence\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#sensory-characteristics\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/sensory-characteristics.html\",title:\"WCAG 2.2 Success Criterion 1.3.3 Sensory Characteristics\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#orientation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/orientation.html\",title:\"WCAG 2.2 Success Criterion 1.3.4 Orientation\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#identify-input-purpose\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html\",title:\"WCAG 2.2 Success Criterion 1.3.5 Identify Input Purpose\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#identify-purpose\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/identify-purpose.html\",title:\"WCAG 2.2 Success Criterion 1.3.6 Identify Purpose\",level:\"AAA\",version:\"2.1\",category:e},{url:i+\"#use-of-color\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/use-of-color.html\",title:\"WCAG 2.2 Success Criterion 1.4.1 Use of Color\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-control\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-control.html\",title:\"WCAG 2.2 Success Criterion 1.4.2 Audio Control\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#contrast-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html\",title:\"WCAG 2.2 Success Criterion 1.4.3 Contrast (Minimum)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#resize-text\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/resize-text.html\",title:\"WCAG 2.2 Success Criterion 1.4.4 Resize Text\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#images-of-text\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/images-of-text.html\",title:\"WCAG 2.2 Success Criterion 1.4.5 Images of Text\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#contrast-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/contrast-enhanced.html\",title:\"WCAG 2.2 Success Criterion 1.4.6 Contrast (Enhanced)\",level:\"AAA\",version:\"2.1\",category:e},{url:i+\"#low-or-no-background-audio\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/low-or-no-background-audio.html\",title:\"WCAG 2.2 Success Criterion 1.4.7 Low or No Background Audio\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#visual-presentation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/visual-presentation.html\",title:\"WCAG 2.2 Success Criterion 1.4.8 Visual Presentation\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#images-of-text-no-exception\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/images-of-text-no-exception.html\",title:\"WCAG 2.2 Success Criterion 1.4.9 Images of Text (No Exception)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#reflow\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/reflow.html\",title:\"WCAG 2.2 Success Criterion 1.4.10 Reflow\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#non-text-contrast\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast.html\",title:\"WCAG 2.2 Success Criterion 1.4.11 Non-text Contrast\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#text-spacing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/text-spacing.html\",title:\"WCAG 2.2 Success Criterion 1.4.12 Text Spacing\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#content-on-hover-or-focus\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/content-on-hover-or-focus.html\",title:\"WCAG 2.2 Success Criterion 1.4.13 Content on Hover or Focus\",level:\"AA\",version:\"2.1\",category:t},{url:i+\"#keyboard\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html\",title:\"WCAG 2.2 Success Criterion 2.1.1 Keyboard\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#no-keyboard-trap\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/no-keyboard-trap.html\",title:\"WCAG 2.2 Success Criterion 2.1.2 No Keyboard Trap\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#keyboard-no-exception\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/keyboard-no-exception.html\",title:\"WCAG 2.2 Success Criterion 2.1.3 Keyboard (No Exception)\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#character-key-shortcuts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/character-key-shortcuts.html\",title:\"WCAG 2.2 Success Criterion 2.1.4 Character Key Shortcuts\",level:\"A\",version:\"2.1\",category:t},{url:i+\"#timing-adjustable\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/timing-adjustable.html\",title:\"WCAG 2.2 Success Criterion 2.2.1 Timing Adjustable\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#pause-stop-hide\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pause-stop-hide.html\",title:\"WCAG 2.2 Success Criterion 2.2.2 Pause, Stop, Hide\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#no-timing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/no-timing.html\",title:\"WCAG 2.2 Success Criterion 2.2.3 No Timing\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#interruptions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/interruptions.html\",title:\"WCAG 2.2 Success Criterion 2.2.4 Interruptions\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#re-authenticating\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/re-authenticating.html\",title:\"WCAG 2.2 Success Criterion 2.2.5 Re-authenticating\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#timeouts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/timeouts.html\",title:\"WCAG 2.2 Success Criterion 2.2.6 Timeouts\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#three-flashes-or-below-threshold\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/three-flashes-or-below-threshold.html\",title:\"WCAG 2.2 Success Criterion 2.3.1 Three Flashes or Below Threshold\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#three-flashes\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/three-flashes.html\",title:\"WCAG 2.2 Success Criterion 2.3.2 Three Flashes\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#animation-from-interactions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/animation-from-interactions.html\",title:\"WCAG 2.2 Success Criterion 2.3.3 Animation from Interactions\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#bypass-blocks\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/bypass-blocks.html\",title:\"WCAG 2.2 Success Criterion 2.4.1 Bypass Blocks\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#page-titled\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/page-titled.html\",title:\"WCAG 2.2 Success Criterion 2.4.2 Page Titled\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#focus-order\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-order.html\",title:\"WCAG 2.2 Success Criterion 2.4.3 Focus Order\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#link-purpose-in-context\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/link-purpose-in-context.html\",title:\"WCAG 2.2 Success Criterion 2.4.4 Link Purpose (In Context)\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#multiple-ways\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/multiple-ways.html\",title:\"WCAG 2.2 Success Criterion 2.4.5 Multiple Ways\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#headings-and-labels\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/headings-and-labels.html\",title:\"WCAG 2.2 Success Criterion 2.4.6 Headings and Labels\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-visible\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-visible.html\",title:\"WCAG 2.2 Success Criterion 2.4.7 Focus Visible\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#location\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/location.html\",title:\"WCAG 2.2 Success Criterion 2.4.8 Location\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#link-purpose-link-only\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/link-purpose-link-only.html\",title:\"WCAG 2.2 Success Criterion 2.4.9 Link Purpose (Link Only)\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#section-headings\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/section-headings.html\",title:\"WCAG 2.2 Success Criterion 2.4.10 Section Headings\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#focus-not-obscured-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-minimum.html\",title:\"WCAG 2.2 Success Criterion 2.4.11 Focus Not Obscured (Minimum)\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-not-obscured-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-enhanced.html\",title:\"WCAG 2.2 Success Criterion 2.4.12 Focus Not Obscured (Enhanced)\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-appearance\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-appearance.html\",title:\"WCAG 2.2 Success Criterion 2.4.13 Focus Appearance\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#pointer-gestures\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pointer-gestures.html\",title:\"WCAG 2.2 Success Criterion 2.5.1 Pointer Gestures\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#pointer-cancellation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pointer-cancellation.html\",title:\"WCAG 2.2 Success Criterion 2.5.2 Pointer Cancellation\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#label-in-name\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/label-in-name.html\",title:\"WCAG 2.2 Success Criterion 2.5.3 Label in Name\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#motion-actuation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/motion-actuation.html\",title:\"WCAG 2.2 Success Criterion 2.5.4 Motion Actuation\",level:\"A\",version:\"2.1\",category:t},{url:i+\"#target-size\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/target-size.html\",title:\"WCAG 2.2 Success Criterion 2.5.5 Target Size\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#concurrent-input-mechanisms\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/concurrent-input-mechanisms.html\",title:\"WCAG 2.2 Success Criterion 2.5.6 Concurrent Input Mechanisms\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#dragging-movements\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html\",title:\"WCAG 2.2 Success Criterion 2.5.7 Dragging Movements\",level:\"AA\",version:\"2.2\",category:t},{url:i+\"#target-size-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html\",title:\"WCAG 2.2 Success Criterion 2.5.8 Target Size (Minimum)\",level:\"AA\",version:\"2.2\",category:t},{url:i+\"#language-of-page\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/language-of-page.html\",title:\"WCAG 2.2 Success Criterion 3.1.1 Language of Page\",level:\"A\",version:\"2.1\",category:n},{url:i+\"#language-of-parts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/language-of-parts.html\",title:\"WCAG 2.2 Success Criterion 3.1.2 Language of Parts\",level:\"AA\",version:\"2.1\",category:n},{url:i+\"#unusual-words\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/unusual-words.html\",title:\"WCAG 2.2 Success Criterion 3.1.3 Unusual Words\",level:\"AAA\",version:\"2.1\",category:n},{url:i+\"#abbreviations\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/abbreviations.html\",title:\"WCAG 2.2 Success Criterion 3.1.4 Abbreviations\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#reading-level\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/reading-level.html\",title:\"WCAG 2.2 Success Criterion 3.1.5 Reading Level\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#pronunciation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pronunciation.html\",title:\"WCAG 2.2 Success Criterion 3.1.6 Pronunciation\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#on-focus\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/on-focus.html\",title:\"WCAG 2.2 Success Criterion 3.2.1 On Focus\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#on-input\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/on-input.html\",title:\"WCAG 2.2 Success Criterion 3.2.2 On Input\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#consistent-navigation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-navigation.html\",title:\"WCAG 2.2 Success Criterion 3.2.3 Consistent Navigation\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#consistent-identification\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-identification.html\",title:\"WCAG 2.2 Success Criterion 3.2.4 Consistent Identification\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#change-on-request\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/change-on-request.html\",title:\"WCAG 2.2 Success Criterion 3.2.5 Change on Request\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#consistent-help\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-help.html\",title:\"WCAG 2.2 Success Criterion 3.2.6 Consistent Help\",level:\"A\",version:\"2.2\",category:n},{url:i+\"#error-identification\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-identification.html\",title:\"WCAG 2.2 Success Criterion 3.3.1 Error Identification\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#labels-or-instructions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/labels-or-instructions.html\",title:\"WCAG 2.2 Success Criterion 3.3.2 Labels or Instructions\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#error-suggestion\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-suggestion.html\",title:\"WCAG 2.2 Success Criterion 3.3.3 Error Suggestion\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#error-prevention-legal-financial-data\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-prevention-legal-financial-data.html\",title:\"WCAG 2.2 Success Criterion 3.3.4 Error Prevention (Legal, Financial, Data)\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#help\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/help.html\",title:\"WCAG 2.2 Success Criterion 3.3.5 Help\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#error-prevention-all\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-prevention-all.html\",title:\"WCAG 2.2 Success Criterion 3.3.6 Error Prevention (All)\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#redundant-entry\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/redundant-entry.html\",title:\"WCAG 2.2 Success Criterion 3.3.7 Redundant Entry\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#accessible-authentication\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication.html\",title:\"WCAG 2.2 Success Criterion 3.3.8 Accessible Authentication\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#accessible-authentication-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication-enhanced.html\",title:\"WCAG 2.2 Success Criterion 3.3.9 Accessible Authentication (Enhanced)\",level:\"AAA\",version:\"2.1\",category:n},{url:i+\"#parsing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/parsing.html\",title:\"WCAG 2.2 Success Criterion 4.1.1 Parsing\",level:\"A\",version:\"2.0\",category:r},{url:i+\"#name-role-value\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/name-role-value.html\",title:\"WCAG 2.2 Success Criterion 4.1.2 Name, Role, Value\",level:\"A\",version:\"2.0\",category:r},{url:i+\"#status-messages\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/status-messages.html\",title:\"WCAG 2.2 Success Criterion 4.1.3 Status Messages\",level:\"AA\",version:\"2.0\",category:r}],console.clear(),!window.wcagData){console.error(\"WCAG data not loaded. Make sure data-source.js is included before this script.\"),alert(\"WCAG data not available. Please ensure the extension is properly installed.\");return}let o=window.wcagData,l=document.getElementById(\"a11y-tools-shadow-host\");if(l){let a=document.querySelectorAll('[aria-hidden=\"true\"]');a.forEach(e=>{e!==l&&e.removeAttribute(\"aria-hidden\")});let s=document.querySelectorAll('[tabindex=\"-1\"]');s.forEach(e=>{e.removeAttribute(\"tabindex\")}),document.body.removeChild(l)}let d=document.activeElement,c=null,u=-1,g=null,A=document.createElement(\"div\");A.setAttribute(\"id\",\"a11y-tools-shadow-host\"),A.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9999;pointer-events: none;`;let p=A.attachShadow({mode:\"closed\"}),w=\"\";\"undefined\"!=typeof openInSidebar&&openInSidebar&&(w=`#a11y-tools-data-lookup {width: 100%;height: 100%;max-width: none;max-height: none;top:0;bottom:0;outline:0;border:0;}#data-list {max-height: 70vh;}`);let h=document.createElement(\"style\");h.textContent=`/* Reset all default styles */*, *::before, *::after {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;box-sizing: border-box;line-height: 1;}/* Basic styling for all elements */* {font-family: Arial, sans-serif;color: inherit;background: transparent;text-decoration: none;list-style: none;}/* Specific component styles */#a11y-tools-modal-backdrop {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 9999;pointer-events: all;}#a11y-tools-data-lookup {background: white;background: #dff3f3;color: black;position: fixed;top: 2em;left: 50%;transform: translate(-50%, 0);border: 2px solid #333;padding: 20px;box-shadow: 0 4px 20px rgba(0,0,0,0.5);z-index: 10000;font-family: Arial, sans-serif;max-width: 90vw;width: 60em;max-height: 80vh;overflow: hidden;display: flex;flex-direction: column;pointer-events: all;}#a11y-tools-data-lookup h1 {margin: 0 0 15px 0;color: #333;font-size: 20px;font-weight: bold;line-height: 1.2;}#a11y-tools-data-lookup input[type=\"text\"] {background: white;color: black;width: 100%;padding: 12px;border: 2px solid #007cba;font-size: 16px;margin-bottom: 16px;box-sizing: border-box;border-radius: 5px;}#a11y-tools-data-lookup input[type=\"text\"]:focus {outline: 3px solid #007cba;outline-offset: 3px;}#a11y-tools-data-lookup button {border-radius: 5px;}#a11y-tools-data-lookup button:focus {outline: 3px solid #007cba;outline-offset: 3px;}#a11y-tools-data-lookup input[type=\"radio\"]:focus {outline: 3px solid #007cba;outline-offset: 3px;}.search-hint {font-size: 12px;color: #666;margin-bottom: 10px;line-height: 1.3;}.filters-container {display: flex;gap: 20px;margin-bottom: 15px;flex-wrap: wrap;}.filter-fieldset {border: 1px solid #ccc;padding: 10px;margin: 0;border-radius: 3px;}.filter-legend {font-weight: bold;padding: 0 5px;}.filter-label {display: inline-block;margin-right: 15px;cursor: pointer;line-height: 1.4;}.filter-radio {margin-right: 5px;}#data-list:empty {display:none!important;}#data-list {max-height: 300px;overflow-y: auto;border: 1px solid #ccc;margin: 0 0 15px 0;padding: 0;list-style: none;background: #f9f9f9;}#data-list li {padding: 10px;cursor: pointer;border-bottom: 1px solid #eee;background: white;line-height: 1.4;}#data-list li:hover,#data-list li.hover {background: #007cba;}#data-list li:hover *,#data-list li.hover * {color: white!important;}#selection-made {border: 1px solid #007cba;padding: 10px;margin-bottom: 15px;background: #f0f8ff;display: none;border-radius: 3px;}#selection-made strong {display: block;margin-bottom: 5px;font-weight: bold;}.selection-text {font-family: monospace;font-size: 14px;line-height: 1.3;}#selection-made:focus {outline: 3px solid #007cba;outline-offset: 3px;}.buttons-container {display: none;gap: 10px;flex-wrap: wrap;}.action-button {background: #007cba;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin: 5px 5px 5px 0;border-radius: 3px;}.action-button:hover {background: #005a8a;}.secondary-button {background: #666;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin-top: 10px;border-radius: 3px;}.secondary-button:hover {background: #444;}.version {font-weight:bold;}.category {color:white;background:gray;padding:0.2em;font-size:0.8em;border-radius:5px;outline:1px solid white;}.Perceivable {color:navy;}.Operable {color:#295f19;}.Understandable {color:purple;}.Robust {color:darkred;}.category.Perceivable {background:navy;color:white;}.category.Operable {background:#295f19;color:white;}.category.Understandable {background:purple;color:white;}.category.Robust {background:darkred;color:white;}/* Notification panel styles */#notification-panel {position: fixed;bottom: 20px;left: 20px;right: 20px;background: #162650;color: white;padding: 15px 20px;border-radius: 8px;border: 2px solid #03a9f4;box-shadow: 0 4px 12px rgba(0,0,0,0.3);z-index: 10001;width:calc(100%-40px);font-family: Arial, sans-serif;font-size: 14px;line-height: 1.4;opacity: 0;transform: translateX(100%);pointer-events: all;}#notification-panel.show {opacity: 1;transform: translateX(0);}#notification-panel .notification-title {font-weight: bold;margin-bottom: 8px;color: #babae4;}#notification-panel .notification-content {font-family: monospace;background: rgba(255,255,255,0.1);padding: 8px;border-radius: 4px;border: 1px solid rgba(255,255,255,0.2);word-break: break-all;}${w}`;let C=[],m=Array.from(document.body.children);m.forEach(e=>{e!==A&&(C.push({element:e,originalAriaHidden:e.getAttribute(\"aria-hidden\")}),e.setAttribute(\"aria-hidden\",\"true\"))});let v=Array.from(document.querySelectorAll('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex=\"-1\"]), [contenteditable]')),W=[];v.forEach(e=>{W.push({element:e,originalTabIndex:e.getAttribute(\"tabindex\")}),e.setAttribute(\"tabindex\",\"-1\")});let b=document.createElement(\"div\");b.setAttribute(\"id\",\"a11y-tools-modal-backdrop\");let y=document.createElement(\"div\");y.setAttribute(\"role\",\"dialog\"),y.setAttribute(\"id\",\"a11y-tools-data-lookup\"),y.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),y.setAttribute(\"aria-modal\",\"true\");let f=document.createElement(\"h1\");f.textContent=\"Look up WCAG Success Criteria\",f.setAttribute(\"id\",\"a11y-tools-lookup-dialog-header\");let $=document.createElement(\"input\");$.type=\"text\",$.placeholder='Type to search/filter (e.g., \"images\", \"keyboard\", \"1.1.1\")...',$.setAttribute(\"role\",\"combobox\"),$.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),$.setAttribute(\"aria-controls\",\"data-list\"),$.setAttribute(\"aria-expanded\",\"false\"),$.setAttribute(\"aria-autocomplete\",\"list\"),$.setAttribute(\"aria-describedby\",\"search-hint filters-hint\");let _=document.createElement(\"div\");_.textContent=\"Filters for WCAG level and version are above this input\",_.setAttribute(\"id\",\"filters-hint\"),_.setAttribute(\"hidden\",\"hidden\");let G=document.createElement(\"div\");G.className=\"filters-container\";let x=document.createElement(\"fieldset\");x.className=\"filter-fieldset\";let U=document.createElement(\"legend\");U.textContent=\"WCAG Level:\",U.className=\"filter-legend\",[\"All\",\"A\",\"AA\",\"AAA\"].forEach((e,t)=>{let n=document.createElement(\"label\");n.className=\"filter-label\";let r=document.createElement(\"input\");r.type=\"radio\",r.name=\"level-filter\",r.value=e,r.checked=\"All\"===e,r.className=\"filter-radio\",r.onchange=()=>H($.value);let i=document.createTextNode(e);n.appendChild(r),n.appendChild(i),x.appendChild(n)}),x.appendChild(U),x.insertBefore(U,x.firstChild);let S=document.createElement(\"fieldset\");S.className=\"filter-fieldset\";let k=document.createElement(\"legend\");k.textContent=\"WCAG Version:\",k.className=\"filter-legend\",[\"All\",\"2.0\",\"2.1\",\"2.2\"].forEach((e,t)=>{let n=document.createElement(\"label\");n.className=\"filter-label\";let r=document.createElement(\"input\");r.type=\"radio\",r.name=\"version-filter\",r.value=e,r.checked=\"All\"===e,r.className=\"filter-radio\",r.onchange=()=>H($.value);let i=document.createTextNode(e);n.appendChild(r),n.appendChild(i),S.appendChild(n)}),S.appendChild(k),S.insertBefore(k,S.firstChild),G.appendChild(x),G.appendChild(S);let I=document.createElement(\"ul\");I.setAttribute(\"role\",\"listbox\"),I.setAttribute(\"tabindex\",\"0\"),I.setAttribute(\"id\",\"data-list\"),I.setAttribute(\"aria-label\",\"WCAG Success Criteria\");let E=document.createElement(\"div\");E.setAttribute(\"id\",\"selection-made\"),E.setAttribute(\"tabindex\",\"-1\");let L=document.createElement(\"strong\");L.textContent=\"Selected:\";let N=document.createElement(\"div\");N.className=\"selection-text\",E.appendChild(L),E.appendChild(N);let T=document.createElement(\"div\");T.className=\"buttons-container\";let P=document.createElement(\"div\");P.setAttribute(\"id\",\"notification-panel\"),P.setAttribute(\"role\",\"status\"),P.setAttribute(\"aria-live\",\"polite\");let z=document.createElement(\"div\");z.className=\"notification-title\";let D=document.createElement(\"div\");function M(e,t){g&&clearTimeout(g),z.textContent=e,D.textContent=t,P.classList.add(\"show\"),g=setTimeout(()=>{P.classList.remove(\"show\")},5e3)}D.className=\"notification-content\",P.appendChild(z),P.appendChild(D),[{text:\"Copy as Markdown Link (1)\",key:\"1\",action:\"markdown\"},{text:\"Copy as HTML Link (2)\",key:\"2\",action:\"html\"},{text:\"Copy SC Name Only (3)\",key:\"3\",action:\"name\"},{text:\"Copy SC URL Only (4)\",key:\"4\",action:\"url\"},{text:\"Go to page (5)\",key:\"5\",action:\"goto\"},{text:\"Go to Understanding doc (6)\",key:\"6\",action:\"understanding\"}].forEach(e=>{let t=document.createElement(\"button\");t.textContent=e.text,t.className=\"action-button\",t.onclick=()=>j(e.action),T.appendChild(t)});let q=document.createElement(\"button\");q.textContent=\"Close (Escape)\",q.className=\"secondary-button\";let R=document.createElement(\"button\");function O(){g&&clearTimeout(g),C.forEach(({element:e,originalAriaHidden:t})=>{null===t?e.removeAttribute(\"aria-hidden\"):e.setAttribute(\"aria-hidden\",t)}),W.forEach(({element:e,originalTabIndex:t})=>{null===t?e.removeAttribute(\"tabindex\"):e.setAttribute(\"tabindex\",t)}),document.body.removeChild(A),d.focus()}function F(e){let t=y.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"])'),n=t[0],r=t[t.length-1];\"Tab\"===e.key&&(e.shiftKey?p.activeElement===n&&(e.preventDefault(),r.focus()):p.activeElement===r&&(e.preventDefault(),n.focus()))}function H(e){let t=p.querySelector('input[name=\"level-filter\"]:checked')?.value||\"All\",n=p.querySelector('input[name=\"version-filter\"]:checked')?.value||\"All\",r=o.filter(r=>{let i=!0;if(e.length>0){let o=e.toLowerCase().trim(),l=r.title.toLowerCase();if(l.includes(o))i=!0;else{let a=o.split(/\\s+/).filter(e=>e.length>0);if(1===a.length){let s=a[0];i=l.split(/\\s+/).some(e=>e.includes(s))}else i=a.every(e=>l.split(/\\s+/).some(t=>t.includes(e)))}}let d=\"All\"===t||r.level===t,c=\"All\"===n||r.version===n;return i&&d&&c});if(I.innerHTML=\"\",u=-1,$.setAttribute(\"aria-expanded\",r.length>0?\"true\":\"false\"),0===r.length){let i=document.createElement(\"li\");i.textContent=\"No WCAG SC found that matches this filtering\",i.style.cssText=\"padding: 10px; color: #666; font-style: italic;\",I.appendChild(i);return}r.forEach((e,t)=>{let n=document.createElement(\"li\");n.setAttribute(\"role\",\"option\"),n.setAttribute(\"id\",`option-${t}`);let r=e.category;n.innerHTML='<span style=\"font-weight:bold\">'+e.title.replace(\"WCAG 2.2 Success Criterion \",\"\")+\"</span> <span>(Level \"+e.level+')</span> <span class=\"version '+r+'\">'+e.version+'</span> <span class=\"category '+r+'\">'+e.category+\"</span>\",n.dataset.index=t,n.dataset.url=e.url,n.dataset.title=e.title,n.onmouseenter=()=>{u=t,B()},n.onclick=()=>V(e),I.appendChild(n)})}function B(){let e=I.querySelectorAll('li[role=\"option\"]');e.forEach((e,t)=>{t===u?(e.classList.add(\"hover\"),$.setAttribute(\"aria-activedescendant\",e.id),e.scrollIntoView({block:\"nearest\"})):e.classList.remove(\"hover\")})}function V(e){I.setAttribute(\"tabindex\",\"-1\"),c=e;let t=e.title;N.textContent=t,E.style.display=\"block\",E.focus(),T.style.display=\"flex\",R.style.display=\"block\",$.value=t,I.innerHTML=\"\",$.setAttribute(\"aria-expanded\",\"false\")}function j(e){if(!c)return;let t=c.title.replace(\"WCAG 2.2 Success Criterion \",\"SC \"),n;switch(e){case\"markdown\":n=`[${t}](${c.url})`;break;case\"html\":n=`<a href=\"${c.url}\">${t}</a>`;break;case\"name\":n=t;break;case\"url\":n=c.url;break;case\"goto\":window.open(c.url,\"_blank\");return;case\"understanding\":window.open(c.understandingUrl,\"_blank\");return}navigator.clipboard.writeText(n).then(()=>{M(\"Copied to clipboard!\",n)}).catch(()=>{console.log(n),M(\"Could not copy to clipboard\",\"Details pasted to console\")})}R.textContent=\"Start again\",R.className=\"secondary-button\",q.addEventListener(\"click\",O),R.addEventListener(\"click\",function e(){I.setAttribute(\"tabindex\",\"0\"),E.style.display=\"none\",T.style.display=\"none\",R.style.display=\"none\",$.value=\"\",c=null,u=-1,H(\"\"),$.focus()}),b.addEventListener(\"click\",e=>{e.target===b&&O()}),$.oninput=e=>{c&&(c=null,u=-1,E.style.display=\"none\",T.style.display=\"none\",R.style.display=\"none\",I.setAttribute(\"tabindex\",\"0\")),H(e.target.value)},$.onfocus=e=>{c&&setTimeout(()=>{$.select()},0)},$.onkeydown=e=>{F(e);let t=I.querySelectorAll('li[role=\"option\"]');switch(e.key){case\"ArrowDown\":e.preventDefault(),u<t.length-1&&(u++,B());break;case\"ArrowUp\":e.preventDefault(),u>0&&(u--,B());break;case\"Enter\":if(e.preventDefault(),u>=0&&t[u]){let n=t[u],r=o.find(e=>e.url===n.dataset.url);r&&V(r)}break;case\"Escape\":e.preventDefault(),O()}},y.addEventListener(\"keydown\",e=>{if(F(e),\"Escape\"===e.key){e.preventDefault(),O();return}c&&e.key>=\"1\"&&e.key<=\"6\"&&p.activeElement!==$&&(e.preventDefault(),j([\"markdown\",\"html\",\"name\",\"url\",\"goto\",\"understanding\"][parseInt(e.key)-1]))}),y.appendChild(f),y.appendChild(G),y.appendChild($),y.appendChild(_),y.appendChild(I),y.appendChild(E),y.appendChild(T),y.appendChild(R),R.style.display=\"none\",\"undefined\"==typeof openInSidebar&&y.appendChild(q),b.appendChild(y),b.appendChild(P),p.appendChild(h),p.appendChild(b),document.body.appendChild(A),$.focus(),H(\"\")}()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","WCAG"],"folderName":"A11y-tools.com: Misc.","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Misc.json","download":{"name":"Look up WCAG Success Criteria","language":"javascript","executionMode":"activate","content":"(function(){javascript:!function(){let e=\"Perceivable\",t=\"Operable\",n=\"Understandable\",r=\"Robust\",i=\"https://www.w3.org/TR/WCAG22/\";if(window.wcagData=[{url:i+\"#non-text-content\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html\",title:\"WCAG 2.2 Success Criterion 1.1.1 Non-text Content\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-only-and-video-only-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-only-and-video-only-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.1 Audio-only and Video-only (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#captions-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/captions-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.2 Captions (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-description-or-media-alternative-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-description-or-media-alternative-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.3 Audio Description or Media Alternative (Prerecorded)\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#captions-live\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/captions-live.html\",title:\"WCAG 2.2 Success Criterion 1.2.4 Captions (Live)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#audio-description-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-description-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.5 Audio Description (Prerecorded)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#sign-language-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/sign-language-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.6 Sign Language (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#extended-audio-description-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/extended-audio-description-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.7 Extended Audio Description (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#media-alternative-prerecorded\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/media-alternative-prerecorded.html\",title:\"WCAG 2.2 Success Criterion 1.2.8 Media Alternative (Prerecorded)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#audio-only-live\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-only-live.html\",title:\"WCAG 2.2 Success Criterion 1.2.9 Audio-only (Live)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#info-and-relationships\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html\",title:\"WCAG 2.2 Success Criterion 1.3.1 Info and Relationships\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#meaningful-sequence\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/meaningful-sequence.html\",title:\"WCAG 2.2 Success Criterion 1.3.2 Meaningful Sequence\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#sensory-characteristics\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/sensory-characteristics.html\",title:\"WCAG 2.2 Success Criterion 1.3.3 Sensory Characteristics\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#orientation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/orientation.html\",title:\"WCAG 2.2 Success Criterion 1.3.4 Orientation\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#identify-input-purpose\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html\",title:\"WCAG 2.2 Success Criterion 1.3.5 Identify Input Purpose\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#identify-purpose\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/identify-purpose.html\",title:\"WCAG 2.2 Success Criterion 1.3.6 Identify Purpose\",level:\"AAA\",version:\"2.1\",category:e},{url:i+\"#use-of-color\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/use-of-color.html\",title:\"WCAG 2.2 Success Criterion 1.4.1 Use of Color\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#audio-control\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/audio-control.html\",title:\"WCAG 2.2 Success Criterion 1.4.2 Audio Control\",level:\"A\",version:\"2.0\",category:e},{url:i+\"#contrast-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html\",title:\"WCAG 2.2 Success Criterion 1.4.3 Contrast (Minimum)\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#resize-text\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/resize-text.html\",title:\"WCAG 2.2 Success Criterion 1.4.4 Resize Text\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#images-of-text\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/images-of-text.html\",title:\"WCAG 2.2 Success Criterion 1.4.5 Images of Text\",level:\"AA\",version:\"2.0\",category:e},{url:i+\"#contrast-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/contrast-enhanced.html\",title:\"WCAG 2.2 Success Criterion 1.4.6 Contrast (Enhanced)\",level:\"AAA\",version:\"2.1\",category:e},{url:i+\"#low-or-no-background-audio\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/low-or-no-background-audio.html\",title:\"WCAG 2.2 Success Criterion 1.4.7 Low or No Background Audio\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#visual-presentation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/visual-presentation.html\",title:\"WCAG 2.2 Success Criterion 1.4.8 Visual Presentation\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#images-of-text-no-exception\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/images-of-text-no-exception.html\",title:\"WCAG 2.2 Success Criterion 1.4.9 Images of Text (No Exception)\",level:\"AAA\",version:\"2.0\",category:e},{url:i+\"#reflow\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/reflow.html\",title:\"WCAG 2.2 Success Criterion 1.4.10 Reflow\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#non-text-contrast\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast.html\",title:\"WCAG 2.2 Success Criterion 1.4.11 Non-text Contrast\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#text-spacing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/text-spacing.html\",title:\"WCAG 2.2 Success Criterion 1.4.12 Text Spacing\",level:\"AA\",version:\"2.1\",category:e},{url:i+\"#content-on-hover-or-focus\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/content-on-hover-or-focus.html\",title:\"WCAG 2.2 Success Criterion 1.4.13 Content on Hover or Focus\",level:\"AA\",version:\"2.1\",category:t},{url:i+\"#keyboard\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html\",title:\"WCAG 2.2 Success Criterion 2.1.1 Keyboard\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#no-keyboard-trap\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/no-keyboard-trap.html\",title:\"WCAG 2.2 Success Criterion 2.1.2 No Keyboard Trap\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#keyboard-no-exception\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/keyboard-no-exception.html\",title:\"WCAG 2.2 Success Criterion 2.1.3 Keyboard (No Exception)\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#character-key-shortcuts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/character-key-shortcuts.html\",title:\"WCAG 2.2 Success Criterion 2.1.4 Character Key Shortcuts\",level:\"A\",version:\"2.1\",category:t},{url:i+\"#timing-adjustable\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/timing-adjustable.html\",title:\"WCAG 2.2 Success Criterion 2.2.1 Timing Adjustable\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#pause-stop-hide\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pause-stop-hide.html\",title:\"WCAG 2.2 Success Criterion 2.2.2 Pause, Stop, Hide\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#no-timing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/no-timing.html\",title:\"WCAG 2.2 Success Criterion 2.2.3 No Timing\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#interruptions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/interruptions.html\",title:\"WCAG 2.2 Success Criterion 2.2.4 Interruptions\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#re-authenticating\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/re-authenticating.html\",title:\"WCAG 2.2 Success Criterion 2.2.5 Re-authenticating\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#timeouts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/timeouts.html\",title:\"WCAG 2.2 Success Criterion 2.2.6 Timeouts\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#three-flashes-or-below-threshold\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/three-flashes-or-below-threshold.html\",title:\"WCAG 2.2 Success Criterion 2.3.1 Three Flashes or Below Threshold\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#three-flashes\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/three-flashes.html\",title:\"WCAG 2.2 Success Criterion 2.3.2 Three Flashes\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#animation-from-interactions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/animation-from-interactions.html\",title:\"WCAG 2.2 Success Criterion 2.3.3 Animation from Interactions\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#bypass-blocks\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/bypass-blocks.html\",title:\"WCAG 2.2 Success Criterion 2.4.1 Bypass Blocks\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#page-titled\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/page-titled.html\",title:\"WCAG 2.2 Success Criterion 2.4.2 Page Titled\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#focus-order\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-order.html\",title:\"WCAG 2.2 Success Criterion 2.4.3 Focus Order\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#link-purpose-in-context\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/link-purpose-in-context.html\",title:\"WCAG 2.2 Success Criterion 2.4.4 Link Purpose (In Context)\",level:\"A\",version:\"2.0\",category:t},{url:i+\"#multiple-ways\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/multiple-ways.html\",title:\"WCAG 2.2 Success Criterion 2.4.5 Multiple Ways\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#headings-and-labels\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/headings-and-labels.html\",title:\"WCAG 2.2 Success Criterion 2.4.6 Headings and Labels\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-visible\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-visible.html\",title:\"WCAG 2.2 Success Criterion 2.4.7 Focus Visible\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#location\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/location.html\",title:\"WCAG 2.2 Success Criterion 2.4.8 Location\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#link-purpose-link-only\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/link-purpose-link-only.html\",title:\"WCAG 2.2 Success Criterion 2.4.9 Link Purpose (Link Only)\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#section-headings\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/section-headings.html\",title:\"WCAG 2.2 Success Criterion 2.4.10 Section Headings\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#focus-not-obscured-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-minimum.html\",title:\"WCAG 2.2 Success Criterion 2.4.11 Focus Not Obscured (Minimum)\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-not-obscured-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-enhanced.html\",title:\"WCAG 2.2 Success Criterion 2.4.12 Focus Not Obscured (Enhanced)\",level:\"AA\",version:\"2.0\",category:t},{url:i+\"#focus-appearance\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/focus-appearance.html\",title:\"WCAG 2.2 Success Criterion 2.4.13 Focus Appearance\",level:\"AAA\",version:\"2.0\",category:t},{url:i+\"#pointer-gestures\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pointer-gestures.html\",title:\"WCAG 2.2 Success Criterion 2.5.1 Pointer Gestures\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#pointer-cancellation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pointer-cancellation.html\",title:\"WCAG 2.2 Success Criterion 2.5.2 Pointer Cancellation\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#label-in-name\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/label-in-name.html\",title:\"WCAG 2.2 Success Criterion 2.5.3 Label in Name\",level:\"A\",version:\"2.2\",category:t},{url:i+\"#motion-actuation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/motion-actuation.html\",title:\"WCAG 2.2 Success Criterion 2.5.4 Motion Actuation\",level:\"A\",version:\"2.1\",category:t},{url:i+\"#target-size\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/target-size.html\",title:\"WCAG 2.2 Success Criterion 2.5.5 Target Size\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#concurrent-input-mechanisms\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/concurrent-input-mechanisms.html\",title:\"WCAG 2.2 Success Criterion 2.5.6 Concurrent Input Mechanisms\",level:\"AAA\",version:\"2.1\",category:t},{url:i+\"#dragging-movements\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html\",title:\"WCAG 2.2 Success Criterion 2.5.7 Dragging Movements\",level:\"AA\",version:\"2.2\",category:t},{url:i+\"#target-size-minimum\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html\",title:\"WCAG 2.2 Success Criterion 2.5.8 Target Size (Minimum)\",level:\"AA\",version:\"2.2\",category:t},{url:i+\"#language-of-page\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/language-of-page.html\",title:\"WCAG 2.2 Success Criterion 3.1.1 Language of Page\",level:\"A\",version:\"2.1\",category:n},{url:i+\"#language-of-parts\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/language-of-parts.html\",title:\"WCAG 2.2 Success Criterion 3.1.2 Language of Parts\",level:\"AA\",version:\"2.1\",category:n},{url:i+\"#unusual-words\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/unusual-words.html\",title:\"WCAG 2.2 Success Criterion 3.1.3 Unusual Words\",level:\"AAA\",version:\"2.1\",category:n},{url:i+\"#abbreviations\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/abbreviations.html\",title:\"WCAG 2.2 Success Criterion 3.1.4 Abbreviations\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#reading-level\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/reading-level.html\",title:\"WCAG 2.2 Success Criterion 3.1.5 Reading Level\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#pronunciation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/pronunciation.html\",title:\"WCAG 2.2 Success Criterion 3.1.6 Pronunciation\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#on-focus\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/on-focus.html\",title:\"WCAG 2.2 Success Criterion 3.2.1 On Focus\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#on-input\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/on-input.html\",title:\"WCAG 2.2 Success Criterion 3.2.2 On Input\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#consistent-navigation\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-navigation.html\",title:\"WCAG 2.2 Success Criterion 3.2.3 Consistent Navigation\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#consistent-identification\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-identification.html\",title:\"WCAG 2.2 Success Criterion 3.2.4 Consistent Identification\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#change-on-request\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/change-on-request.html\",title:\"WCAG 2.2 Success Criterion 3.2.5 Change on Request\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#consistent-help\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/consistent-help.html\",title:\"WCAG 2.2 Success Criterion 3.2.6 Consistent Help\",level:\"A\",version:\"2.2\",category:n},{url:i+\"#error-identification\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-identification.html\",title:\"WCAG 2.2 Success Criterion 3.3.1 Error Identification\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#labels-or-instructions\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/labels-or-instructions.html\",title:\"WCAG 2.2 Success Criterion 3.3.2 Labels or Instructions\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#error-suggestion\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-suggestion.html\",title:\"WCAG 2.2 Success Criterion 3.3.3 Error Suggestion\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#error-prevention-legal-financial-data\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-prevention-legal-financial-data.html\",title:\"WCAG 2.2 Success Criterion 3.3.4 Error Prevention (Legal, Financial, Data)\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#help\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/help.html\",title:\"WCAG 2.2 Success Criterion 3.3.5 Help\",level:\"AAA\",version:\"2.0\",category:n},{url:i+\"#error-prevention-all\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/error-prevention-all.html\",title:\"WCAG 2.2 Success Criterion 3.3.6 Error Prevention (All)\",level:\"AAA\",version:\"2.2\",category:n},{url:i+\"#redundant-entry\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/redundant-entry.html\",title:\"WCAG 2.2 Success Criterion 3.3.7 Redundant Entry\",level:\"A\",version:\"2.0\",category:n},{url:i+\"#accessible-authentication\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication.html\",title:\"WCAG 2.2 Success Criterion 3.3.8 Accessible Authentication\",level:\"AA\",version:\"2.0\",category:n},{url:i+\"#accessible-authentication-enhanced\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/accessible-authentication-enhanced.html\",title:\"WCAG 2.2 Success Criterion 3.3.9 Accessible Authentication (Enhanced)\",level:\"AAA\",version:\"2.1\",category:n},{url:i+\"#parsing\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/parsing.html\",title:\"WCAG 2.2 Success Criterion 4.1.1 Parsing\",level:\"A\",version:\"2.0\",category:r},{url:i+\"#name-role-value\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/name-role-value.html\",title:\"WCAG 2.2 Success Criterion 4.1.2 Name, Role, Value\",level:\"A\",version:\"2.0\",category:r},{url:i+\"#status-messages\",understandingUrl:\"https://www.w3.org/WAI/WCAG22/Understanding/status-messages.html\",title:\"WCAG 2.2 Success Criterion 4.1.3 Status Messages\",level:\"AA\",version:\"2.0\",category:r}],console.clear(),!window.wcagData){console.error(\"WCAG data not loaded. Make sure data-source.js is included before this script.\"),alert(\"WCAG data not available. Please ensure the extension is properly installed.\");return}let o=window.wcagData,l=document.getElementById(\"a11y-tools-shadow-host\");if(l){let a=document.querySelectorAll('[aria-hidden=\"true\"]');a.forEach(e=>{e!==l&&e.removeAttribute(\"aria-hidden\")});let s=document.querySelectorAll('[tabindex=\"-1\"]');s.forEach(e=>{e.removeAttribute(\"tabindex\")}),document.body.removeChild(l)}let d=document.activeElement,c=null,u=-1,g=null,A=document.createElement(\"div\");A.setAttribute(\"id\",\"a11y-tools-shadow-host\"),A.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9999;pointer-events: none;`;let p=A.attachShadow({mode:\"closed\"}),w=\"\";\"undefined\"!=typeof openInSidebar&&openInSidebar&&(w=`#a11y-tools-data-lookup {width: 100%;height: 100%;max-width: none;max-height: none;top:0;bottom:0;outline:0;border:0;}#data-list {max-height: 70vh;}`);let h=document.createElement(\"style\");h.textContent=`/* Reset all default styles */*, *::before, *::after {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;box-sizing: border-box;line-height: 1;}/* Basic styling for all elements */* {font-family: Arial, sans-serif;color: inherit;background: transparent;text-decoration: none;list-style: none;}/* Specific component styles */#a11y-tools-modal-backdrop {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);z-index: 9999;pointer-events: all;}#a11y-tools-data-lookup {background: white;background: #dff3f3;color: black;position: fixed;top: 2em;left: 50%;transform: translate(-50%, 0);border: 2px solid #333;padding: 20px;box-shadow: 0 4px 20px rgba(0,0,0,0.5);z-index: 10000;font-family: Arial, sans-serif;max-width: 90vw;width: 60em;max-height: 80vh;overflow: hidden;display: flex;flex-direction: column;pointer-events: all;}#a11y-tools-data-lookup h1 {margin: 0 0 15px 0;color: #333;font-size: 20px;font-weight: bold;line-height: 1.2;}#a11y-tools-data-lookup input[type=\"text\"] {background: white;color: black;width: 100%;padding: 12px;border: 2px solid #007cba;font-size: 16px;margin-bottom: 16px;box-sizing: border-box;border-radius: 5px;}#a11y-tools-data-lookup input[type=\"text\"]:focus {outline: 3px solid #007cba;outline-offset: 3px;}#a11y-tools-data-lookup button {border-radius: 5px;}#a11y-tools-data-lookup button:focus {outline: 3px solid #007cba;outline-offset: 3px;}#a11y-tools-data-lookup input[type=\"radio\"]:focus {outline: 3px solid #007cba;outline-offset: 3px;}.search-hint {font-size: 12px;color: #666;margin-bottom: 10px;line-height: 1.3;}.filters-container {display: flex;gap: 20px;margin-bottom: 15px;flex-wrap: wrap;}.filter-fieldset {border: 1px solid #ccc;padding: 10px;margin: 0;border-radius: 3px;}.filter-legend {font-weight: bold;padding: 0 5px;}.filter-label {display: inline-block;margin-right: 15px;cursor: pointer;line-height: 1.4;}.filter-radio {margin-right: 5px;}#data-list:empty {display:none!important;}#data-list {max-height: 300px;overflow-y: auto;border: 1px solid #ccc;margin: 0 0 15px 0;padding: 0;list-style: none;background: #f9f9f9;}#data-list li {padding: 10px;cursor: pointer;border-bottom: 1px solid #eee;background: white;line-height: 1.4;}#data-list li:hover,#data-list li.hover {background: #007cba;}#data-list li:hover *,#data-list li.hover * {color: white!important;}#selection-made {border: 1px solid #007cba;padding: 10px;margin-bottom: 15px;background: #f0f8ff;display: none;border-radius: 3px;}#selection-made strong {display: block;margin-bottom: 5px;font-weight: bold;}.selection-text {font-family: monospace;font-size: 14px;line-height: 1.3;}#selection-made:focus {outline: 3px solid #007cba;outline-offset: 3px;}.buttons-container {display: none;gap: 10px;flex-wrap: wrap;}.action-button {background: #007cba;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin: 5px 5px 5px 0;border-radius: 3px;}.action-button:hover {background: #005a8a;}.secondary-button {background: #666;color: white;border: none;padding: 10px 15px;cursor: pointer;font-size: 14px;margin-top: 10px;border-radius: 3px;}.secondary-button:hover {background: #444;}.version {font-weight:bold;}.category {color:white;background:gray;padding:0.2em;font-size:0.8em;border-radius:5px;outline:1px solid white;}.Perceivable {color:navy;}.Operable {color:#295f19;}.Understandable {color:purple;}.Robust {color:darkred;}.category.Perceivable {background:navy;color:white;}.category.Operable {background:#295f19;color:white;}.category.Understandable {background:purple;color:white;}.category.Robust {background:darkred;color:white;}/* Notification panel styles */#notification-panel {position: fixed;bottom: 20px;left: 20px;right: 20px;background: #162650;color: white;padding: 15px 20px;border-radius: 8px;border: 2px solid #03a9f4;box-shadow: 0 4px 12px rgba(0,0,0,0.3);z-index: 10001;width:calc(100%-40px);font-family: Arial, sans-serif;font-size: 14px;line-height: 1.4;opacity: 0;transform: translateX(100%);pointer-events: all;}#notification-panel.show {opacity: 1;transform: translateX(0);}#notification-panel .notification-title {font-weight: bold;margin-bottom: 8px;color: #babae4;}#notification-panel .notification-content {font-family: monospace;background: rgba(255,255,255,0.1);padding: 8px;border-radius: 4px;border: 1px solid rgba(255,255,255,0.2);word-break: break-all;}${w}`;let C=[],m=Array.from(document.body.children);m.forEach(e=>{e!==A&&(C.push({element:e,originalAriaHidden:e.getAttribute(\"aria-hidden\")}),e.setAttribute(\"aria-hidden\",\"true\"))});let v=Array.from(document.querySelectorAll('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex=\"-1\"]), [contenteditable]')),W=[];v.forEach(e=>{W.push({element:e,originalTabIndex:e.getAttribute(\"tabindex\")}),e.setAttribute(\"tabindex\",\"-1\")});let b=document.createElement(\"div\");b.setAttribute(\"id\",\"a11y-tools-modal-backdrop\");let y=document.createElement(\"div\");y.setAttribute(\"role\",\"dialog\"),y.setAttribute(\"id\",\"a11y-tools-data-lookup\"),y.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),y.setAttribute(\"aria-modal\",\"true\");let f=document.createElement(\"h1\");f.textContent=\"Look up WCAG Success Criteria\",f.setAttribute(\"id\",\"a11y-tools-lookup-dialog-header\");let $=document.createElement(\"input\");$.type=\"text\",$.placeholder='Type to search/filter (e.g., \"images\", \"keyboard\", \"1.1.1\")...',$.setAttribute(\"role\",\"combobox\"),$.setAttribute(\"aria-labelledby\",\"a11y-tools-lookup-dialog-header\"),$.setAttribute(\"aria-controls\",\"data-list\"),$.setAttribute(\"aria-expanded\",\"false\"),$.setAttribute(\"aria-autocomplete\",\"list\"),$.setAttribute(\"aria-describedby\",\"search-hint filters-hint\");let _=document.createElement(\"div\");_.textContent=\"Filters for WCAG level and version are above this input\",_.setAttribute(\"id\",\"filters-hint\"),_.setAttribute(\"hidden\",\"hidden\");let G=document.createElement(\"div\");G.className=\"filters-container\";let x=document.createElement(\"fieldset\");x.className=\"filter-fieldset\";let U=document.createElement(\"legend\");U.textContent=\"WCAG Level:\",U.className=\"filter-legend\",[\"All\",\"A\",\"AA\",\"AAA\"].forEach((e,t)=>{let n=document.createElement(\"label\");n.className=\"filter-label\";let r=document.createElement(\"input\");r.type=\"radio\",r.name=\"level-filter\",r.value=e,r.checked=\"All\"===e,r.className=\"filter-radio\",r.onchange=()=>H($.value);let i=document.createTextNode(e);n.appendChild(r),n.appendChild(i),x.appendChild(n)}),x.appendChild(U),x.insertBefore(U,x.firstChild);let S=document.createElement(\"fieldset\");S.className=\"filter-fieldset\";let k=document.createElement(\"legend\");k.textContent=\"WCAG Version:\",k.className=\"filter-legend\",[\"All\",\"2.0\",\"2.1\",\"2.2\"].forEach((e,t)=>{let n=document.createElement(\"label\");n.className=\"filter-label\";let r=document.createElement(\"input\");r.type=\"radio\",r.name=\"version-filter\",r.value=e,r.checked=\"All\"===e,r.className=\"filter-radio\",r.onchange=()=>H($.value);let i=document.createTextNode(e);n.appendChild(r),n.appendChild(i),S.appendChild(n)}),S.appendChild(k),S.insertBefore(k,S.firstChild),G.appendChild(x),G.appendChild(S);let I=document.createElement(\"ul\");I.setAttribute(\"role\",\"listbox\"),I.setAttribute(\"tabindex\",\"0\"),I.setAttribute(\"id\",\"data-list\"),I.setAttribute(\"aria-label\",\"WCAG Success Criteria\");let E=document.createElement(\"div\");E.setAttribute(\"id\",\"selection-made\"),E.setAttribute(\"tabindex\",\"-1\");let L=document.createElement(\"strong\");L.textContent=\"Selected:\";let N=document.createElement(\"div\");N.className=\"selection-text\",E.appendChild(L),E.appendChild(N);let T=document.createElement(\"div\");T.className=\"buttons-container\";let P=document.createElement(\"div\");P.setAttribute(\"id\",\"notification-panel\"),P.setAttribute(\"role\",\"status\"),P.setAttribute(\"aria-live\",\"polite\");let z=document.createElement(\"div\");z.className=\"notification-title\";let D=document.createElement(\"div\");function M(e,t){g&&clearTimeout(g),z.textContent=e,D.textContent=t,P.classList.add(\"show\"),g=setTimeout(()=>{P.classList.remove(\"show\")},5e3)}D.className=\"notification-content\",P.appendChild(z),P.appendChild(D),[{text:\"Copy as Markdown Link (1)\",key:\"1\",action:\"markdown\"},{text:\"Copy as HTML Link (2)\",key:\"2\",action:\"html\"},{text:\"Copy SC Name Only (3)\",key:\"3\",action:\"name\"},{text:\"Copy SC URL Only (4)\",key:\"4\",action:\"url\"},{text:\"Go to page (5)\",key:\"5\",action:\"goto\"},{text:\"Go to Understanding doc (6)\",key:\"6\",action:\"understanding\"}].forEach(e=>{let t=document.createElement(\"button\");t.textContent=e.text,t.className=\"action-button\",t.onclick=()=>j(e.action),T.appendChild(t)});let q=document.createElement(\"button\");q.textContent=\"Close (Escape)\",q.className=\"secondary-button\";let R=document.createElement(\"button\");function O(){g&&clearTimeout(g),C.forEach(({element:e,originalAriaHidden:t})=>{null===t?e.removeAttribute(\"aria-hidden\"):e.setAttribute(\"aria-hidden\",t)}),W.forEach(({element:e,originalTabIndex:t})=>{null===t?e.removeAttribute(\"tabindex\"):e.setAttribute(\"tabindex\",t)}),document.body.removeChild(A),d.focus()}function F(e){let t=y.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"])'),n=t[0],r=t[t.length-1];\"Tab\"===e.key&&(e.shiftKey?p.activeElement===n&&(e.preventDefault(),r.focus()):p.activeElement===r&&(e.preventDefault(),n.focus()))}function H(e){let t=p.querySelector('input[name=\"level-filter\"]:checked')?.value||\"All\",n=p.querySelector('input[name=\"version-filter\"]:checked')?.value||\"All\",r=o.filter(r=>{let i=!0;if(e.length>0){let o=e.toLowerCase().trim(),l=r.title.toLowerCase();if(l.includes(o))i=!0;else{let a=o.split(/\\s+/).filter(e=>e.length>0);if(1===a.length){let s=a[0];i=l.split(/\\s+/).some(e=>e.includes(s))}else i=a.every(e=>l.split(/\\s+/).some(t=>t.includes(e)))}}let d=\"All\"===t||r.level===t,c=\"All\"===n||r.version===n;return i&&d&&c});if(I.innerHTML=\"\",u=-1,$.setAttribute(\"aria-expanded\",r.length>0?\"true\":\"false\"),0===r.length){let i=document.createElement(\"li\");i.textContent=\"No WCAG SC found that matches this filtering\",i.style.cssText=\"padding: 10px; color: #666; font-style: italic;\",I.appendChild(i);return}r.forEach((e,t)=>{let n=document.createElement(\"li\");n.setAttribute(\"role\",\"option\"),n.setAttribute(\"id\",`option-${t}`);let r=e.category;n.innerHTML='<span style=\"font-weight:bold\">'+e.title.replace(\"WCAG 2.2 Success Criterion \",\"\")+\"</span> <span>(Level \"+e.level+')</span> <span class=\"version '+r+'\">'+e.version+'</span> <span class=\"category '+r+'\">'+e.category+\"</span>\",n.dataset.index=t,n.dataset.url=e.url,n.dataset.title=e.title,n.onmouseenter=()=>{u=t,B()},n.onclick=()=>V(e),I.appendChild(n)})}function B(){let e=I.querySelectorAll('li[role=\"option\"]');e.forEach((e,t)=>{t===u?(e.classList.add(\"hover\"),$.setAttribute(\"aria-activedescendant\",e.id),e.scrollIntoView({block:\"nearest\"})):e.classList.remove(\"hover\")})}function V(e){I.setAttribute(\"tabindex\",\"-1\"),c=e;let t=e.title;N.textContent=t,E.style.display=\"block\",E.focus(),T.style.display=\"flex\",R.style.display=\"block\",$.value=t,I.innerHTML=\"\",$.setAttribute(\"aria-expanded\",\"false\")}function j(e){if(!c)return;let t=c.title.replace(\"WCAG 2.2 Success Criterion \",\"SC \"),n;switch(e){case\"markdown\":n=`[${t}](${c.url})`;break;case\"html\":n=`<a href=\"${c.url}\">${t}</a>`;break;case\"name\":n=t;break;case\"url\":n=c.url;break;case\"goto\":window.open(c.url,\"_blank\");return;case\"understanding\":window.open(c.understandingUrl,\"_blank\");return}navigator.clipboard.writeText(n).then(()=>{M(\"Copied to clipboard!\",n)}).catch(()=>{console.log(n),M(\"Could not copy to clipboard\",\"Details pasted to console\")})}R.textContent=\"Start again\",R.className=\"secondary-button\",q.addEventListener(\"click\",O),R.addEventListener(\"click\",function e(){I.setAttribute(\"tabindex\",\"0\"),E.style.display=\"none\",T.style.display=\"none\",R.style.display=\"none\",$.value=\"\",c=null,u=-1,H(\"\"),$.focus()}),b.addEventListener(\"click\",e=>{e.target===b&&O()}),$.oninput=e=>{c&&(c=null,u=-1,E.style.display=\"none\",T.style.display=\"none\",R.style.display=\"none\",I.setAttribute(\"tabindex\",\"0\")),H(e.target.value)},$.onfocus=e=>{c&&setTimeout(()=>{$.select()},0)},$.onkeydown=e=>{F(e);let t=I.querySelectorAll('li[role=\"option\"]');switch(e.key){case\"ArrowDown\":e.preventDefault(),u<t.length-1&&(u++,B());break;case\"ArrowUp\":e.preventDefault(),u>0&&(u--,B());break;case\"Enter\":if(e.preventDefault(),u>=0&&t[u]){let n=t[u],r=o.find(e=>e.url===n.dataset.url);r&&V(r)}break;case\"Escape\":e.preventDefault(),O()}},y.addEventListener(\"keydown\",e=>{if(F(e),\"Escape\"===e.key){e.preventDefault(),O();return}c&&e.key>=\"1\"&&e.key<=\"6\"&&p.activeElement!==$&&(e.preventDefault(),j([\"markdown\",\"html\",\"name\",\"url\",\"goto\",\"understanding\"][parseInt(e.key)-1]))}),y.appendChild(f),y.appendChild(G),y.appendChild($),y.appendChild(_),y.appendChild(I),y.appendChild(E),y.appendChild(T),y.appendChild(R),R.style.display=\"none\",\"undefined\"==typeof openInSidebar&&y.appendChild(q),b.appendChild(y),b.appendChild(P),p.appendChild(h),p.appendChild(b),document.body.appendChild(A),$.focus(),H(\"\")}()})()","description":"A simple lookup tool that lets you search WCAG SCs by their name or number. Also provides filtering options. Copy the SC as a link in various formats.","author":"Ian Lloyd","categories":["Accessibility","WCAG"]}}

{"id":"A11y-tools.com: Focus.json-0-0","name":"Lost focus alert","description":"Displays warning message when focus on page is lost, even when it is not visible obvious.","language":"javascript","executionMode":"activate","content":"(function(){console.log(\"Tracking focus loss now ------------------------------------\");const focusableThings=document.querySelectorAll('a[href],button,select,input:not([type=\"hidden\"]),textarea,summary,area,[tabindex],[contenteditable]:not([contenteditable=\"false\"])');let activeEl,prevActiveEl,delayTimeout,statusTimeout;const statusNotif=document.createElement(\"div\");function clearStatus(){clearTimeout(statusTimeout),statusTimeout=setTimeout(function(){statusNotif.innerHTML=\"\"},3e3)}statusNotif.setAttribute(\"role\",\"alert\"),statusNotif.setAttribute(\"aria-atomic\",\"false\"),statusNotif.setAttribute(\"id\",\"focLostNotif\"),document.body.appendChild(statusNotif);let a=document.createElement(\"style\"),b;document.head.appendChild(a),(b=a.sheet).insertRule(\"#focLostNotif:empty {visibility:hidden;}\",0),b.insertRule(\"#focLostNotif {background:black;color:white;padding:1em;font-size:2em;border-radius:10px;outline:4px solid white;position:fixed;bottom:2em;left:50%;transform:translateX(-50%)}\",0),b.insertRule(\".elCausedLossOfFocus {outline:4px solid red}\",0),b.insertRule('.elCausedLossOfFocus:before {content:\"\\uD83D\\uDEA8 \"}',0),Array.from(focusableThings).forEach(t=>{t.addEventListener(\"focus\",e=>{console.log(\"Focus: \",t),prevActiveEl=document.activeElement}),t.addEventListener(\"click\",t=>{clearTimeout(delayTimeout),delayTimeout=setTimeout(function(){activeEl=document.activeElement,statusNotif.innerHTML=\"\",\"BODY\"===activeEl.tagName&&(console.log(\"\\uD83D\\uDEA8 FOCUS WAS LOST! \\uD83D\\uDEA8\"),console.log(\"* Active element before was = \",prevActiveEl),console.log(\"* Focus after = \",activeEl),prevActiveEl.classList.add(\"elCausedLossOfFocus\"),statusNotif.innerHTML=\"FOCUS WAS LOST!<br>Check Console for details\",clearStatus())},100)})})})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Focus"],"folderName":"Focus","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Focus.json","download":{"name":"Lost focus alert","language":"javascript","executionMode":"activate","content":"(function(){console.log(\"Tracking focus loss now ------------------------------------\");const focusableThings=document.querySelectorAll('a[href],button,select,input:not([type=\"hidden\"]),textarea,summary,area,[tabindex],[contenteditable]:not([contenteditable=\"false\"])');let activeEl,prevActiveEl,delayTimeout,statusTimeout;const statusNotif=document.createElement(\"div\");function clearStatus(){clearTimeout(statusTimeout),statusTimeout=setTimeout(function(){statusNotif.innerHTML=\"\"},3e3)}statusNotif.setAttribute(\"role\",\"alert\"),statusNotif.setAttribute(\"aria-atomic\",\"false\"),statusNotif.setAttribute(\"id\",\"focLostNotif\"),document.body.appendChild(statusNotif);let a=document.createElement(\"style\"),b;document.head.appendChild(a),(b=a.sheet).insertRule(\"#focLostNotif:empty {visibility:hidden;}\",0),b.insertRule(\"#focLostNotif {background:black;color:white;padding:1em;font-size:2em;border-radius:10px;outline:4px solid white;position:fixed;bottom:2em;left:50%;transform:translateX(-50%)}\",0),b.insertRule(\".elCausedLossOfFocus {outline:4px solid red}\",0),b.insertRule('.elCausedLossOfFocus:before {content:\"\\uD83D\\uDEA8 \"}',0),Array.from(focusableThings).forEach(t=>{t.addEventListener(\"focus\",e=>{console.log(\"Focus: \",t),prevActiveEl=document.activeElement}),t.addEventListener(\"click\",t=>{clearTimeout(delayTimeout),delayTimeout=setTimeout(function(){activeEl=document.activeElement,statusNotif.innerHTML=\"\",\"BODY\"===activeEl.tagName&&(console.log(\"\\uD83D\\uDEA8 FOCUS WAS LOST! \\uD83D\\uDEA8\"),console.log(\"* Active element before was = \",prevActiveEl),console.log(\"* Focus after = \",activeEl),prevActiveEl.classList.add(\"elCausedLossOfFocus\"),statusNotif.innerHTML=\"FOCUS WAS LOST!<br>Check Console for details\",clearStatus())},100)})})})()","description":"Displays warning message when focus on page is lost, even when it is not visible obvious.","author":"Ian Lloyd","categories":["Accessibility","Focus"]}}

{"id":"A11y-tools.com: Assistive tech.json-0-0","name":"Navigate like a screen reader user","description":"Finds all landmarks, headings, links and form controls on a page and lets you navigate to them.","language":"javascript","executionMode":"activate","content":"(function(){function navigateLikeSR(){let e=document.activeElement,t=null,o=0,l=0,a=0,r=0,n=document.title;document.querySelector(\".a11y-tools-modal\")&&document.querySelector(\".a11y-tools-modal\").remove();let i={isElementHidden:function e(t){if(!t||t.hasAttribute(\"hidden\"))return!0;let o=window.getComputedStyle(t);return\"none\"===o.display||\"hidden\"===o.visibility||!!t.parentElement&&e(t.parentElement)},isElementVisuallyHidden:function e(t){let o=getComputedStyle(t);return Object.entries({clip:\"rect(1px, 1px, 1px, 1px)\",\"clip-path\":\"inset(100%)\",height:\"1px\",\"overflow-x\":\"hidden\",\"overflow-y\":\"hidden\",position:\"absolute\",width:\"1px\"}).every(([e,t])=>o.getPropertyValue(e)===t)},getTextContent:function e(t){function o(e){let t=function e(t){if(t.hasAttribute(\"aria-label\"))return t.getAttribute(\"aria-label\");if(t.hasAttribute(\"aria-labelledby\")){let o=t.getAttribute(\"aria-labelledby\").split(\" \");return o.map(e=>(function e(t){let o=document.getElementById(t);return o?o.textContent.trim():\"\"})(e)).filter(e=>e.length>0).join(\" \")}return\"\"}(e);if(t)return t;switch(e.nodeName.toLowerCase()){case\"img\":return e.getAttribute(\"alt\")||e.getAttribute(\"title\")||\"\";case\"svg\":let o=e.querySelector(\"title\"),l=e.querySelector(\"desc\");return[o?o.textContent:\"\",l?l.textContent:\"\",e.getAttribute(\"aria-label\")||\"\"].filter(e=>e.length>0).join(\" \");default:return\"\"}}return(function e(t){let l=\"\";if(t.nodeType===Node.TEXT_NODE)return t.textContent.trim();if(t.nodeType===Node.ELEMENT_NODE){if(\"svg\"===t.nodeName.toLowerCase())return o(t);let a=o(t);for(let r of(a&&(l+=a+\" \"),t.childNodes))l+=e(r)+\" \"}return l.trim()})(t).replace(/\\s+/g,\" \").trim()},computeAccessibleName:function e(t){function o(e){return e.hasAttribute(\"hidden\")||\"true\"===e.getAttribute(\"aria-hidden\")||e.style&&\"none\"===e.style.display||e.style&&\"hidden\"===e.style.visibility}function l(e){let t=\"\";for(let a of e.childNodes)a.nodeType===Node.TEXT_NODE?t+=a.textContent.trim():a.nodeType!==Node.ELEMENT_NODE||o(a)||(t+=l(a));return t}let a=t.getAttribute(\"aria-labelledby\");if(a){var r;let n=(r=a)?r.split(/\\s+/).map(e=>document.getElementById(e)).filter(e=>null!==e):[];if(n.length>0)return n.map(t=>e(t)).filter(e=>e.length>0).join(\" \")}let i=t.getAttribute(\"aria-label\");if(i&&i.trim())return i.trim();switch(t.tagName.toLowerCase()){case\"input\":{let s=t.getAttribute(\"type\")?.toLowerCase();if(\"button\"===s||\"submit\"===s||\"reset\"===s){if(t.hasAttribute(\"value\"))return t.value;return\"submit\"===s?\"Submit\":\"reset\"===s?\"Reset\":\"\"}let d=t.labels?.[0];if(d)return e(d);if(t.title)return t.title;if(t.placeholder)return t.placeholder;break}case\"img\":case\"area\":{let c=t.getAttribute(\"alt\");if(null!==c)return c;if(t.title)return t.title;break}case\"label\":case\"button\":return l(t);case\"fieldset\":{let u=t.querySelector(\"legend\");if(u)return e(u);break}case\"figure\":{let b=t.querySelector(\"figcaption\");if(b)return e(b);break}case\"table\":{let p=t.querySelector(\"caption\");if(p)return e(p)}}if(t.title)return t.title;if(![\"img\",\"area\"].includes(t.tagName.toLowerCase())){let m=l(t);if(m)return m}return\"\"},prepareElement:(e,t,o)=>(e.classList.add(\"a11y-tools-focus-highlight\"),e.getAttribute(\"id\")||e.setAttribute(\"id\",`${t}${o}`),e.getAttribute(\"id\")),createListItem(e,t,o){let l=`<li><a data-source=${t} href=\"#${e}\">${o}`;return this.isElementVisuallyHidden(document.getElementById(t))&&(l+=\" (WARNING: visually hidden element)\"),l+\"</a></li>\"},wrapInList(e,t=\"\"){let o=`<ul>${e}</ul>`;return t&&(o+=`<p>${t}</p>`),o}},s={landmarks:`aside:not([role]:not([role=complementary])),header:not(:is(article, section) header, header header):not([role]:not([role=banner])),footer:not(:is(article, section) footer, footer footer):not([role]:not([role=contentinfo])),main:not([role]:not([role=main])),nav:not([role]:not([role=navigation])),section[aria-label]:not([role]:not([role=region])),section[aria-labelledby]:not([role]:not([role=region])),[role=complementary],[role=contentinfo],[role=banner],[role=main],[role=navigation],[role=region]`,headings:`h1:not([role]:not([role=heading])),h2:not(.a11y-tools-modal-content h2):not([role]:not([role=heading])),h3:not([role]:not([role=heading])),h4:not([role]:not([role=heading])),h5:not([role]:not([role=heading])),h6:not([role]:not([role=heading])),[role=\"heading\"][aria-level=\"1\"],[role=\"heading\"][aria-level=\"2\"],[role=\"heading\"][aria-level=\"3\"],[role=\"heading\"][aria-level=\"4\"],[role=\"heading\"][aria-level=\"5\"],[role=\"heading\"][aria-level=\"6\"]`,links:`a:not(.a11y-tools-modal a):not([role]:not([role=link])),[role=link]`,formControls:`input:not([type=hidden],.a11y-tools-modal input):not([role]:not([role=textbox],[role=button],[role=checkbox],[role=radio],[role=spinbutton],[role=combobox],[role=searchbox])),button:not(.a11y-tools-modal button):not([role]:not([role=button])),textarea:not([role]:not([role=textbox])),select:not([role]:not([role=listbox],[role=combobox])),[role=button]`};function d(){let e=\"\";r=0;let t=document.querySelectorAll(s.formControls),o=document.querySelector(\"[name=levelOfDetail]:checked\").getAttribute(\"id\");Array.from(t).forEach((t,l)=>{if(!i.isElementHidden(t)){r++;let a=i.prepareElement(t,\"formEl\",l+1),n=t.tagName.toLowerCase(),s=t.getAttribute(\"name\"),d=i.computeAccessibleName(t),c=function e(t){let o=t.tagName.toLowerCase(),l=t.getAttribute(\"type\")?.toLowerCase();if(\"input\"===o)switch(l){case\"text\":default:return\"textbox\";case\"password\":return\"password\";case\"checkbox\":return\"checkbox\";case\"radio\":return\"radio button\";case\"submit\":return\"submit button\";case\"reset\":return\"reset button\";case\"button\":return\"button\";case\"file\":return\"file upload\";case\"image\":return\"image button\";case\"color\":return\"color picker\";case\"date\":return\"date picker\";case\"datetime-local\":return\"datetime picker\";case\"email\":return\"email\";case\"month\":return\"month picker\";case\"number\":return\"number input\";case\"range\":return\"slider\";case\"search\":return\"search box\";case\"tel\":return\"telephone\";case\"time\":return\"time picker\";case\"url\":return\"URL\";case\"week\":return\"week picker\"}else if(\"textarea\"===o)return\"multiline textbox\";else if(\"select\"===o)return t.hasAttribute(\"multiple\")?\"multi-select list\":\"dropdown\";else if(\"button\"===o||\"button\"===t.getAttribute(\"role\"))return\"button\";return\"form control\"}(t),u=d?`\"${d}\" `:\"*MISSING LABEL*\";u+=`<span aria-hidden=\"false\">, ${c}</span>`,\"DetailedView\"===o&&(u+=` <span aria-hidden=\"false\">(${n}${a?`, id: ${a}`:\"\"}${s?`, name: ${s}`:\"\"})</span>`),e+=i.createListItem(a,a,u)}}),document.querySelector(\"#tabPanel4 .tabpanel-inner\").innerHTML=i.wrapInList(e)}function c(){document.querySelector(\".a11y-tools-modal\")?(t.classList.add(\"a11y-tools-modal-open\"),document.querySelector(\"#a11y-tools-hint-panel\")&&document.querySelector(\"#a11y-tools-hint-panel\").remove()):(function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"a11yToolsStyles\"),t.textContent=`.visually-hidden {clip-path:inset(100%); clip:rect(1px,1px,1px,1px); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px;}body.a11y-tools-modal-open {overflow:hidden;}.a11y-tools-modal {display:none; position:fixed; bottom:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.1); z-index:50000; isolation:isolate; box-sizing:border-box;}.a11y-tools-modal-open {display:block;}.a11y-tools-modal-content {position:relative; background-color:#fff; margin:0 auto; padding:20px; overflow-y:auto; border-radius:4px; box-shadow:0 4px 6px rgba(0,0,0,0.5); width:80%; height:50vh; top:40%;}.a11y-tools-modal-close {position:absolute; top:10px; right:10px; border:none; background:none; font-size:24px; line-height:1; padding:5px 10px; cursor:pointer; color:#666;}.a11y-tools-modal-close:hover, .a11y-tools-modal-close:focus {color:#000; background-color:#f0f0f0; border-radius:4px;}.a11y-tools-modal[style*=\"display: block\"] {display:flex !important; align-items:flex-start; justify-content:center;}body.a11y-tools-modal-open > *:not(.a11y-tools-modal) {visibility:hidden;}body.a11y-tools-modal-open .a11y-tools-modal, body.a11y-tools-modal-open .a11y-tools-modal * {visibility:visible;}.a11y-tools-tabs+.a11y-tools-tabs {margin-top:1em !important;}.js .a11y-tools-tabs [role=tablist] {margin:0; padding:0;}.js .a11y-tools-tabs [role=tab] {padding:10px; display:block; text-decoration:none; color:darkslategray; font-weight:bold;}.js .a11y-tools-tabs [role=tab]:focus {outline:2px solid #fff; outline-offset:-4px; box-shadow:none;}.js .a11y-tools-tabs.horizontal>div>div {height:35vh; overflow-y:scroll; width:100%; outline:none;}.js .a11y-tools-tabs.horizontal {padding:0; margin:2em 0 1em 0; border:1px solid #000; height:35vh; overflow-y:hidden;}.js .a11y-tools-tabs.horizontal>ul {width:100%; display:table; table-layout:fixed;}.js .a11y-tools-tabs.horizontal>ul>li {list-style:none; background:#EEE; display:table-cell; border-bottom:1px solid #000; border-right:1px solid #000; margin:0; padding:0;}.js .a11y-tools-tabs.horizontal>ul>li:last-child {border-right:0;}.js .a11y-tools-tabs.horizontal>div {overflow:auto;}.js .a11y-tools-tabs [role=tabpanel] {padding:10px; box-sizing:border-box; border:2px solid transparent; transition:border 0.3s;}.js .a11y-tools-tabs [role=tabpanel][aria-hidden] {display:none;}.js .a11y-tools-tabs [aria-selected] {background:darkslategray; color:#fff; outline:none;}.js .a11y-tools-tabs [role=tabpanel]:focus {border:2px solid darkslategray;}.js .a11y-tools-tabs.horizontal>ul.grid {display:grid; grid-gap:0;}@supports (width: min(250px, 100%)) {.js .a11y-tools-tabs.horizontal>ul.grid {grid-template-columns:repeat(auto-fit, minmax(min(250px, 100%), 1fr));}}.a11y-tools-tabs label {display:inline;}.a11y-tools-tabs [role=tabpanel] a {outline:none; text-decoration:none; border-bottom:4px solid transparent;}.a11y-tools-tabs [role=tabpanel] a:focus {outline:none; color:black; background:yellow; text-decoration:none; border-bottom:4px solid black;}.a11y-tools-tabs [role=tabpanel] li {padding:0 0 0 1em; margin:.5em 0 .5em 1em; list-style:initial;}.a11y-tools-tabs a .pill {color:white; background:darkslategray; display:inline-block; padding:5px; border-radius:10px; outline:2px solid white; min-width:2em; text-align:center; font-size:0.8rem; transform:translateY(-0.1rem); margin-left:0.5em;}.a11y-tools-tabs [role=tabpanel] a .pill {font-size:0.6rem; background:#555;}* .a11y-tools-modal h2 {color:black!important;border:none!important;padding:0!important;}* .a11y-tools-modal {color:black; font-family:sans-serif; line-height:1.5;}* .a11y-tools-modal [role=tab] a {color:white!important;}* .a11y-tools-modal [role=tabpanel] a {color:blue!important;}* .a11y-tools-modal [role=tabpanel] ul,.a11y-tools-modal [role=tabpanel] li {padding:0;text-align:left;}@keyframes focus-animation {0% {outline:10px solid yellow; background:yellow; outline-offset:-10px;}100% {outline:2px solid black; background:unset; outline-offset:0;}}.temp-focus {animation:focus-animation 0.8s ease-out forwards;}/*.a11y-tools-focus-highlight:focus {outline:6px solid lime; box-shadow:0 0 0 8px black;}*/.tabs.horizontal > ul[role=\"tablist\"] {position: sticky;top: 0;background-color: #EEE;z-index: 10;}.hint-panel {background:black;color:white;font-weight:bold;text-align:center;padding:5px;border-radius:5px;position:fixed;bottom:5px;left:5px;right:5px;}`,document.head.appendChild(t)}(),function e(){let t=document.createElement(\"div\");t.className=\"a11y-tools-modal\",t.setAttribute(\"role\",\"dialog\"),t.setAttribute(\"aria-modal\",\"true\");let o=document.createElement(\"div\");o.className=\"a11y-tools-modal-content\";let l=`<h2>Page title: ${n}</h2><div class=\"a11y-tools-tabs horizontal\"><ul role=\"tablist\" aria-label=\"Navigation options\" class=\"roving\"><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel1\" href=\"#tabPanel1\" id=\"tab1\">Landmarks</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel2\" href=\"#tabPanel2\" tabindex=\"-1\" id=\"tab2\">Headings</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel3\" href=\"#tabPanel3\" tabindex=\"-1\" id=\"tab3\">Links</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel4\" href=\"#tabPanel4\" tabindex=\"-1\" id=\"tab4\">Form Controls</a></li></ul><div class=\"tab-panels\"><div role=\"tabpanel\" aria-labelledby=\"tab1\" id=\"tabPanel1\"><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab2\" id=\"tabPanel2\"><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab3\" id=\"tabPanel3\"><fieldset><legend>Link behaviour</legend><div><input type=\"radio\" id=\"radShowLink\" name=\"linkBehaviour\" checked><label for=\"radShowLink\">Go to link location on the page</label></div><div><input type=\"radio\" id=\"radLinkImmediately\" name=\"linkBehaviour\"><label for=\"radLinkImmediately\">Navigate to link destination immediately</label></div></fieldset><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab4\" id=\"tabPanel4\"><fieldset><legend>Level of detail</legend><div><input type=\"radio\" id=\"SimpleView\" name=\"levelOfDetail\" checked><label for=\"SimpleView\">Just show accessible name</label></div><div><input type=\"radio\" id=\"DetailedView\" name=\"levelOfDetail\"><label for=\"DetailedView\">Accessible name, element type, name and id</label></div></fieldset><div class=\"tabpanel-inner\"></div></div></div></div><p>Note: the panel will disappear when a link is activated, but it can be shown again by pressing Shift + N</p>`;o.innerHTML=l,t.appendChild(o);let a=document.createElement(\"button\");a.textContent=\"\\xd7\",a.className=\"a11y-tools-modal-close\",a.setAttribute(\"aria-label\",\"Close dialog\"),o.insertBefore(a,o.firstChild),a.addEventListener(\"click\",()=>{u()}),t.classList.add(\"a11y-tools-modal-open\"),document.body.appendChild(t),t.querySelector(\"a[role=tab]\").focus()}(),function e(){function t(e,t,o){l=e,a=t,Array.from(l).forEach(e=>{e.setAttribute(\"hidden\",\"hidden\")}),Array.from(a).forEach(e=>{e.removeAttribute(\"aria-selected\")}),o.setAttribute(\"aria-selected\",\"true\");var l,a,r=o.getAttribute(\"aria-controls\");document.querySelector(\"#\"+r).removeAttribute(\"hidden\")}document.querySelector(\"body\").classList.add(\"js\"),Array.from(document.querySelectorAll(\".a11y-tools-tabs\")).forEach(e=>{e.querySelectorAll(\"[role=tablist]\"),e.querySelectorAll(\".tabpanels\");var o=e.querySelectorAll(\"[role=tab]\"),l=e.querySelectorAll(\"[role=tabpanel]\"),a=e.querySelector(\"[role=tab]\"),r=e.querySelector(\"[role=tabpanel]\");Array.from(o).forEach(e=>{e.addEventListener(\"click\",a=>{t(l,o,e),a.preventDefault()}),e.addEventListener(\"focus\",a=>{t(l,o,e)})}),Array.from(l).forEach(e=>{e.setAttribute(\"hidden\",\"hidden\")}),a.setAttribute(\"aria-selected\",\"true\"),r.removeAttribute(\"hidden\")})}(),function e(){let t=!1,l=\"\";o=0;let a=document.querySelectorAll(s.landmarks);Array.from(a).forEach((e,a)=>{if(!i.isElementHidden(e)){o++;let r=function e(t,o){let l=t.tagName.toLowerCase(),a={complementary:\"aside\",contentinfo:\"footer\",banner:\"header\",main:\"main\",navigation:\"nav\",region:\"section\"},r=t.getAttribute(\"role\"),n=r&&a[r];n&&(l=a[r]);let s=t.getAttribute(\"aria-label\")||(t.getAttribute(\"aria-labelledby\")?i.computeAccessibleName(t):\"\"),d=i.prepareElement(t,\"landmark\",o),c=`${l}${s?` (${s})`:\"\"}`;return{html:i.createListItem(d,d,c),convertedBack:n}}(e,a+1);l+=r.html,t=t||r.convertedBack,e.getAttribute(\"tabindex\")||e.setAttribute(\"tabindex\",\"-1\")}});let r=t?\"Note: some landmarks were defined using <code>role</code> attributes but are indicated by their native HTML equivalents for simplicity.\":\"\";document.querySelector(\"#tabPanel1 .tabpanel-inner\").innerHTML=i.wrapInList(l,r)}(),function e(){let t=\"\";l=0;let o=document.querySelectorAll(s.headings);Array.from(o).forEach((e,o)=>{i.isElementHidden(e)||(l++,t+=function e(t,o){let l={h1:{level:\"H1\",announcement:\"Heading level 1\"},h2:{level:\"H2\",announcement:\"Heading level 2\"},h3:{level:\"H3\",announcement:\"Heading level 3\"},h4:{level:\"H4\",announcement:\"Heading level 4\"},h5:{level:\"H5\",announcement:\"Heading level 5\"},h6:{level:\"H6\",announcement:\"Heading level 6\"}},a,r,n=t.tagName.toLowerCase(),s=t.getAttribute(\"aria-level\");if(\"heading\"===t.getAttribute(\"role\")&&s){let d=l[`h${s}`];a=d.level,r=d.announcement}else a=l[n].level,r=l[n].announcement;let c=i.prepareElement(t,\"heading\",o),u=i.getTextContent(t)||\"*MISSING LABEL*\",b=`${u}<span class=\"visually-hidden\">${r}</span><span class=\"pill\" aria-hidden=\"true\">${a}</span>`;return i.createListItem(c,c,b)}(e,o+1))}),document.querySelector(\"#tabPanel2 .tabpanel-inner\").innerHTML=i.wrapInList(t)}(),function e(){let t=\"\";a=0;let o=document.querySelectorAll(s.links);Array.from(o).forEach((e,o)=>{if(!i.isElementHidden(e)){a++;let l=i.prepareElement(e,\"link\",o+1),r=i.getTextContent(e);\"\"===r&&(r=\"*MISSING LABEL*\"),t+=i.createListItem(e.href,l,r)}});let l=document.querySelector(\"#tabPanel3 .tabpanel-inner\");l.innerHTML=i.wrapInList(t);let r=l.querySelectorAll(\"li a\");Array.from(r).forEach(e=>{e.addEventListener(\"click\",t=>{let o=document.querySelector(\"[name=linkBehaviour]:checked\").getAttribute(\"id\");\"radLinkImmediately\"!==o&&(t.preventDefault(),document.querySelector(\"#\"+e.getAttribute(\"data-source\")).focus())})})}(),d(),function e(){let t=document.querySelectorAll(\".a11y-tools-modal [role=tabpanel] a\");Array.from(t).forEach(e=>{e.addEventListener(\"click\",e=>{u()})})}(),document.querySelector(\"#tab1\").innerHTML='Landmarks <span class=\"pill\">'+o+\"</span>\",document.querySelector(\"#tab2\").innerHTML='Headings <span class=\"pill\">'+l+\"</span>\",document.querySelector(\"#tab3\").innerHTML='Links <span class=\"pill\">'+a+\"</span>\",document.querySelector(\"#tab4\").innerHTML='Form Controls <span class=\"pill\">'+r+\"</span>\",t=document.querySelector(\".a11y-tools-modal\")),document.querySelector(\".a11y-tools-modal a[role=tab]\").focus()}function u(){t&&(t.classList.remove(\"a11y-tools-modal-open\"),function e(){let t=document.createElement(\"div\");t.textContent=\"Tool is still running in background. Press SHIFT + N to show again\",t.classList.add(\"hint-panel\"),t.setAttribute(\"id\",\"a11y-tools-hint-panel\"),document.body.appendChild(t)}(),e.focus())}document.addEventListener(\"keydown\",function(e){\"Escape\"===e.key&&u(),\"N\"===e.key&&e.shiftKey&&(e.preventDefault(),c()),(\"ArrowLeft\"===e.key||\"ArrowRight\"===e.key)&&document.querySelector(\".a11y-tools-modal.a11y-tools-modal-open\")&&function e(t){let o=document.querySelector('.a11y-tools-modal [role=\"tablist\"]'),l=Array.from(o.querySelectorAll('[role=\"tab\"]')),a=document.querySelector('[aria-selected=\"true\"]');if(Array.from(l).forEach(e=>{e.setAttribute(\"tabindex\",\"-1\")}),!a)return;let r=l.indexOf(a),n;if(\"ArrowLeft\"===t.key)n=0===r?l.length-1:r-1,t.preventDefault();else{if(\"ArrowRight\"!==t.key)return;n=r===l.length-1?0:r+1,t.preventDefault()}l[n].click(),l[n].focus(),l[n].removeAttribute(\"tabindex\")}(e)}),c(),function e(){function t(e){!function e(){let t=document.querySelectorAll(\".temp-focus\");Array.from(t).forEach(e=>{e.classList.remove(\"temp-focus\")})}();let t=e.getAttribute(\"data-source\");document.querySelector(\"#\"+t).scrollIntoView(),document.querySelector(\"#\"+t).classList.add(\"temp-focus\")}let o=document.querySelectorAll(\".tabpanel-inner li a\");Array.from(o).forEach(e=>{e.addEventListener(\"focus\",o=>{t(e)}),e.addEventListener(\"mouseover\",o=>{t(e)})})}(),function e(){let t=document.querySelectorAll(\"[name=levelOfDetail]\");console.log(t),Array.from(t).forEach(e=>{e.addEventListener(\"change\",e=>{d()})})}()}navigateLikeSR()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Assistive technology"],"folderName":"Assistive tech","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Assistive tech.json","download":{"name":"Navigate like a screen reader user","language":"javascript","executionMode":"activate","content":"(function(){function navigateLikeSR(){let e=document.activeElement,t=null,o=0,l=0,a=0,r=0,n=document.title;document.querySelector(\".a11y-tools-modal\")&&document.querySelector(\".a11y-tools-modal\").remove();let i={isElementHidden:function e(t){if(!t||t.hasAttribute(\"hidden\"))return!0;let o=window.getComputedStyle(t);return\"none\"===o.display||\"hidden\"===o.visibility||!!t.parentElement&&e(t.parentElement)},isElementVisuallyHidden:function e(t){let o=getComputedStyle(t);return Object.entries({clip:\"rect(1px, 1px, 1px, 1px)\",\"clip-path\":\"inset(100%)\",height:\"1px\",\"overflow-x\":\"hidden\",\"overflow-y\":\"hidden\",position:\"absolute\",width:\"1px\"}).every(([e,t])=>o.getPropertyValue(e)===t)},getTextContent:function e(t){function o(e){let t=function e(t){if(t.hasAttribute(\"aria-label\"))return t.getAttribute(\"aria-label\");if(t.hasAttribute(\"aria-labelledby\")){let o=t.getAttribute(\"aria-labelledby\").split(\" \");return o.map(e=>(function e(t){let o=document.getElementById(t);return o?o.textContent.trim():\"\"})(e)).filter(e=>e.length>0).join(\" \")}return\"\"}(e);if(t)return t;switch(e.nodeName.toLowerCase()){case\"img\":return e.getAttribute(\"alt\")||e.getAttribute(\"title\")||\"\";case\"svg\":let o=e.querySelector(\"title\"),l=e.querySelector(\"desc\");return[o?o.textContent:\"\",l?l.textContent:\"\",e.getAttribute(\"aria-label\")||\"\"].filter(e=>e.length>0).join(\" \");default:return\"\"}}return(function e(t){let l=\"\";if(t.nodeType===Node.TEXT_NODE)return t.textContent.trim();if(t.nodeType===Node.ELEMENT_NODE){if(\"svg\"===t.nodeName.toLowerCase())return o(t);let a=o(t);for(let r of(a&&(l+=a+\" \"),t.childNodes))l+=e(r)+\" \"}return l.trim()})(t).replace(/\\s+/g,\" \").trim()},computeAccessibleName:function e(t){function o(e){return e.hasAttribute(\"hidden\")||\"true\"===e.getAttribute(\"aria-hidden\")||e.style&&\"none\"===e.style.display||e.style&&\"hidden\"===e.style.visibility}function l(e){let t=\"\";for(let a of e.childNodes)a.nodeType===Node.TEXT_NODE?t+=a.textContent.trim():a.nodeType!==Node.ELEMENT_NODE||o(a)||(t+=l(a));return t}let a=t.getAttribute(\"aria-labelledby\");if(a){var r;let n=(r=a)?r.split(/\\s+/).map(e=>document.getElementById(e)).filter(e=>null!==e):[];if(n.length>0)return n.map(t=>e(t)).filter(e=>e.length>0).join(\" \")}let i=t.getAttribute(\"aria-label\");if(i&&i.trim())return i.trim();switch(t.tagName.toLowerCase()){case\"input\":{let s=t.getAttribute(\"type\")?.toLowerCase();if(\"button\"===s||\"submit\"===s||\"reset\"===s){if(t.hasAttribute(\"value\"))return t.value;return\"submit\"===s?\"Submit\":\"reset\"===s?\"Reset\":\"\"}let d=t.labels?.[0];if(d)return e(d);if(t.title)return t.title;if(t.placeholder)return t.placeholder;break}case\"img\":case\"area\":{let c=t.getAttribute(\"alt\");if(null!==c)return c;if(t.title)return t.title;break}case\"label\":case\"button\":return l(t);case\"fieldset\":{let u=t.querySelector(\"legend\");if(u)return e(u);break}case\"figure\":{let b=t.querySelector(\"figcaption\");if(b)return e(b);break}case\"table\":{let p=t.querySelector(\"caption\");if(p)return e(p)}}if(t.title)return t.title;if(![\"img\",\"area\"].includes(t.tagName.toLowerCase())){let m=l(t);if(m)return m}return\"\"},prepareElement:(e,t,o)=>(e.classList.add(\"a11y-tools-focus-highlight\"),e.getAttribute(\"id\")||e.setAttribute(\"id\",`${t}${o}`),e.getAttribute(\"id\")),createListItem(e,t,o){let l=`<li><a data-source=${t} href=\"#${e}\">${o}`;return this.isElementVisuallyHidden(document.getElementById(t))&&(l+=\" (WARNING: visually hidden element)\"),l+\"</a></li>\"},wrapInList(e,t=\"\"){let o=`<ul>${e}</ul>`;return t&&(o+=`<p>${t}</p>`),o}},s={landmarks:`aside:not([role]:not([role=complementary])),header:not(:is(article, section) header, header header):not([role]:not([role=banner])),footer:not(:is(article, section) footer, footer footer):not([role]:not([role=contentinfo])),main:not([role]:not([role=main])),nav:not([role]:not([role=navigation])),section[aria-label]:not([role]:not([role=region])),section[aria-labelledby]:not([role]:not([role=region])),[role=complementary],[role=contentinfo],[role=banner],[role=main],[role=navigation],[role=region]`,headings:`h1:not([role]:not([role=heading])),h2:not(.a11y-tools-modal-content h2):not([role]:not([role=heading])),h3:not([role]:not([role=heading])),h4:not([role]:not([role=heading])),h5:not([role]:not([role=heading])),h6:not([role]:not([role=heading])),[role=\"heading\"][aria-level=\"1\"],[role=\"heading\"][aria-level=\"2\"],[role=\"heading\"][aria-level=\"3\"],[role=\"heading\"][aria-level=\"4\"],[role=\"heading\"][aria-level=\"5\"],[role=\"heading\"][aria-level=\"6\"]`,links:`a:not(.a11y-tools-modal a):not([role]:not([role=link])),[role=link]`,formControls:`input:not([type=hidden],.a11y-tools-modal input):not([role]:not([role=textbox],[role=button],[role=checkbox],[role=radio],[role=spinbutton],[role=combobox],[role=searchbox])),button:not(.a11y-tools-modal button):not([role]:not([role=button])),textarea:not([role]:not([role=textbox])),select:not([role]:not([role=listbox],[role=combobox])),[role=button]`};function d(){let e=\"\";r=0;let t=document.querySelectorAll(s.formControls),o=document.querySelector(\"[name=levelOfDetail]:checked\").getAttribute(\"id\");Array.from(t).forEach((t,l)=>{if(!i.isElementHidden(t)){r++;let a=i.prepareElement(t,\"formEl\",l+1),n=t.tagName.toLowerCase(),s=t.getAttribute(\"name\"),d=i.computeAccessibleName(t),c=function e(t){let o=t.tagName.toLowerCase(),l=t.getAttribute(\"type\")?.toLowerCase();if(\"input\"===o)switch(l){case\"text\":default:return\"textbox\";case\"password\":return\"password\";case\"checkbox\":return\"checkbox\";case\"radio\":return\"radio button\";case\"submit\":return\"submit button\";case\"reset\":return\"reset button\";case\"button\":return\"button\";case\"file\":return\"file upload\";case\"image\":return\"image button\";case\"color\":return\"color picker\";case\"date\":return\"date picker\";case\"datetime-local\":return\"datetime picker\";case\"email\":return\"email\";case\"month\":return\"month picker\";case\"number\":return\"number input\";case\"range\":return\"slider\";case\"search\":return\"search box\";case\"tel\":return\"telephone\";case\"time\":return\"time picker\";case\"url\":return\"URL\";case\"week\":return\"week picker\"}else if(\"textarea\"===o)return\"multiline textbox\";else if(\"select\"===o)return t.hasAttribute(\"multiple\")?\"multi-select list\":\"dropdown\";else if(\"button\"===o||\"button\"===t.getAttribute(\"role\"))return\"button\";return\"form control\"}(t),u=d?`\"${d}\" `:\"*MISSING LABEL*\";u+=`<span aria-hidden=\"false\">, ${c}</span>`,\"DetailedView\"===o&&(u+=` <span aria-hidden=\"false\">(${n}${a?`, id: ${a}`:\"\"}${s?`, name: ${s}`:\"\"})</span>`),e+=i.createListItem(a,a,u)}}),document.querySelector(\"#tabPanel4 .tabpanel-inner\").innerHTML=i.wrapInList(e)}function c(){document.querySelector(\".a11y-tools-modal\")?(t.classList.add(\"a11y-tools-modal-open\"),document.querySelector(\"#a11y-tools-hint-panel\")&&document.querySelector(\"#a11y-tools-hint-panel\").remove()):(function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"a11yToolsStyles\"),t.textContent=`.visually-hidden {clip-path:inset(100%); clip:rect(1px,1px,1px,1px); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px;}body.a11y-tools-modal-open {overflow:hidden;}.a11y-tools-modal {display:none; position:fixed; bottom:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.1); z-index:50000; isolation:isolate; box-sizing:border-box;}.a11y-tools-modal-open {display:block;}.a11y-tools-modal-content {position:relative; background-color:#fff; margin:0 auto; padding:20px; overflow-y:auto; border-radius:4px; box-shadow:0 4px 6px rgba(0,0,0,0.5); width:80%; height:50vh; top:40%;}.a11y-tools-modal-close {position:absolute; top:10px; right:10px; border:none; background:none; font-size:24px; line-height:1; padding:5px 10px; cursor:pointer; color:#666;}.a11y-tools-modal-close:hover, .a11y-tools-modal-close:focus {color:#000; background-color:#f0f0f0; border-radius:4px;}.a11y-tools-modal[style*=\"display: block\"] {display:flex !important; align-items:flex-start; justify-content:center;}body.a11y-tools-modal-open > *:not(.a11y-tools-modal) {visibility:hidden;}body.a11y-tools-modal-open .a11y-tools-modal, body.a11y-tools-modal-open .a11y-tools-modal * {visibility:visible;}.a11y-tools-tabs+.a11y-tools-tabs {margin-top:1em !important;}.js .a11y-tools-tabs [role=tablist] {margin:0; padding:0;}.js .a11y-tools-tabs [role=tab] {padding:10px; display:block; text-decoration:none; color:darkslategray; font-weight:bold;}.js .a11y-tools-tabs [role=tab]:focus {outline:2px solid #fff; outline-offset:-4px; box-shadow:none;}.js .a11y-tools-tabs.horizontal>div>div {height:35vh; overflow-y:scroll; width:100%; outline:none;}.js .a11y-tools-tabs.horizontal {padding:0; margin:2em 0 1em 0; border:1px solid #000; height:35vh; overflow-y:hidden;}.js .a11y-tools-tabs.horizontal>ul {width:100%; display:table; table-layout:fixed;}.js .a11y-tools-tabs.horizontal>ul>li {list-style:none; background:#EEE; display:table-cell; border-bottom:1px solid #000; border-right:1px solid #000; margin:0; padding:0;}.js .a11y-tools-tabs.horizontal>ul>li:last-child {border-right:0;}.js .a11y-tools-tabs.horizontal>div {overflow:auto;}.js .a11y-tools-tabs [role=tabpanel] {padding:10px; box-sizing:border-box; border:2px solid transparent; transition:border 0.3s;}.js .a11y-tools-tabs [role=tabpanel][aria-hidden] {display:none;}.js .a11y-tools-tabs [aria-selected] {background:darkslategray; color:#fff; outline:none;}.js .a11y-tools-tabs [role=tabpanel]:focus {border:2px solid darkslategray;}.js .a11y-tools-tabs.horizontal>ul.grid {display:grid; grid-gap:0;}@supports (width: min(250px, 100%)) {.js .a11y-tools-tabs.horizontal>ul.grid {grid-template-columns:repeat(auto-fit, minmax(min(250px, 100%), 1fr));}}.a11y-tools-tabs label {display:inline;}.a11y-tools-tabs [role=tabpanel] a {outline:none; text-decoration:none; border-bottom:4px solid transparent;}.a11y-tools-tabs [role=tabpanel] a:focus {outline:none; color:black; background:yellow; text-decoration:none; border-bottom:4px solid black;}.a11y-tools-tabs [role=tabpanel] li {padding:0 0 0 1em; margin:.5em 0 .5em 1em; list-style:initial;}.a11y-tools-tabs a .pill {color:white; background:darkslategray; display:inline-block; padding:5px; border-radius:10px; outline:2px solid white; min-width:2em; text-align:center; font-size:0.8rem; transform:translateY(-0.1rem); margin-left:0.5em;}.a11y-tools-tabs [role=tabpanel] a .pill {font-size:0.6rem; background:#555;}* .a11y-tools-modal h2 {color:black!important;border:none!important;padding:0!important;}* .a11y-tools-modal {color:black; font-family:sans-serif; line-height:1.5;}* .a11y-tools-modal [role=tab] a {color:white!important;}* .a11y-tools-modal [role=tabpanel] a {color:blue!important;}* .a11y-tools-modal [role=tabpanel] ul,.a11y-tools-modal [role=tabpanel] li {padding:0;text-align:left;}@keyframes focus-animation {0% {outline:10px solid yellow; background:yellow; outline-offset:-10px;}100% {outline:2px solid black; background:unset; outline-offset:0;}}.temp-focus {animation:focus-animation 0.8s ease-out forwards;}/*.a11y-tools-focus-highlight:focus {outline:6px solid lime; box-shadow:0 0 0 8px black;}*/.tabs.horizontal > ul[role=\"tablist\"] {position: sticky;top: 0;background-color: #EEE;z-index: 10;}.hint-panel {background:black;color:white;font-weight:bold;text-align:center;padding:5px;border-radius:5px;position:fixed;bottom:5px;left:5px;right:5px;}`,document.head.appendChild(t)}(),function e(){let t=document.createElement(\"div\");t.className=\"a11y-tools-modal\",t.setAttribute(\"role\",\"dialog\"),t.setAttribute(\"aria-modal\",\"true\");let o=document.createElement(\"div\");o.className=\"a11y-tools-modal-content\";let l=`<h2>Page title: ${n}</h2><div class=\"a11y-tools-tabs horizontal\"><ul role=\"tablist\" aria-label=\"Navigation options\" class=\"roving\"><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel1\" href=\"#tabPanel1\" id=\"tab1\">Landmarks</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel2\" href=\"#tabPanel2\" tabindex=\"-1\" id=\"tab2\">Headings</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel3\" href=\"#tabPanel3\" tabindex=\"-1\" id=\"tab3\">Links</a></li><li role=\"presentation\"><a role=\"tab\" aria-controls=\"tabPanel4\" href=\"#tabPanel4\" tabindex=\"-1\" id=\"tab4\">Form Controls</a></li></ul><div class=\"tab-panels\"><div role=\"tabpanel\" aria-labelledby=\"tab1\" id=\"tabPanel1\"><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab2\" id=\"tabPanel2\"><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab3\" id=\"tabPanel3\"><fieldset><legend>Link behaviour</legend><div><input type=\"radio\" id=\"radShowLink\" name=\"linkBehaviour\" checked><label for=\"radShowLink\">Go to link location on the page</label></div><div><input type=\"radio\" id=\"radLinkImmediately\" name=\"linkBehaviour\"><label for=\"radLinkImmediately\">Navigate to link destination immediately</label></div></fieldset><div class=\"tabpanel-inner\"></div></div><div role=\"tabpanel\" aria-labelledby=\"tab4\" id=\"tabPanel4\"><fieldset><legend>Level of detail</legend><div><input type=\"radio\" id=\"SimpleView\" name=\"levelOfDetail\" checked><label for=\"SimpleView\">Just show accessible name</label></div><div><input type=\"radio\" id=\"DetailedView\" name=\"levelOfDetail\"><label for=\"DetailedView\">Accessible name, element type, name and id</label></div></fieldset><div class=\"tabpanel-inner\"></div></div></div></div><p>Note: the panel will disappear when a link is activated, but it can be shown again by pressing Shift + N</p>`;o.innerHTML=l,t.appendChild(o);let a=document.createElement(\"button\");a.textContent=\"\\xd7\",a.className=\"a11y-tools-modal-close\",a.setAttribute(\"aria-label\",\"Close dialog\"),o.insertBefore(a,o.firstChild),a.addEventListener(\"click\",()=>{u()}),t.classList.add(\"a11y-tools-modal-open\"),document.body.appendChild(t),t.querySelector(\"a[role=tab]\").focus()}(),function e(){function t(e,t,o){l=e,a=t,Array.from(l).forEach(e=>{e.setAttribute(\"hidden\",\"hidden\")}),Array.from(a).forEach(e=>{e.removeAttribute(\"aria-selected\")}),o.setAttribute(\"aria-selected\",\"true\");var l,a,r=o.getAttribute(\"aria-controls\");document.querySelector(\"#\"+r).removeAttribute(\"hidden\")}document.querySelector(\"body\").classList.add(\"js\"),Array.from(document.querySelectorAll(\".a11y-tools-tabs\")).forEach(e=>{e.querySelectorAll(\"[role=tablist]\"),e.querySelectorAll(\".tabpanels\");var o=e.querySelectorAll(\"[role=tab]\"),l=e.querySelectorAll(\"[role=tabpanel]\"),a=e.querySelector(\"[role=tab]\"),r=e.querySelector(\"[role=tabpanel]\");Array.from(o).forEach(e=>{e.addEventListener(\"click\",a=>{t(l,o,e),a.preventDefault()}),e.addEventListener(\"focus\",a=>{t(l,o,e)})}),Array.from(l).forEach(e=>{e.setAttribute(\"hidden\",\"hidden\")}),a.setAttribute(\"aria-selected\",\"true\"),r.removeAttribute(\"hidden\")})}(),function e(){let t=!1,l=\"\";o=0;let a=document.querySelectorAll(s.landmarks);Array.from(a).forEach((e,a)=>{if(!i.isElementHidden(e)){o++;let r=function e(t,o){let l=t.tagName.toLowerCase(),a={complementary:\"aside\",contentinfo:\"footer\",banner:\"header\",main:\"main\",navigation:\"nav\",region:\"section\"},r=t.getAttribute(\"role\"),n=r&&a[r];n&&(l=a[r]);let s=t.getAttribute(\"aria-label\")||(t.getAttribute(\"aria-labelledby\")?i.computeAccessibleName(t):\"\"),d=i.prepareElement(t,\"landmark\",o),c=`${l}${s?` (${s})`:\"\"}`;return{html:i.createListItem(d,d,c),convertedBack:n}}(e,a+1);l+=r.html,t=t||r.convertedBack,e.getAttribute(\"tabindex\")||e.setAttribute(\"tabindex\",\"-1\")}});let r=t?\"Note: some landmarks were defined using <code>role</code> attributes but are indicated by their native HTML equivalents for simplicity.\":\"\";document.querySelector(\"#tabPanel1 .tabpanel-inner\").innerHTML=i.wrapInList(l,r)}(),function e(){let t=\"\";l=0;let o=document.querySelectorAll(s.headings);Array.from(o).forEach((e,o)=>{i.isElementHidden(e)||(l++,t+=function e(t,o){let l={h1:{level:\"H1\",announcement:\"Heading level 1\"},h2:{level:\"H2\",announcement:\"Heading level 2\"},h3:{level:\"H3\",announcement:\"Heading level 3\"},h4:{level:\"H4\",announcement:\"Heading level 4\"},h5:{level:\"H5\",announcement:\"Heading level 5\"},h6:{level:\"H6\",announcement:\"Heading level 6\"}},a,r,n=t.tagName.toLowerCase(),s=t.getAttribute(\"aria-level\");if(\"heading\"===t.getAttribute(\"role\")&&s){let d=l[`h${s}`];a=d.level,r=d.announcement}else a=l[n].level,r=l[n].announcement;let c=i.prepareElement(t,\"heading\",o),u=i.getTextContent(t)||\"*MISSING LABEL*\",b=`${u}<span class=\"visually-hidden\">${r}</span><span class=\"pill\" aria-hidden=\"true\">${a}</span>`;return i.createListItem(c,c,b)}(e,o+1))}),document.querySelector(\"#tabPanel2 .tabpanel-inner\").innerHTML=i.wrapInList(t)}(),function e(){let t=\"\";a=0;let o=document.querySelectorAll(s.links);Array.from(o).forEach((e,o)=>{if(!i.isElementHidden(e)){a++;let l=i.prepareElement(e,\"link\",o+1),r=i.getTextContent(e);\"\"===r&&(r=\"*MISSING LABEL*\"),t+=i.createListItem(e.href,l,r)}});let l=document.querySelector(\"#tabPanel3 .tabpanel-inner\");l.innerHTML=i.wrapInList(t);let r=l.querySelectorAll(\"li a\");Array.from(r).forEach(e=>{e.addEventListener(\"click\",t=>{let o=document.querySelector(\"[name=linkBehaviour]:checked\").getAttribute(\"id\");\"radLinkImmediately\"!==o&&(t.preventDefault(),document.querySelector(\"#\"+e.getAttribute(\"data-source\")).focus())})})}(),d(),function e(){let t=document.querySelectorAll(\".a11y-tools-modal [role=tabpanel] a\");Array.from(t).forEach(e=>{e.addEventListener(\"click\",e=>{u()})})}(),document.querySelector(\"#tab1\").innerHTML='Landmarks <span class=\"pill\">'+o+\"</span>\",document.querySelector(\"#tab2\").innerHTML='Headings <span class=\"pill\">'+l+\"</span>\",document.querySelector(\"#tab3\").innerHTML='Links <span class=\"pill\">'+a+\"</span>\",document.querySelector(\"#tab4\").innerHTML='Form Controls <span class=\"pill\">'+r+\"</span>\",t=document.querySelector(\".a11y-tools-modal\")),document.querySelector(\".a11y-tools-modal a[role=tab]\").focus()}function u(){t&&(t.classList.remove(\"a11y-tools-modal-open\"),function e(){let t=document.createElement(\"div\");t.textContent=\"Tool is still running in background. Press SHIFT + N to show again\",t.classList.add(\"hint-panel\"),t.setAttribute(\"id\",\"a11y-tools-hint-panel\"),document.body.appendChild(t)}(),e.focus())}document.addEventListener(\"keydown\",function(e){\"Escape\"===e.key&&u(),\"N\"===e.key&&e.shiftKey&&(e.preventDefault(),c()),(\"ArrowLeft\"===e.key||\"ArrowRight\"===e.key)&&document.querySelector(\".a11y-tools-modal.a11y-tools-modal-open\")&&function e(t){let o=document.querySelector('.a11y-tools-modal [role=\"tablist\"]'),l=Array.from(o.querySelectorAll('[role=\"tab\"]')),a=document.querySelector('[aria-selected=\"true\"]');if(Array.from(l).forEach(e=>{e.setAttribute(\"tabindex\",\"-1\")}),!a)return;let r=l.indexOf(a),n;if(\"ArrowLeft\"===t.key)n=0===r?l.length-1:r-1,t.preventDefault();else{if(\"ArrowRight\"!==t.key)return;n=r===l.length-1?0:r+1,t.preventDefault()}l[n].click(),l[n].focus(),l[n].removeAttribute(\"tabindex\")}(e)}),c(),function e(){function t(e){!function e(){let t=document.querySelectorAll(\".temp-focus\");Array.from(t).forEach(e=>{e.classList.remove(\"temp-focus\")})}();let t=e.getAttribute(\"data-source\");document.querySelector(\"#\"+t).scrollIntoView(),document.querySelector(\"#\"+t).classList.add(\"temp-focus\")}let o=document.querySelectorAll(\".tabpanel-inner li a\");Array.from(o).forEach(e=>{e.addEventListener(\"focus\",o=>{t(e)}),e.addEventListener(\"mouseover\",o=>{t(e)})})}(),function e(){let t=document.querySelectorAll(\"[name=levelOfDetail]\");console.log(t),Array.from(t).forEach(e=>{e.addEventListener(\"change\",e=>{d()})})}()}navigateLikeSR()})()","description":"Finds all landmarks, headings, links and form controls on a page and lets you navigate to them.","author":"Ian Lloyd","categories":["Assistive technology"]}}

{"id":"A11y-tools.com: DOM manipulation.json-0-1","name":"Node Duplicator","description":"Duplicate any part of the page with a single click (also keyboard-operable).","language":"javascript","executionMode":"activate","content":"(function(){function nodeDuplicator(){let e=()=>{let e=new(window.AudioContext||window.webkitAudioContext);return()=>{let t=e.createOscillator(),o=e.createGain();t.connect(o),o.connect(e.destination),t.frequency.setValueAtTime(200,e.currentTime),t.frequency.exponentialRampToValueAtTime(600,e.currentTime+.15),o.gain.setValueAtTime(0,e.currentTime),o.gain.linearRampToValueAtTime(.3,e.currentTime+.02),o.gain.exponentialRampToValueAtTime(.01,e.currentTime+.15),t.start(e.currentTime),t.stop(e.currentTime+.15)}},t=()=>{let e=document.createElement(\"div\");return e.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(0, 30, 0, 0.8);color: #fff;padding: 10px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 80%;word-wrap: break-word;`,e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},o=()=>{let e=document.createElement(\"div\");return e.setAttribute(\"id\",\"duplicatorPanel\"),e.style.cssText=`position: fixed;top: 20px;right: 20px;background: rgba(0, 60, 0, 0.8);color: #fff;padding: 15px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 500px;word-wrap: break-word;`,document.body.appendChild(e),e},r=(e,t,o,r)=>{let n=o*r,i=Math.min(Math.max(Math.floor(15*Math.sqrt(n)/100),15),50),l=Math.min(Math.max(Math.sqrt(n)/15,8),20),a=Math.min(Math.max(Math.min(o,r)/2,40),150);for(let s=0;s<i;s++){let d=document.createElement(\"div\");d.style.cssText=`position: fixed;left: ${e}px;top: ${t}px;width: ${l}px;height: ${l}px;background: rgba(100, 200, 255, 0.8);border-radius: 50%;pointer-events: none;z-index: 9999;`,document.body.appendChild(d);let p=s/i*2*Math.PI,u=a/50*(2+2*Math.random()),c=Math.cos(p)*u,m=Math.sin(p)*u,$=.8,f=1,g=.03*(150/a),h=.04*(a/150),v=()=>{if($<=0){d.remove();return}let e=parseFloat(d.style.left),t=parseFloat(d.style.top);d.style.left=`${e+c}px`,d.style.top=`${t+m}px`,$-=g,f+=h,d.style.opacity=$,d.style.transform=`scale(${f})`,requestAnimationFrame(v)};requestAnimationFrame(v)}},n=e=>{if(!e)return\"\";if(e.id)return`//*[@id=\"${e.id}\"]`;let t=[];for(;e&&e.nodeType===Node.ELEMENT_NODE;){let o=e.nodeName.toLowerCase(),r=e,n=1;for(;r=r.previousSibling;)r.nodeType===Node.ELEMENT_NODE&&r.nodeName===e.nodeName&&n++;n>1&&(o+=`[${n}]`),t.unshift(o),e=e.parentNode}return`/${t.join(\"/\")}`};(()=>{let i=t(),l=o(),a=e(),s=null,d=!0,p=!0,u=!0,c={keydown:null,mouseover:null,mouseout:null,click:null},m=()=>{if(!p){l.style.display=\"none\";return}l.style.display=\"block\",l.innerHTML=`Element Duplicator Controls:<br>- Hover over elements, click to duplicate<br>- OR arrow keys to navigate, ENTER to duplicate<br>- ALT + Click / ALT + ENTER: duplicates all sibling elements<br>- 'S' to toggle sound (${d?\"ON\":\"OFF\"})<br>- 'H' to toggle help panel<br>- 'Q' to quit duplicator`};m();let $=document.createElement(\"style\");$.textContent=`.element-duplicator-hover {outline: 4px dashed green !important;box-shadow: 0 0 0 2px white !important;outline-offset: -2px !important;}`,document.head.appendChild($);let f=e=>!!e&&e!==i&&e!==l&&(s&&s.classList.remove(\"element-duplicator-hover\"),(s=e).classList.add(\"element-duplicator-hover\"),i.textContent=n(e),!0),g=(e,t)=>{if(!e||e===i||e===l)return;let o=e.getBoundingClientRect(),n=o.left+o.width/2,s=o.top+o.height/2;if(d&&a(),r(n,s,o.width,o.height),t.altKey){let p=e.parentElement;p&&Array.from(p.children).filter(t=>t!==e&&t!==i&&t!==l).forEach(e=>{let t=e.cloneNode(!0);e.parentNode.insertBefore(t,e.nextSibling);let o=e.getBoundingClientRect();r(o.left+o.width/2,o.top+o.height/2,o.width,o.height)})}else{let u=e.cloneNode(!0);e.parentNode.insertBefore(u,e.nextSibling)}},h=()=>{u=!1,document.removeEventListener(\"keydown\",c.keydown,!0),document.removeEventListener(\"mouseover\",c.mouseover),document.removeEventListener(\"mouseout\",c.mouseout),document.removeEventListener(\"click\",c.click),s&&s.classList.remove(\"element-duplicator-hover\"),i.remove(),l.remove(),$.remove()},v=e=>{if(\"q\"===e.key.toLowerCase()){h(),e.preventDefault(),e.stopPropagation();return}if(\"s\"===e.key.toLowerCase()){d=!d,m(),e.preventDefault(),e.stopPropagation();return}if(\"h\"===e.key.toLowerCase()){p=!p,m(),e.preventDefault(),e.stopPropagation();return}if(!s)return;let t=null;switch(e.key.toLowerCase()){case\"enter\":if(e.altKey){let o=s.parentElement;o&&Array.from(o.children).filter(e=>e!==s&&e!==i&&e!==l).forEach(e=>{let t=e.cloneNode(!0);e.parentNode.insertBefore(t,e.nextSibling);let o=e.getBoundingClientRect();r(o.left+o.width/2,o.top+o.height/2,o.width,o.height)})}else g(s,e);e.preventDefault(),e.stopPropagation();break;case\"arrowup\":t=s.parentElement;break;case\"arrowdown\":let n=Array.from(s.children).filter(e=>e.nodeType===Node.ELEMENT_NODE);t=n[0];break;case\"arrowleft\":t=s.previousElementSibling;break;case\"arrowright\":t=s.nextElementSibling}t&&(e.preventDefault(),e.stopPropagation(),f(t))};return c.keydown=v,document.addEventListener(\"keydown\",v,!0),c.mouseover=e=>{u&&f(e.target)},document.addEventListener(\"mouseover\",c.mouseover),c.mouseout=e=>{u&&e.target===s&&(e.target.classList.remove(\"element-duplicator-hover\"),s=null,i.textContent=\"\")},document.addEventListener(\"mouseout\",c.mouseout),c.click=e=>{u&&e.target!==i&&e.target!==l&&(g(e.target,e),e.preventDefault(),e.stopPropagation())},document.addEventListener(\"click\",c.click),h})()}nodeDuplicator()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"DOM manipulation","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: DOM manipulation.json","download":{"name":"Node Duplicator","language":"javascript","executionMode":"activate","content":"(function(){function nodeDuplicator(){let e=()=>{let e=new(window.AudioContext||window.webkitAudioContext);return()=>{let t=e.createOscillator(),o=e.createGain();t.connect(o),o.connect(e.destination),t.frequency.setValueAtTime(200,e.currentTime),t.frequency.exponentialRampToValueAtTime(600,e.currentTime+.15),o.gain.setValueAtTime(0,e.currentTime),o.gain.linearRampToValueAtTime(.3,e.currentTime+.02),o.gain.exponentialRampToValueAtTime(.01,e.currentTime+.15),t.start(e.currentTime),t.stop(e.currentTime+.15)}},t=()=>{let e=document.createElement(\"div\");return e.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(0, 30, 0, 0.8);color: #fff;padding: 10px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 80%;word-wrap: break-word;`,e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},o=()=>{let e=document.createElement(\"div\");return e.setAttribute(\"id\",\"duplicatorPanel\"),e.style.cssText=`position: fixed;top: 20px;right: 20px;background: rgba(0, 60, 0, 0.8);color: #fff;padding: 15px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 500px;word-wrap: break-word;`,document.body.appendChild(e),e},r=(e,t,o,r)=>{let n=o*r,i=Math.min(Math.max(Math.floor(15*Math.sqrt(n)/100),15),50),l=Math.min(Math.max(Math.sqrt(n)/15,8),20),a=Math.min(Math.max(Math.min(o,r)/2,40),150);for(let s=0;s<i;s++){let d=document.createElement(\"div\");d.style.cssText=`position: fixed;left: ${e}px;top: ${t}px;width: ${l}px;height: ${l}px;background: rgba(100, 200, 255, 0.8);border-radius: 50%;pointer-events: none;z-index: 9999;`,document.body.appendChild(d);let p=s/i*2*Math.PI,u=a/50*(2+2*Math.random()),c=Math.cos(p)*u,m=Math.sin(p)*u,$=.8,f=1,g=.03*(150/a),h=.04*(a/150),v=()=>{if($<=0){d.remove();return}let e=parseFloat(d.style.left),t=parseFloat(d.style.top);d.style.left=`${e+c}px`,d.style.top=`${t+m}px`,$-=g,f+=h,d.style.opacity=$,d.style.transform=`scale(${f})`,requestAnimationFrame(v)};requestAnimationFrame(v)}},n=e=>{if(!e)return\"\";if(e.id)return`//*[@id=\"${e.id}\"]`;let t=[];for(;e&&e.nodeType===Node.ELEMENT_NODE;){let o=e.nodeName.toLowerCase(),r=e,n=1;for(;r=r.previousSibling;)r.nodeType===Node.ELEMENT_NODE&&r.nodeName===e.nodeName&&n++;n>1&&(o+=`[${n}]`),t.unshift(o),e=e.parentNode}return`/${t.join(\"/\")}`};(()=>{let i=t(),l=o(),a=e(),s=null,d=!0,p=!0,u=!0,c={keydown:null,mouseover:null,mouseout:null,click:null},m=()=>{if(!p){l.style.display=\"none\";return}l.style.display=\"block\",l.innerHTML=`Element Duplicator Controls:<br>- Hover over elements, click to duplicate<br>- OR arrow keys to navigate, ENTER to duplicate<br>- ALT + Click / ALT + ENTER: duplicates all sibling elements<br>- 'S' to toggle sound (${d?\"ON\":\"OFF\"})<br>- 'H' to toggle help panel<br>- 'Q' to quit duplicator`};m();let $=document.createElement(\"style\");$.textContent=`.element-duplicator-hover {outline: 4px dashed green !important;box-shadow: 0 0 0 2px white !important;outline-offset: -2px !important;}`,document.head.appendChild($);let f=e=>!!e&&e!==i&&e!==l&&(s&&s.classList.remove(\"element-duplicator-hover\"),(s=e).classList.add(\"element-duplicator-hover\"),i.textContent=n(e),!0),g=(e,t)=>{if(!e||e===i||e===l)return;let o=e.getBoundingClientRect(),n=o.left+o.width/2,s=o.top+o.height/2;if(d&&a(),r(n,s,o.width,o.height),t.altKey){let p=e.parentElement;p&&Array.from(p.children).filter(t=>t!==e&&t!==i&&t!==l).forEach(e=>{let t=e.cloneNode(!0);e.parentNode.insertBefore(t,e.nextSibling);let o=e.getBoundingClientRect();r(o.left+o.width/2,o.top+o.height/2,o.width,o.height)})}else{let u=e.cloneNode(!0);e.parentNode.insertBefore(u,e.nextSibling)}},h=()=>{u=!1,document.removeEventListener(\"keydown\",c.keydown,!0),document.removeEventListener(\"mouseover\",c.mouseover),document.removeEventListener(\"mouseout\",c.mouseout),document.removeEventListener(\"click\",c.click),s&&s.classList.remove(\"element-duplicator-hover\"),i.remove(),l.remove(),$.remove()},v=e=>{if(\"q\"===e.key.toLowerCase()){h(),e.preventDefault(),e.stopPropagation();return}if(\"s\"===e.key.toLowerCase()){d=!d,m(),e.preventDefault(),e.stopPropagation();return}if(\"h\"===e.key.toLowerCase()){p=!p,m(),e.preventDefault(),e.stopPropagation();return}if(!s)return;let t=null;switch(e.key.toLowerCase()){case\"enter\":if(e.altKey){let o=s.parentElement;o&&Array.from(o.children).filter(e=>e!==s&&e!==i&&e!==l).forEach(e=>{let t=e.cloneNode(!0);e.parentNode.insertBefore(t,e.nextSibling);let o=e.getBoundingClientRect();r(o.left+o.width/2,o.top+o.height/2,o.width,o.height)})}else g(s,e);e.preventDefault(),e.stopPropagation();break;case\"arrowup\":t=s.parentElement;break;case\"arrowdown\":let n=Array.from(s.children).filter(e=>e.nodeType===Node.ELEMENT_NODE);t=n[0];break;case\"arrowleft\":t=s.previousElementSibling;break;case\"arrowright\":t=s.nextElementSibling}t&&(e.preventDefault(),e.stopPropagation(),f(t))};return c.keydown=v,document.addEventListener(\"keydown\",v,!0),c.mouseover=e=>{u&&f(e.target)},document.addEventListener(\"mouseover\",c.mouseover),c.mouseout=e=>{u&&e.target===s&&(e.target.classList.remove(\"element-duplicator-hover\"),s=null,i.textContent=\"\")},document.addEventListener(\"mouseout\",c.mouseout),c.click=e=>{u&&e.target!==i&&e.target!==l&&(g(e.target,e),e.preventDefault(),e.stopPropagation())},document.addEventListener(\"click\",c.click),h})()}nodeDuplicator()})()","description":"Duplicate any part of the page with a single click (also keyboard-operable).","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"A11y-tools.com: DOM manipulation.json-0-0","name":"Node Killer","description":"Delete any part of the page with a single click (also keyboard-operable).","language":"javascript","executionMode":"activate","content":"(function(){const createPoofSound=()=>{let e=new(window.AudioContext||window.webkitAudioContext);return()=>{let t=e.createOscillator(),n=e.createGain();t.connect(n),n.connect(e.destination),t.frequency.setValueAtTime(400,e.currentTime),t.frequency.exponentialRampToValueAtTime(50,e.currentTime+.1),n.gain.setValueAtTime(0,e.currentTime),n.gain.linearRampToValueAtTime(.3,e.currentTime+.02),n.gain.exponentialRampToValueAtTime(.01,e.currentTime+.1),t.start(e.currentTime),t.stop(e.currentTime+.1)}},createInfoPanel=()=>{let e=document.createElement(\"div\");return e.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(30, 0, 0, 0.8);color: #fff;padding: 10px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 80%;word-wrap: break-word;`,e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},createStatusPanel=()=>{let e=document.createElement(\"div\");return e.setAttribute(\"id\",\"zapperPanel\"),e.style.cssText=`position: fixed;top: 20px;right: 20px;background: rgba(60, 0, 0, 0.8);color: #fff;padding: 15px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 300px;word-wrap: break-word;`,document.body.appendChild(e),e},createSmokeEffect=(e,t,n,o)=>{let r=n*o,i=Math.min(Math.max(Math.floor(15*Math.sqrt(r)/100),15),50),a=Math.min(Math.max(Math.sqrt(r)/10,10),30),l=Math.min(Math.max(Math.min(n,o)/2,50),200);for(let s=0;s<i;s++){let p=document.createElement(\"div\");p.style.cssText=`position: fixed;left: ${e}px;top: ${t}px;width: ${a}px;height: ${a}px;background: rgba(128, 128, 128, 0.5);border-radius: 50%;pointer-events: none;z-index: 9999;`,document.body.appendChild(p);let d=s/i*2*Math.PI,u=l/50*(2+2*Math.random()),m=Math.cos(d)*u,c=Math.sin(d)*u,$=.5,f=1,g=.02*(200/l),v=.05*(l/200),h=()=>{if($<=0){p.remove();return}let e=parseFloat(p.style.left),t=parseFloat(p.style.top);p.style.left=`${e+m}px`,p.style.top=`${t+c}px`,$-=g,f+=v,p.style.opacity=$,p.style.transform=`scale(${f})`,requestAnimationFrame(h)};requestAnimationFrame(h)}},getXPath=e=>{if(!e)return\"\";if(e.id)return`//*[@id=\"${e.id}\"]`;let t=[];for(;e&&e.nodeType===Node.ELEMENT_NODE;){let n=e.nodeName.toLowerCase(),o=e,r=1;for(;o=o.previousSibling;)o.nodeType===Node.ELEMENT_NODE&&o.nodeName===e.nodeName&&r++;r>1&&(n+=`[${r}]`),t.unshift(n),e=e.parentNode}return`/${t.join(\"/\")}`},initElementZapper=()=>{let e=createInfoPanel(),t=createStatusPanel(),n=createPoofSound(),o=null,r=!0,i=!0,a=!0,l={keydown:null,mouseover:null,mouseout:null,click:null},s=()=>{if(!i){t.style.display=\"none\";return}t.style.display=\"block\",t.innerHTML=`Element Zapper Controls:<br>- Hover over elements<br>- Click to zap<br>- ALT + Click / ALT + ENTER = zap all sibling elements<br>- Arrow keys to navigate<br>- 'S' to toggle sound (${r?\"ON\":\"OFF\"})<br>- 'H' to toggle help panel`};s();let p=document.createElement(\"style\");p.textContent=`.element-zapper-hover {outline: 4px dashed black !important;box-shadow: 0 0 0 2px white !important;outline-offset: -2px !important;}`,document.head.appendChild(p);let d=n=>!!n&&n!==e&&n!==t&&(o&&o.classList.remove(\"element-zapper-hover\"),(o=n).classList.add(\"element-zapper-hover\"),e.textContent=getXPath(n),!0),u=(i,a)=>{if(!i||i===e||i===t)return;let l=i.getBoundingClientRect(),s=l.left+l.width/2,p=l.top+l.height/2;r&&n(),createSmokeEffect(s,p,l.width,l.height),setTimeout(()=>{if(a.altKey){let t=i.parentElement;t&&Array.from(t.children).filter(e=>e!==i).forEach(e=>{createSmokeEffect(e.getBoundingClientRect().left+e.getBoundingClientRect().width/2,e.getBoundingClientRect().top+e.getBoundingClientRect().height/2,e.getBoundingClientRect().width,e.getBoundingClientRect().height),e.remove()})}else i.remove();e.textContent=\"\",o=null},100)},m=()=>{a=!1,document.removeEventListener(\"keydown\",l.keydown,!0),document.removeEventListener(\"mouseover\",l.mouseover),document.removeEventListener(\"mouseout\",l.mouseout),document.removeEventListener(\"click\",l.click),o&&o.classList.remove(\"element-zapper-hover\"),e.remove(),t.remove();let n=document.head.querySelector(\"style[data-zapper-style]\");n&&n.remove()},c=e=>{if(\"q\"===e.key.toLowerCase()){m(),e.preventDefault(),e.stopPropagation();return}if(\"s\"===e.key.toLowerCase()){r=!r,s(),e.preventDefault(),e.stopPropagation();return}if(\"h\"===e.key.toLowerCase()){i=!i,s(),e.preventDefault(),e.stopPropagation();return}if(!o)return;let t=null;switch(e.key.toLowerCase()){case\"enter\":if(e.altKey){let n=o.parentElement;n&&Array.from(n.children).filter(e=>e!==o).forEach(e=>{createSmokeEffect(e.getBoundingClientRect().left+e.getBoundingClientRect().width/2,e.getBoundingClientRect().top+e.getBoundingClientRect().height/2,e.getBoundingClientRect().width,e.getBoundingClientRect().height),e.remove()})}else u(o,e);e.preventDefault(),e.stopPropagation();break;case\"arrowup\":t=o.parentElement;break;case\"arrowdown\":let a=Array.from(o.children).filter(e=>e.nodeType===Node.ELEMENT_NODE);t=a[0];break;case\"arrowleft\":t=o.previousElementSibling;break;case\"arrowright\":t=o.nextElementSibling}t&&(e.preventDefault(),e.stopPropagation(),d(t))};return l.keydown=c,document.addEventListener(\"keydown\",c,!0),l.mouseover=e=>{a&&d(e.target)},document.addEventListener(\"mouseover\",l.mouseover),l.mouseout=t=>{a&&t.target===o&&(t.target.classList.remove(\"element-zapper-hover\"),o=null,e.textContent=\"\")},document.addEventListener(\"mouseout\",l.mouseout),l.click=n=>{a&&n.target!==e&&n.target!==t&&(u(n.target,n),n.preventDefault(),n.stopPropagation())},document.addEventListener(\"click\",l.click),()=>{document.removeEventListener(\"keydown\",c,!0),document.removeEventListener(\"mouseover\",d),document.removeEventListener(\"mouseout\",d),document.removeEventListener(\"click\",u),p.remove(),e.remove(),t.remove()}};initElementZapper()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"DOM manipulation","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: DOM manipulation.json","download":{"name":"Node Killer","language":"javascript","executionMode":"activate","content":"(function(){const createPoofSound=()=>{let e=new(window.AudioContext||window.webkitAudioContext);return()=>{let t=e.createOscillator(),n=e.createGain();t.connect(n),n.connect(e.destination),t.frequency.setValueAtTime(400,e.currentTime),t.frequency.exponentialRampToValueAtTime(50,e.currentTime+.1),n.gain.setValueAtTime(0,e.currentTime),n.gain.linearRampToValueAtTime(.3,e.currentTime+.02),n.gain.exponentialRampToValueAtTime(.01,e.currentTime+.1),t.start(e.currentTime),t.stop(e.currentTime+.1)}},createInfoPanel=()=>{let e=document.createElement(\"div\");return e.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(30, 0, 0, 0.8);color: #fff;padding: 10px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 80%;word-wrap: break-word;`,e.id=\"infoPanel\",e.setAttribute(\"role\",\"status\"),document.body.appendChild(e),e},createStatusPanel=()=>{let e=document.createElement(\"div\");return e.setAttribute(\"id\",\"zapperPanel\"),e.style.cssText=`position: fixed;top: 20px;right: 20px;background: rgba(60, 0, 0, 0.8);color: #fff;padding: 15px;border-radius: 5px;font-family: monospace;z-index: 10000;pointer-events: none;max-width: 300px;word-wrap: break-word;`,document.body.appendChild(e),e},createSmokeEffect=(e,t,n,o)=>{let r=n*o,i=Math.min(Math.max(Math.floor(15*Math.sqrt(r)/100),15),50),a=Math.min(Math.max(Math.sqrt(r)/10,10),30),l=Math.min(Math.max(Math.min(n,o)/2,50),200);for(let s=0;s<i;s++){let p=document.createElement(\"div\");p.style.cssText=`position: fixed;left: ${e}px;top: ${t}px;width: ${a}px;height: ${a}px;background: rgba(128, 128, 128, 0.5);border-radius: 50%;pointer-events: none;z-index: 9999;`,document.body.appendChild(p);let d=s/i*2*Math.PI,u=l/50*(2+2*Math.random()),m=Math.cos(d)*u,c=Math.sin(d)*u,$=.5,f=1,g=.02*(200/l),v=.05*(l/200),h=()=>{if($<=0){p.remove();return}let e=parseFloat(p.style.left),t=parseFloat(p.style.top);p.style.left=`${e+m}px`,p.style.top=`${t+c}px`,$-=g,f+=v,p.style.opacity=$,p.style.transform=`scale(${f})`,requestAnimationFrame(h)};requestAnimationFrame(h)}},getXPath=e=>{if(!e)return\"\";if(e.id)return`//*[@id=\"${e.id}\"]`;let t=[];for(;e&&e.nodeType===Node.ELEMENT_NODE;){let n=e.nodeName.toLowerCase(),o=e,r=1;for(;o=o.previousSibling;)o.nodeType===Node.ELEMENT_NODE&&o.nodeName===e.nodeName&&r++;r>1&&(n+=`[${r}]`),t.unshift(n),e=e.parentNode}return`/${t.join(\"/\")}`},initElementZapper=()=>{let e=createInfoPanel(),t=createStatusPanel(),n=createPoofSound(),o=null,r=!0,i=!0,a=!0,l={keydown:null,mouseover:null,mouseout:null,click:null},s=()=>{if(!i){t.style.display=\"none\";return}t.style.display=\"block\",t.innerHTML=`Element Zapper Controls:<br>- Hover over elements<br>- Click to zap<br>- ALT + Click / ALT + ENTER = zap all sibling elements<br>- Arrow keys to navigate<br>- 'S' to toggle sound (${r?\"ON\":\"OFF\"})<br>- 'H' to toggle help panel`};s();let p=document.createElement(\"style\");p.textContent=`.element-zapper-hover {outline: 4px dashed black !important;box-shadow: 0 0 0 2px white !important;outline-offset: -2px !important;}`,document.head.appendChild(p);let d=n=>!!n&&n!==e&&n!==t&&(o&&o.classList.remove(\"element-zapper-hover\"),(o=n).classList.add(\"element-zapper-hover\"),e.textContent=getXPath(n),!0),u=(i,a)=>{if(!i||i===e||i===t)return;let l=i.getBoundingClientRect(),s=l.left+l.width/2,p=l.top+l.height/2;r&&n(),createSmokeEffect(s,p,l.width,l.height),setTimeout(()=>{if(a.altKey){let t=i.parentElement;t&&Array.from(t.children).filter(e=>e!==i).forEach(e=>{createSmokeEffect(e.getBoundingClientRect().left+e.getBoundingClientRect().width/2,e.getBoundingClientRect().top+e.getBoundingClientRect().height/2,e.getBoundingClientRect().width,e.getBoundingClientRect().height),e.remove()})}else i.remove();e.textContent=\"\",o=null},100)},m=()=>{a=!1,document.removeEventListener(\"keydown\",l.keydown,!0),document.removeEventListener(\"mouseover\",l.mouseover),document.removeEventListener(\"mouseout\",l.mouseout),document.removeEventListener(\"click\",l.click),o&&o.classList.remove(\"element-zapper-hover\"),e.remove(),t.remove();let n=document.head.querySelector(\"style[data-zapper-style]\");n&&n.remove()},c=e=>{if(\"q\"===e.key.toLowerCase()){m(),e.preventDefault(),e.stopPropagation();return}if(\"s\"===e.key.toLowerCase()){r=!r,s(),e.preventDefault(),e.stopPropagation();return}if(\"h\"===e.key.toLowerCase()){i=!i,s(),e.preventDefault(),e.stopPropagation();return}if(!o)return;let t=null;switch(e.key.toLowerCase()){case\"enter\":if(e.altKey){let n=o.parentElement;n&&Array.from(n.children).filter(e=>e!==o).forEach(e=>{createSmokeEffect(e.getBoundingClientRect().left+e.getBoundingClientRect().width/2,e.getBoundingClientRect().top+e.getBoundingClientRect().height/2,e.getBoundingClientRect().width,e.getBoundingClientRect().height),e.remove()})}else u(o,e);e.preventDefault(),e.stopPropagation();break;case\"arrowup\":t=o.parentElement;break;case\"arrowdown\":let a=Array.from(o.children).filter(e=>e.nodeType===Node.ELEMENT_NODE);t=a[0];break;case\"arrowleft\":t=o.previousElementSibling;break;case\"arrowright\":t=o.nextElementSibling}t&&(e.preventDefault(),e.stopPropagation(),d(t))};return l.keydown=c,document.addEventListener(\"keydown\",c,!0),l.mouseover=e=>{a&&d(e.target)},document.addEventListener(\"mouseover\",l.mouseover),l.mouseout=t=>{a&&t.target===o&&(t.target.classList.remove(\"element-zapper-hover\"),o=null,e.textContent=\"\")},document.addEventListener(\"mouseout\",l.mouseout),l.click=n=>{a&&n.target!==e&&n.target!==t&&(u(n.target,n),n.preventDefault(),n.stopPropagation())},document.addEventListener(\"click\",l.click),()=>{document.removeEventListener(\"keydown\",c,!0),document.removeEventListener(\"mouseover\",d),document.removeEventListener(\"mouseout\",d),document.removeEventListener(\"click\",u),p.remove(),e.remove(),t.remove()}};initElementZapper()})()","description":"Delete any part of the page with a single click (also keyboard-operable).","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"A11y-tools.com: Design.json-0-1","name":"Non-underlined links","description":"Reveals all links that lack underlines that also have low contrast with adjacent text.","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";var consoleOutput=\"\";function checkNonUnderlinedLinks(){function e(){let e=document.createElement(\"style\");e.setAttribute(\"id\",\"a11yToolsStyles\"),e.textContent=`.a11y-tools-highlighlight {}`,document.head.appendChild(e)}console.clear();let t=!1,o=!1,n=!1,l=!1,r=document.querySelectorAll(\"a\"),i=0,s=!1,a=!1;function u(e,t,o){let n=[e,t,o].map(function(e){return(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4)});return .2126*n[0]+.7152*n[1]+.0722*n[2]}function d(e){return e=(e=(e=e.replace(\"rgb(\",\"\")).replace(\")\",\"\")).split(\", \")}function e(){let e=document.createElement(\"style\");e.textContent=\".problem-highlight {outline:3px solid darkred;outline-offset:3px;box-shadow: 0px 0px 0px 10px #fff;}.big-problem-highlight {outline:6px solid darkred;}\",document.head.appendChild(e)}if(e(),Array.from(r).forEach(e=>{if(s=!1,a=!1,l=function e(t,o){for(;(t=t.parentElement)&&!(t.matches||t.matchesSelector).call(t,o););return t}(e,\"nav,[role=navigation]\"),e.childNodes.length>0&&(e.childNodes[0].tagName&&(\"IMG\"===e.childNodes[0].tagName.toUpperCase()||\"SVG\"===e.childNodes[0].tagName.toUpperCase()||\"FIGURE\"===e.childNodes[0].tagName.toUpperCase())&&(s=!0),!function e(l){t=!1,o=!1,n=!1;let r=getComputedStyle(l);for(let i=0;i<r.length;i++){let s=r[i],a=r.getPropertyValue(s);\"text-decoration-line\"===s&&\"underline\"===a&&(o=!0),\"border-bottom-style\"===s&&(\"solid\"===a||\"dotted\"===a||\"dashed\"===a)&&(n=!0),\"border-bottom-color\"===s&&\"transparent\"===a&&(n=!1),(o||n)&&(t=!0)}return t}(e)&&!s)){consoleOutput+=\"-------\\n\",consoleOutput+=\"Link text: \"+e.textContent+\"\\n\",!l&&(function e(t){t.classList.add(\"problem-highlight\")}(e),consoleOutput+=\"Affected node (xpath): \"+function e(t){let o=t,n=t.tagName.toLowerCase(),l,r=\"\",i=\"\",s=\"\",a=\"\";for(;o.parentNode;){if((l=o.parentNode).tagName){r=l.tagName.toLowerCase();let u=l.querySelectorAll(o.tagName);s=u.length>1?\"[\"+parseInt(Array.from(u).indexOf(o)+1)+\"]\":\"\",i=(n=o.tagName.toLowerCase())+s+a+i,a=\"/\"}o=l}return\"\"===r&&(r=n),i=\"//\"+r+s+a+i}(e)+\"\\n\",i++);let r=d(getComputedStyle(e).color),c=d(getComputedStyle(e.parentNode).color),p=function e(t,o){let n=u(t[0],t[1],t[2]),l=u(o[0],o[1],o[2]);return(Math.max(n,l)+.05)/(Math.min(n,l)+.05)}(r,c);l?consoleOutput+=\"Link is inside a <nav> element and therefore its position/display does not require the underline for it to be perceived as a link.\\n\":(p<3?(consoleOutput+=\"\\uD83D\\uDEA8 Contrast between link text and parent text node is under 3:1. \",l||function e(t){t.classList.add(\"big-problem-highlight\")}(e)):consoleOutput+=\"✅ Contrast between link text and parent text node is over 3:1. \",consoleOutput+=\"Ratio is \"+p.toFixed(2)+\":1.\",p<3?consoleOutput+=\"\\n  Very likely a [SC 1.4.1 Use of Color](https://www.w3.org/TR/WCAG21/#use-of-color) issue\\n\":consoleOutput+=\"\\n  Possibly a [SC 1.4.1 Use of Color](https://www.w3.org/TR/WCAG21/#use-of-color) issue. HOWEVER, as ratio with adjacent text appears to be over 3:1, it is not a failure [Understanding SC 1.4.1: Use of Color (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html) \\n\")}}),i>0){let c=i+\" possible issues with non-underlined links found\";consoleOutput=c+\"\\n\"+consoleOutput,alert(c+\" (check console for more details)\")}else alert(\"No non-underlined links found (outside of a navigation area)\");console.log(consoleOutput),document.addEventListener(\"keydown\",function(e){\"q\"===e.key&&(e.preventDefault(),function e(){let t=document.querySelectorAll(\".problem-highlight,.big-problem-highlight\");Array.from(t).forEach(e=>{e.classList.remove(\"problem-highlight\"),e.classList.remove(\"big-problem-highlight\")});let o=document.querySelector(\"#a11yToolsStyles\");o&&o.remove()}())})}checkNonUnderlinedLinks();var kmOutput=consoleOutput})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Color","Links"],"folderName":"Design","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Design.json","download":{"name":"Non-underlined links","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";var consoleOutput=\"\";function checkNonUnderlinedLinks(){function e(){let e=document.createElement(\"style\");e.setAttribute(\"id\",\"a11yToolsStyles\"),e.textContent=`.a11y-tools-highlighlight {}`,document.head.appendChild(e)}console.clear();let t=!1,o=!1,n=!1,l=!1,r=document.querySelectorAll(\"a\"),i=0,s=!1,a=!1;function u(e,t,o){let n=[e,t,o].map(function(e){return(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4)});return .2126*n[0]+.7152*n[1]+.0722*n[2]}function d(e){return e=(e=(e=e.replace(\"rgb(\",\"\")).replace(\")\",\"\")).split(\", \")}function e(){let e=document.createElement(\"style\");e.textContent=\".problem-highlight {outline:3px solid darkred;outline-offset:3px;box-shadow: 0px 0px 0px 10px #fff;}.big-problem-highlight {outline:6px solid darkred;}\",document.head.appendChild(e)}if(e(),Array.from(r).forEach(e=>{if(s=!1,a=!1,l=function e(t,o){for(;(t=t.parentElement)&&!(t.matches||t.matchesSelector).call(t,o););return t}(e,\"nav,[role=navigation]\"),e.childNodes.length>0&&(e.childNodes[0].tagName&&(\"IMG\"===e.childNodes[0].tagName.toUpperCase()||\"SVG\"===e.childNodes[0].tagName.toUpperCase()||\"FIGURE\"===e.childNodes[0].tagName.toUpperCase())&&(s=!0),!function e(l){t=!1,o=!1,n=!1;let r=getComputedStyle(l);for(let i=0;i<r.length;i++){let s=r[i],a=r.getPropertyValue(s);\"text-decoration-line\"===s&&\"underline\"===a&&(o=!0),\"border-bottom-style\"===s&&(\"solid\"===a||\"dotted\"===a||\"dashed\"===a)&&(n=!0),\"border-bottom-color\"===s&&\"transparent\"===a&&(n=!1),(o||n)&&(t=!0)}return t}(e)&&!s)){consoleOutput+=\"-------\\n\",consoleOutput+=\"Link text: \"+e.textContent+\"\\n\",!l&&(function e(t){t.classList.add(\"problem-highlight\")}(e),consoleOutput+=\"Affected node (xpath): \"+function e(t){let o=t,n=t.tagName.toLowerCase(),l,r=\"\",i=\"\",s=\"\",a=\"\";for(;o.parentNode;){if((l=o.parentNode).tagName){r=l.tagName.toLowerCase();let u=l.querySelectorAll(o.tagName);s=u.length>1?\"[\"+parseInt(Array.from(u).indexOf(o)+1)+\"]\":\"\",i=(n=o.tagName.toLowerCase())+s+a+i,a=\"/\"}o=l}return\"\"===r&&(r=n),i=\"//\"+r+s+a+i}(e)+\"\\n\",i++);let r=d(getComputedStyle(e).color),c=d(getComputedStyle(e.parentNode).color),p=function e(t,o){let n=u(t[0],t[1],t[2]),l=u(o[0],o[1],o[2]);return(Math.max(n,l)+.05)/(Math.min(n,l)+.05)}(r,c);l?consoleOutput+=\"Link is inside a <nav> element and therefore its position/display does not require the underline for it to be perceived as a link.\\n\":(p<3?(consoleOutput+=\"\\uD83D\\uDEA8 Contrast between link text and parent text node is under 3:1. \",l||function e(t){t.classList.add(\"big-problem-highlight\")}(e)):consoleOutput+=\"✅ Contrast between link text and parent text node is over 3:1. \",consoleOutput+=\"Ratio is \"+p.toFixed(2)+\":1.\",p<3?consoleOutput+=\"\\n  Very likely a [SC 1.4.1 Use of Color](https://www.w3.org/TR/WCAG21/#use-of-color) issue\\n\":consoleOutput+=\"\\n  Possibly a [SC 1.4.1 Use of Color](https://www.w3.org/TR/WCAG21/#use-of-color) issue. HOWEVER, as ratio with adjacent text appears to be over 3:1, it is not a failure [Understanding SC 1.4.1: Use of Color (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html) \\n\")}}),i>0){let c=i+\" possible issues with non-underlined links found\";consoleOutput=c+\"\\n\"+consoleOutput,alert(c+\" (check console for more details)\")}else alert(\"No non-underlined links found (outside of a navigation area)\");console.log(consoleOutput),document.addEventListener(\"keydown\",function(e){\"q\"===e.key&&(e.preventDefault(),function e(){let t=document.querySelectorAll(\".problem-highlight,.big-problem-highlight\");Array.from(t).forEach(e=>{e.classList.remove(\"problem-highlight\"),e.classList.remove(\"big-problem-highlight\")});let o=document.querySelector(\"#a11yToolsStyles\");o&&o.remove()}())})}checkNonUnderlinedLinks();var kmOutput=consoleOutput})()","description":"Reveals all links that lack underlines that also have low contrast with adjacent text.","author":"Ian Lloyd","categories":["Accessibility","Color","Links"]}}

{"id":"External Links.json-0-0","name":"Outline all external links","description":"","language":"css","content":"a[href^=\"https://\"] {\n  outline: 1px solid red;\n}","author":"Polypane","authorUrl":null,"categories":["Debugging","Links"],"folderName":null,"folderDescription":null,"sourceFile":"External Links.json","download":{"name":"Outline all external links","language":"css","content":"a[href^=\"https://\"] {\n  outline: 1px solid red;\n}","author":"Polypane","categories":["Debugging","Links"]}}

{"id":"A11y-tools.com: Design.json-0-0","name":"Page Color Analysis","description":"Finds all background and foreground colors used on a page and displays them as swatches.","language":"javascript","executionMode":"activate","content":"(function(){function showColorsUsedOnWebPage(){let e=`<style>.visually-hidden {clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;}#color-dialog {font-family:sans-serif;font-size:16px;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);background: white;border: 2px solid black;padding: 20px;z-index: 1000;max-width: 80%;max-height: 80%;overflow: auto;}#color-dialog h2 {font-size:24px;margin-bottom:10px;}#color-dialog h3 {font-size:20px;}#color-dialog h2, #color-dialog h3 {font-weight:bold;}#color-dialog h2, #color-dialog h3, #color-dialog p {color:black!important;border:none;padding:0;}#color-dialog li {list-style:none;}.color-swatches {display: flex;flex-wrap: wrap;list-style-type: none;padding: 0;margin: 0;}.color-swatch {width: 150px;height: 150px;margin: 5px;border: 1px solid black;position: relative;text-align: center;}.color-swatch-label {position: absolute;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.7);color: white;font-size: 12px;padding: 2px;}.color-swatch-label,.color-swatch-label>div,.color-swatch-label>span {font-size:14px;}.copy-btn {display: block;width: 100%;margin-top: 3px;padding: 2px 4px;background: rgba(255,255,255,0.15);color: white;border: 1px solid rgba(255,255,255,0.6);font-size: 12px;cursor: pointer;border-radius: 2px;line-height: 1.4;}.copy-btn:hover {background: rgba(255,255,255,0.3);}.copy-btn:focus {outline: 4px solid white;outline-offset: 1px;}.color-section {margin-bottom: 20px;}#close-dialog {position:absolute;top:10px;right:10px;outline:2px solid black;padding:5px;color:black!important;background:white!important;}#close-dialog:focus {outline:4px solid black;}#copy-all-btn {display: block;margin-top: 16px;padding: 8px 16px;background: white;color: black;border: 2px solid black;font-size: 16px;cursor: pointer;border-radius: 2px;}#copy-all-btn:hover {background: #f0f0f0;}#copy-all-btn:focus {outline: 4px solid black;outline-offset: 2px;}#copy-status {margin-top: 8px;font-size: 14px;color: black;min-height: 1.4em;}</style>`;!function t(){let o=[],l=0,r=[],a=document.createElement(\"div\");a.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);z-index: 999;`;let i=document.createElement(\"div\");i.id=\"color-dialog\",i.setAttribute(\"role\",\"dialog\"),i.setAttribute(\"aria-modal\",\"true\"),i.setAttribute(\"aria-labelledby\",\"color-dialog-title\"),i.innerHTML=e+`<button id=\"close-dialog\">Close</button><h2 id=\"color-dialog-title\">Page Color Analysis</h2><div class=\"color-section\"><h3>Background Colors</h3><ul id=\"background-colors\" class=\"color-swatches\"></ul></div><div class=\"color-section\"><h3>Foreground Colors</h3><ul id=\"foreground-colors\" class=\"color-swatches\"></ul></div><ul><li>Where colors match HTML color names, these are included under the hex value.</li><li>Color are 100% opacity unless stated otherwise.</li></ul><button id=\"copy-all-btn\">Copy all hex values</button><div id=\"copy-status\" aria-live=\"polite\" aria-atomic=\"true\"></div>`;let n={\"#F0F8FF\":\"AliceBlue\",\"#FAEBD7\":\"AntiqueWhite\",\"#00FFFF\":\"Aqua\",\"#7FFFD4\":\"Aquamarine\",\"#F0FFFF\":\"Azure\",\"#F5F5DC\":\"Beige\",\"#FFE4C4\":\"Bisque\",\"#000000\":\"Black\",\"#FFEBCD\":\"BlanchedAlmond\",\"#0000FF\":\"Blue\",\"#8A2BE2\":\"BlueViolet\",\"#A52A2A\":\"Brown\",\"#DEB887\":\"BurlyWood\",\"#5F9EA0\":\"CadetBlue\",\"#7FFF00\":\"Chartreuse\",\"#D2691E\":\"Chocolate\",\"#FF7F50\":\"Coral\",\"#6495ED\":\"CornflowerBlue\",\"#FFF8DC\":\"Cornsilk\",\"#DC143C\":\"Crimson\",\"#00FFFF\":\"Cyan\",\"#00008B\":\"DarkBlue\",\"#008B8B\":\"DarkCyan\",\"#B8860B\":\"DarkGoldenRod\",\"#A9A9A9\":\"DarkGray\",\"#006400\":\"DarkGreen\",\"#BDB76B\":\"DarkKhaki\",\"#8B008B\":\"DarkMagenta\",\"#556B2F\":\"DarkOliveGreen\",\"#FF8C00\":\"DarkOrange\",\"#9932CC\":\"DarkOrchid\",\"#8B0000\":\"DarkRed\",\"#E9967A\":\"DarkSalmon\",\"#8FBC8F\":\"DarkSeaGreen\",\"#483D8B\":\"DarkSlateBlue\",\"#2F4F4F\":\"DarkSlateGray\",\"#00CED1\":\"DarkTurquoise\",\"#9400D3\":\"DarkViolet\",\"#FF1493\":\"DeepPink\",\"#00BFFF\":\"DeepSkyBlue\",\"#696969\":\"DimGray\",\"#1E90FF\":\"DodgerBlue\",\"#B22222\":\"FireBrick\",\"#FFFAF0\":\"FloralWhite\",\"#228B22\":\"ForestGreen\",\"#FF00FF\":\"Fuchsia\",\"#DCDCDC\":\"Gainsboro\",\"#F8F8FF\":\"GhostWhite\",\"#FFD700\":\"Gold\",\"#DAA520\":\"GoldenRod\",\"#808080\":\"Gray\",\"#008000\":\"Green\",\"#ADFF2F\":\"GreenYellow\",\"#F0FFF0\":\"HoneyDew\",\"#FF69B4\":\"HotPink\",\"#CD5C5C\":\"IndianRed\",\"#4B0082\":\"Indigo\",\"#FFFFF0\":\"Ivory\",\"#F0E68C\":\"Khaki\",\"#E6E6FA\":\"Lavender\",\"#FFF0F5\":\"LavenderBlush\",\"#7CFC00\":\"LawnGreen\",\"#FFFACD\":\"LemonChiffon\",\"#ADD8E6\":\"LightBlue\",\"#F08080\":\"LightCoral\",\"#E0FFFF\":\"LightCyan\",\"#FAFAD2\":\"LightGoldenRodYellow\",\"#D3D3D3\":\"LightGray\",\"#90EE90\":\"LightGreen\",\"#FFB6C1\":\"LightPink\",\"#FFA07A\":\"LightSalmon\",\"#20B2AA\":\"LightSeaGreen\",\"#87CEFA\":\"LightSkyBlue\",\"#778899\":\"LightSlateGray\",\"#B0C4DE\":\"LightSteelBlue\",\"#FFFFE0\":\"LightYellow\",\"#00FF00\":\"Lime\",\"#32CD32\":\"LimeGreen\",\"#FAF0E6\":\"Linen\",\"#FF00FF\":\"Magenta\",\"#800000\":\"Maroon\",\"#66CDAA\":\"MediumAquaMarine\",\"#0000CD\":\"MediumBlue\",\"#BA55D3\":\"MediumOrchid\",\"#9370DB\":\"MediumPurple\",\"#3CB371\":\"MediumSeaGreen\",\"#7B68EE\":\"MediumSlateBlue\",\"#00FA9A\":\"MediumSpringGreen\",\"#48D1CC\":\"MediumTurquoise\",\"#C71585\":\"MediumVioletRed\",\"#191970\":\"MidnightBlue\",\"#F5FFFA\":\"MintCream\",\"#FFE4E1\":\"MistyRose\",\"#FFE4B5\":\"Moccasin\",\"#FFDEAD\":\"NavajoWhite\",\"#000080\":\"Navy\",\"#FDF5E6\":\"OldLace\",\"#808000\":\"Olive\",\"#6B8E23\":\"OliveDrab\",\"#FFA500\":\"Orange\",\"#FF4500\":\"OrangeRed\",\"#DA70D6\":\"Orchid\",\"#EEE8AA\":\"PaleGoldenRod\",\"#98FB98\":\"PaleGreen\",\"#AFEEEE\":\"PaleTurquoise\",\"#DB7093\":\"PaleVioletRed\",\"#FFEFD5\":\"PapayaWhip\",\"#FFDAB9\":\"PeachPuff\",\"#CD853F\":\"Peru\",\"#FFC0CB\":\"Pink\",\"#DDA0DD\":\"Plum\",\"#B0E0E6\":\"PowderBlue\",\"#800080\":\"Purple\",\"#663399\":\"RebeccaPurple\",\"#FF0000\":\"Red\",\"#BC8F8F\":\"RosyBrown\",\"#4169E1\":\"RoyalBlue\",\"#8B4513\":\"SaddleBrown\",\"#FA8072\":\"Salmon\",\"#F4A460\":\"SandyBrown\",\"#2E8B57\":\"SeaGreen\",\"#FFF5EE\":\"SeaShell\",\"#A0522D\":\"Sienna\",\"#C0C0C0\":\"Silver\",\"#87CEEB\":\"SkyBlue\",\"#6A5ACD\":\"SlateBlue\",\"#708090\":\"SlateGray\",\"#FFFAFA\":\"Snow\",\"#00FF7F\":\"SpringGreen\",\"#4682B4\":\"SteelBlue\",\"#D2B48C\":\"Tan\",\"#008080\":\"Teal\",\"#D8BFD8\":\"Thistle\",\"#FF6347\":\"Tomato\",\"#40E0D0\":\"Turquoise\",\"#EE82EE\":\"Violet\",\"#F5DEB3\":\"Wheat\",\"#FFFFFF\":\"White\",\"#F5F5F5\":\"WhiteSmoke\",\"#FFFF00\":\"Yellow\",\"#9ACD32\":\"YellowGreen\"};function d(e,t,o,l){navigator.clipboard.writeText(e).then(()=>{t&&(t.textContent=`Copied ${e}`,setTimeout(()=>{t.textContent=\"\"},1500)),o&&(o.textContent=\"Copied!\",setTimeout(()=>{o.textContent=l},1500))}).catch(()=>{let r=document.createElement(\"textarea\");r.value=e,r.style.position=\"fixed\",r.style.opacity=\"0\",document.body.appendChild(r),r.focus(),r.select();try{document.execCommand(\"copy\")}catch(a){}document.body.removeChild(r),t&&(t.textContent=`Copied ${e}`,setTimeout(()=>{t.textContent=\"\"},1500)),o&&(o.textContent=\"Copied!\",setTimeout(()=>{o.textContent=l},1500))})}function $(e){let t=function e(t){if(!t.startsWith(\"rgb\")){let o=document.createElement(\"canvas\").getContext(\"2d\");return o.fillStyle=t,o.fillStyle.toUpperCase()}let l=t.match(/^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/);if(!l)return t;let r=parseInt(l[1]),a=parseInt(l[2]),i=parseInt(l[3]);return`#${r.toString(16).padStart(2,\"0\")}${a.toString(16).padStart(2,\"0\")}${i.toString(16).padStart(2,\"0\")}`.toUpperCase()}(e),{r:o,g:a,b:$}=function e(t){let o=document.createElement(\"canvas\").getContext(\"2d\");o.fillStyle=t;let l=o.fillStyle,r,a,i;if(l.startsWith(\"#\"))r=parseInt(l.slice(1,3),16),a=parseInt(l.slice(3,5),16),i=parseInt(l.slice(5,7),16);else{let n=l.match(/^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/);n&&([,r,a,i]=n.map(Number))}return{r,g:a,b:i}}(e),s=function e(t,o,l){let r=(299*t+587*o+114*l)/1e3,a=\"\";if(a=r<64?\"dark\":r<128?\"medium\":r<192?\"light\":\"bright\",40>Math.abs(t-o)&&40>Math.abs(o-l)&&40>Math.abs(t-l))return r<32?\"black\":r>224?\"pure white\":`${a} gray`;let i=[];return(t>o&&t>l&&t>40&&i.push(\"red\"),o>t&&o>l&&o>40&&i.push(\"green\"),l>t&&l>o&&l>40&&i.push(\"blue\"),40>Math.abs(t-o)&&t>l&&o>l&&i.push(\"yellow\"),40>Math.abs(t-l)&&t>o&&l>o&&i.push(\"magenta\"),40>Math.abs(o-l)&&o>t&&l>t&&i.push(\"cyan\"),0===i.length)?`${a} gray`:1===i.length?`${a} ${i[0]}`:`${a} ${i.join(\"-\")}`}(o,a,$),c=n[t];r.includes(t)||r.push(t);let u=`color-swatch-label-${l++}`,F=document.createElement(\"li\");F.className=\"color-swatch\",F.style.backgroundColor=e;let p=document.createElement(\"div\");p.className=\"color-swatch-label\";let h=(e=>{if(e.startsWith(\"rgb(\"))return\"100%\";let t=e.match(/,\\s*([\\d.]+)\\)/)[1];return 100*parseFloat(t)+\"%\"})(e);p.innerHTML=`<div id=\"${u}\">${t}</div>${c?`<div>${c}</div>`:`<span class=\"visually-hidden\"> ${s}</span>`}${\"100%\"!==h?`<div>${h}</div>`:\"\"}`;let g=document.createElement(\"button\");return g.className=\"copy-btn\",g.textContent=\"Copy\",g.setAttribute(\"aria-labelledby\",u),g.addEventListener(\"click\",()=>{let e=i.querySelector(\"#copy-status\");d(t,e,g,\"Copy\")}),p.appendChild(g),F.appendChild(p),F}let s={backgrounds:new Set,foregrounds:new Set};document.querySelectorAll(\"*\").forEach(e=>{let t=window.getComputedStyle(e),o=t.backgroundColor;\"rgba(0, 0, 0, 0)\"!==o&&\"transparent\"!==o&&s.backgrounds.add(o);let l=t.color;\"rgba(0, 0, 0, 0)\"!==l&&\"transparent\"!==l&&s.foregrounds.add(l),[t.borderTopColor,t.borderRightColor,t.borderBottomColor,t.borderLeftColor].forEach(e=>{\"rgba(0, 0, 0, 0)\"!==e&&\"transparent\"!==e&&s.foregrounds.add(e)});let r=t.outlineColor;\"rgba(0, 0, 0, 0)\"!==r&&\"transparent\"!==r&&s.foregrounds.add(r)});let c=i.querySelector(\"#background-colors\");Array.from(s.backgrounds).forEach(e=>{c.appendChild($(e))});let u=i.querySelector(\"#foreground-colors\");Array.from(s.foregrounds).forEach(e=>{u.appendChild($(e))});let F=i.querySelector(\"#copy-all-btn\");F.addEventListener(\"click\",()=>{let e=i.querySelector(\"#copy-status\"),t=r.join(\"\\n\");d(t,null,F,\"Copy all hex values\"),e.textContent=`Copied ${r.length} hex values`,setTimeout(()=>{e.textContent=\"\"},1500)});let p=i.querySelector(\"#close-dialog\");function h(){document.body.removeChild(a),document.body.removeChild(i),o.forEach(e=>{e.removeAttribute(\"aria-hidden\"),e.removeAttribute(\"inert\")}),y.focus()}p.addEventListener(\"click\",h);let g=i.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'),b=g[0],C=g[g.length-1];i.addEventListener(\"keydown\",e=>{\"Escape\"===e.key&&h(),\"Tab\"!==e.key||(e.shiftKey&&document.activeElement===b?(C.focus(),e.preventDefault()):e.shiftKey||document.activeElement!==C||(b.focus(),e.preventDefault()))}),a.setAttribute(\"aria-hidden\",\"true\"),Array.from(document.body.children).forEach(e=>{e!==a&&e!==i&&(e.setAttribute(\"aria-hidden\",\"true\"),e.setAttribute(\"inert\",\"\"),o.push(e))});let y=document.activeElement;document.body.appendChild(a),document.body.appendChild(i),i.focus()}()}showColorsUsedOnWebPage()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Color","Links"],"folderName":"Design","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Design.json","download":{"name":"Page Color Analysis","language":"javascript","executionMode":"activate","content":"(function(){function showColorsUsedOnWebPage(){let e=`<style>.visually-hidden {clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;}#color-dialog {font-family:sans-serif;font-size:16px;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);background: white;border: 2px solid black;padding: 20px;z-index: 1000;max-width: 80%;max-height: 80%;overflow: auto;}#color-dialog h2 {font-size:24px;margin-bottom:10px;}#color-dialog h3 {font-size:20px;}#color-dialog h2, #color-dialog h3 {font-weight:bold;}#color-dialog h2, #color-dialog h3, #color-dialog p {color:black!important;border:none;padding:0;}#color-dialog li {list-style:none;}.color-swatches {display: flex;flex-wrap: wrap;list-style-type: none;padding: 0;margin: 0;}.color-swatch {width: 150px;height: 150px;margin: 5px;border: 1px solid black;position: relative;text-align: center;}.color-swatch-label {position: absolute;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.7);color: white;font-size: 12px;padding: 2px;}.color-swatch-label,.color-swatch-label>div,.color-swatch-label>span {font-size:14px;}.copy-btn {display: block;width: 100%;margin-top: 3px;padding: 2px 4px;background: rgba(255,255,255,0.15);color: white;border: 1px solid rgba(255,255,255,0.6);font-size: 12px;cursor: pointer;border-radius: 2px;line-height: 1.4;}.copy-btn:hover {background: rgba(255,255,255,0.3);}.copy-btn:focus {outline: 4px solid white;outline-offset: 1px;}.color-section {margin-bottom: 20px;}#close-dialog {position:absolute;top:10px;right:10px;outline:2px solid black;padding:5px;color:black!important;background:white!important;}#close-dialog:focus {outline:4px solid black;}#copy-all-btn {display: block;margin-top: 16px;padding: 8px 16px;background: white;color: black;border: 2px solid black;font-size: 16px;cursor: pointer;border-radius: 2px;}#copy-all-btn:hover {background: #f0f0f0;}#copy-all-btn:focus {outline: 4px solid black;outline-offset: 2px;}#copy-status {margin-top: 8px;font-size: 14px;color: black;min-height: 1.4em;}</style>`;!function t(){let o=[],l=0,r=[],a=document.createElement(\"div\");a.style.cssText=`position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);z-index: 999;`;let i=document.createElement(\"div\");i.id=\"color-dialog\",i.setAttribute(\"role\",\"dialog\"),i.setAttribute(\"aria-modal\",\"true\"),i.setAttribute(\"aria-labelledby\",\"color-dialog-title\"),i.innerHTML=e+`<button id=\"close-dialog\">Close</button><h2 id=\"color-dialog-title\">Page Color Analysis</h2><div class=\"color-section\"><h3>Background Colors</h3><ul id=\"background-colors\" class=\"color-swatches\"></ul></div><div class=\"color-section\"><h3>Foreground Colors</h3><ul id=\"foreground-colors\" class=\"color-swatches\"></ul></div><ul><li>Where colors match HTML color names, these are included under the hex value.</li><li>Color are 100% opacity unless stated otherwise.</li></ul><button id=\"copy-all-btn\">Copy all hex values</button><div id=\"copy-status\" aria-live=\"polite\" aria-atomic=\"true\"></div>`;let n={\"#F0F8FF\":\"AliceBlue\",\"#FAEBD7\":\"AntiqueWhite\",\"#00FFFF\":\"Aqua\",\"#7FFFD4\":\"Aquamarine\",\"#F0FFFF\":\"Azure\",\"#F5F5DC\":\"Beige\",\"#FFE4C4\":\"Bisque\",\"#000000\":\"Black\",\"#FFEBCD\":\"BlanchedAlmond\",\"#0000FF\":\"Blue\",\"#8A2BE2\":\"BlueViolet\",\"#A52A2A\":\"Brown\",\"#DEB887\":\"BurlyWood\",\"#5F9EA0\":\"CadetBlue\",\"#7FFF00\":\"Chartreuse\",\"#D2691E\":\"Chocolate\",\"#FF7F50\":\"Coral\",\"#6495ED\":\"CornflowerBlue\",\"#FFF8DC\":\"Cornsilk\",\"#DC143C\":\"Crimson\",\"#00FFFF\":\"Cyan\",\"#00008B\":\"DarkBlue\",\"#008B8B\":\"DarkCyan\",\"#B8860B\":\"DarkGoldenRod\",\"#A9A9A9\":\"DarkGray\",\"#006400\":\"DarkGreen\",\"#BDB76B\":\"DarkKhaki\",\"#8B008B\":\"DarkMagenta\",\"#556B2F\":\"DarkOliveGreen\",\"#FF8C00\":\"DarkOrange\",\"#9932CC\":\"DarkOrchid\",\"#8B0000\":\"DarkRed\",\"#E9967A\":\"DarkSalmon\",\"#8FBC8F\":\"DarkSeaGreen\",\"#483D8B\":\"DarkSlateBlue\",\"#2F4F4F\":\"DarkSlateGray\",\"#00CED1\":\"DarkTurquoise\",\"#9400D3\":\"DarkViolet\",\"#FF1493\":\"DeepPink\",\"#00BFFF\":\"DeepSkyBlue\",\"#696969\":\"DimGray\",\"#1E90FF\":\"DodgerBlue\",\"#B22222\":\"FireBrick\",\"#FFFAF0\":\"FloralWhite\",\"#228B22\":\"ForestGreen\",\"#FF00FF\":\"Fuchsia\",\"#DCDCDC\":\"Gainsboro\",\"#F8F8FF\":\"GhostWhite\",\"#FFD700\":\"Gold\",\"#DAA520\":\"GoldenRod\",\"#808080\":\"Gray\",\"#008000\":\"Green\",\"#ADFF2F\":\"GreenYellow\",\"#F0FFF0\":\"HoneyDew\",\"#FF69B4\":\"HotPink\",\"#CD5C5C\":\"IndianRed\",\"#4B0082\":\"Indigo\",\"#FFFFF0\":\"Ivory\",\"#F0E68C\":\"Khaki\",\"#E6E6FA\":\"Lavender\",\"#FFF0F5\":\"LavenderBlush\",\"#7CFC00\":\"LawnGreen\",\"#FFFACD\":\"LemonChiffon\",\"#ADD8E6\":\"LightBlue\",\"#F08080\":\"LightCoral\",\"#E0FFFF\":\"LightCyan\",\"#FAFAD2\":\"LightGoldenRodYellow\",\"#D3D3D3\":\"LightGray\",\"#90EE90\":\"LightGreen\",\"#FFB6C1\":\"LightPink\",\"#FFA07A\":\"LightSalmon\",\"#20B2AA\":\"LightSeaGreen\",\"#87CEFA\":\"LightSkyBlue\",\"#778899\":\"LightSlateGray\",\"#B0C4DE\":\"LightSteelBlue\",\"#FFFFE0\":\"LightYellow\",\"#00FF00\":\"Lime\",\"#32CD32\":\"LimeGreen\",\"#FAF0E6\":\"Linen\",\"#FF00FF\":\"Magenta\",\"#800000\":\"Maroon\",\"#66CDAA\":\"MediumAquaMarine\",\"#0000CD\":\"MediumBlue\",\"#BA55D3\":\"MediumOrchid\",\"#9370DB\":\"MediumPurple\",\"#3CB371\":\"MediumSeaGreen\",\"#7B68EE\":\"MediumSlateBlue\",\"#00FA9A\":\"MediumSpringGreen\",\"#48D1CC\":\"MediumTurquoise\",\"#C71585\":\"MediumVioletRed\",\"#191970\":\"MidnightBlue\",\"#F5FFFA\":\"MintCream\",\"#FFE4E1\":\"MistyRose\",\"#FFE4B5\":\"Moccasin\",\"#FFDEAD\":\"NavajoWhite\",\"#000080\":\"Navy\",\"#FDF5E6\":\"OldLace\",\"#808000\":\"Olive\",\"#6B8E23\":\"OliveDrab\",\"#FFA500\":\"Orange\",\"#FF4500\":\"OrangeRed\",\"#DA70D6\":\"Orchid\",\"#EEE8AA\":\"PaleGoldenRod\",\"#98FB98\":\"PaleGreen\",\"#AFEEEE\":\"PaleTurquoise\",\"#DB7093\":\"PaleVioletRed\",\"#FFEFD5\":\"PapayaWhip\",\"#FFDAB9\":\"PeachPuff\",\"#CD853F\":\"Peru\",\"#FFC0CB\":\"Pink\",\"#DDA0DD\":\"Plum\",\"#B0E0E6\":\"PowderBlue\",\"#800080\":\"Purple\",\"#663399\":\"RebeccaPurple\",\"#FF0000\":\"Red\",\"#BC8F8F\":\"RosyBrown\",\"#4169E1\":\"RoyalBlue\",\"#8B4513\":\"SaddleBrown\",\"#FA8072\":\"Salmon\",\"#F4A460\":\"SandyBrown\",\"#2E8B57\":\"SeaGreen\",\"#FFF5EE\":\"SeaShell\",\"#A0522D\":\"Sienna\",\"#C0C0C0\":\"Silver\",\"#87CEEB\":\"SkyBlue\",\"#6A5ACD\":\"SlateBlue\",\"#708090\":\"SlateGray\",\"#FFFAFA\":\"Snow\",\"#00FF7F\":\"SpringGreen\",\"#4682B4\":\"SteelBlue\",\"#D2B48C\":\"Tan\",\"#008080\":\"Teal\",\"#D8BFD8\":\"Thistle\",\"#FF6347\":\"Tomato\",\"#40E0D0\":\"Turquoise\",\"#EE82EE\":\"Violet\",\"#F5DEB3\":\"Wheat\",\"#FFFFFF\":\"White\",\"#F5F5F5\":\"WhiteSmoke\",\"#FFFF00\":\"Yellow\",\"#9ACD32\":\"YellowGreen\"};function d(e,t,o,l){navigator.clipboard.writeText(e).then(()=>{t&&(t.textContent=`Copied ${e}`,setTimeout(()=>{t.textContent=\"\"},1500)),o&&(o.textContent=\"Copied!\",setTimeout(()=>{o.textContent=l},1500))}).catch(()=>{let r=document.createElement(\"textarea\");r.value=e,r.style.position=\"fixed\",r.style.opacity=\"0\",document.body.appendChild(r),r.focus(),r.select();try{document.execCommand(\"copy\")}catch(a){}document.body.removeChild(r),t&&(t.textContent=`Copied ${e}`,setTimeout(()=>{t.textContent=\"\"},1500)),o&&(o.textContent=\"Copied!\",setTimeout(()=>{o.textContent=l},1500))})}function $(e){let t=function e(t){if(!t.startsWith(\"rgb\")){let o=document.createElement(\"canvas\").getContext(\"2d\");return o.fillStyle=t,o.fillStyle.toUpperCase()}let l=t.match(/^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/);if(!l)return t;let r=parseInt(l[1]),a=parseInt(l[2]),i=parseInt(l[3]);return`#${r.toString(16).padStart(2,\"0\")}${a.toString(16).padStart(2,\"0\")}${i.toString(16).padStart(2,\"0\")}`.toUpperCase()}(e),{r:o,g:a,b:$}=function e(t){let o=document.createElement(\"canvas\").getContext(\"2d\");o.fillStyle=t;let l=o.fillStyle,r,a,i;if(l.startsWith(\"#\"))r=parseInt(l.slice(1,3),16),a=parseInt(l.slice(3,5),16),i=parseInt(l.slice(5,7),16);else{let n=l.match(/^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/);n&&([,r,a,i]=n.map(Number))}return{r,g:a,b:i}}(e),s=function e(t,o,l){let r=(299*t+587*o+114*l)/1e3,a=\"\";if(a=r<64?\"dark\":r<128?\"medium\":r<192?\"light\":\"bright\",40>Math.abs(t-o)&&40>Math.abs(o-l)&&40>Math.abs(t-l))return r<32?\"black\":r>224?\"pure white\":`${a} gray`;let i=[];return(t>o&&t>l&&t>40&&i.push(\"red\"),o>t&&o>l&&o>40&&i.push(\"green\"),l>t&&l>o&&l>40&&i.push(\"blue\"),40>Math.abs(t-o)&&t>l&&o>l&&i.push(\"yellow\"),40>Math.abs(t-l)&&t>o&&l>o&&i.push(\"magenta\"),40>Math.abs(o-l)&&o>t&&l>t&&i.push(\"cyan\"),0===i.length)?`${a} gray`:1===i.length?`${a} ${i[0]}`:`${a} ${i.join(\"-\")}`}(o,a,$),c=n[t];r.includes(t)||r.push(t);let u=`color-swatch-label-${l++}`,F=document.createElement(\"li\");F.className=\"color-swatch\",F.style.backgroundColor=e;let p=document.createElement(\"div\");p.className=\"color-swatch-label\";let h=(e=>{if(e.startsWith(\"rgb(\"))return\"100%\";let t=e.match(/,\\s*([\\d.]+)\\)/)[1];return 100*parseFloat(t)+\"%\"})(e);p.innerHTML=`<div id=\"${u}\">${t}</div>${c?`<div>${c}</div>`:`<span class=\"visually-hidden\"> ${s}</span>`}${\"100%\"!==h?`<div>${h}</div>`:\"\"}`;let g=document.createElement(\"button\");return g.className=\"copy-btn\",g.textContent=\"Copy\",g.setAttribute(\"aria-labelledby\",u),g.addEventListener(\"click\",()=>{let e=i.querySelector(\"#copy-status\");d(t,e,g,\"Copy\")}),p.appendChild(g),F.appendChild(p),F}let s={backgrounds:new Set,foregrounds:new Set};document.querySelectorAll(\"*\").forEach(e=>{let t=window.getComputedStyle(e),o=t.backgroundColor;\"rgba(0, 0, 0, 0)\"!==o&&\"transparent\"!==o&&s.backgrounds.add(o);let l=t.color;\"rgba(0, 0, 0, 0)\"!==l&&\"transparent\"!==l&&s.foregrounds.add(l),[t.borderTopColor,t.borderRightColor,t.borderBottomColor,t.borderLeftColor].forEach(e=>{\"rgba(0, 0, 0, 0)\"!==e&&\"transparent\"!==e&&s.foregrounds.add(e)});let r=t.outlineColor;\"rgba(0, 0, 0, 0)\"!==r&&\"transparent\"!==r&&s.foregrounds.add(r)});let c=i.querySelector(\"#background-colors\");Array.from(s.backgrounds).forEach(e=>{c.appendChild($(e))});let u=i.querySelector(\"#foreground-colors\");Array.from(s.foregrounds).forEach(e=>{u.appendChild($(e))});let F=i.querySelector(\"#copy-all-btn\");F.addEventListener(\"click\",()=>{let e=i.querySelector(\"#copy-status\"),t=r.join(\"\\n\");d(t,null,F,\"Copy all hex values\"),e.textContent=`Copied ${r.length} hex values`,setTimeout(()=>{e.textContent=\"\"},1500)});let p=i.querySelector(\"#close-dialog\");function h(){document.body.removeChild(a),document.body.removeChild(i),o.forEach(e=>{e.removeAttribute(\"aria-hidden\"),e.removeAttribute(\"inert\")}),y.focus()}p.addEventListener(\"click\",h);let g=i.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'),b=g[0],C=g[g.length-1];i.addEventListener(\"keydown\",e=>{\"Escape\"===e.key&&h(),\"Tab\"!==e.key||(e.shiftKey&&document.activeElement===b?(C.focus(),e.preventDefault()):e.shiftKey||document.activeElement!==C||(b.focus(),e.preventDefault()))}),a.setAttribute(\"aria-hidden\",\"true\"),Array.from(document.body.children).forEach(e=>{e!==a&&e!==i&&(e.setAttribute(\"aria-hidden\",\"true\"),e.setAttribute(\"inert\",\"\"),o.push(e))});let y=document.activeElement;document.body.appendChild(a),document.body.appendChild(i),i.focus()}()}showColorsUsedOnWebPage()})()","description":"Finds all background and foreground colors used on a page and displays them as swatches.","author":"Ian Lloyd","categories":["Accessibility","Color","Links"]}}

{"id":"REVENGE.CSS.json-0-0","name":"REVENGE.CSS","description":"A CSS snippet that uses selectors to find bad markup, displaying ugly pink error messages in comic sans serif wherever you write bad HTML.","language":"css","executionMode":"load","content":"/*!\n* Revenge CSS v 1.0 \n* Copyright 2013, Heydon Pickering: http://www.heydonworks.com\n* Released under Attribution 3.0 Unported license - http://creativecommons.org/licenses/by/3.0/\n* Please leave this comment block intact as attribution\n*/\n\na:not([href]), a[href=\"\"], a[href$=\"#\"], a[href^=\"javascript\"], \n.button:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"]),\n.btn:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"]), \na[class*=\"button\"]:not([role=\"button\"]), \na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"]), \na[role=\"button\"][href=\"\"], a[role=\"button\"][href$=\"#\"], a[role=\"button\"][href^=\"javascript\"], \n.button:not(button):not([role=\"button\"]):not(input),\n.btn:not(button):not([role=\"button\"]):not(input), \na[class*=\"button\"]:not([role=\"button\"]), \na.button[class*=\"disabled\"],  \na.btn.disabled, a[class*=\"button\"][class*=\"disabled\"], \nform button:not([type]), \na:empty:not([aria-label]):not([aria-labelledby]), \nbutton:empty:not([aria-label]):not([aria-labelledby]), \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt]), \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt]), \n.button:not(a):not(button):not(input), \n.btn:not(a):not(button):not(input),  \nfigcaption, \nform:not([action]),  \nfieldset > *:first-child:not(legend), \nbutton.disabled:not([disabled]):not([readonly]), \nacronym, applet, basefont, center, dir, \nfont, frame, frameset, isindex, listing, menu, multicol, \nplaintext, s, strike, u, xmp, bgsound, blink, comment, \nembed, marquee, nobr, noembed, wbr, \n*:empty:not(script), \nsection > section:first-child, \narticle > section:first-child, \narticle > article:first-child, \nsection > article:first-child, \nsection > aside:first-child, \naside > aside:first-child, \narticle > aside:first-child, \naside > article:first-child, \naside > section:first-child, \nbody > header:not([role=\"banner\"]), body > div > header:not([role=\"banner\"]),  \nbody > footer:not([role=\"contentinfo\"]), body > div > footer:not([role=\"contentinfo\"]), \nsection [role=\"banner\"], section [role=\"contentinfo\"], \narticle [role=\"banner\"], article [role=\"contentinfo\"], \naside [role=\"banner\"], aside [role=\"contentinfo\"], \n#main:not(main):not([role=\"main\"]),\n#footer:not(footer):not([role=\"contentinfo\"]),\n#header:not(header):not([role=\"banner\"]),\n#banner:not(header):not([role=\"banner\"]), \n[align], [alink], [background],\n[bgcolor], [border], [clear], \n[height], [hspace], [link], \n[nowrap], [start], [vlink], \n[vspace], \nscript[language], \ntable[summary], \nol > *:not(li), \nul > *:not(li), \nabbr div, b div, i div, span div, em div, \nstrong div, small div, cite div, q div, code div, \nlabel div,\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"]), \nli.divider:not([role=\"separator\"]), li:empty:not([role=\"separator\"]), \nli.dropdown-header,\n.btn:not(button):not([href]), \nli.disabled > a[href]:not([tabindex=\"-1\"]),\nli.disabled > button:not([disabled]), \na.disabled[href]:not([tabindex=\"-1\"]),\nbutton.disabled:not([disabled]), \n[data-toggle=\"dropdown\"]:not([aria-haspopup]) {\n\toverflow: visible !important;\t\n}\n\na:not([href])::after, a[href=\"\"]::after, a[href$=\"#\"]::after, a[href^=\"javascript\"]::after, \n.button:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"])::after,\n.btn:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"])::after, \na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"])::after, \na[role=\"button\"][href=\"\"]::after, a[role=\"button\"][href$=\"#\"]::after, a[role=\"button\"][href^=\"javascript\"]::after, \na[href].button[class*=\"disabled\"]::after,\na[href].disabled::after,  \na[href][class*=\"button\"][class*=\"disabled\"]::after,\nform button:not([type])::after, \na:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \n.button:not(a):not(button):not(input)::after, \n.btn:not(a):not(button):not(input)::after,  \nfigcaption::after, \nform:not([action])::after,  \nfieldset > *:first-child:not(legend)::after, \nbutton.disabled:not([disabled]):not([readonly])::after, \nacronym::after, applet::after, basefont::after, center::after, dir::after, \nfont::after, frame::after, frameset::after, isindex::after, listing::after, menu::after, multicol::after, \nplaintext::after, s::after, strike::after, u::after, xmp::after, bgsound::after, blink::after, comment::after, \nembed::after, marquee::after, nobr::after, noembed::after, wbr::after, \n*:empty:not(script)::after, \nsection > section:first-child::after, \narticle > section:first-child::after, \narticle > article:first-child::after, \nsection > article:first-child::after, \nsection > aside:first-child::after, \naside > aside:first-child::after, \narticle > aside:first-child::after, \naside > article:first-child::after, \naside > section:first-child::after, \nbody > header:not([role=\"banner\"])::after, body > div > header:not([role=\"banner\"])::after,  \nbody > footer:not([role=\"contentinfo\"])::after, body > div > footer:not([role=\"contentinfo\"])::after, \nsection [role=\"banner\"]::after, section [role=\"contentinfo\"]::after, \narticle [role=\"banner\"]::after, article [role=\"contentinfo\"]::after, \naside [role=\"banner\"]::after, aside [role=\"contentinfo\"]::after, \n#main:not(main):not([role=\"main\"])::after,\n#footer:not(footer):not([role=\"contentinfo\"])::after,\n#header:not(header):not([role=\"banner\"])::after,\n#banner:not(header):not([role=\"banner\"])::after, \n[align]::after, [alink]::after, [background]::after, \n[bgcolor]::after, [border]::after, [clear]::after, \n[height]::after, [hspace]::after, [link]::after, \n[nowrap]::after, [start]::after, [vlink]::after, \n[vspace]::after, \nscript[language]::after, \ntable[summary]::after, \nol > *:not(li)::after, \nul > *:not(li)::after, \ndl > *:not(dt):not(dd)::after, \ndt + *:not(dd)::after, \nabbr div::after, b div::after, i div::after, span div::after, em div::after, \nstrong div::after, small div::after, cite div::after, q div::after, code div::after, \nlabel div::after,\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"])::after, \nli.divider:not([role=\"separator\"])::after, li:empty:not([role=\"separator\"])::after, \nli.dropdown-header::after,\n.btn:not(button):not([href])::after, \nli.disabled > a[href]:not([tabindex=\"-1\"])::after,\nli.disabled > button:not([disabled])::after, \na.disabled[href]:not([tabindex=\"-1\"])::after,\nbutton.disabled:not([disabled])::after, \n[data-toggle=\"dropdown\"]:not([aria-haspopup])::after\n{\n   display: inline-block !important;\n   background: #dc143c !important;\n   padding: 0.25em !important;\n   font-family: 'comic sans ms', cursive !important;\n   color: #fff !important;\n   font-size: 14px !important;\n   text-shadow: none !important;\n   font-weight: normal !important;\n   font-style: normal !important;\n}\n\n/**\n* Button and hyperlink errors\n----------------------------------------------------------------------\n*/\n\na:not([href])::after {\n   content: 'Do you mean for this to be a link or a <button>? It does not link to anything!' !important;\n}\n\na[href=\"\"]::after, a[href$=\"#\"]::after, a[href^=\"javascript\"]::after {\n   content: 'Do you mean for this to be a <button>? It is a link that does not go anywhere!' !important;\n}\n\n.button:not(a):not(button):not(input):not([tabindex])::after, \n.btn:not(a):not(button):not(input):not([tabindex])::after {\n\tcontent: 'You are not using a standard focusable element for your \"button\". Can keyboard users focus on it?' !important;\n}\n\na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"])::after, \na[role=\"button\"][href=\"\"]::after, a[role=\"button\"][href$=\"#\"]::after, a[role=\"button\"][href^=\"javascript\"]::after {\n   content: 'Either use a proper href fallback or just use a button element.' !important;\n}\n\na[href].button[class*=\"disabled\"]::after,\na[href].disabled::after,  \na[href][class*=\"button\"][class*=\"disabled\"]::after {\n   content: 'You cannot disable a hyperlink. Use a button element with disabled attribute or remove the href' !important; \n}\n\n[class*=\"toggle\"]:not([aria-pressed]) {\n\tcontent: 'If it is toggleable, you should supply an aria-pressed attribute.' !important;\n}\n\nform button:not([type])::after {\n\tcontent: 'Is this a submit button, a reset button or just a button? Use type=\"submit\", type=\"reset\" or type=\"button\".' !important;\n}\n\na:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after {\n\tcontent: 'All buttons and links should have text content, an image with alt text or an ARIA label.' !important;\n}\n\nfigcaption::after {\n\tcontent: '<figcaption>s must belong to parent <figure>s.' !important;\n}\n\nfigure figcaption::after {\n\tcontent: '' !important;\n\tdisplay: none !important;\n}\n\n/**\n* Form errors\n----------------------------------------------------------------------\n*/\n\nform:not([action])::after {\n\tcontent: 'Forms must have action attributes.' !important;\n}\n\nfieldset > *:first-child:not(legend)::after {\n\tcontent: 'Place a legend as the first element in this fieldset.' !important;\n}\n\nbutton.disabled:not([disabled]):not([readonly])::after {\n\tcontent: 'Use a disabled or readonly attribute on this button.' !important;\n}\n\n/**\n* Deprecated, obsolete and proprietary elements\n----------------------------------------------------------------------\n*/\n\nacronym::after, applet::after, basefont::after, big::after, center::after, dir::after, \nfont::after, frame::after, frameset::after, isindex::after, listing::after, menu::after, multicol::after, \nplaintext::after, strike::after, u::after, xmp::after, bgsound::after, blink::after, comment::after, \nembed::after, marquee::after, nobr::after, noembed::after, wbr::after {\n\tcontent: 'This element is deprecated, non-standard or obsolete.' !important;\n}\n\n/**\n* Empty elements\n----------------------------------------------------------------------\n*/\n\n*:empty:not(script):not(input):not(br):not(img):not(link):not(hr):not(embed):not(area):not(command):not(col):not(param):not(source):not(track):not(wbr):not(base):not(keygen)::after {\n\tcontent: 'This element is empty. Why?' !important;\n}\n\n/**\n* Sectioning elements, headers and footers\n----------------------------------------------------------------------\n*/\n\nsection > section:first-child::after, \narticle > section:first-child::after, \narticle > article:first-child::after, \nsection > article:first-child::after, \nsection > aside:first-child::after, \naside > aside:first-child::after, \narticle > aside:first-child::after, \naside > article:first-child::after, \naside > section:first-child::after {\n\tcontent: 'Sectioning elems are not arbitrary wrappers. Use <div>s here.' !important;\n}\n\nbody > header:not([role=\"banner\"])::after, body > div > header:not([role=\"banner\"])::after {\n\tcontent: 'Use role=\"banner\" on this header element.' !important;\n}\n\nbody > footer:not([role=\"contentinfo\"])::after, body > div > footer:not([role=\"contentinfo\"])::after {\n\tcontent: 'Use role=\"contentinfo\" on this footer element.' !important;\n}\n\nsection [role=\"banner\"]::after, section [role=\"contentinfo\"]::after, \narticle [role=\"banner\"]::after, article [role=\"contentinfo\"]::after, \naside [role=\"banner\"]::after, aside [role=\"contentinfo\"]::after {\n\tcontent: 'Do not put [role=\"banner\"] or [role=\"contentinfo\"] inside a subsection.' !important;\n}\n\n#main:not(main):not([role=\"main\"])::after {\n    content: 'Use the standard <main> element or role of main.' !important;\n}\n\n#footer:not(footer):not([role=\"contentinfo\"])::after {\n    content: 'Use the standard <footer> element or contentinfo role' !important;\n}\n\n#header:not(header):not([role=\"banner\"])::after,\n#banner:not(header):not([role=\"banner\"])::after {\n    content: 'Use the standard <header> element or banner role' !important;\n}\n\n/**\n* Bad attribute usage\n----------------------------------------------------------------------\n*/\n\n[align]::after, [alink]::after, [background]::after, [bgcolor]::after, [border]::after, [clear]::after, [height]::after, [hspace]::after, [link]::after, [nowrap]::after, [start]::after, [vlink]::after, [vspace]::after {\n\tcontent: 'You are using a deprecated attribute. Use CSS instead.' !important;\n}\n\nscript[language]::after {\n\tcontent: 'The language attribute is superceded by type. Use type.' !important;\n}\n\ntable[summary]::after {\n\tcontent: 'The summary attribute is deprecated. Perhaps use the <caption> element.' !important;\n}\n\n/**\n* List errors\n----------------------------------------------------------------------\n*/\n\nol > *:not(li)::after, \nul > *:not(li)::after {\n\tcontent: 'Only <li> can be a direct child of <ul> or <ol>.' !important;\n}\n\ndl > *:not(dt):not(dd)::after {\n\tcontent: 'This element does not belong directly inside a definition list.' !important;\n}\n\ndt + *:not(dd)::after {\n\tcontent: 'Definitions must follow definition titles.' !important;\n}\n\n/**\n* <div>s in the wrong places\n----------------------------------------------------------------------\n*/\n\nabbr div::after, b div::after, i div::after, span div::after, em div::after, \nstrong div::after, small div::after, cite div::after, q div::after, code div::after, \nlabel div::after {\n\tcontent: 'Do not put <div>s inside inline elements.' !important;\n}\n\n/**\n* Crazy tabindexing\n----------------------------------------------------------------------\n*/\n\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"])::after {\n\tcontent: 'Do not disrupt the natural tab order.' !important;\n}\n\n/* Boot Crap (specific to Twitter BootStrap class misuse)\n-----------------------------------------------------------------------------*/\n\n/* Don't use list elements to divide up list elements. \nUse a class-based style on the preceeding or proceeding element or use role=\"separator\" \non the item in question */\n\nli.divider:not([role=\"separator\"])::after, li:empty:not([role=\"separator\"])::after {\n\tcontent: 'Do not use list items to divide up lists unless they have role = separator' !important;\n}\n\n/* For obvious reasons, a header for a list should not be an item in that list. \nMake two lists! */\n\nli.dropdown-header::after {\n\tcontent: 'Do not use list items as headers for lists, obvs' !important;\n}\n\n/* Only <button>s and, to a lesser extent, <a>s WITH HREFS are keyboard functional as \"buttons\" */\n\n.btn:not(button):not([href])::after {\n\tcontent: 'This is not an accessible control. Use a <button> or a <a> with href.' !important;\n}\n\n/* Disabled links and buttons should be disabled correctly */\n\nli.disabled > a[href]:not([tabindex=\"-1\"])::after,\nli.disabled > button:not([disabled])::after, \na.disabled[href]::after,\nbutton.disabled:not([disabled])::after {\n\tcontent: 'Disable buttons with disabled attr and links by removing href' !important;\n}\n\n/* The submenu should be indicated with aria-haspopup */\n\n[data-toggle=\"dropdown\"]:not([aria-haspopup])::after {\n\tcontent: 'Indicate the hidden menu with aria-haspopup' !important;\n}","author":"Heydon Pickering","authorUrl":"http://www.heydonworks.com","categories":["HTML","Accessibility"],"folderName":null,"folderDescription":null,"sourceFile":"REVENGE.CSS.json","download":{"name":"REVENGE.CSS","language":"css","executionMode":"load","content":"/*!\n* Revenge CSS v 1.0 \n* Copyright 2013, Heydon Pickering: http://www.heydonworks.com\n* Released under Attribution 3.0 Unported license - http://creativecommons.org/licenses/by/3.0/\n* Please leave this comment block intact as attribution\n*/\n\na:not([href]), a[href=\"\"], a[href$=\"#\"], a[href^=\"javascript\"], \n.button:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"]),\n.btn:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"]), \na[class*=\"button\"]:not([role=\"button\"]), \na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"]), \na[role=\"button\"][href=\"\"], a[role=\"button\"][href$=\"#\"], a[role=\"button\"][href^=\"javascript\"], \n.button:not(button):not([role=\"button\"]):not(input),\n.btn:not(button):not([role=\"button\"]):not(input), \na[class*=\"button\"]:not([role=\"button\"]), \na.button[class*=\"disabled\"],  \na.btn.disabled, a[class*=\"button\"][class*=\"disabled\"], \nform button:not([type]), \na:empty:not([aria-label]):not([aria-labelledby]), \nbutton:empty:not([aria-label]):not([aria-labelledby]), \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt]), \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt]), \n.button:not(a):not(button):not(input), \n.btn:not(a):not(button):not(input),  \nfigcaption, \nform:not([action]),  \nfieldset > *:first-child:not(legend), \nbutton.disabled:not([disabled]):not([readonly]), \nacronym, applet, basefont, center, dir, \nfont, frame, frameset, isindex, listing, menu, multicol, \nplaintext, s, strike, u, xmp, bgsound, blink, comment, \nembed, marquee, nobr, noembed, wbr, \n*:empty:not(script), \nsection > section:first-child, \narticle > section:first-child, \narticle > article:first-child, \nsection > article:first-child, \nsection > aside:first-child, \naside > aside:first-child, \narticle > aside:first-child, \naside > article:first-child, \naside > section:first-child, \nbody > header:not([role=\"banner\"]), body > div > header:not([role=\"banner\"]),  \nbody > footer:not([role=\"contentinfo\"]), body > div > footer:not([role=\"contentinfo\"]), \nsection [role=\"banner\"], section [role=\"contentinfo\"], \narticle [role=\"banner\"], article [role=\"contentinfo\"], \naside [role=\"banner\"], aside [role=\"contentinfo\"], \n#main:not(main):not([role=\"main\"]),\n#footer:not(footer):not([role=\"contentinfo\"]),\n#header:not(header):not([role=\"banner\"]),\n#banner:not(header):not([role=\"banner\"]), \n[align], [alink], [background],\n[bgcolor], [border], [clear], \n[height], [hspace], [link], \n[nowrap], [start], [vlink], \n[vspace], \nscript[language], \ntable[summary], \nol > *:not(li), \nul > *:not(li), \nabbr div, b div, i div, span div, em div, \nstrong div, small div, cite div, q div, code div, \nlabel div,\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"]), \nli.divider:not([role=\"separator\"]), li:empty:not([role=\"separator\"]), \nli.dropdown-header,\n.btn:not(button):not([href]), \nli.disabled > a[href]:not([tabindex=\"-1\"]),\nli.disabled > button:not([disabled]), \na.disabled[href]:not([tabindex=\"-1\"]),\nbutton.disabled:not([disabled]), \n[data-toggle=\"dropdown\"]:not([aria-haspopup]) {\n\toverflow: visible !important;\t\n}\n\na:not([href])::after, a[href=\"\"]::after, a[href$=\"#\"]::after, a[href^=\"javascript\"]::after, \n.button:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"])::after,\n.btn:not(button):not([role=\"button\"]):not([type=\"button\"]):not([type=\"submit\"]):not([type=\"reset\"])::after, \na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"])::after, \na[role=\"button\"][href=\"\"]::after, a[role=\"button\"][href$=\"#\"]::after, a[role=\"button\"][href^=\"javascript\"]::after, \na[href].button[class*=\"disabled\"]::after,\na[href].disabled::after,  \na[href][class*=\"button\"][class*=\"disabled\"]::after,\nform button:not([type])::after, \na:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \n.button:not(a):not(button):not(input)::after, \n.btn:not(a):not(button):not(input)::after,  \nfigcaption::after, \nform:not([action])::after,  \nfieldset > *:first-child:not(legend)::after, \nbutton.disabled:not([disabled]):not([readonly])::after, \nacronym::after, applet::after, basefont::after, center::after, dir::after, \nfont::after, frame::after, frameset::after, isindex::after, listing::after, menu::after, multicol::after, \nplaintext::after, s::after, strike::after, u::after, xmp::after, bgsound::after, blink::after, comment::after, \nembed::after, marquee::after, nobr::after, noembed::after, wbr::after, \n*:empty:not(script)::after, \nsection > section:first-child::after, \narticle > section:first-child::after, \narticle > article:first-child::after, \nsection > article:first-child::after, \nsection > aside:first-child::after, \naside > aside:first-child::after, \narticle > aside:first-child::after, \naside > article:first-child::after, \naside > section:first-child::after, \nbody > header:not([role=\"banner\"])::after, body > div > header:not([role=\"banner\"])::after,  \nbody > footer:not([role=\"contentinfo\"])::after, body > div > footer:not([role=\"contentinfo\"])::after, \nsection [role=\"banner\"]::after, section [role=\"contentinfo\"]::after, \narticle [role=\"banner\"]::after, article [role=\"contentinfo\"]::after, \naside [role=\"banner\"]::after, aside [role=\"contentinfo\"]::after, \n#main:not(main):not([role=\"main\"])::after,\n#footer:not(footer):not([role=\"contentinfo\"])::after,\n#header:not(header):not([role=\"banner\"])::after,\n#banner:not(header):not([role=\"banner\"])::after, \n[align]::after, [alink]::after, [background]::after, \n[bgcolor]::after, [border]::after, [clear]::after, \n[height]::after, [hspace]::after, [link]::after, \n[nowrap]::after, [start]::after, [vlink]::after, \n[vspace]::after, \nscript[language]::after, \ntable[summary]::after, \nol > *:not(li)::after, \nul > *:not(li)::after, \ndl > *:not(dt):not(dd)::after, \ndt + *:not(dd)::after, \nabbr div::after, b div::after, i div::after, span div::after, em div::after, \nstrong div::after, small div::after, cite div::after, q div::after, code div::after, \nlabel div::after,\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"])::after, \nli.divider:not([role=\"separator\"])::after, li:empty:not([role=\"separator\"])::after, \nli.dropdown-header::after,\n.btn:not(button):not([href])::after, \nli.disabled > a[href]:not([tabindex=\"-1\"])::after,\nli.disabled > button:not([disabled])::after, \na.disabled[href]:not([tabindex=\"-1\"])::after,\nbutton.disabled:not([disabled])::after, \n[data-toggle=\"dropdown\"]:not([aria-haspopup])::after\n{\n   display: inline-block !important;\n   background: #dc143c !important;\n   padding: 0.25em !important;\n   font-family: 'comic sans ms', cursive !important;\n   color: #fff !important;\n   font-size: 14px !important;\n   text-shadow: none !important;\n   font-weight: normal !important;\n   font-style: normal !important;\n}\n\n/**\n* Button and hyperlink errors\n----------------------------------------------------------------------\n*/\n\na:not([href])::after {\n   content: 'Do you mean for this to be a link or a <button>? It does not link to anything!' !important;\n}\n\na[href=\"\"]::after, a[href$=\"#\"]::after, a[href^=\"javascript\"]::after {\n   content: 'Do you mean for this to be a <button>? It is a link that does not go anywhere!' !important;\n}\n\n.button:not(a):not(button):not(input):not([tabindex])::after, \n.btn:not(a):not(button):not(input):not([tabindex])::after {\n\tcontent: 'You are not using a standard focusable element for your \"button\". Can keyboard users focus on it?' !important;\n}\n\na[role=\"button\"]:not([href*=\"/\"]):not([href*=\".\"]):not([href*=\"?\"])::after, \na[role=\"button\"][href=\"\"]::after, a[role=\"button\"][href$=\"#\"]::after, a[role=\"button\"][href^=\"javascript\"]::after {\n   content: 'Either use a proper href fallback or just use a button element.' !important;\n}\n\na[href].button[class*=\"disabled\"]::after,\na[href].disabled::after,  \na[href][class*=\"button\"][class*=\"disabled\"]::after {\n   content: 'You cannot disable a hyperlink. Use a button element with disabled attribute or remove the href' !important; \n}\n\n[class*=\"toggle\"]:not([aria-pressed]) {\n\tcontent: 'If it is toggleable, you should supply an aria-pressed attribute.' !important;\n}\n\nform button:not([type])::after {\n\tcontent: 'Is this a submit button, a reset button or just a button? Use type=\"submit\", type=\"reset\" or type=\"button\".' !important;\n}\n\na:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:empty:not([aria-label]):not([aria-labelledby])::after, \nbutton:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after, \na:not([aria-label]):not([aria-labelledby]) img:only-child:not([alt])::after {\n\tcontent: 'All buttons and links should have text content, an image with alt text or an ARIA label.' !important;\n}\n\nfigcaption::after {\n\tcontent: '<figcaption>s must belong to parent <figure>s.' !important;\n}\n\nfigure figcaption::after {\n\tcontent: '' !important;\n\tdisplay: none !important;\n}\n\n/**\n* Form errors\n----------------------------------------------------------------------\n*/\n\nform:not([action])::after {\n\tcontent: 'Forms must have action attributes.' !important;\n}\n\nfieldset > *:first-child:not(legend)::after {\n\tcontent: 'Place a legend as the first element in this fieldset.' !important;\n}\n\nbutton.disabled:not([disabled]):not([readonly])::after {\n\tcontent: 'Use a disabled or readonly attribute on this button.' !important;\n}\n\n/**\n* Deprecated, obsolete and proprietary elements\n----------------------------------------------------------------------\n*/\n\nacronym::after, applet::after, basefont::after, big::after, center::after, dir::after, \nfont::after, frame::after, frameset::after, isindex::after, listing::after, menu::after, multicol::after, \nplaintext::after, strike::after, u::after, xmp::after, bgsound::after, blink::after, comment::after, \nembed::after, marquee::after, nobr::after, noembed::after, wbr::after {\n\tcontent: 'This element is deprecated, non-standard or obsolete.' !important;\n}\n\n/**\n* Empty elements\n----------------------------------------------------------------------\n*/\n\n*:empty:not(script):not(input):not(br):not(img):not(link):not(hr):not(embed):not(area):not(command):not(col):not(param):not(source):not(track):not(wbr):not(base):not(keygen)::after {\n\tcontent: 'This element is empty. Why?' !important;\n}\n\n/**\n* Sectioning elements, headers and footers\n----------------------------------------------------------------------\n*/\n\nsection > section:first-child::after, \narticle > section:first-child::after, \narticle > article:first-child::after, \nsection > article:first-child::after, \nsection > aside:first-child::after, \naside > aside:first-child::after, \narticle > aside:first-child::after, \naside > article:first-child::after, \naside > section:first-child::after {\n\tcontent: 'Sectioning elems are not arbitrary wrappers. Use <div>s here.' !important;\n}\n\nbody > header:not([role=\"banner\"])::after, body > div > header:not([role=\"banner\"])::after {\n\tcontent: 'Use role=\"banner\" on this header element.' !important;\n}\n\nbody > footer:not([role=\"contentinfo\"])::after, body > div > footer:not([role=\"contentinfo\"])::after {\n\tcontent: 'Use role=\"contentinfo\" on this footer element.' !important;\n}\n\nsection [role=\"banner\"]::after, section [role=\"contentinfo\"]::after, \narticle [role=\"banner\"]::after, article [role=\"contentinfo\"]::after, \naside [role=\"banner\"]::after, aside [role=\"contentinfo\"]::after {\n\tcontent: 'Do not put [role=\"banner\"] or [role=\"contentinfo\"] inside a subsection.' !important;\n}\n\n#main:not(main):not([role=\"main\"])::after {\n    content: 'Use the standard <main> element or role of main.' !important;\n}\n\n#footer:not(footer):not([role=\"contentinfo\"])::after {\n    content: 'Use the standard <footer> element or contentinfo role' !important;\n}\n\n#header:not(header):not([role=\"banner\"])::after,\n#banner:not(header):not([role=\"banner\"])::after {\n    content: 'Use the standard <header> element or banner role' !important;\n}\n\n/**\n* Bad attribute usage\n----------------------------------------------------------------------\n*/\n\n[align]::after, [alink]::after, [background]::after, [bgcolor]::after, [border]::after, [clear]::after, [height]::after, [hspace]::after, [link]::after, [nowrap]::after, [start]::after, [vlink]::after, [vspace]::after {\n\tcontent: 'You are using a deprecated attribute. Use CSS instead.' !important;\n}\n\nscript[language]::after {\n\tcontent: 'The language attribute is superceded by type. Use type.' !important;\n}\n\ntable[summary]::after {\n\tcontent: 'The summary attribute is deprecated. Perhaps use the <caption> element.' !important;\n}\n\n/**\n* List errors\n----------------------------------------------------------------------\n*/\n\nol > *:not(li)::after, \nul > *:not(li)::after {\n\tcontent: 'Only <li> can be a direct child of <ul> or <ol>.' !important;\n}\n\ndl > *:not(dt):not(dd)::after {\n\tcontent: 'This element does not belong directly inside a definition list.' !important;\n}\n\ndt + *:not(dd)::after {\n\tcontent: 'Definitions must follow definition titles.' !important;\n}\n\n/**\n* <div>s in the wrong places\n----------------------------------------------------------------------\n*/\n\nabbr div::after, b div::after, i div::after, span div::after, em div::after, \nstrong div::after, small div::after, cite div::after, q div::after, code div::after, \nlabel div::after {\n\tcontent: 'Do not put <div>s inside inline elements.' !important;\n}\n\n/**\n* Crazy tabindexing\n----------------------------------------------------------------------\n*/\n\n[tabindex]:not([tabindex=\"0\"]):not([tabindex=\"-1\"])::after {\n\tcontent: 'Do not disrupt the natural tab order.' !important;\n}\n\n/* Boot Crap (specific to Twitter BootStrap class misuse)\n-----------------------------------------------------------------------------*/\n\n/* Don't use list elements to divide up list elements. \nUse a class-based style on the preceeding or proceeding element or use role=\"separator\" \non the item in question */\n\nli.divider:not([role=\"separator\"])::after, li:empty:not([role=\"separator\"])::after {\n\tcontent: 'Do not use list items to divide up lists unless they have role = separator' !important;\n}\n\n/* For obvious reasons, a header for a list should not be an item in that list. \nMake two lists! */\n\nli.dropdown-header::after {\n\tcontent: 'Do not use list items as headers for lists, obvs' !important;\n}\n\n/* Only <button>s and, to a lesser extent, <a>s WITH HREFS are keyboard functional as \"buttons\" */\n\n.btn:not(button):not([href])::after {\n\tcontent: 'This is not an accessible control. Use a <button> or a <a> with href.' !important;\n}\n\n/* Disabled links and buttons should be disabled correctly */\n\nli.disabled > a[href]:not([tabindex=\"-1\"])::after,\nli.disabled > button:not([disabled])::after, \na.disabled[href]::after,\nbutton.disabled:not([disabled])::after {\n\tcontent: 'Disable buttons with disabled attr and links by removing href' !important;\n}\n\n/* The submenu should be indicated with aria-haspopup */\n\n[data-toggle=\"dropdown\"]:not([aria-haspopup])::after {\n\tcontent: 'Indicate the hidden menu with aria-haspopup' !important;\n}","description":"A CSS snippet that uses selectors to find bad markup, displaying ugly pink error messages in comic sans serif wherever you write bad HTML.","author":"Heydon Pickering","categories":["HTML","Accessibility"]}}

{"id":"A11y-tools.com: DOM manipulation.json-0-3","name":"Selector Selector","description":"Collect references to multiple page elements (outputs in several formats).","language":"javascript","executionMode":"activate","content":"(function(){!function(){let e=!1,t=[],r=null,n=\"js\",i=[],o=null,l=null,a;function s(e){let t=e.replace(/\\s+/g,\" \").trim();return t.length>50?t.substring(0,30)+\"...\":t}function d(e){return[/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i,/^[a-z0-9]{10,}$/i,/^(temp|generated|dynamic|auto)/i].some(t=>t.test(e))}function c(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){let r=t,n=[];for(;t!==r;){let i=1,o=t.previousSibling;for(;o;)1===o.nodeType&&o.tagName===t.tagName&&i++,o=o.previousSibling;n.unshift(`${t.tagName.toLowerCase()}[${i}]`),t=t.parentNode}return`//*[@id=\"${r.id}\"]${n.length>0?\"/\"+n.join(\"/\"):\"\"}`}t=t.parentElement}t=e;let l=[];for(;t&&1===t.nodeType&&t!==document.body;){let a=1,s=t.previousSibling;for(;s;)1===s.nodeType&&s.tagName===t.tagName&&a++,s=s.previousSibling;let c=t.tagName.toLowerCase();l.unshift(`${c}[${a}]`),t=t.parentNode}return\"/\"+l.join(\"/\")}function u(e){l&&(l.innerHTML=`Tag: &lt;${e.tagName.toLowerCase()}&gt;<br>XPath: ${c(e)}<br>Text: ${s(e.textContent)}`)}function p(e){return(document.querySelectorAll('[data-selector-highlight=\"hover\"]').forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),e)?(e.hasAttribute(\"data-selector-highlight\")&&\"selected\"===e.getAttribute(\"data-selector-highlight\")||(e.style.outline=\"2px solid blue\",e.setAttribute(\"data-selector-highlight\",\"hover\"),u(e)),e):null}function h(e,t){if(!e)return null;switch(t){case\"up\":let r=e.parentElement;for(;r;){if(r.parentElement||r.previousElementSibling||r.nextElementSibling)return r;r=r.parentElement}return null;case\"down\":return e.children[0]||null;case\"left\":return e.previousElementSibling||e.parentElement&&e.parentElement.previousElementSibling||null;case\"right\":return e.nextElementSibling||e.parentElement&&e.parentElement.nextElementSibling||null;default:return null}}function p(e){return(document.querySelectorAll('[data-selector-highlight=\"hover\"]').forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),e)?(e.getAttribute(\"data-selector-highlight\")&&\"hover\"!==e.getAttribute(\"data-selector-highlight\")||(e.style.outline=\"2px solid blue\",e.setAttribute(\"data-selector-highlight\",\"hover\"),u(e)),e):null}function g(e){if(e.target.closest(\"[data-selector-ui]\"))return;e.preventDefault(),e.stopPropagation();let r=e.target;if(!r.hasAttribute(\"data-selector-highlight\")||\"selected\"!==r.getAttribute(\"data-selector-highlight\")){let n=b(r),i=f(r);t.push({element:r,structuredSelector:n,idSelector:i,textContent:r.textContent.trim()}),r.removeAttribute(\"style\"),r.setAttribute(\"data-selector-highlight\",\"selected\"),r.style.outline=\"2px solid red\",o=r}return!1}function b(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){let r=t,n=[];for(t=e;t!==r;){let i=t.tagName.toLowerCase(),o=Array.from(t.parentElement?.children||[]).filter(e=>e.tagName===t.tagName);if(o.length>0){let l=o.indexOf(t)+1;i+=`:nth-child(${l})`}n.unshift(i),t=t.parentElement}return`#${r.id} ${n.join(\" > \")}`}t=t.parentElement}t=e;let a=[];for(;t&&t!==document.body;){let s=t.tagName.toLowerCase(),c=Array.from(t.parentElement?.children||[]).filter(e=>e.tagName===t.tagName);if(c.length>0){let u=c.indexOf(t)+1;s+=`:nth-child(${u})`}a.unshift(s),t=t.parentElement}return a.join(\" > \")}function f(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id))return`#${t.id}`;t=t.parentElement}t=e;let r=[];for(;t&&t!==document.body;){let n=t.tagName.toLowerCase(),i=Array.from(t.parentElement?.children||[]),o=i.indexOf(t)+1;i.length>1&&(n+=`:nth-child(${o})`),r.unshift(n),t=t.parentElement}return r.join(\" \")}function c(e){let t=e,r=null;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){r=t;break}t=t.parentElement}if(r){t=e;let n=[];for(;t!==r;){let i=1,o=t.previousSibling;for(;o;)1===o.nodeType&&o.tagName===t.tagName&&i++,o=o.previousSibling;n.unshift(`${t.tagName.toLowerCase()}[${i}]`),t=t.parentNode}return`//*[@id=\"${r.id}\"]${n.length>0?\"/\"+n.join(\"/\"):\"\"}`}t=e;let l=[];for(;t&&1===t.nodeType&&t!==document.body;){let a=1,s=t.previousSibling;for(;s;)1===s.nodeType&&s.tagName===t.tagName&&a++,s=s.previousSibling;let c=t.tagName.toLowerCase();l.unshift(`${c}[${a}]`),t=t.parentNode}return\"/\"+l.join(\"/\")}function m(e,t){if(e.element.id&&!d(e.element.id))switch(t){case\"js\":return`document.querySelector(\"#${e.element.id}\");`;case\"css\":return`#${e.element.id}`;case\"xpath\":return`//*[@id=\"${e.element.id}\"]`}switch(t){case\"js\":return`document.querySelector(\"${e.structuredSelector}\");`;case\"css\":default:return e.structuredSelector;case\"xpath\":return e.xpathSelector}}function x(e,n){i.forEach(e=>{e.removeAttribute(\"aria-hidden\")}),i=[],e.remove(),n.remove(),t.forEach(e=>{e.element.style.outline=\"\"}),t=[],document.querySelectorAll(\"[data-selector-highlight]\").forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),r&&r.focus()}window.startElementSelection=function(){e||(e=!0,a=function o(){let d=document.createElement(\"button\");d.textContent='I am done [press \"d\"]',d.setAttribute(\"data-selector-ui\",\"true\"),d.style.cssText=`position: fixed;top: 20px;left: 20px;z-index: 10000;padding: 10px 20px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-size: 16px;`,d.addEventListener(\"click\",o=>{o.stopPropagation(),e=!1,document.removeEventListener(\"click\",g,!0),a.doneButton.remove(),document.body.style.cursor=\"default\",l&&l.remove(),function e(o){(i=Array.from(document.body.children).filter(e=>\"true\"!==e.getAttribute(\"data-selector-ui\")&&!e.contains(document.getElementById(\"selectorSelectorDialog\")))).forEach(e=>{e.setAttribute(\"aria-hidden\",\"true\")}),r=document.activeElement;let l=function e(){let t=document.createElement(\"div\");return t.setAttribute(\"data-selector-ui\",\"true\"),t.style.cssText=`position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, 0.5);z-index: 10000;`,t}();document.body.appendChild(l);let a=document.createElement(\"div\");a.setAttribute(\"data-selector-ui\",\"true\"),a.setAttribute(\"role\",\"dialog\"),a.setAttribute(\"id\",\"selectorSelectorDialog\"),a.setAttribute(\"aria-modal\",\"true\"),a.setAttribute(\"aria-labelledby\",\"dialog-title\"),a.setAttribute(\"aria-describedby\",\"selectorSelectorDescription\"),a.setAttribute(\"tabindex\",\"-1\"),a.style.cssText=`position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 80%;max-width: 800px;max-height: 80vh;background: white;padding: 20px;border-radius: 8px;box-shadow: 0 0 20px rgba(0,0,0,0.2);z-index: 10001;overflow-y: auto;font-family: monospace;`;let d=document.createElement(\"div\");d.style.cssText=`display: flex;justify-content: space-between;align-items: center;margin-bottom: 1em;`;let u=document.createElement(\"h1\");u.id=\"dialog-title\",u.setAttribute(\"data-selector-ui\",\"true\"),u.style.cssText=`margin: 0;font-family: sans-serif;font-size: 1.5em;`,u.textContent=\"Your selections\";let p=document.createElement(\"div\");p.style.cssText=`font-size: 0.9em;color: #666;margin-top: 0.5em;`,p.textContent=\"Press T to toggle between JS, CSS, and XPath selectors\",p.setAttribute(\"id\",\"selectorSelectorDescription\");let h=document.createElement(\"button\");h.setAttribute(\"data-selector-ui\",\"true\"),h.setAttribute(\"data-copy-button\",\"true\"),h.textContent=\"Copy all JS selectors\",h.style.cssText=`padding: 8px 16px;margin-right: 30px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-size: 14px;`;var g,b=document,f=b.createElement(\"style\");b.head.appendChild(f),(g=f.sheet).insertRule(\"#selectorSelectorDialog {background:white!important;outline:2px solid black;}\",0),g.insertRule(\"#selectorSelectorDialog * {color:black!important;}\",0),h.addEventListener(\"click\",async()=>{try{await navigator.clipboard.writeText(o.map((e,t)=>`Element ${t+1} (\"${s(e.textContent)}\"):${m(e,n)}`).join(\"\\n\"));let e=h.textContent;h.textContent=\"Copied!\",document.querySelector(\"#copyStatus\").textContent=\"Copied\",h.style.background=\"#45a049\",setTimeout(()=>{h.textContent=e,document.querySelector(\"#copyStatus\").textContent=\"\",h.style.background=\"#4CAF50\"},2e3)}catch(t){console.error(\"Failed to copy text:\",t),h.textContent=\"Failed to copy\",h.style.background=\"#f44336\",setTimeout(()=>{h.textContent=`Copy all ${n.toUpperCase()} selectors`,h.style.background=\"#4CAF50\"},2e3)}}),d.appendChild(u),d.appendChild(h);let y=document.createElement(\"dl\");y.setAttribute(\"data-selector-ui\",\"true\"),o.forEach((e,t)=>{e.xpathSelector=c(e.element);let r=document.createElement(\"dt\");r.setAttribute(\"data-selector-ui\",\"true\"),r.style.cssText=`font-size: 1.2em;margin: 1em 0 0.5em;font-family: sans-serif;`,r.textContent=`Element ${t+1} (\"${s(e.textContent)}\")`;let i=document.createElement(\"dd\"),o=document.createElement(\"div\");o.setAttribute(\"data-selector-ui\",\"true\"),o.setAttribute(\"data-selector-content\",\"true\"),o.setAttribute(\"data-item-index\",t),o.setAttribute(\"contenteditable\",\"true\"),o.setAttribute(\"tabindex\",\"0\"),o.style.cssText=`padding: 5px;margin: 5px 0;background: #f5f5f5;cursor: pointer;white-space: nowrap;overflow-x: auto;`,o.textContent=m(e,n),o.addEventListener(\"click\",function(e){e.stopPropagation();let t=document.createRange();t.selectNodeContents(this);let r=window.getSelection();r.removeAllRanges(),r.addRange(t)}),y.appendChild(r),i.appendChild(o),y.appendChild(i)});let $=document.createElement(\"button\");$.setAttribute(\"data-selector-ui\",\"true\"),$.textContent=\"\\xd7\",$.setAttribute(\"aria-label\",\"Close dialog\"),$.style.cssText=`position: absolute;top: 15px;right: 10px;background: none;border: none;font-size: 24px;cursor: pointer;padding: 5px 10px;`,$.onclick=e=>{e.stopPropagation();let t=document.querySelector('[data-selector-ui][style*=\"background: rgba\"]');x(t,a)},a.appendChild($),a.appendChild(d),a.appendChild(p),a.appendChild(y),document.body.appendChild(a),document.addEventListener(\"keydown\",function(e){if(\"t\"===e.key.toLowerCase()){switch(n){case\"js\":n=\"css\";break;case\"css\":n=\"xpath\";break;case\"xpath\":n=\"js\"}!function e(r){let i=r.querySelectorAll(\"[data-selector-content]\");i.forEach(e=>{let r=e.getAttribute(\"data-item-index\"),i=t[r];e.textContent=m(i,n)});let o=r.querySelector(\"[data-copy-button]\");o&&(o.textContent=`Copy all ${n.toUpperCase()} selectors`)}(a)}}),function e(t){let r=t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'),n=r[0],i=r[r.length-1];t.addEventListener(\"keydown\",function(e){if(\"Escape\"===e.key){let r=document.querySelector('[data-selector-ui][style*=\"background: rgba\"]');x(r,t);return}\"Tab\"===e.key&&(e.shiftKey?document.activeElement===n&&(e.preventDefault(),i.focus()):document.activeElement===i&&(e.preventDefault(),n.focus()))})}(a),a.focus()}(t)}),document.body.appendChild(d),document.addEventListener(\"keydown\",function(e){\"d\"===e.key.toLowerCase()&&d.click()});let u=document.createElement(\"div\");return u.setAttribute(\"role\",\"status\"),u.setAttribute(\"id\",\"copyStatus\"),u.style.cssText=`clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;`,document.body.appendChild(u),(l=document.createElement(\"div\")).id=\"nodeDetails\",l.setAttribute(\"role\",\"status\"),l.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(0,0,0,0.8);color: white;padding: 10px;border-radius: 4px;z-index: 10000;font-family: monospace;word-wrap: break-word;`,document.body.appendChild(l),{doneButton:d}}(),p(o=document.activeElement||document.body),document.addEventListener(\"click\",g,!0),document.addEventListener(\"keydown\",function(r){if(e){if([\"ArrowUp\",\"ArrowDown\",\"ArrowLeft\",\"ArrowRight\"].includes(r.key)&&r.preventDefault(),\"Tab\"===r.key){setTimeout(()=>{let e=document.activeElement;e&&e!==o&&(o=e,e.hasAttribute(\"data-selector-highlight\")&&\"selected\"===e.getAttribute(\"data-selector-highlight\")||p(e))},0);return}switch(r.key){case\"ArrowUp\":o=h(o,\"up\");break;case\"ArrowDown\":o=h(o,\"down\");break;case\"ArrowLeft\":o=h(o,\"left\");break;case\"ArrowRight\":o=h(o,\"right\");break;case\"Enter\":r.preventDefault(),o&&(!o.hasAttribute(\"data-selector-highlight\")||\"selected\"!==o.getAttribute(\"data-selector-highlight\"))&&(t.push({element:o,structuredSelector:b(o),idSelector:f(o),textContent:o.textContent.trim()}),o.removeAttribute(\"style\"),o.setAttribute(\"data-selector-highlight\",\"selected\"),o.style.outline=\"2px solid red\")}o&&(!o.hasAttribute(\"data-selector-highlight\")||\"selected\"!==o.getAttribute(\"data-selector-highlight\"))&&p(o)}}),document.addEventListener(\"mousemove\",function(t){if(!e)return;let r=t.target;r===o||r.hasAttribute(\"data-selector-highlight\")&&\"selected\"===r.getAttribute(\"data-selector-highlight\")||p(o=r)}),document.body.style.cursor=\"pointer\",console.log(\"Selection mode started. Use arrow keys to navigate, ENTER to select, or use mouse and click.\"))}}(),startElementSelection()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"DOM manipulation","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: DOM manipulation.json","download":{"name":"Selector Selector","language":"javascript","executionMode":"activate","content":"(function(){!function(){let e=!1,t=[],r=null,n=\"js\",i=[],o=null,l=null,a;function s(e){let t=e.replace(/\\s+/g,\" \").trim();return t.length>50?t.substring(0,30)+\"...\":t}function d(e){return[/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i,/^[a-z0-9]{10,}$/i,/^(temp|generated|dynamic|auto)/i].some(t=>t.test(e))}function c(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){let r=t,n=[];for(;t!==r;){let i=1,o=t.previousSibling;for(;o;)1===o.nodeType&&o.tagName===t.tagName&&i++,o=o.previousSibling;n.unshift(`${t.tagName.toLowerCase()}[${i}]`),t=t.parentNode}return`//*[@id=\"${r.id}\"]${n.length>0?\"/\"+n.join(\"/\"):\"\"}`}t=t.parentElement}t=e;let l=[];for(;t&&1===t.nodeType&&t!==document.body;){let a=1,s=t.previousSibling;for(;s;)1===s.nodeType&&s.tagName===t.tagName&&a++,s=s.previousSibling;let c=t.tagName.toLowerCase();l.unshift(`${c}[${a}]`),t=t.parentNode}return\"/\"+l.join(\"/\")}function u(e){l&&(l.innerHTML=`Tag: &lt;${e.tagName.toLowerCase()}&gt;<br>XPath: ${c(e)}<br>Text: ${s(e.textContent)}`)}function p(e){return(document.querySelectorAll('[data-selector-highlight=\"hover\"]').forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),e)?(e.hasAttribute(\"data-selector-highlight\")&&\"selected\"===e.getAttribute(\"data-selector-highlight\")||(e.style.outline=\"2px solid blue\",e.setAttribute(\"data-selector-highlight\",\"hover\"),u(e)),e):null}function h(e,t){if(!e)return null;switch(t){case\"up\":let r=e.parentElement;for(;r;){if(r.parentElement||r.previousElementSibling||r.nextElementSibling)return r;r=r.parentElement}return null;case\"down\":return e.children[0]||null;case\"left\":return e.previousElementSibling||e.parentElement&&e.parentElement.previousElementSibling||null;case\"right\":return e.nextElementSibling||e.parentElement&&e.parentElement.nextElementSibling||null;default:return null}}function p(e){return(document.querySelectorAll('[data-selector-highlight=\"hover\"]').forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),e)?(e.getAttribute(\"data-selector-highlight\")&&\"hover\"!==e.getAttribute(\"data-selector-highlight\")||(e.style.outline=\"2px solid blue\",e.setAttribute(\"data-selector-highlight\",\"hover\"),u(e)),e):null}function g(e){if(e.target.closest(\"[data-selector-ui]\"))return;e.preventDefault(),e.stopPropagation();let r=e.target;if(!r.hasAttribute(\"data-selector-highlight\")||\"selected\"!==r.getAttribute(\"data-selector-highlight\")){let n=b(r),i=f(r);t.push({element:r,structuredSelector:n,idSelector:i,textContent:r.textContent.trim()}),r.removeAttribute(\"style\"),r.setAttribute(\"data-selector-highlight\",\"selected\"),r.style.outline=\"2px solid red\",o=r}return!1}function b(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){let r=t,n=[];for(t=e;t!==r;){let i=t.tagName.toLowerCase(),o=Array.from(t.parentElement?.children||[]).filter(e=>e.tagName===t.tagName);if(o.length>0){let l=o.indexOf(t)+1;i+=`:nth-child(${l})`}n.unshift(i),t=t.parentElement}return`#${r.id} ${n.join(\" > \")}`}t=t.parentElement}t=e;let a=[];for(;t&&t!==document.body;){let s=t.tagName.toLowerCase(),c=Array.from(t.parentElement?.children||[]).filter(e=>e.tagName===t.tagName);if(c.length>0){let u=c.indexOf(t)+1;s+=`:nth-child(${u})`}a.unshift(s),t=t.parentElement}return a.join(\" > \")}function f(e){let t=e;for(;t&&t!==document.body;){if(t.id&&!d(t.id))return`#${t.id}`;t=t.parentElement}t=e;let r=[];for(;t&&t!==document.body;){let n=t.tagName.toLowerCase(),i=Array.from(t.parentElement?.children||[]),o=i.indexOf(t)+1;i.length>1&&(n+=`:nth-child(${o})`),r.unshift(n),t=t.parentElement}return r.join(\" \")}function c(e){let t=e,r=null;for(;t&&t!==document.body;){if(t.id&&!d(t.id)){r=t;break}t=t.parentElement}if(r){t=e;let n=[];for(;t!==r;){let i=1,o=t.previousSibling;for(;o;)1===o.nodeType&&o.tagName===t.tagName&&i++,o=o.previousSibling;n.unshift(`${t.tagName.toLowerCase()}[${i}]`),t=t.parentNode}return`//*[@id=\"${r.id}\"]${n.length>0?\"/\"+n.join(\"/\"):\"\"}`}t=e;let l=[];for(;t&&1===t.nodeType&&t!==document.body;){let a=1,s=t.previousSibling;for(;s;)1===s.nodeType&&s.tagName===t.tagName&&a++,s=s.previousSibling;let c=t.tagName.toLowerCase();l.unshift(`${c}[${a}]`),t=t.parentNode}return\"/\"+l.join(\"/\")}function m(e,t){if(e.element.id&&!d(e.element.id))switch(t){case\"js\":return`document.querySelector(\"#${e.element.id}\");`;case\"css\":return`#${e.element.id}`;case\"xpath\":return`//*[@id=\"${e.element.id}\"]`}switch(t){case\"js\":return`document.querySelector(\"${e.structuredSelector}\");`;case\"css\":default:return e.structuredSelector;case\"xpath\":return e.xpathSelector}}function x(e,n){i.forEach(e=>{e.removeAttribute(\"aria-hidden\")}),i=[],e.remove(),n.remove(),t.forEach(e=>{e.element.style.outline=\"\"}),t=[],document.querySelectorAll(\"[data-selector-highlight]\").forEach(e=>{e.removeAttribute(\"style\"),e.removeAttribute(\"data-selector-highlight\")}),r&&r.focus()}window.startElementSelection=function(){e||(e=!0,a=function o(){let d=document.createElement(\"button\");d.textContent='I am done [press \"d\"]',d.setAttribute(\"data-selector-ui\",\"true\"),d.style.cssText=`position: fixed;top: 20px;left: 20px;z-index: 10000;padding: 10px 20px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-size: 16px;`,d.addEventListener(\"click\",o=>{o.stopPropagation(),e=!1,document.removeEventListener(\"click\",g,!0),a.doneButton.remove(),document.body.style.cursor=\"default\",l&&l.remove(),function e(o){(i=Array.from(document.body.children).filter(e=>\"true\"!==e.getAttribute(\"data-selector-ui\")&&!e.contains(document.getElementById(\"selectorSelectorDialog\")))).forEach(e=>{e.setAttribute(\"aria-hidden\",\"true\")}),r=document.activeElement;let l=function e(){let t=document.createElement(\"div\");return t.setAttribute(\"data-selector-ui\",\"true\"),t.style.cssText=`position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, 0.5);z-index: 10000;`,t}();document.body.appendChild(l);let a=document.createElement(\"div\");a.setAttribute(\"data-selector-ui\",\"true\"),a.setAttribute(\"role\",\"dialog\"),a.setAttribute(\"id\",\"selectorSelectorDialog\"),a.setAttribute(\"aria-modal\",\"true\"),a.setAttribute(\"aria-labelledby\",\"dialog-title\"),a.setAttribute(\"aria-describedby\",\"selectorSelectorDescription\"),a.setAttribute(\"tabindex\",\"-1\"),a.style.cssText=`position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 80%;max-width: 800px;max-height: 80vh;background: white;padding: 20px;border-radius: 8px;box-shadow: 0 0 20px rgba(0,0,0,0.2);z-index: 10001;overflow-y: auto;font-family: monospace;`;let d=document.createElement(\"div\");d.style.cssText=`display: flex;justify-content: space-between;align-items: center;margin-bottom: 1em;`;let u=document.createElement(\"h1\");u.id=\"dialog-title\",u.setAttribute(\"data-selector-ui\",\"true\"),u.style.cssText=`margin: 0;font-family: sans-serif;font-size: 1.5em;`,u.textContent=\"Your selections\";let p=document.createElement(\"div\");p.style.cssText=`font-size: 0.9em;color: #666;margin-top: 0.5em;`,p.textContent=\"Press T to toggle between JS, CSS, and XPath selectors\",p.setAttribute(\"id\",\"selectorSelectorDescription\");let h=document.createElement(\"button\");h.setAttribute(\"data-selector-ui\",\"true\"),h.setAttribute(\"data-copy-button\",\"true\"),h.textContent=\"Copy all JS selectors\",h.style.cssText=`padding: 8px 16px;margin-right: 30px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-size: 14px;`;var g,b=document,f=b.createElement(\"style\");b.head.appendChild(f),(g=f.sheet).insertRule(\"#selectorSelectorDialog {background:white!important;outline:2px solid black;}\",0),g.insertRule(\"#selectorSelectorDialog * {color:black!important;}\",0),h.addEventListener(\"click\",async()=>{try{await navigator.clipboard.writeText(o.map((e,t)=>`Element ${t+1} (\"${s(e.textContent)}\"):${m(e,n)}`).join(\"\\n\"));let e=h.textContent;h.textContent=\"Copied!\",document.querySelector(\"#copyStatus\").textContent=\"Copied\",h.style.background=\"#45a049\",setTimeout(()=>{h.textContent=e,document.querySelector(\"#copyStatus\").textContent=\"\",h.style.background=\"#4CAF50\"},2e3)}catch(t){console.error(\"Failed to copy text:\",t),h.textContent=\"Failed to copy\",h.style.background=\"#f44336\",setTimeout(()=>{h.textContent=`Copy all ${n.toUpperCase()} selectors`,h.style.background=\"#4CAF50\"},2e3)}}),d.appendChild(u),d.appendChild(h);let y=document.createElement(\"dl\");y.setAttribute(\"data-selector-ui\",\"true\"),o.forEach((e,t)=>{e.xpathSelector=c(e.element);let r=document.createElement(\"dt\");r.setAttribute(\"data-selector-ui\",\"true\"),r.style.cssText=`font-size: 1.2em;margin: 1em 0 0.5em;font-family: sans-serif;`,r.textContent=`Element ${t+1} (\"${s(e.textContent)}\")`;let i=document.createElement(\"dd\"),o=document.createElement(\"div\");o.setAttribute(\"data-selector-ui\",\"true\"),o.setAttribute(\"data-selector-content\",\"true\"),o.setAttribute(\"data-item-index\",t),o.setAttribute(\"contenteditable\",\"true\"),o.setAttribute(\"tabindex\",\"0\"),o.style.cssText=`padding: 5px;margin: 5px 0;background: #f5f5f5;cursor: pointer;white-space: nowrap;overflow-x: auto;`,o.textContent=m(e,n),o.addEventListener(\"click\",function(e){e.stopPropagation();let t=document.createRange();t.selectNodeContents(this);let r=window.getSelection();r.removeAllRanges(),r.addRange(t)}),y.appendChild(r),i.appendChild(o),y.appendChild(i)});let $=document.createElement(\"button\");$.setAttribute(\"data-selector-ui\",\"true\"),$.textContent=\"\\xd7\",$.setAttribute(\"aria-label\",\"Close dialog\"),$.style.cssText=`position: absolute;top: 15px;right: 10px;background: none;border: none;font-size: 24px;cursor: pointer;padding: 5px 10px;`,$.onclick=e=>{e.stopPropagation();let t=document.querySelector('[data-selector-ui][style*=\"background: rgba\"]');x(t,a)},a.appendChild($),a.appendChild(d),a.appendChild(p),a.appendChild(y),document.body.appendChild(a),document.addEventListener(\"keydown\",function(e){if(\"t\"===e.key.toLowerCase()){switch(n){case\"js\":n=\"css\";break;case\"css\":n=\"xpath\";break;case\"xpath\":n=\"js\"}!function e(r){let i=r.querySelectorAll(\"[data-selector-content]\");i.forEach(e=>{let r=e.getAttribute(\"data-item-index\"),i=t[r];e.textContent=m(i,n)});let o=r.querySelector(\"[data-copy-button]\");o&&(o.textContent=`Copy all ${n.toUpperCase()} selectors`)}(a)}}),function e(t){let r=t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'),n=r[0],i=r[r.length-1];t.addEventListener(\"keydown\",function(e){if(\"Escape\"===e.key){let r=document.querySelector('[data-selector-ui][style*=\"background: rgba\"]');x(r,t);return}\"Tab\"===e.key&&(e.shiftKey?document.activeElement===n&&(e.preventDefault(),i.focus()):document.activeElement===i&&(e.preventDefault(),n.focus()))})}(a),a.focus()}(t)}),document.body.appendChild(d),document.addEventListener(\"keydown\",function(e){\"d\"===e.key.toLowerCase()&&d.click()});let u=document.createElement(\"div\");return u.setAttribute(\"role\",\"status\"),u.setAttribute(\"id\",\"copyStatus\"),u.style.cssText=`clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;`,document.body.appendChild(u),(l=document.createElement(\"div\")).id=\"nodeDetails\",l.setAttribute(\"role\",\"status\"),l.style.cssText=`position: fixed;bottom: 20px;left: 20px;background: rgba(0,0,0,0.8);color: white;padding: 10px;border-radius: 4px;z-index: 10000;font-family: monospace;word-wrap: break-word;`,document.body.appendChild(l),{doneButton:d}}(),p(o=document.activeElement||document.body),document.addEventListener(\"click\",g,!0),document.addEventListener(\"keydown\",function(r){if(e){if([\"ArrowUp\",\"ArrowDown\",\"ArrowLeft\",\"ArrowRight\"].includes(r.key)&&r.preventDefault(),\"Tab\"===r.key){setTimeout(()=>{let e=document.activeElement;e&&e!==o&&(o=e,e.hasAttribute(\"data-selector-highlight\")&&\"selected\"===e.getAttribute(\"data-selector-highlight\")||p(e))},0);return}switch(r.key){case\"ArrowUp\":o=h(o,\"up\");break;case\"ArrowDown\":o=h(o,\"down\");break;case\"ArrowLeft\":o=h(o,\"left\");break;case\"ArrowRight\":o=h(o,\"right\");break;case\"Enter\":r.preventDefault(),o&&(!o.hasAttribute(\"data-selector-highlight\")||\"selected\"!==o.getAttribute(\"data-selector-highlight\"))&&(t.push({element:o,structuredSelector:b(o),idSelector:f(o),textContent:o.textContent.trim()}),o.removeAttribute(\"style\"),o.setAttribute(\"data-selector-highlight\",\"selected\"),o.style.outline=\"2px solid red\")}o&&(!o.hasAttribute(\"data-selector-highlight\")||\"selected\"!==o.getAttribute(\"data-selector-highlight\"))&&p(o)}}),document.addEventListener(\"mousemove\",function(t){if(!e)return;let r=t.target;r===o||r.hasAttribute(\"data-selector-highlight\")&&\"selected\"===r.getAttribute(\"data-selector-highlight\")||p(o=r)}),document.body.style.cursor=\"pointer\",console.log(\"Selection mode started. Use arrow keys to navigate, ENTER to select, or use mouse and click.\"))}}(),startElementSelection()})()","description":"Collect references to multiple page elements (outputs in several formats).","author":"Ian Lloyd","categories":["HTML"]}}

{"id":"A11y-tools.com: Diagnostics.json-0-1","name":"Structure Revealer","description":"Highlight structural elements on a page, including custom elements of your choosing.","language":"javascript","executionMode":"activate","content":"(function () { 'use strict'; const TOOL_ID = 'structure-revealer-host'; const existingHost = document.getElementById(TOOL_ID); if (existingHost) { existingHost._cleanup(); existingHost.remove(); return; } const PALETTE = { header: { highlight: '#FF6B35', labelBg: '#B94B00', labelFg: '#ffffff' }, main: { highlight: '#4ECDC4', labelBg: '#006E68', labelFg: '#ffffff' }, footer: { highlight: '#FFE66D', labelBg: '#7A6C00', labelFg: '#ffffff' }, aside: { highlight: '#C77DFF', labelBg: '#5C00A3', labelFg: '#ffffff' }, nav: { highlight: '#74D7CB', labelBg: '#007A73', labelFg: '#ffffff' }, section: { highlight: '#F4A261', labelBg: '#7A3B00', labelFg: '#ffffff' }, table: { highlight: '#FF9F1C', labelBg: '#8B5000', labelFg: '#ffffff' }, list: { highlight: '#A8DADC', labelBg: '#005F7A', labelFg: '#ffffff' }, tabs: { highlight: '#E63946', labelBg: '#9B1C23', labelFg: '#ffffff' }, h1: { highlight: '#FF4D6D', labelBg: '#8B0020', labelFg: '#ffffff' }, h2: { highlight: '#FF8500', labelBg: '#7A3D00', labelFg: '#ffffff' }, h3: { highlight: '#FFD166', labelBg: '#6B4E00', labelFg: '#ffffff' }, h4: { highlight: '#06D6A0', labelBg: '#005C40', labelFg: '#ffffff' }, h5: { highlight: '#118AB2', labelBg: '#003F5C', labelFg: '#ffffff' }, h6: { highlight: '#9B5DE5', labelBg: '#3D0070', labelFg: '#ffffff' }, }; const ELEMENT_CONFIG = { header: { selector: 'header, [role=\"banner\"]', displayTag: el => el.tagName === 'HEADER' ? '<header>' : `<${el.tagName.toLowerCase()}>[banner]`, }, main: { selector: 'main, [role=\"main\"]', displayTag: el => el.tagName === 'MAIN' ? '<main>' : `<${el.tagName.toLowerCase()}>[main]`, }, footer: { selector: 'footer, [role=\"contentinfo\"]', displayTag: el => el.tagName === 'FOOTER' ? '<footer>' : `<${el.tagName.toLowerCase()}>[contentinfo]`, }, aside: { selector: 'aside, [role=\"complementary\"]', displayTag: el => el.tagName === 'ASIDE' ? '<aside>' : `<${el.tagName.toLowerCase()}>[complementary]`, }, nav: { selector: 'nav, [role=\"navigation\"]', displayTag: el => el.tagName === 'NAV' ? '<nav>' : `<${el.tagName.toLowerCase()}>[navigation]`, }, section: { selector: 'section[aria-label], section[aria-labelledby], article[aria-label], article[aria-labelledby], [role=\"region\"][aria-label], [role=\"region\"][aria-labelledby], [role=\"article\"][aria-label], [role=\"article\"][aria-labelledby]', filter: el => { const labelledBy = el.getAttribute('aria-labelledby'); if (labelledBy !== null) { return labelledBy.trim().split(/\\s+/).some(id => { const ref = document.getElementById(id); return ref && ref.textContent.trim().length > 0; }); } const label = el.getAttribute('aria-label'); if (label !== null) { return label.trim().length > 0; } return false; }, displayTag: el => { const t = el.tagName.toLowerCase(); if (t === 'section') return '<section>'; if (t === 'article') return '<article>'; return `<${t}>[${el.tagName === 'SECTION' ? 'region' : 'article'}]`; }, }, table: { selector: 'table, [role=\"table\"], [role=\"grid\"]', displayTag: el => el.tagName === 'TABLE' ? '<table>' : `<${el.tagName.toLowerCase()}>[table]`, children: [ { selector: 'th', label: el => '<th>' }, { selector: 'td', label: () => null }, ], }, list: { selector: 'ul, ol, dl, [role=\"list\"]', displayTag: el => { const t = el.tagName.toLowerCase(); return ['ul','ol','dl'].includes(t) ? `<${t}>` : `<${t}>[list]`; }, children: [ { selector: 'li', label: () => null }, { selector: 'dt', label: () => null }, { selector: 'dd', label: () => null }, ], }, tabs: { selector: '[role=\"tablist\"]', displayTag: el => `<${el.tagName.toLowerCase()}>[tablist]`, }, h1: { selector: 'h1', displayTag: () => '<h1>' }, h2: { selector: 'h2', displayTag: () => '<h2>' }, h3: { selector: 'h3', displayTag: () => '<h3>' }, h4: { selector: 'h4', displayTag: () => '<h4>' }, h5: { selector: 'h5', displayTag: () => '<h5>' }, h6: { selector: 'h6', displayTag: () => '<h6>' }, }; const active = {}; const overlays = []; function getAccessibleName(el) { if (el.getAttribute('aria-labelledby')) { const text = el.getAttribute('aria-labelledby') .split(/\\s+/) .map(id => { const t = document.getElementById(id); return t ? t.textContent.trim() : ''; }) .filter(Boolean).join(' '); if (text) return text; } if (el.getAttribute('aria-label')) return el.getAttribute('aria-label'); if (el.getAttribute('title')) return el.getAttribute('title'); const caption = el.querySelector(':scope > caption'); if (caption) return caption.textContent.trim(); const heading = el.querySelector('h1,h2,h3,h4,h5,h6'); if (heading) return heading.textContent.trim(); if (el.id) return `#${el.id}`; return ''; } function getAriaName(el) { const labelledBy = el.getAttribute('aria-labelledby'); if (labelledBy) { const text = labelledBy.split(/\\s+/) .map(id => { const t = document.getElementById(id); return t ? t.textContent.trim() : ''; }) .filter(Boolean).join(' '); if (text) return text; } const label = el.getAttribute('aria-label'); if (label && label.trim()) return label.trim(); return ''; } function highlightDepth(el) { let depth = 0; let node = el.parentElement; while (node) { for (const key of Object.keys(PALETTE)) { if (active[key] && node.dataset.srHighlighted) { depth++; break; } } node = node.parentElement; } return depth; } function positionOverlay(entry) { const { el, overlay, depth, outset = 0 } = entry; const rect = el.getBoundingClientRect(); const scrollX = window.scrollX; const scrollY = window.scrollY; const vw = document.documentElement.clientWidth; const vh = document.documentElement.clientHeight; const inset = depth * 6; let left = rect.left + scrollX - 3 - outset + inset; let top = rect.top + scrollY - 3 - outset + inset; let right = rect.right + scrollX + 3 + outset - inset; let bottom = rect.bottom + scrollY + 3 + outset - inset; const SHADOW = 6; if (rect.left < SHADOW && rect.right > 0) left = scrollX + SHADOW; if (rect.top < SHADOW && rect.bottom > 0) top = scrollY + SHADOW; if (rect.right > vw - SHADOW && rect.left < vw) right = scrollX + vw - SHADOW; if (rect.bottom > vh - SHADOW && rect.top < vh) bottom = scrollY + vh - SHADOW; overlay.style.left = left + 'px'; overlay.style.top = top + 'px'; overlay.style.width = Math.max(0, right - left) + 'px'; overlay.style.height = Math.max(0, bottom - top) + 'px'; const LABEL_HEIGHT = 20; const label = overlay.querySelector('.sr-label'); if (label) { const nearTop = rect.top < LABEL_HEIGHT; label.classList.toggle('sr-label--inside', nearTop); } } const overlayStyleEl = document.createElement('style'); overlayStyleEl.id = `${TOOL_ID}-styles`; overlayStyleEl.textContent = ` .sr-overlay { position: absolute; box-sizing: border-box; border: 3px solid; pointer-events: none; z-index: 2147483640; } .sr-overlay--child { border-width: 1px; box-shadow: none !important; } @keyframes sr-zoom-in { 0% { transform: scale(2.5); opacity: 0; outline-offset: 48px; } 30% { opacity: 1; } 70% { transform: scale(1); opacity: 1; outline-offset: 4px; } 100% { transform: scale(1); opacity: 0; outline-offset: 4px; } } .sr-beacon { position: absolute; box-sizing: border-box; pointer-events: none; z-index: 2147483641; border: 3px solid #fff; border-radius: 2px; animation: sr-zoom-in 1600ms cubic-bezier(0.22, 1, 0.36, 1) forwards; } .sr-label { position: absolute; left: 50%; top: 0; transform: translateX(-50%) translateY(-100%); font: bold 11px/1.2 'Courier New', Courier, monospace; padding: 2px 6px 3px; white-space: nowrap; letter-spacing: 0.03em; border-radius: 2px 2px 0 0; } .sr-label.sr-label--inside { top: 6px; transform: translateX(-50%); border-radius: 0 0 2px 2px; } `; document.head.appendChild(overlayStyleEl); function createOverlay(el, key, depth, { isChild = false, childLabelText = null } = {}) { const pal = PALETTE[key]; const overlay = document.createElement('div'); overlay.className = isChild ? 'sr-overlay sr-overlay--child' : 'sr-overlay'; overlay.setAttribute('aria-hidden', 'true'); overlay.style.borderColor = pal.highlight; if (!isChild) { overlay.style.boxShadow = `0 0 0 3px #000, 0 0 0 6px ${pal.highlight}`; } if (!isChild) { const cfg = ELEMENT_CONFIG[key]; const isCustom = key.startsWith('custom:'); const isHeading = HEADING_KEYS.has(el.tagName.toLowerCase()); const prefix = cfg.displayTag(el); const name = isHeading ? '' : isCustom ? getAriaName(el) : getAccessibleName(el); const labelText = name ? `${prefix}: ${name}` : prefix; const label = document.createElement('span'); label.className = 'sr-label'; label.textContent = labelText; label.style.background = pal.labelBg; label.style.color = pal.labelFg; overlay.appendChild(label); } else if (childLabelText) { const label = document.createElement('span'); label.className = 'sr-label'; label.textContent = childLabelText; label.style.background = pal.labelBg; label.style.color = pal.labelFg; overlay.appendChild(label); } document.body.appendChild(overlay); const outset = (!isChild && HEADING_KEYS.has(el.tagName.toLowerCase())) ? 6 : 0; const entry = { el, overlay, key, depth, outset, isChild }; positionOverlay(entry); return entry; } function applyHighlight(key) { if (active[key]) return; active[key] = true; const cfg = ELEMENT_CONFIG[key]; if (!cfg) return; document.querySelectorAll(cfg.selector).forEach(el => { if (el.closest(`#${TOOL_ID}`)) return; if (cfg.filter && !cfg.filter(el)) return; el.dataset.srHighlighted = '1'; const depth = highlightDepth(el); const entry = createOverlay(el, key, depth); overlays.push(entry); if (cfg.children) { cfg.children.forEach(({ selector, label: getLabel }) => { el.querySelectorAll(selector).forEach(child => { const childLabelText = getLabel(child); const childEntry = createOverlay(child, key, depth + 1, { isChild: true, childLabelText, }); overlays.push(childEntry); }); }); } }); } function _stripHighlight(key) { for (let i = overlays.length - 1; i >= 0; i--) { if (overlays[i].key !== key) continue; overlays[i].el.removeAttribute('data-sr-highlighted'); overlays[i].overlay.remove(); overlays.splice(i, 1); } } function removeHighlight(key) { active[key] = false; _stripHighlight(key); const stillActive = Object.keys(active).filter(k => active[k]); stillActive.forEach(k => { active[k] = false; _stripHighlight(k); }); stillActive.forEach(k => applyHighlight(k)); } function removeAllHighlights() { Object.keys(PALETTE).forEach(k => { active[k] = false; }); overlays.forEach(e => { e.el.removeAttribute('data-sr-highlighted'); e.overlay.remove(); }); overlays.length = 0; } function repositionAll() { overlays.forEach(entry => positionOverlay(entry)); } window.addEventListener('scroll', repositionAll, { passive: true, capture: true }); window.addEventListener('resize', repositionAll, { passive: true }); const host = document.createElement('div'); host.id = TOOL_ID; host.setAttribute('role', 'none'); host.style.cssText = ` position: fixed; bottom: 24px; right: 24px; z-index: 2147483647; width: 435px; `; host._cleanup = () => {}; const shadow = host.attachShadow({ mode: 'open' }); const styleEl = document.createElement('style'); styleEl.textContent = ` *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } :host { display: block; } #panel { font-family: 'Courier New', Courier, monospace; font-size: 18px; background: #0f0f0f; color: #e8e8e8; border: 2px solid #ffffff; border-radius: 4px; box-shadow: 4px 4px 0 #000; width: 435px; user-select: text; -webkit-user-select: text; zoom: 0.8; } /* Minimised state — show only the title bar */ #panel.minimised #body { display: none; } #panel.minimised { width: auto; min-width: 270px; } /* ── Title bar ── */ #titlebar { display: flex; align-items: center; justify-content: space-between; padding: 0.5em 0.6em; background: #1a1a1a; border-bottom: 1px solid #333; border-radius: 4px 4px 0 0; gap: 0.4em; } #panel.minimised #titlebar { border-bottom: none; border-radius: 4px; } #title { font-weight: bold; font-size: 1em; letter-spacing: 0.1em; color: #fff; flex: 1; white-space: nowrap; } .icon-btn { background: none; border: 1px solid #444; color: #aaa; cursor: pointer; font-size: 0.9em; padding: 0.15em 0.4em; line-height: 1.2; font-family: 'Courier New', Courier, monospace; border-radius: 2px; flex-shrink: 0; } .icon-btn:hover { border-color: #888; color: #fff; } .icon-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } #panel { font-family: 'Courier New', Courier, monospace; font-size: 18px; background: #0f0f0f; color: #e8e8e8; border: 2px solid #ffffff; border-radius: 4px; box-shadow: 4px 4px 0 #000; width: 435px; user-select: text; -webkit-user-select: text; zoom: 0.8; max-height: 90vh; display: flex; flex-direction: column; } /* ── Body scrolls independently of the fixed title bar ── */ #body { padding: 0.75em; overflow-y: auto; } /* ── Fieldset groups ── */ fieldset { border: 1px solid #2a2a2a; border-radius: 3px; margin: 0 0 0.6em 0; padding: 0; } legend { padding: 0; width: 100%; font-size: 0; /* suppress default legend spacing */ } .group-header { display: flex; align-items: center; padding: 0.4em 0.6em 0.4em 2.2em; cursor: pointer; font-size: 18px; font-weight: bold; letter-spacing: 0.08em; color: #fff; text-transform: none; background: #1c1c1c; border-radius: 3px 3px 0 0; width: 100%; gap: 0.5em; /* Reset button defaults when group-header is a <button> */ border: none; font-family: 'Courier New', Courier, monospace; text-align: left; } .group-header:focus-visible { outline: 2px solid #4ECDC4; outline-offset: -2px; } .group-items { padding: 0.25em 0.6em 0.4em 0.6em; } /* ── Checkbox rows ── */ .cb-wrap { display: flex; align-items: center; flex-wrap: wrap; padding: 2px 0; } .cb-row { display: flex; align-items: center; padding: 0.25em 0; cursor: pointer; color: #bbb; gap: 0; } .cb-row:hover { color: #fff; } /* Custom checkbox */ input[type=\"checkbox\"] { appearance: none; -webkit-appearance: none; width: 1em; height: 1em; border: 1px solid #555; border-radius: 2px; background: #1a1a1a; cursor: pointer; margin: 0 0.5em 0 0; flex-shrink: 0; position: relative; transition: background 0.1s, border-color 0.1s; } input[type=\"checkbox\"]:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } input[type=\"checkbox\"]:checked::after { content: ''; display: block; position: absolute; /* Tick centred in an 18×18px box */ left: 3px; top: 0px; width: 6px; height: 10px; border: 2px solid #000; border-top: none; border-left: none; transform: rotate(45deg); } input[type=\"checkbox\"]:indeterminate::after { content: ''; display: block; position: absolute; left: 2px; top: 5px; width: 7px; height: 0; border-top: 2px solid #888; } .cb-label-text { font-size: 1em; } .count-btn { font-family: 'Courier New', Courier, monospace; font-size: 0.8em; color: #aaa; background: #222; border: 1px solid #555; border-radius: 3px; padding: 0.1em 0.45em; margin-left: 0.4em; cursor: pointer; line-height: 1.4; flex-shrink: 0; } .count-btn:hover { background: #333; color: #fff; border-color: #888; } .count-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .count-btn[aria-pressed=\"true\"] { background: #4ECDC4; color: #000; border-color: #4ECDC4; font-weight: bold; } .count-btn[aria-pressed=\"true\"]:hover { background: #3bbdb4; border-color: #3bbdb4; } .count-warn { font-family: 'Courier New', Courier, monospace; font-size: 0.75em; color: #e8a020; margin-left: 0.4em; flex-shrink: 1; } /* ── Detail drawer ── */ #drawer { border-top: 1px solid #2a2a2a; margin-top: 4px; padding: 8px 0 4px; } .drawer-header { display: flex; align-items: center; justify-content: space-between; padding: 0 0.6em 0.4em; gap: 0.4em; } .drawer-heading { font-size: 0.85em; color: #888; font-family: 'Courier New', Courier, monospace; font-weight: normal; margin: 0; } .drawer-close { background: none; border: 1px solid #444; color: #aaa; cursor: pointer; font-size: 0.8em; padding: 0.1em 0.4em; font-family: 'Courier New', Courier, monospace; border-radius: 2px; flex-shrink: 0; line-height: 1.2; } .drawer-close:hover { border-color: #888; color: #fff; } .drawer-close:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .drawer-list { margin: 0; padding: 0 0 0 2.2em; } .drawer-item { display: block; width: 100%; text-align: left; background: none; border: none; border-left: 3px solid transparent; color: #ccc; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.35em 0.6em; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .drawer-item:hover { background: #1a1a1a; color: #fff; border-left-color: #4ECDC4; } .drawer-item:focus-visible { outline: 2px solid #4ECDC4; outline-offset: -2px; } /* ── Custom selectors ── */ #panel-footer { padding: 0.5em 0.8em; border-top: 1px solid #2a2a2a; font-size: 0.75em; color: #555; text-align: center; } #panel-footer a { color: #4ECDC4; text-decoration: none; } #panel-footer a:hover { text-decoration: underline; } #panel-footer a:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; border-radius: 2px; } .custom-disclosure-arrow { font-size: 0.8em; } .custom-input-area { padding: 0.5em 0.6em 0.6em; display: flex; flex-direction: column; gap: 0.4em; } .custom-textarea-label { font-family: 'Courier New', Courier, monospace; font-size: 0.8em; color: #888; display: block; margin-bottom: 0.3em; } .custom-textarea { width: 100%; background: #1a1a1a; border: 1px solid #444; border-radius: 2px; color: #e8e8e8; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.4em; resize: vertical; min-height: 4em; box-sizing: border-box; } .custom-textarea:focus { outline: 2px solid #4ECDC4; border-color: #4ECDC4; } .custom-textarea::placeholder { color: #555; } .custom-add-btn { align-self: flex-end; background: #222; border: 1px solid #555; border-radius: 2px; color: #ccc; cursor: pointer; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.25em 0.7em; } .custom-add-btn:hover { background: #333; color: #fff; border-color: #888; } .custom-add-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .custom-error { color: #e63946; font-size: 0.8em; font-family: 'Courier New', Courier, monospace; } .custom-delete-btn { background: none; border: none; color: #555; cursor: pointer; font-size: 0.9em; padding: 0 0.2em; line-height: 1; flex-shrink: 0; font-family: 'Courier New', Courier, monospace; } .custom-delete-btn:hover { color: #e63946; } .custom-delete-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } `; shadow.appendChild(styleEl); const panel = document.createElement('div'); panel.id = 'panel'; const titleBar = document.createElement('div'); titleBar.id = 'titlebar'; const titleSpan = document.createElement('span'); titleSpan.id = 'title'; titleSpan.textContent = 'Structure Revealer'; const minBtn = document.createElement('button'); minBtn.className = 'icon-btn'; minBtn.textContent = '▼'; minBtn.setAttribute('aria-label', 'Minimise panel'); minBtn.setAttribute('aria-expanded', 'true'); minBtn.addEventListener('click', () => { const isMin = panel.classList.toggle('minimised'); minBtn.textContent = isMin ? '▲' : '▼'; minBtn.setAttribute('aria-label', isMin ? 'Restore panel' : 'Minimise panel'); minBtn.setAttribute('aria-expanded', isMin ? 'false' : 'true'); host.style.width = isMin ? 'auto' : '435px'; }); function teardown() { removeAllHighlights(); window.removeEventListener('scroll', repositionAll, { capture: true }); window.removeEventListener('resize', repositionAll); const s = document.getElementById(`${TOOL_ID}-styles`); if (s) s.remove(); host.remove(); } host._cleanup = teardown; const closeBtn = document.createElement('button'); closeBtn.className = 'icon-btn'; closeBtn.textContent = '✕'; closeBtn.setAttribute('aria-label', 'Close Structure Revealer'); closeBtn.addEventListener('click', teardown); titleBar.appendChild(titleSpan); titleBar.appendChild(minBtn); titleBar.appendChild(closeBtn); const bodyEl = document.createElement('div'); bodyEl.id = 'body'; function buildCheckboxRow(labelText, highlightColour, onChange) { const wrap = document.createElement('div'); wrap.className = 'cb-wrap'; const lbl = document.createElement('label'); lbl.className = 'cb-row'; const cb = document.createElement('input'); cb.type = 'checkbox'; cb.addEventListener('change', () => { cb.style.background = cb.checked ? highlightColour : '#1a1a1a'; cb.style.borderColor = cb.checked ? highlightColour : '#555'; onChange(cb.checked); }); const txt = document.createElement('span'); txt.className = 'cb-label-text'; txt.textContent = labelText; lbl.appendChild(cb); lbl.appendChild(txt); const countBtn = document.createElement('button'); countBtn.className = 'count-btn'; countBtn.hidden = true; const warnEl = document.createElement('span'); warnEl.className = 'count-warn'; warnEl.hidden = true; wrap.appendChild(lbl); wrap.appendChild(countBtn); wrap.appendChild(warnEl); return { wrap, cb, countBtn, warnEl }; } function buildGroup(groupLabel, items) { const fs = document.createElement('fieldset'); fs.style.position = 'relative'; const legend = document.createElement('legend'); legend.style.cssText = 'padding:0; width:100%; font-size:0;'; const hdr = document.createElement('div'); hdr.className = 'group-header'; const hdrTxt = document.createElement('span'); hdrTxt.textContent = groupLabel; hdr.appendChild(hdrTxt); legend.appendChild(hdr); fs.appendChild(legend); const allCb = document.createElement('input'); allCb.type = 'checkbox'; allCb.setAttribute('aria-label', `Toggle all ${groupLabel}`); allCb.style.cssText = 'position:absolute; top:-25px; left:0.6em; z-index:1;'; fs.appendChild(allCb); hdr.addEventListener('click', e => { if (e.target === allCb) return; allCb.checked = !allCb.checked; allCb.dispatchEvent(new Event('change')); }); const inner = document.createElement('div'); inner.className = 'group-items'; const childCbs = []; let updatingFromAll = false; function syncAll() { if (updatingFromAll) return; const n = childCbs.length; const on = childCbs.filter(c => c.checked).length; if (on === 0) { allCb.checked = false; allCb.indeterminate = false; allCb.style.background = '#1a1a1a'; allCb.style.borderColor = '#555'; } else if (on === n) { allCb.checked = true; allCb.indeterminate = false; allCb.style.background = '#4ECDC4'; allCb.style.borderColor = '#4ECDC4'; } else { allCb.checked = false; allCb.indeterminate = true; allCb.style.background = '#1a1a1a'; allCb.style.borderColor = '#888'; } } const SINGLETON_KEYS = new Set(['header', 'main', 'footer']); items.forEach(({ key, label }) => { const { wrap, cb, countBtn, warnEl } = buildCheckboxRow(label, PALETTE[key].highlight, checked => { if (checked) { applyHighlight(key); const n = overlays.filter(o => o.key === key && !o.isChild).length; countBtn.textContent = n; countBtn.setAttribute('aria-label', `${n} ${label} element${n !== 1 ? 's' : ''} found. View details`); countBtn.setAttribute('aria-pressed', 'false'); countBtn.hidden = false; if (SINGLETON_KEYS.has(key)) { if (n === 0) { warnEl.textContent = `No ${label} elements found`; warnEl.hidden = false; } else if (n > 1) { warnEl.textContent = `Multiple ${label} elements found (check scoping)`; warnEl.hidden = false; } else { warnEl.hidden = true; } } } else { removeHighlight(key); countBtn.hidden = true; countBtn.textContent = ''; countBtn.removeAttribute('aria-pressed'); warnEl.hidden = true; warnEl.textContent = ''; if (drawer.dataset.activeKey === key) closeDrawer(); } syncAll(); saveCheckedState(); }); cb.dataset.srKey = key; countBtn.addEventListener('click', () => { const n = overlays.filter(o => o.key === key && !o.isChild).length; if (drawer.dataset.activeKey === key && !drawer.hidden) { closeDrawer(); return; } openDrawer(key, label, n, countBtn); }); childCbs.push(cb); inner.appendChild(wrap); }); allCb.addEventListener('change', () => { updatingFromAll = true; allCb.style.background = allCb.checked ? '#4ECDC4' : '#1a1a1a'; allCb.style.borderColor = allCb.checked ? '#4ECDC4' : '#555'; childCbs.forEach(cb => { if (cb.checked !== allCb.checked) { cb.checked = allCb.checked; cb.dispatchEvent(new Event('change')); } }); updatingFromAll = false; syncAll(); }); fs.appendChild(inner); return fs; } const drawer = document.createElement('div'); drawer.id = 'drawer'; drawer.hidden = true; drawer.dataset.activeKey = ''; let activeCountBtn = null; const HEADING_KEYS = new Set(['h1','h2','h3','h4','h5','h6']); function getElementDescription(el, key) { const tag = el.tagName.toLowerCase(); if (HEADING_KEYS.has(tag)) { const text = el.textContent.trim(); return text ? `<${tag}> — ${text}` : `<${tag}> (empty)`; } const isCustom = key && key.startsWith('custom:'); const prefix = isCustom ? ELEMENT_CONFIG[key].displayTag(el) : `<${tag}>`; const name = getAccessibleName(el); if (name) return `${prefix} — ${name}`; const siblings = Array.from(document.querySelectorAll(tag)); const pos = siblings.indexOf(el) + 1; return `${prefix} (${ordinal(pos)} on page)`; } function ordinal(n) { const s = ['th','st','nd','rd']; const v = n % 100; return n + (s[(v - 20) % 10] || s[v] || s[0]); } function openDrawer(key, label, n, countBtn) { if (activeCountBtn && activeCountBtn !== countBtn) { activeCountBtn.setAttribute('aria-pressed', 'false'); } activeCountBtn = countBtn; countBtn.setAttribute('aria-pressed', 'true'); drawer.dataset.activeKey = key; drawer.hidden = false; drawer.setAttribute('role', 'region'); drawer.setAttribute('tabindex', '-1'); drawer.innerHTML = ''; const headingId = `${TOOL_ID}-drawer-heading`; const drawerHeader = document.createElement('div'); drawerHeader.className = 'drawer-header'; const heading = document.createElement('h3'); heading.className = 'drawer-heading'; heading.id = headingId; heading.textContent = `${n} ${label} element${n !== 1 ? 's' : ''} found`; const drawerCloseBtn = document.createElement('button'); drawerCloseBtn.className = 'drawer-close'; drawerCloseBtn.textContent = '✕'; drawerCloseBtn.setAttribute('aria-label', 'Close details panel'); drawerCloseBtn.addEventListener('click', () => closeDrawer()); drawerHeader.appendChild(heading); drawerHeader.appendChild(drawerCloseBtn); drawer.appendChild(drawerHeader); drawer.setAttribute('aria-labelledby', headingId); const list = document.createElement('ol'); list.className = 'drawer-list'; overlays .filter(o => o.key === key && !o.isChild) .forEach((entry) => { const li = document.createElement('li'); const btn = document.createElement('button'); btn.className = 'drawer-item'; btn.textContent = getElementDescription(entry.el, entry.key); btn.addEventListener('click', () => { entry.el.scrollIntoView({ behavior: 'smooth', block: 'center' }); pulseOverlay(entry); }); li.appendChild(btn); list.appendChild(li); }); drawer.appendChild(list); drawer.focus(); } function closeDrawer() { if (activeCountBtn) { activeCountBtn.setAttribute('aria-pressed', 'false'); activeCountBtn.focus(); activeCountBtn = null; } drawer.hidden = true; drawer.dataset.activeKey = ''; drawer.innerHTML = ''; } function pulseOverlay(entry) { setTimeout(() => { const ov = entry.overlay; const beacon = document.createElement('div'); beacon.className = 'sr-beacon'; beacon.style.left = ov.style.left; beacon.style.top = ov.style.top; beacon.style.width = ov.style.width; beacon.style.height = ov.style.height; beacon.style.borderColor = ov.style.borderColor; document.body.appendChild(beacon); beacon.addEventListener('animationend', () => beacon.remove(), { once: true }); }, 500); } const CUSTOM_PALETTE = [ { highlight: '#F72585', labelBg: '#7A0040', labelFg: '#ffffff' }, { highlight: '#A855F7', labelBg: '#3A0060', labelFg: '#ffffff' }, { highlight: '#3A86FF', labelBg: '#003080', labelFg: '#ffffff' }, { highlight: '#FB5607', labelBg: '#7A2200', labelFg: '#ffffff' }, { highlight: '#38B000', labelBg: '#1A5200', labelFg: '#ffffff' }, { highlight: '#FFBE0B', labelBg: '#6B4E00', labelFg: '#ffffff' }, ]; let customPaletteIndex = 0; const LS_DISCLOSURE_KEY = 'structure-revealer-custom-open'; const LS_KEY = 'structure-revealer-custom-selectors'; const LS_STATE_KEY = 'structure-revealer-checked-state'; function loadSavedSelectors() { try { return JSON.parse(localStorage.getItem(LS_KEY) || '[]'); } catch { return []; } } function saveSelectors(selectors) { try { localStorage.setItem(LS_KEY, JSON.stringify(selectors)); } catch { } } function buildCustomGroup() { const fs = document.createElement('fieldset'); const legend = document.createElement('legend'); legend.style.cssText = 'padding:0; width:100%; font-size:0;'; const hdr = document.createElement('button'); hdr.className = 'group-header'; hdr.setAttribute('aria-expanded', 'false'); hdr.style.width = '100%'; hdr.style.textAlign = 'left'; const arrow = document.createElement('span'); arrow.className = 'custom-disclosure-arrow'; arrow.textContent = '▶'; arrow.setAttribute('aria-hidden', 'true'); hdr.appendChild(arrow); const hdrTxt = document.createElement('span'); hdrTxt.textContent = ' Custom'; hdr.appendChild(hdrTxt); legend.appendChild(hdr); fs.appendChild(legend); const inputArea = document.createElement('div'); inputArea.className = 'custom-input-area'; inputArea.hidden = true; fs.appendChild(inputArea); const inner = document.createElement('div'); inner.className = 'group-items'; inputArea.appendChild(inner); const textareaId = `${TOOL_ID}-custom-textarea`; const textareaLabel = document.createElement('label'); textareaLabel.htmlFor = textareaId; textareaLabel.className = 'custom-textarea-label'; textareaLabel.textContent = 'CSS selectors (one per line)'; inputArea.appendChild(textareaLabel); const textarea = document.createElement('textarea'); textarea.id = textareaId; textarea.className = 'custom-textarea'; textarea.placeholder = 'e.g.\\n[aria-live]\\ninput:not([type=\"hidden\"])\\n.my-component'; inputArea.appendChild(textarea); const errorEl = document.createElement('p'); errorEl.className = 'custom-error'; errorEl.setAttribute('aria-live', 'polite'); errorEl.hidden = true; inputArea.appendChild(errorEl); const addBtn = document.createElement('button'); addBtn.className = 'custom-add-btn'; addBtn.textContent = 'Add'; inputArea.appendChild(addBtn); hdr.addEventListener('click', () => { const expanded = inputArea.hidden; inputArea.hidden = !expanded; hdr.setAttribute('aria-expanded', String(expanded)); arrow.textContent = expanded ? '▼' : '▶'; try { localStorage.setItem(LS_DISCLOSURE_KEY, expanded ? '1' : '0'); } catch {} }); try { if (localStorage.getItem(LS_DISCLOSURE_KEY) === '1') { inputArea.hidden = false; hdr.setAttribute('aria-expanded', 'true'); arrow.textContent = '▼'; } } catch {} function addCustomRow(selector, pal) { const key = `custom:${selector}`; PALETTE[key] = pal; ELEMENT_CONFIG[key] = { selector, displayTag: el => { const tag = el.tagName.toLowerCase(); const simple = selector.split(/[\\s>+~]/)[0]; const qualRaw = simple.replace(/^[a-zA-Z*]*/, ''); if (!qualRaw) return `<${tag}>`; const classes = []; const ids = []; const attrs = []; const tokenRe = /\\.([^.#[]+)|#([^.#[]+)|\\[([^\\]]+)\\]/g; let m; while ((m = tokenRe.exec(qualRaw)) !== null) { if (m[1]) classes.push(m[1]); else if (m[2]) ids.push(m[2]); else if (m[3]) { const attrName = m[3].split(/[=~|^$*!]/)[0].trim(); attrs.push(attrName); } } let label = `<${tag}`; if (ids.length) label += ` id=\"${ids.join(' ')}\"`; if (classes.length) label += ` class=\"${classes.join(' ')}\"`; if (attrs.length) label += ` ${attrs.map(a => `${a}=\"…\"`).join(' ')}`; label += '>'; return label; }, }; const { wrap, cb, countBtn, warnEl } = buildCheckboxRow( selector, pal.highlight, checked => { if (checked) { applyHighlight(key); const n = overlays.filter(o => o.key === key && !o.isChild).length; countBtn.textContent = n; countBtn.setAttribute('aria-label', `${n} match${n !== 1 ? 'es' : ''} found. View details`); countBtn.setAttribute('aria-pressed', 'false'); countBtn.hidden = false; } else { removeHighlight(key); countBtn.hidden = true; countBtn.textContent = ''; countBtn.removeAttribute('aria-pressed'); if (drawer.dataset.activeKey === key) closeDrawer(); } saveCheckedState(); } ); cb.dataset.srKey = key; countBtn.addEventListener('click', () => { const n = overlays.filter(o => o.key === key && !o.isChild).length; if (drawer.dataset.activeKey === key && !drawer.hidden) { closeDrawer(); return; } openDrawer(key, selector, n, countBtn); }); const delBtn = document.createElement('button'); delBtn.className = 'custom-delete-btn'; delBtn.textContent = '✕'; delBtn.setAttribute('aria-label', `Remove selector: ${selector}`); delBtn.addEventListener('click', () => { if (active[key]) { removeHighlight(key); if (drawer.dataset.activeKey === key) closeDrawer(); } delete PALETTE[key]; delete ELEMENT_CONFIG[key]; wrap.remove(); const saved = loadSavedSelectors().filter(s => s.selector !== selector); saveSelectors(saved); }); wrap.appendChild(delBtn); inner.appendChild(wrap); } addBtn.addEventListener('click', () => { errorEl.hidden = true; const lines = textarea.value .split('\\n') .map(l => l.trim()) .filter(Boolean); if (!lines.length) return; const errors = []; const saved = loadSavedSelectors(); const existingSelectors = new Set(saved.map(s => s.selector)); lines.forEach(selector => { try { document.querySelector(selector); } catch { errors.push(`Invalid selector: ${selector}`); return; } if (existingSelectors.has(selector)) { errors.push(`Already saved: ${selector}`); return; } const pal = CUSTOM_PALETTE[customPaletteIndex % CUSTOM_PALETTE.length]; customPaletteIndex++; const entry = { selector, paletteIndex: customPaletteIndex - 1 }; saved.push(entry); existingSelectors.add(selector); addCustomRow(selector, pal); }); saveSelectors(saved); if (errors.length) { errorEl.textContent = errors.join(' · '); errorEl.hidden = false; } else { textarea.value = ''; inputArea.hidden = true; disclosure.setAttribute('aria-expanded', 'false'); arrow.textContent = '▶'; } }); loadSavedSelectors().forEach(({ selector, paletteIndex }) => { const pal = CUSTOM_PALETTE[paletteIndex % CUSTOM_PALETTE.length]; customPaletteIndex = Math.max(customPaletteIndex, paletteIndex + 1); addCustomRow(selector, pal); }); return fs; } function saveCheckedState() { try { const checked = Array.from( shadow.querySelectorAll('input[type=\"checkbox\"][data-sr-key]') ).filter(cb => cb.checked).map(cb => cb.dataset.srKey); localStorage.setItem(LS_STATE_KEY, JSON.stringify(checked)); } catch {} } function loadCheckedState() { try { return new Set(JSON.parse(localStorage.getItem(LS_STATE_KEY) || '[]')); } catch { return new Set(); } } bodyEl.appendChild(buildGroup('Page structure', [ { key: 'header', label: 'header' }, { key: 'main', label: 'main' }, { key: 'footer', label: 'footer' }, { key: 'nav', label: 'nav' }, { key: 'aside', label: 'aside' }, { key: 'section', label: 'section / article (with name)' }, ])); bodyEl.appendChild(buildGroup('Headings', [ { key: 'h1', label: 'h1' }, { key: 'h2', label: 'h2' }, { key: 'h3', label: 'h3' }, { key: 'h4', label: 'h4' }, { key: 'h5', label: 'h5' }, { key: 'h6', label: 'h6' }, ])); bodyEl.appendChild(buildGroup('Relationships', [ { key: 'table', label: 'tables' }, { key: 'list', label: 'lists' }, { key: 'tabs', label: 'tabs' }, ])); bodyEl.appendChild(buildCustomGroup()); bodyEl.appendChild(drawer); const footer = document.createElement('div'); footer.id = 'panel-footer'; footer.innerHTML = 'Brought to you by <a href=\"https://a11y-tools.com\" target=\"_blank\" rel=\"noopener noreferrer\">a11y-tools</a>'; panel.appendChild(titleBar); panel.appendChild(bodyEl); panel.appendChild(footer); shadow.appendChild(panel); document.body.appendChild(host); const savedChecked = loadCheckedState(); if (savedChecked.size) { shadow.querySelectorAll('input[type=\"checkbox\"][data-sr-key]').forEach(cb => { if (savedChecked.has(cb.dataset.srKey)) { cb.checked = true; cb.dispatchEvent(new Event('change')); } }); } document.addEventListener('keydown', function escHandler(e) { if (e.key === 'Escape' && document.getElementById(TOOL_ID)) { teardown(); document.removeEventListener('keydown', escHandler); } }); panel.setAttribute('tabindex', '-1'); panel.focus(); })();","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Diagnostics","Inspection"],"folderName":"Diagnostics","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Diagnostics.json","download":{"name":"Structure Revealer","language":"javascript","executionMode":"activate","content":"(function () { 'use strict'; const TOOL_ID = 'structure-revealer-host'; const existingHost = document.getElementById(TOOL_ID); if (existingHost) { existingHost._cleanup(); existingHost.remove(); return; } const PALETTE = { header: { highlight: '#FF6B35', labelBg: '#B94B00', labelFg: '#ffffff' }, main: { highlight: '#4ECDC4', labelBg: '#006E68', labelFg: '#ffffff' }, footer: { highlight: '#FFE66D', labelBg: '#7A6C00', labelFg: '#ffffff' }, aside: { highlight: '#C77DFF', labelBg: '#5C00A3', labelFg: '#ffffff' }, nav: { highlight: '#74D7CB', labelBg: '#007A73', labelFg: '#ffffff' }, section: { highlight: '#F4A261', labelBg: '#7A3B00', labelFg: '#ffffff' }, table: { highlight: '#FF9F1C', labelBg: '#8B5000', labelFg: '#ffffff' }, list: { highlight: '#A8DADC', labelBg: '#005F7A', labelFg: '#ffffff' }, tabs: { highlight: '#E63946', labelBg: '#9B1C23', labelFg: '#ffffff' }, h1: { highlight: '#FF4D6D', labelBg: '#8B0020', labelFg: '#ffffff' }, h2: { highlight: '#FF8500', labelBg: '#7A3D00', labelFg: '#ffffff' }, h3: { highlight: '#FFD166', labelBg: '#6B4E00', labelFg: '#ffffff' }, h4: { highlight: '#06D6A0', labelBg: '#005C40', labelFg: '#ffffff' }, h5: { highlight: '#118AB2', labelBg: '#003F5C', labelFg: '#ffffff' }, h6: { highlight: '#9B5DE5', labelBg: '#3D0070', labelFg: '#ffffff' }, }; const ELEMENT_CONFIG = { header: { selector: 'header, [role=\"banner\"]', displayTag: el => el.tagName === 'HEADER' ? '<header>' : `<${el.tagName.toLowerCase()}>[banner]`, }, main: { selector: 'main, [role=\"main\"]', displayTag: el => el.tagName === 'MAIN' ? '<main>' : `<${el.tagName.toLowerCase()}>[main]`, }, footer: { selector: 'footer, [role=\"contentinfo\"]', displayTag: el => el.tagName === 'FOOTER' ? '<footer>' : `<${el.tagName.toLowerCase()}>[contentinfo]`, }, aside: { selector: 'aside, [role=\"complementary\"]', displayTag: el => el.tagName === 'ASIDE' ? '<aside>' : `<${el.tagName.toLowerCase()}>[complementary]`, }, nav: { selector: 'nav, [role=\"navigation\"]', displayTag: el => el.tagName === 'NAV' ? '<nav>' : `<${el.tagName.toLowerCase()}>[navigation]`, }, section: { selector: 'section[aria-label], section[aria-labelledby], article[aria-label], article[aria-labelledby], [role=\"region\"][aria-label], [role=\"region\"][aria-labelledby], [role=\"article\"][aria-label], [role=\"article\"][aria-labelledby]', filter: el => { const labelledBy = el.getAttribute('aria-labelledby'); if (labelledBy !== null) { return labelledBy.trim().split(/\\s+/).some(id => { const ref = document.getElementById(id); return ref && ref.textContent.trim().length > 0; }); } const label = el.getAttribute('aria-label'); if (label !== null) { return label.trim().length > 0; } return false; }, displayTag: el => { const t = el.tagName.toLowerCase(); if (t === 'section') return '<section>'; if (t === 'article') return '<article>'; return `<${t}>[${el.tagName === 'SECTION' ? 'region' : 'article'}]`; }, }, table: { selector: 'table, [role=\"table\"], [role=\"grid\"]', displayTag: el => el.tagName === 'TABLE' ? '<table>' : `<${el.tagName.toLowerCase()}>[table]`, children: [ { selector: 'th', label: el => '<th>' }, { selector: 'td', label: () => null }, ], }, list: { selector: 'ul, ol, dl, [role=\"list\"]', displayTag: el => { const t = el.tagName.toLowerCase(); return ['ul','ol','dl'].includes(t) ? `<${t}>` : `<${t}>[list]`; }, children: [ { selector: 'li', label: () => null }, { selector: 'dt', label: () => null }, { selector: 'dd', label: () => null }, ], }, tabs: { selector: '[role=\"tablist\"]', displayTag: el => `<${el.tagName.toLowerCase()}>[tablist]`, }, h1: { selector: 'h1', displayTag: () => '<h1>' }, h2: { selector: 'h2', displayTag: () => '<h2>' }, h3: { selector: 'h3', displayTag: () => '<h3>' }, h4: { selector: 'h4', displayTag: () => '<h4>' }, h5: { selector: 'h5', displayTag: () => '<h5>' }, h6: { selector: 'h6', displayTag: () => '<h6>' }, }; const active = {}; const overlays = []; function getAccessibleName(el) { if (el.getAttribute('aria-labelledby')) { const text = el.getAttribute('aria-labelledby') .split(/\\s+/) .map(id => { const t = document.getElementById(id); return t ? t.textContent.trim() : ''; }) .filter(Boolean).join(' '); if (text) return text; } if (el.getAttribute('aria-label')) return el.getAttribute('aria-label'); if (el.getAttribute('title')) return el.getAttribute('title'); const caption = el.querySelector(':scope > caption'); if (caption) return caption.textContent.trim(); const heading = el.querySelector('h1,h2,h3,h4,h5,h6'); if (heading) return heading.textContent.trim(); if (el.id) return `#${el.id}`; return ''; } function getAriaName(el) { const labelledBy = el.getAttribute('aria-labelledby'); if (labelledBy) { const text = labelledBy.split(/\\s+/) .map(id => { const t = document.getElementById(id); return t ? t.textContent.trim() : ''; }) .filter(Boolean).join(' '); if (text) return text; } const label = el.getAttribute('aria-label'); if (label && label.trim()) return label.trim(); return ''; } function highlightDepth(el) { let depth = 0; let node = el.parentElement; while (node) { for (const key of Object.keys(PALETTE)) { if (active[key] && node.dataset.srHighlighted) { depth++; break; } } node = node.parentElement; } return depth; } function positionOverlay(entry) { const { el, overlay, depth, outset = 0 } = entry; const rect = el.getBoundingClientRect(); const scrollX = window.scrollX; const scrollY = window.scrollY; const vw = document.documentElement.clientWidth; const vh = document.documentElement.clientHeight; const inset = depth * 6; let left = rect.left + scrollX - 3 - outset + inset; let top = rect.top + scrollY - 3 - outset + inset; let right = rect.right + scrollX + 3 + outset - inset; let bottom = rect.bottom + scrollY + 3 + outset - inset; const SHADOW = 6; if (rect.left < SHADOW && rect.right > 0) left = scrollX + SHADOW; if (rect.top < SHADOW && rect.bottom > 0) top = scrollY + SHADOW; if (rect.right > vw - SHADOW && rect.left < vw) right = scrollX + vw - SHADOW; if (rect.bottom > vh - SHADOW && rect.top < vh) bottom = scrollY + vh - SHADOW; overlay.style.left = left + 'px'; overlay.style.top = top + 'px'; overlay.style.width = Math.max(0, right - left) + 'px'; overlay.style.height = Math.max(0, bottom - top) + 'px'; const LABEL_HEIGHT = 20; const label = overlay.querySelector('.sr-label'); if (label) { const nearTop = rect.top < LABEL_HEIGHT; label.classList.toggle('sr-label--inside', nearTop); } } const overlayStyleEl = document.createElement('style'); overlayStyleEl.id = `${TOOL_ID}-styles`; overlayStyleEl.textContent = ` .sr-overlay { position: absolute; box-sizing: border-box; border: 3px solid; pointer-events: none; z-index: 2147483640; } .sr-overlay--child { border-width: 1px; box-shadow: none !important; } @keyframes sr-zoom-in { 0% { transform: scale(2.5); opacity: 0; outline-offset: 48px; } 30% { opacity: 1; } 70% { transform: scale(1); opacity: 1; outline-offset: 4px; } 100% { transform: scale(1); opacity: 0; outline-offset: 4px; } } .sr-beacon { position: absolute; box-sizing: border-box; pointer-events: none; z-index: 2147483641; border: 3px solid #fff; border-radius: 2px; animation: sr-zoom-in 1600ms cubic-bezier(0.22, 1, 0.36, 1) forwards; } .sr-label { position: absolute; left: 50%; top: 0; transform: translateX(-50%) translateY(-100%); font: bold 11px/1.2 'Courier New', Courier, monospace; padding: 2px 6px 3px; white-space: nowrap; letter-spacing: 0.03em; border-radius: 2px 2px 0 0; } .sr-label.sr-label--inside { top: 6px; transform: translateX(-50%); border-radius: 0 0 2px 2px; } `; document.head.appendChild(overlayStyleEl); function createOverlay(el, key, depth, { isChild = false, childLabelText = null } = {}) { const pal = PALETTE[key]; const overlay = document.createElement('div'); overlay.className = isChild ? 'sr-overlay sr-overlay--child' : 'sr-overlay'; overlay.setAttribute('aria-hidden', 'true'); overlay.style.borderColor = pal.highlight; if (!isChild) { overlay.style.boxShadow = `0 0 0 3px #000, 0 0 0 6px ${pal.highlight}`; } if (!isChild) { const cfg = ELEMENT_CONFIG[key]; const isCustom = key.startsWith('custom:'); const isHeading = HEADING_KEYS.has(el.tagName.toLowerCase()); const prefix = cfg.displayTag(el); const name = isHeading ? '' : isCustom ? getAriaName(el) : getAccessibleName(el); const labelText = name ? `${prefix}: ${name}` : prefix; const label = document.createElement('span'); label.className = 'sr-label'; label.textContent = labelText; label.style.background = pal.labelBg; label.style.color = pal.labelFg; overlay.appendChild(label); } else if (childLabelText) { const label = document.createElement('span'); label.className = 'sr-label'; label.textContent = childLabelText; label.style.background = pal.labelBg; label.style.color = pal.labelFg; overlay.appendChild(label); } document.body.appendChild(overlay); const outset = (!isChild && HEADING_KEYS.has(el.tagName.toLowerCase())) ? 6 : 0; const entry = { el, overlay, key, depth, outset, isChild }; positionOverlay(entry); return entry; } function applyHighlight(key) { if (active[key]) return; active[key] = true; const cfg = ELEMENT_CONFIG[key]; if (!cfg) return; document.querySelectorAll(cfg.selector).forEach(el => { if (el.closest(`#${TOOL_ID}`)) return; if (cfg.filter && !cfg.filter(el)) return; el.dataset.srHighlighted = '1'; const depth = highlightDepth(el); const entry = createOverlay(el, key, depth); overlays.push(entry); if (cfg.children) { cfg.children.forEach(({ selector, label: getLabel }) => { el.querySelectorAll(selector).forEach(child => { const childLabelText = getLabel(child); const childEntry = createOverlay(child, key, depth + 1, { isChild: true, childLabelText, }); overlays.push(childEntry); }); }); } }); } function _stripHighlight(key) { for (let i = overlays.length - 1; i >= 0; i--) { if (overlays[i].key !== key) continue; overlays[i].el.removeAttribute('data-sr-highlighted'); overlays[i].overlay.remove(); overlays.splice(i, 1); } } function removeHighlight(key) { active[key] = false; _stripHighlight(key); const stillActive = Object.keys(active).filter(k => active[k]); stillActive.forEach(k => { active[k] = false; _stripHighlight(k); }); stillActive.forEach(k => applyHighlight(k)); } function removeAllHighlights() { Object.keys(PALETTE).forEach(k => { active[k] = false; }); overlays.forEach(e => { e.el.removeAttribute('data-sr-highlighted'); e.overlay.remove(); }); overlays.length = 0; } function repositionAll() { overlays.forEach(entry => positionOverlay(entry)); } window.addEventListener('scroll', repositionAll, { passive: true, capture: true }); window.addEventListener('resize', repositionAll, { passive: true }); const host = document.createElement('div'); host.id = TOOL_ID; host.setAttribute('role', 'none'); host.style.cssText = ` position: fixed; bottom: 24px; right: 24px; z-index: 2147483647; width: 435px; `; host._cleanup = () => {}; const shadow = host.attachShadow({ mode: 'open' }); const styleEl = document.createElement('style'); styleEl.textContent = ` *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } :host { display: block; } #panel { font-family: 'Courier New', Courier, monospace; font-size: 18px; background: #0f0f0f; color: #e8e8e8; border: 2px solid #ffffff; border-radius: 4px; box-shadow: 4px 4px 0 #000; width: 435px; user-select: text; -webkit-user-select: text; zoom: 0.8; } /* Minimised state — show only the title bar */ #panel.minimised #body { display: none; } #panel.minimised { width: auto; min-width: 270px; } /* ── Title bar ── */ #titlebar { display: flex; align-items: center; justify-content: space-between; padding: 0.5em 0.6em; background: #1a1a1a; border-bottom: 1px solid #333; border-radius: 4px 4px 0 0; gap: 0.4em; } #panel.minimised #titlebar { border-bottom: none; border-radius: 4px; } #title { font-weight: bold; font-size: 1em; letter-spacing: 0.1em; color: #fff; flex: 1; white-space: nowrap; } .icon-btn { background: none; border: 1px solid #444; color: #aaa; cursor: pointer; font-size: 0.9em; padding: 0.15em 0.4em; line-height: 1.2; font-family: 'Courier New', Courier, monospace; border-radius: 2px; flex-shrink: 0; } .icon-btn:hover { border-color: #888; color: #fff; } .icon-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } #panel { font-family: 'Courier New', Courier, monospace; font-size: 18px; background: #0f0f0f; color: #e8e8e8; border: 2px solid #ffffff; border-radius: 4px; box-shadow: 4px 4px 0 #000; width: 435px; user-select: text; -webkit-user-select: text; zoom: 0.8; max-height: 90vh; display: flex; flex-direction: column; } /* ── Body scrolls independently of the fixed title bar ── */ #body { padding: 0.75em; overflow-y: auto; } /* ── Fieldset groups ── */ fieldset { border: 1px solid #2a2a2a; border-radius: 3px; margin: 0 0 0.6em 0; padding: 0; } legend { padding: 0; width: 100%; font-size: 0; /* suppress default legend spacing */ } .group-header { display: flex; align-items: center; padding: 0.4em 0.6em 0.4em 2.2em; cursor: pointer; font-size: 18px; font-weight: bold; letter-spacing: 0.08em; color: #fff; text-transform: none; background: #1c1c1c; border-radius: 3px 3px 0 0; width: 100%; gap: 0.5em; /* Reset button defaults when group-header is a <button> */ border: none; font-family: 'Courier New', Courier, monospace; text-align: left; } .group-header:focus-visible { outline: 2px solid #4ECDC4; outline-offset: -2px; } .group-items { padding: 0.25em 0.6em 0.4em 0.6em; } /* ── Checkbox rows ── */ .cb-wrap { display: flex; align-items: center; flex-wrap: wrap; padding: 2px 0; } .cb-row { display: flex; align-items: center; padding: 0.25em 0; cursor: pointer; color: #bbb; gap: 0; } .cb-row:hover { color: #fff; } /* Custom checkbox */ input[type=\"checkbox\"] { appearance: none; -webkit-appearance: none; width: 1em; height: 1em; border: 1px solid #555; border-radius: 2px; background: #1a1a1a; cursor: pointer; margin: 0 0.5em 0 0; flex-shrink: 0; position: relative; transition: background 0.1s, border-color 0.1s; } input[type=\"checkbox\"]:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } input[type=\"checkbox\"]:checked::after { content: ''; display: block; position: absolute; /* Tick centred in an 18×18px box */ left: 3px; top: 0px; width: 6px; height: 10px; border: 2px solid #000; border-top: none; border-left: none; transform: rotate(45deg); } input[type=\"checkbox\"]:indeterminate::after { content: ''; display: block; position: absolute; left: 2px; top: 5px; width: 7px; height: 0; border-top: 2px solid #888; } .cb-label-text { font-size: 1em; } .count-btn { font-family: 'Courier New', Courier, monospace; font-size: 0.8em; color: #aaa; background: #222; border: 1px solid #555; border-radius: 3px; padding: 0.1em 0.45em; margin-left: 0.4em; cursor: pointer; line-height: 1.4; flex-shrink: 0; } .count-btn:hover { background: #333; color: #fff; border-color: #888; } .count-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .count-btn[aria-pressed=\"true\"] { background: #4ECDC4; color: #000; border-color: #4ECDC4; font-weight: bold; } .count-btn[aria-pressed=\"true\"]:hover { background: #3bbdb4; border-color: #3bbdb4; } .count-warn { font-family: 'Courier New', Courier, monospace; font-size: 0.75em; color: #e8a020; margin-left: 0.4em; flex-shrink: 1; } /* ── Detail drawer ── */ #drawer { border-top: 1px solid #2a2a2a; margin-top: 4px; padding: 8px 0 4px; } .drawer-header { display: flex; align-items: center; justify-content: space-between; padding: 0 0.6em 0.4em; gap: 0.4em; } .drawer-heading { font-size: 0.85em; color: #888; font-family: 'Courier New', Courier, monospace; font-weight: normal; margin: 0; } .drawer-close { background: none; border: 1px solid #444; color: #aaa; cursor: pointer; font-size: 0.8em; padding: 0.1em 0.4em; font-family: 'Courier New', Courier, monospace; border-radius: 2px; flex-shrink: 0; line-height: 1.2; } .drawer-close:hover { border-color: #888; color: #fff; } .drawer-close:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .drawer-list { margin: 0; padding: 0 0 0 2.2em; } .drawer-item { display: block; width: 100%; text-align: left; background: none; border: none; border-left: 3px solid transparent; color: #ccc; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.35em 0.6em; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .drawer-item:hover { background: #1a1a1a; color: #fff; border-left-color: #4ECDC4; } .drawer-item:focus-visible { outline: 2px solid #4ECDC4; outline-offset: -2px; } /* ── Custom selectors ── */ #panel-footer { padding: 0.5em 0.8em; border-top: 1px solid #2a2a2a; font-size: 0.75em; color: #555; text-align: center; } #panel-footer a { color: #4ECDC4; text-decoration: none; } #panel-footer a:hover { text-decoration: underline; } #panel-footer a:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; border-radius: 2px; } .custom-disclosure-arrow { font-size: 0.8em; } .custom-input-area { padding: 0.5em 0.6em 0.6em; display: flex; flex-direction: column; gap: 0.4em; } .custom-textarea-label { font-family: 'Courier New', Courier, monospace; font-size: 0.8em; color: #888; display: block; margin-bottom: 0.3em; } .custom-textarea { width: 100%; background: #1a1a1a; border: 1px solid #444; border-radius: 2px; color: #e8e8e8; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.4em; resize: vertical; min-height: 4em; box-sizing: border-box; } .custom-textarea:focus { outline: 2px solid #4ECDC4; border-color: #4ECDC4; } .custom-textarea::placeholder { color: #555; } .custom-add-btn { align-self: flex-end; background: #222; border: 1px solid #555; border-radius: 2px; color: #ccc; cursor: pointer; font-family: 'Courier New', Courier, monospace; font-size: 0.85em; padding: 0.25em 0.7em; } .custom-add-btn:hover { background: #333; color: #fff; border-color: #888; } .custom-add-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } .custom-error { color: #e63946; font-size: 0.8em; font-family: 'Courier New', Courier, monospace; } .custom-delete-btn { background: none; border: none; color: #555; cursor: pointer; font-size: 0.9em; padding: 0 0.2em; line-height: 1; flex-shrink: 0; font-family: 'Courier New', Courier, monospace; } .custom-delete-btn:hover { color: #e63946; } .custom-delete-btn:focus-visible { outline: 2px solid #4ECDC4; outline-offset: 2px; } `; shadow.appendChild(styleEl); const panel = document.createElement('div'); panel.id = 'panel'; const titleBar = document.createElement('div'); titleBar.id = 'titlebar'; const titleSpan = document.createElement('span'); titleSpan.id = 'title'; titleSpan.textContent = 'Structure Revealer'; const minBtn = document.createElement('button'); minBtn.className = 'icon-btn'; minBtn.textContent = '▼'; minBtn.setAttribute('aria-label', 'Minimise panel'); minBtn.setAttribute('aria-expanded', 'true'); minBtn.addEventListener('click', () => { const isMin = panel.classList.toggle('minimised'); minBtn.textContent = isMin ? '▲' : '▼'; minBtn.setAttribute('aria-label', isMin ? 'Restore panel' : 'Minimise panel'); minBtn.setAttribute('aria-expanded', isMin ? 'false' : 'true'); host.style.width = isMin ? 'auto' : '435px'; }); function teardown() { removeAllHighlights(); window.removeEventListener('scroll', repositionAll, { capture: true }); window.removeEventListener('resize', repositionAll); const s = document.getElementById(`${TOOL_ID}-styles`); if (s) s.remove(); host.remove(); } host._cleanup = teardown; const closeBtn = document.createElement('button'); closeBtn.className = 'icon-btn'; closeBtn.textContent = '✕'; closeBtn.setAttribute('aria-label', 'Close Structure Revealer'); closeBtn.addEventListener('click', teardown); titleBar.appendChild(titleSpan); titleBar.appendChild(minBtn); titleBar.appendChild(closeBtn); const bodyEl = document.createElement('div'); bodyEl.id = 'body'; function buildCheckboxRow(labelText, highlightColour, onChange) { const wrap = document.createElement('div'); wrap.className = 'cb-wrap'; const lbl = document.createElement('label'); lbl.className = 'cb-row'; const cb = document.createElement('input'); cb.type = 'checkbox'; cb.addEventListener('change', () => { cb.style.background = cb.checked ? highlightColour : '#1a1a1a'; cb.style.borderColor = cb.checked ? highlightColour : '#555'; onChange(cb.checked); }); const txt = document.createElement('span'); txt.className = 'cb-label-text'; txt.textContent = labelText; lbl.appendChild(cb); lbl.appendChild(txt); const countBtn = document.createElement('button'); countBtn.className = 'count-btn'; countBtn.hidden = true; const warnEl = document.createElement('span'); warnEl.className = 'count-warn'; warnEl.hidden = true; wrap.appendChild(lbl); wrap.appendChild(countBtn); wrap.appendChild(warnEl); return { wrap, cb, countBtn, warnEl }; } function buildGroup(groupLabel, items) { const fs = document.createElement('fieldset'); fs.style.position = 'relative'; const legend = document.createElement('legend'); legend.style.cssText = 'padding:0; width:100%; font-size:0;'; const hdr = document.createElement('div'); hdr.className = 'group-header'; const hdrTxt = document.createElement('span'); hdrTxt.textContent = groupLabel; hdr.appendChild(hdrTxt); legend.appendChild(hdr); fs.appendChild(legend); const allCb = document.createElement('input'); allCb.type = 'checkbox'; allCb.setAttribute('aria-label', `Toggle all ${groupLabel}`); allCb.style.cssText = 'position:absolute; top:-25px; left:0.6em; z-index:1;'; fs.appendChild(allCb); hdr.addEventListener('click', e => { if (e.target === allCb) return; allCb.checked = !allCb.checked; allCb.dispatchEvent(new Event('change')); }); const inner = document.createElement('div'); inner.className = 'group-items'; const childCbs = []; let updatingFromAll = false; function syncAll() { if (updatingFromAll) return; const n = childCbs.length; const on = childCbs.filter(c => c.checked).length; if (on === 0) { allCb.checked = false; allCb.indeterminate = false; allCb.style.background = '#1a1a1a'; allCb.style.borderColor = '#555'; } else if (on === n) { allCb.checked = true; allCb.indeterminate = false; allCb.style.background = '#4ECDC4'; allCb.style.borderColor = '#4ECDC4'; } else { allCb.checked = false; allCb.indeterminate = true; allCb.style.background = '#1a1a1a'; allCb.style.borderColor = '#888'; } } const SINGLETON_KEYS = new Set(['header', 'main', 'footer']); items.forEach(({ key, label }) => { const { wrap, cb, countBtn, warnEl } = buildCheckboxRow(label, PALETTE[key].highlight, checked => { if (checked) { applyHighlight(key); const n = overlays.filter(o => o.key === key && !o.isChild).length; countBtn.textContent = n; countBtn.setAttribute('aria-label', `${n} ${label} element${n !== 1 ? 's' : ''} found. View details`); countBtn.setAttribute('aria-pressed', 'false'); countBtn.hidden = false; if (SINGLETON_KEYS.has(key)) { if (n === 0) { warnEl.textContent = `No ${label} elements found`; warnEl.hidden = false; } else if (n > 1) { warnEl.textContent = `Multiple ${label} elements found (check scoping)`; warnEl.hidden = false; } else { warnEl.hidden = true; } } } else { removeHighlight(key); countBtn.hidden = true; countBtn.textContent = ''; countBtn.removeAttribute('aria-pressed'); warnEl.hidden = true; warnEl.textContent = ''; if (drawer.dataset.activeKey === key) closeDrawer(); } syncAll(); saveCheckedState(); }); cb.dataset.srKey = key; countBtn.addEventListener('click', () => { const n = overlays.filter(o => o.key === key && !o.isChild).length; if (drawer.dataset.activeKey === key && !drawer.hidden) { closeDrawer(); return; } openDrawer(key, label, n, countBtn); }); childCbs.push(cb); inner.appendChild(wrap); }); allCb.addEventListener('change', () => { updatingFromAll = true; allCb.style.background = allCb.checked ? '#4ECDC4' : '#1a1a1a'; allCb.style.borderColor = allCb.checked ? '#4ECDC4' : '#555'; childCbs.forEach(cb => { if (cb.checked !== allCb.checked) { cb.checked = allCb.checked; cb.dispatchEvent(new Event('change')); } }); updatingFromAll = false; syncAll(); }); fs.appendChild(inner); return fs; } const drawer = document.createElement('div'); drawer.id = 'drawer'; drawer.hidden = true; drawer.dataset.activeKey = ''; let activeCountBtn = null; const HEADING_KEYS = new Set(['h1','h2','h3','h4','h5','h6']); function getElementDescription(el, key) { const tag = el.tagName.toLowerCase(); if (HEADING_KEYS.has(tag)) { const text = el.textContent.trim(); return text ? `<${tag}> — ${text}` : `<${tag}> (empty)`; } const isCustom = key && key.startsWith('custom:'); const prefix = isCustom ? ELEMENT_CONFIG[key].displayTag(el) : `<${tag}>`; const name = getAccessibleName(el); if (name) return `${prefix} — ${name}`; const siblings = Array.from(document.querySelectorAll(tag)); const pos = siblings.indexOf(el) + 1; return `${prefix} (${ordinal(pos)} on page)`; } function ordinal(n) { const s = ['th','st','nd','rd']; const v = n % 100; return n + (s[(v - 20) % 10] || s[v] || s[0]); } function openDrawer(key, label, n, countBtn) { if (activeCountBtn && activeCountBtn !== countBtn) { activeCountBtn.setAttribute('aria-pressed', 'false'); } activeCountBtn = countBtn; countBtn.setAttribute('aria-pressed', 'true'); drawer.dataset.activeKey = key; drawer.hidden = false; drawer.setAttribute('role', 'region'); drawer.setAttribute('tabindex', '-1'); drawer.innerHTML = ''; const headingId = `${TOOL_ID}-drawer-heading`; const drawerHeader = document.createElement('div'); drawerHeader.className = 'drawer-header'; const heading = document.createElement('h3'); heading.className = 'drawer-heading'; heading.id = headingId; heading.textContent = `${n} ${label} element${n !== 1 ? 's' : ''} found`; const drawerCloseBtn = document.createElement('button'); drawerCloseBtn.className = 'drawer-close'; drawerCloseBtn.textContent = '✕'; drawerCloseBtn.setAttribute('aria-label', 'Close details panel'); drawerCloseBtn.addEventListener('click', () => closeDrawer()); drawerHeader.appendChild(heading); drawerHeader.appendChild(drawerCloseBtn); drawer.appendChild(drawerHeader); drawer.setAttribute('aria-labelledby', headingId); const list = document.createElement('ol'); list.className = 'drawer-list'; overlays .filter(o => o.key === key && !o.isChild) .forEach((entry) => { const li = document.createElement('li'); const btn = document.createElement('button'); btn.className = 'drawer-item'; btn.textContent = getElementDescription(entry.el, entry.key); btn.addEventListener('click', () => { entry.el.scrollIntoView({ behavior: 'smooth', block: 'center' }); pulseOverlay(entry); }); li.appendChild(btn); list.appendChild(li); }); drawer.appendChild(list); drawer.focus(); } function closeDrawer() { if (activeCountBtn) { activeCountBtn.setAttribute('aria-pressed', 'false'); activeCountBtn.focus(); activeCountBtn = null; } drawer.hidden = true; drawer.dataset.activeKey = ''; drawer.innerHTML = ''; } function pulseOverlay(entry) { setTimeout(() => { const ov = entry.overlay; const beacon = document.createElement('div'); beacon.className = 'sr-beacon'; beacon.style.left = ov.style.left; beacon.style.top = ov.style.top; beacon.style.width = ov.style.width; beacon.style.height = ov.style.height; beacon.style.borderColor = ov.style.borderColor; document.body.appendChild(beacon); beacon.addEventListener('animationend', () => beacon.remove(), { once: true }); }, 500); } const CUSTOM_PALETTE = [ { highlight: '#F72585', labelBg: '#7A0040', labelFg: '#ffffff' }, { highlight: '#A855F7', labelBg: '#3A0060', labelFg: '#ffffff' }, { highlight: '#3A86FF', labelBg: '#003080', labelFg: '#ffffff' }, { highlight: '#FB5607', labelBg: '#7A2200', labelFg: '#ffffff' }, { highlight: '#38B000', labelBg: '#1A5200', labelFg: '#ffffff' }, { highlight: '#FFBE0B', labelBg: '#6B4E00', labelFg: '#ffffff' }, ]; let customPaletteIndex = 0; const LS_DISCLOSURE_KEY = 'structure-revealer-custom-open'; const LS_KEY = 'structure-revealer-custom-selectors'; const LS_STATE_KEY = 'structure-revealer-checked-state'; function loadSavedSelectors() { try { return JSON.parse(localStorage.getItem(LS_KEY) || '[]'); } catch { return []; } } function saveSelectors(selectors) { try { localStorage.setItem(LS_KEY, JSON.stringify(selectors)); } catch { } } function buildCustomGroup() { const fs = document.createElement('fieldset'); const legend = document.createElement('legend'); legend.style.cssText = 'padding:0; width:100%; font-size:0;'; const hdr = document.createElement('button'); hdr.className = 'group-header'; hdr.setAttribute('aria-expanded', 'false'); hdr.style.width = '100%'; hdr.style.textAlign = 'left'; const arrow = document.createElement('span'); arrow.className = 'custom-disclosure-arrow'; arrow.textContent = '▶'; arrow.setAttribute('aria-hidden', 'true'); hdr.appendChild(arrow); const hdrTxt = document.createElement('span'); hdrTxt.textContent = ' Custom'; hdr.appendChild(hdrTxt); legend.appendChild(hdr); fs.appendChild(legend); const inputArea = document.createElement('div'); inputArea.className = 'custom-input-area'; inputArea.hidden = true; fs.appendChild(inputArea); const inner = document.createElement('div'); inner.className = 'group-items'; inputArea.appendChild(inner); const textareaId = `${TOOL_ID}-custom-textarea`; const textareaLabel = document.createElement('label'); textareaLabel.htmlFor = textareaId; textareaLabel.className = 'custom-textarea-label'; textareaLabel.textContent = 'CSS selectors (one per line)'; inputArea.appendChild(textareaLabel); const textarea = document.createElement('textarea'); textarea.id = textareaId; textarea.className = 'custom-textarea'; textarea.placeholder = 'e.g.\\n[aria-live]\\ninput:not([type=\"hidden\"])\\n.my-component'; inputArea.appendChild(textarea); const errorEl = document.createElement('p'); errorEl.className = 'custom-error'; errorEl.setAttribute('aria-live', 'polite'); errorEl.hidden = true; inputArea.appendChild(errorEl); const addBtn = document.createElement('button'); addBtn.className = 'custom-add-btn'; addBtn.textContent = 'Add'; inputArea.appendChild(addBtn); hdr.addEventListener('click', () => { const expanded = inputArea.hidden; inputArea.hidden = !expanded; hdr.setAttribute('aria-expanded', String(expanded)); arrow.textContent = expanded ? '▼' : '▶'; try { localStorage.setItem(LS_DISCLOSURE_KEY, expanded ? '1' : '0'); } catch {} }); try { if (localStorage.getItem(LS_DISCLOSURE_KEY) === '1') { inputArea.hidden = false; hdr.setAttribute('aria-expanded', 'true'); arrow.textContent = '▼'; } } catch {} function addCustomRow(selector, pal) { const key = `custom:${selector}`; PALETTE[key] = pal; ELEMENT_CONFIG[key] = { selector, displayTag: el => { const tag = el.tagName.toLowerCase(); const simple = selector.split(/[\\s>+~]/)[0]; const qualRaw = simple.replace(/^[a-zA-Z*]*/, ''); if (!qualRaw) return `<${tag}>`; const classes = []; const ids = []; const attrs = []; const tokenRe = /\\.([^.#[]+)|#([^.#[]+)|\\[([^\\]]+)\\]/g; let m; while ((m = tokenRe.exec(qualRaw)) !== null) { if (m[1]) classes.push(m[1]); else if (m[2]) ids.push(m[2]); else if (m[3]) { const attrName = m[3].split(/[=~|^$*!]/)[0].trim(); attrs.push(attrName); } } let label = `<${tag}`; if (ids.length) label += ` id=\"${ids.join(' ')}\"`; if (classes.length) label += ` class=\"${classes.join(' ')}\"`; if (attrs.length) label += ` ${attrs.map(a => `${a}=\"…\"`).join(' ')}`; label += '>'; return label; }, }; const { wrap, cb, countBtn, warnEl } = buildCheckboxRow( selector, pal.highlight, checked => { if (checked) { applyHighlight(key); const n = overlays.filter(o => o.key === key && !o.isChild).length; countBtn.textContent = n; countBtn.setAttribute('aria-label', `${n} match${n !== 1 ? 'es' : ''} found. View details`); countBtn.setAttribute('aria-pressed', 'false'); countBtn.hidden = false; } else { removeHighlight(key); countBtn.hidden = true; countBtn.textContent = ''; countBtn.removeAttribute('aria-pressed'); if (drawer.dataset.activeKey === key) closeDrawer(); } saveCheckedState(); } ); cb.dataset.srKey = key; countBtn.addEventListener('click', () => { const n = overlays.filter(o => o.key === key && !o.isChild).length; if (drawer.dataset.activeKey === key && !drawer.hidden) { closeDrawer(); return; } openDrawer(key, selector, n, countBtn); }); const delBtn = document.createElement('button'); delBtn.className = 'custom-delete-btn'; delBtn.textContent = '✕'; delBtn.setAttribute('aria-label', `Remove selector: ${selector}`); delBtn.addEventListener('click', () => { if (active[key]) { removeHighlight(key); if (drawer.dataset.activeKey === key) closeDrawer(); } delete PALETTE[key]; delete ELEMENT_CONFIG[key]; wrap.remove(); const saved = loadSavedSelectors().filter(s => s.selector !== selector); saveSelectors(saved); }); wrap.appendChild(delBtn); inner.appendChild(wrap); } addBtn.addEventListener('click', () => { errorEl.hidden = true; const lines = textarea.value .split('\\n') .map(l => l.trim()) .filter(Boolean); if (!lines.length) return; const errors = []; const saved = loadSavedSelectors(); const existingSelectors = new Set(saved.map(s => s.selector)); lines.forEach(selector => { try { document.querySelector(selector); } catch { errors.push(`Invalid selector: ${selector}`); return; } if (existingSelectors.has(selector)) { errors.push(`Already saved: ${selector}`); return; } const pal = CUSTOM_PALETTE[customPaletteIndex % CUSTOM_PALETTE.length]; customPaletteIndex++; const entry = { selector, paletteIndex: customPaletteIndex - 1 }; saved.push(entry); existingSelectors.add(selector); addCustomRow(selector, pal); }); saveSelectors(saved); if (errors.length) { errorEl.textContent = errors.join(' · '); errorEl.hidden = false; } else { textarea.value = ''; inputArea.hidden = true; disclosure.setAttribute('aria-expanded', 'false'); arrow.textContent = '▶'; } }); loadSavedSelectors().forEach(({ selector, paletteIndex }) => { const pal = CUSTOM_PALETTE[paletteIndex % CUSTOM_PALETTE.length]; customPaletteIndex = Math.max(customPaletteIndex, paletteIndex + 1); addCustomRow(selector, pal); }); return fs; } function saveCheckedState() { try { const checked = Array.from( shadow.querySelectorAll('input[type=\"checkbox\"][data-sr-key]') ).filter(cb => cb.checked).map(cb => cb.dataset.srKey); localStorage.setItem(LS_STATE_KEY, JSON.stringify(checked)); } catch {} } function loadCheckedState() { try { return new Set(JSON.parse(localStorage.getItem(LS_STATE_KEY) || '[]')); } catch { return new Set(); } } bodyEl.appendChild(buildGroup('Page structure', [ { key: 'header', label: 'header' }, { key: 'main', label: 'main' }, { key: 'footer', label: 'footer' }, { key: 'nav', label: 'nav' }, { key: 'aside', label: 'aside' }, { key: 'section', label: 'section / article (with name)' }, ])); bodyEl.appendChild(buildGroup('Headings', [ { key: 'h1', label: 'h1' }, { key: 'h2', label: 'h2' }, { key: 'h3', label: 'h3' }, { key: 'h4', label: 'h4' }, { key: 'h5', label: 'h5' }, { key: 'h6', label: 'h6' }, ])); bodyEl.appendChild(buildGroup('Relationships', [ { key: 'table', label: 'tables' }, { key: 'list', label: 'lists' }, { key: 'tabs', label: 'tabs' }, ])); bodyEl.appendChild(buildCustomGroup()); bodyEl.appendChild(drawer); const footer = document.createElement('div'); footer.id = 'panel-footer'; footer.innerHTML = 'Brought to you by <a href=\"https://a11y-tools.com\" target=\"_blank\" rel=\"noopener noreferrer\">a11y-tools</a>'; panel.appendChild(titleBar); panel.appendChild(bodyEl); panel.appendChild(footer); shadow.appendChild(panel); document.body.appendChild(host); const savedChecked = loadCheckedState(); if (savedChecked.size) { shadow.querySelectorAll('input[type=\"checkbox\"][data-sr-key]').forEach(cb => { if (savedChecked.has(cb.dataset.srKey)) { cb.checked = true; cb.dispatchEvent(new Event('change')); } }); } document.addEventListener('keydown', function escHandler(e) { if (e.key === 'Escape' && document.getElementById(TOOL_ID)) { teardown(); document.removeEventListener('keydown', escHandler); } }); panel.setAttribute('tabindex', '-1'); panel.focus(); })();","description":"Highlight structural elements on a page, including custom elements of your choosing.","author":"Ian Lloyd","categories":["Accessibility","Diagnostics","Inspection"]}}

{"id":"A11y-tools.com: Form.json-0-0","name":"Suggest autocomplete values","description":"Lets you pick autocomplete values for fields that lack them with easier-to-understand categories.","language":"javascript","executionMode":"activate","content":"(function(){function showAllAutoCompleteCandidates(){!function e(){let o=document.querySelectorAll(\"[aria-hidden=true]\");Array.from(o).forEach(function(e){e.remove()})}();let e=document.createElement(\"style\");e.innerHTML=\".auto-complete-candidate {outline:3px dotted orange;}.auto-complete-required {outline:3px solid red;outline-offset:2px;box-shadow:0 0 0 8px white}\",document.querySelector(\"head\").append(e);let o=document.querySelectorAll(\"input:not([autocomplete]):not([type=radio]):not([type=checkbox]):not([type=hidden]):not([type=submit]),select:not([autocomplete])\"),t=\"\",n=\"\",i=\"\",a=\"\",l=\"\",r=0,p=\"\";p+='<option value=\"\">Pick an autocomplete value...</option>\\n',p+='<optgroup label=\"Title\">\\n',p+='<option value=\"honorific-prefix\">honorific-prefix  ----  prefix, title e.g. Mr/Mrs</option>\\n',p+='<option value=\"honorific-suffix\">honorific-suffix  ----  suffix e.g. Jnr/Esq</option>\\n',p+='<optgroup label=\"Name/Personal Details\">\\n',p+='<option value=\"name\">name  ----  full name</option>\\n',p+='<option value=\"given-name\">given-name  ----  first-name, forename</option>\\n',p+='<option value=\"additional-name\">additional-name  ----  middle name</option>\\n',p+='<option value=\"family-name\">family-name  ----  last name, surname</option>\\n',p+='<option value=\"nickname\">nickname  ----  screen name, handle</option>\\n',p+='<option value=\"username\">username  ----  login name, account name</option>\\n',p+='<option value=\"sex\">sex  ----  gender</option>\\n',p+='<option value=\"language\">language</option>\\n',p+='<optgroup label=\"Address\">\\n',p+='<option value=\"street-address\">street-address  ----  full address, postal address</option>\\n',p+='<option value=\"address-line1\">address-line1</option>\\n',p+='<option value=\"address-line2\">address-line2</option>\\n',p+='<option value=\"address-line3\">address-line3</option>\\n',p+='<option value=\"address-level4\">address-level4</option>\\n',p+='<option value=\"address-level3\">address-level3</option>\\n',p+='<option value=\"address-level2\">address-level2  ----  city, town, village</option>\\n',p+='<option value=\"address-level1\">address-level1  ----  state, post-town, province, canton</option>\\n',p+='<option value=\"country\">country  ----  country code, territory code</option>\\n',p+='<option value=\"country-name\">country-name</option>\\n',p+='<option value=\"postal-code\">postal-code  ----  post code, zip code, cedex code</option>\\n',p+='<optgroup label=\"Telephone\">\\n',p+='<option value=\"tel\">tel  ----  full telephone number</option>\\n',p+='<option value=\"tel-country-code\">tel-country-code</option>\\n',p+='<option value=\"tel-national\">tel-national</option>\\n',p+='<option value=\"tel-area-code\">tel-area-code</option>\\n',p+='<option value=\"tel-local\">tel-local</option>\\n',p+='<option value=\"tel-local-prefix\">tel-local-prefix</option>\\n',p+='<option value=\"tel-local-suffix\">tel-local-suffix</option>\\n',p+='<option value=\"tel-extension\">tel-extension</option>\\n',p+='<optgroup label=\"Passwords\">\\n',p+='<option value=\"new-password\">new-password</option>\\n',p+='<option value=\"current-password\">current-password</option>\\n',p+='<option value=\"one-time-code\">one-time-code  ----  one-time-password, otp, otc</option>\\n',p+='<optgroup label=\"Credit Card/Financial\">\\n',p+='<option value=\"cc-name\">cc-name  ----  credit card full name</option>\\n',p+='<option value=\"cc-given-name\">cc-given-name  ----  credit card first name</option>\\n',p+='<option value=\"cc-additional-name\">cc-additional-name  ----  credit card middle-name</option>\\n',p+='<option value=\"cc-family-name\">cc-family-name  ----  credit card surname</option>\\n',p+='<option value=\"cc-number\">cc-number</option>\\n',p+='<option value=\"cc-exp\">cc-exp  ----  credit card expiry date</option>\\n',p+='<option value=\"cc-exp-month\">cc-exp-month  ----  credit card expiry month</option>\\n',p+='<option value=\"cc-exp-year\">cc-exp-year  ----  credit card expiry year</option>\\n',p+='<option value=\"cc-csc\">cc-csc  ----  credit card cvc 3-digit code</option>\\n',p+='<option value=\"cc-type\">cc-type  ----  credit card type</option>\\n',p+='<option value=\"transaction-currency\">transaction-currency</option>\\n',p+='<option value=\"transaction-amount\">transaction-amount</option>\\n',p+='<optgroup label=\"Date of Birth\">\\n',p+='<option value=\"bday\">bday  ----  birthday</option>\\n',p+='<option value=\"bday-day\">bday-day  ----  birthday day</option>\\n',p+='<option value=\"bday-month\">bday-month  ----  birthday month</option>\\n',p+='<option value=\"bday-year\">bday-year  ----  birthday year</option>\\n',p+='<optgroup label=\"Other\">\\n',p+='<option value=\"organization-title\">organization-title  ----  job title</option>\\n',p+='<option value=\"organization\">organization  ----  company-name, company</option>\\n',p+='<option value=\"email\">email</option>\\n',p+='<option value=\"url\">url  ----  web address/homepage</option>\\n',p+='<option value=\"photo\">photo  ----  image, avatar, icon</option>\\n',p+='<option value=\"impp\">impp</option>\\n',p+='<option value=\"off\">off</option>\\n';var d=0;if(o.length>0){let c=/^[A-Za-z][-A-Za-z0-9_:.]*$/;Array.from(o).forEach(function(e){if(t=e.outerHTML,a=e.getAttribute(\"id\"),!c.test(a)){console.group(\"Invalid ID found\"),console.log(\"Following field had invalid `id` of \"+a),e.setAttribute(\"data-original-invalid-id\",a);let o=`id_${a.replace(/[^a-zA-Z0-9_]/g,\"_\")}`;a=function e(o){let t=o,n=1;for(;document.getElementById(t);)t=`${o}_${n++}`;return t}(o),console.log(\"Renamed to \"+o),e.id=a,console.log(e),console.groupEnd()}fieldName=e.getAttribute(\"name\"),null===a&&(null===fieldName?(d++,e.setAttribute(\"id\",\"IDDYNAMICALLYMADEUP_\"+d),a=\"IDDYNAMICALLYMADEUP_\"+d):(e.setAttribute(\"id\",\"IDFROMNAME_\"+e.getAttribute(\"name\")),a=\"IDFROMNAME_\"+e.getAttribute(\"name\"))),e.classList.add(\"auto-complete-candidate\");let n=document.createElement(\"DIV\");n.innerHTML='<select class=\"autoCompleteSuggestion\" data-field-id=\"'+a+'\" aria-label=\"autocomplete suggestion for '+a+'\">\\n'+p+\"</select>\\n\",n.classList.add(\"tempDiv\"),n.style=\"margin:5px 0 20px 0\",function e(o,t){t.parentNode.insertBefore(o,t.nextSibling)}(n,e)});let u=document.querySelectorAll(\".autoCompleteSuggestion\"),s=\"\";Array.from(u).forEach(function(e){e.addEventListener(\"change\",function(){\"\"!==e[e.selectedIndex].value&&r++,n=\"\",i=\"\",l=e[e.selectedIndex].value,s=e.getAttribute(\"data-field-id\"),document.querySelector(\"#\"+s).classList.add(\"auto-complete-required\"),document.querySelector(\"#\"+s).setAttribute(\"autocomplete\",l);let o=document.querySelectorAll(\".auto-complete-required\");Array.from(o).forEach(function(e){n+=\"* \"+e.getAttribute(\"id\")+\": \"+e.getAttribute(\"autocomplete\")+\"\\n\",i+=e.outerHTML+\"\\n\\n\"}),i=(i=(i=i.split('class=\"amended\"').join(\"\").split(\" amended\").join(\"\").split(' class=\"\"').join(\"\")).split(\"auto-complete-candidate auto-complete-required\").join(\"\")).split(' class=\"\"').join(\"\");let t=\" fields require\";1===r&&(t=\" field requires\"),console.clear(),console.log(\"The following \"+r+t+\" an autocomplete attribute as specified:\\n\\n\"+n+\"\\nFull details:\\n\\n\"+i)})});let m=document.createElement(\"button\");m.setAttribute(\"type\",\"button\"),m.innerHTML=\"I'm done setting `autocomplete`\",m.style=\"position:fixed;z-index:10000;top:1em;right:1em;background:red;color:white;font-weight:bold;\",document.querySelector(\"body\").append(m),m.addEventListener(\"click\",function(){m.remove();let e=document.querySelectorAll(\".auto-complete-candidate\");Array.from(e).forEach(function(e){e.classList.remove(\"auto-complete-candidate\")});let o=document.querySelectorAll(\".tempDiv\");Array.from(o).forEach(function(e){e.remove()})}),alert(o.length+' fields that lack an autocomplete are present on the page.\\n\\n• Set the correct values for each identified field\\n• Then press the \"I\\'m done ...\" button')}else alert(\"No fields without autocomplete found\")}showAllAutoCompleteCandidates()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Forms"],"folderName":"Forms","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Form.json","download":{"name":"Suggest autocomplete values","language":"javascript","executionMode":"activate","content":"(function(){function showAllAutoCompleteCandidates(){!function e(){let o=document.querySelectorAll(\"[aria-hidden=true]\");Array.from(o).forEach(function(e){e.remove()})}();let e=document.createElement(\"style\");e.innerHTML=\".auto-complete-candidate {outline:3px dotted orange;}.auto-complete-required {outline:3px solid red;outline-offset:2px;box-shadow:0 0 0 8px white}\",document.querySelector(\"head\").append(e);let o=document.querySelectorAll(\"input:not([autocomplete]):not([type=radio]):not([type=checkbox]):not([type=hidden]):not([type=submit]),select:not([autocomplete])\"),t=\"\",n=\"\",i=\"\",a=\"\",l=\"\",r=0,p=\"\";p+='<option value=\"\">Pick an autocomplete value...</option>\\n',p+='<optgroup label=\"Title\">\\n',p+='<option value=\"honorific-prefix\">honorific-prefix  ----  prefix, title e.g. Mr/Mrs</option>\\n',p+='<option value=\"honorific-suffix\">honorific-suffix  ----  suffix e.g. Jnr/Esq</option>\\n',p+='<optgroup label=\"Name/Personal Details\">\\n',p+='<option value=\"name\">name  ----  full name</option>\\n',p+='<option value=\"given-name\">given-name  ----  first-name, forename</option>\\n',p+='<option value=\"additional-name\">additional-name  ----  middle name</option>\\n',p+='<option value=\"family-name\">family-name  ----  last name, surname</option>\\n',p+='<option value=\"nickname\">nickname  ----  screen name, handle</option>\\n',p+='<option value=\"username\">username  ----  login name, account name</option>\\n',p+='<option value=\"sex\">sex  ----  gender</option>\\n',p+='<option value=\"language\">language</option>\\n',p+='<optgroup label=\"Address\">\\n',p+='<option value=\"street-address\">street-address  ----  full address, postal address</option>\\n',p+='<option value=\"address-line1\">address-line1</option>\\n',p+='<option value=\"address-line2\">address-line2</option>\\n',p+='<option value=\"address-line3\">address-line3</option>\\n',p+='<option value=\"address-level4\">address-level4</option>\\n',p+='<option value=\"address-level3\">address-level3</option>\\n',p+='<option value=\"address-level2\">address-level2  ----  city, town, village</option>\\n',p+='<option value=\"address-level1\">address-level1  ----  state, post-town, province, canton</option>\\n',p+='<option value=\"country\">country  ----  country code, territory code</option>\\n',p+='<option value=\"country-name\">country-name</option>\\n',p+='<option value=\"postal-code\">postal-code  ----  post code, zip code, cedex code</option>\\n',p+='<optgroup label=\"Telephone\">\\n',p+='<option value=\"tel\">tel  ----  full telephone number</option>\\n',p+='<option value=\"tel-country-code\">tel-country-code</option>\\n',p+='<option value=\"tel-national\">tel-national</option>\\n',p+='<option value=\"tel-area-code\">tel-area-code</option>\\n',p+='<option value=\"tel-local\">tel-local</option>\\n',p+='<option value=\"tel-local-prefix\">tel-local-prefix</option>\\n',p+='<option value=\"tel-local-suffix\">tel-local-suffix</option>\\n',p+='<option value=\"tel-extension\">tel-extension</option>\\n',p+='<optgroup label=\"Passwords\">\\n',p+='<option value=\"new-password\">new-password</option>\\n',p+='<option value=\"current-password\">current-password</option>\\n',p+='<option value=\"one-time-code\">one-time-code  ----  one-time-password, otp, otc</option>\\n',p+='<optgroup label=\"Credit Card/Financial\">\\n',p+='<option value=\"cc-name\">cc-name  ----  credit card full name</option>\\n',p+='<option value=\"cc-given-name\">cc-given-name  ----  credit card first name</option>\\n',p+='<option value=\"cc-additional-name\">cc-additional-name  ----  credit card middle-name</option>\\n',p+='<option value=\"cc-family-name\">cc-family-name  ----  credit card surname</option>\\n',p+='<option value=\"cc-number\">cc-number</option>\\n',p+='<option value=\"cc-exp\">cc-exp  ----  credit card expiry date</option>\\n',p+='<option value=\"cc-exp-month\">cc-exp-month  ----  credit card expiry month</option>\\n',p+='<option value=\"cc-exp-year\">cc-exp-year  ----  credit card expiry year</option>\\n',p+='<option value=\"cc-csc\">cc-csc  ----  credit card cvc 3-digit code</option>\\n',p+='<option value=\"cc-type\">cc-type  ----  credit card type</option>\\n',p+='<option value=\"transaction-currency\">transaction-currency</option>\\n',p+='<option value=\"transaction-amount\">transaction-amount</option>\\n',p+='<optgroup label=\"Date of Birth\">\\n',p+='<option value=\"bday\">bday  ----  birthday</option>\\n',p+='<option value=\"bday-day\">bday-day  ----  birthday day</option>\\n',p+='<option value=\"bday-month\">bday-month  ----  birthday month</option>\\n',p+='<option value=\"bday-year\">bday-year  ----  birthday year</option>\\n',p+='<optgroup label=\"Other\">\\n',p+='<option value=\"organization-title\">organization-title  ----  job title</option>\\n',p+='<option value=\"organization\">organization  ----  company-name, company</option>\\n',p+='<option value=\"email\">email</option>\\n',p+='<option value=\"url\">url  ----  web address/homepage</option>\\n',p+='<option value=\"photo\">photo  ----  image, avatar, icon</option>\\n',p+='<option value=\"impp\">impp</option>\\n',p+='<option value=\"off\">off</option>\\n';var d=0;if(o.length>0){let c=/^[A-Za-z][-A-Za-z0-9_:.]*$/;Array.from(o).forEach(function(e){if(t=e.outerHTML,a=e.getAttribute(\"id\"),!c.test(a)){console.group(\"Invalid ID found\"),console.log(\"Following field had invalid `id` of \"+a),e.setAttribute(\"data-original-invalid-id\",a);let o=`id_${a.replace(/[^a-zA-Z0-9_]/g,\"_\")}`;a=function e(o){let t=o,n=1;for(;document.getElementById(t);)t=`${o}_${n++}`;return t}(o),console.log(\"Renamed to \"+o),e.id=a,console.log(e),console.groupEnd()}fieldName=e.getAttribute(\"name\"),null===a&&(null===fieldName?(d++,e.setAttribute(\"id\",\"IDDYNAMICALLYMADEUP_\"+d),a=\"IDDYNAMICALLYMADEUP_\"+d):(e.setAttribute(\"id\",\"IDFROMNAME_\"+e.getAttribute(\"name\")),a=\"IDFROMNAME_\"+e.getAttribute(\"name\"))),e.classList.add(\"auto-complete-candidate\");let n=document.createElement(\"DIV\");n.innerHTML='<select class=\"autoCompleteSuggestion\" data-field-id=\"'+a+'\" aria-label=\"autocomplete suggestion for '+a+'\">\\n'+p+\"</select>\\n\",n.classList.add(\"tempDiv\"),n.style=\"margin:5px 0 20px 0\",function e(o,t){t.parentNode.insertBefore(o,t.nextSibling)}(n,e)});let u=document.querySelectorAll(\".autoCompleteSuggestion\"),s=\"\";Array.from(u).forEach(function(e){e.addEventListener(\"change\",function(){\"\"!==e[e.selectedIndex].value&&r++,n=\"\",i=\"\",l=e[e.selectedIndex].value,s=e.getAttribute(\"data-field-id\"),document.querySelector(\"#\"+s).classList.add(\"auto-complete-required\"),document.querySelector(\"#\"+s).setAttribute(\"autocomplete\",l);let o=document.querySelectorAll(\".auto-complete-required\");Array.from(o).forEach(function(e){n+=\"* \"+e.getAttribute(\"id\")+\": \"+e.getAttribute(\"autocomplete\")+\"\\n\",i+=e.outerHTML+\"\\n\\n\"}),i=(i=(i=i.split('class=\"amended\"').join(\"\").split(\" amended\").join(\"\").split(' class=\"\"').join(\"\")).split(\"auto-complete-candidate auto-complete-required\").join(\"\")).split(' class=\"\"').join(\"\");let t=\" fields require\";1===r&&(t=\" field requires\"),console.clear(),console.log(\"The following \"+r+t+\" an autocomplete attribute as specified:\\n\\n\"+n+\"\\nFull details:\\n\\n\"+i)})});let m=document.createElement(\"button\");m.setAttribute(\"type\",\"button\"),m.innerHTML=\"I'm done setting `autocomplete`\",m.style=\"position:fixed;z-index:10000;top:1em;right:1em;background:red;color:white;font-weight:bold;\",document.querySelector(\"body\").append(m),m.addEventListener(\"click\",function(){m.remove();let e=document.querySelectorAll(\".auto-complete-candidate\");Array.from(e).forEach(function(e){e.classList.remove(\"auto-complete-candidate\")});let o=document.querySelectorAll(\".tempDiv\");Array.from(o).forEach(function(e){e.remove()})}),alert(o.length+' fields that lack an autocomplete are present on the page.\\n\\n• Set the correct values for each identified field\\n• Then press the \"I\\'m done ...\" button')}else alert(\"No fields without autocomplete found\")}showAllAutoCompleteCandidates()})()","description":"Lets you pick autocomplete values for fields that lack them with easier-to-understand categories.","author":"Ian Lloyd","categories":["Accessibility","Forms"]}}

{"id":"Alwaystwisted.com: Third-Party Resource Detector.json-0-0","name":"Third-Party Resource Detector","description":"Lists all external CSS and JavaScript files loaded from external domains","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var currentHost=window.location.hostname;function extractDomain(url){try{return new URL(url).hostname;}catch(e){return url;}}function getBaseDomain(domain){var parts=domain.split('.');if(parts.length<=2)return domain;var baseDomain=parts.slice(parts.length-2).join('.');return baseSiteDomain;}var baseSiteDomain=getBaseDomain(currentHost);var externalResources=[];var links=d.getElementsByTagName('link');var scripts=d.getElementsByTagName('script');for(var i=0;i<links.length;i++){if(links[i].href){var linkDomain=extractDomain(links[i].href);if(getBaseDomain(linkDomain)!==baseSiteDomain){var type=links[i].rel==='stylesheet'?'CSS':(links[i].rel||'Link');externalResources.push({type:type,url:links[i].href});}}}for(var j=0;j<scripts.length;j++){if(scripts[j].src){var scriptDomain=extractDomain(scripts[j].src);if(getBaseDomain(scriptDomain)!==baseSiteDomain){externalResources.push({type:'JS',url:scripts[j].src});}}}var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var html='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>External Resources</h3>';if(externalResources.length===0){html+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No external resources found.</div>';}else{html+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+externalResources.length+'</strong> truly external resources:</div>';externalResources.forEach(function(resource,index){var color=resource.type==='CSS'?'#06a':(resource.type==='JS'?'#850':'#444');html+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:'+color+'!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'>'+resource.type+' #'+(index+1)+'</div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;word-break:break-all!important;\\'>'+resource.url+'</pre></div>';});}html+='<div id=\\'external-resources-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=html;d.body.appendChild(c);document.getElementById('external-resources-close-btn').addEventListener('click',function(){c.remove();});})();","author":"Stuart Robson","authorUrl":"https://www.alwaystwisted.com","categories":["Network"],"folderName":null,"folderDescription":null,"sourceFile":"Alwaystwisted.com: Third-Party Resource Detector.json","download":{"name":"Third-Party Resource Detector","language":"javascript","executionMode":"activate","content":"(function(){var d=document;var currentHost=window.location.hostname;function extractDomain(url){try{return new URL(url).hostname;}catch(e){return url;}}function getBaseDomain(domain){var parts=domain.split('.');if(parts.length<=2)return domain;var baseDomain=parts.slice(parts.length-2).join('.');return baseSiteDomain;}var baseSiteDomain=getBaseDomain(currentHost);var externalResources=[];var links=d.getElementsByTagName('link');var scripts=d.getElementsByTagName('script');for(var i=0;i<links.length;i++){if(links[i].href){var linkDomain=extractDomain(links[i].href);if(getBaseDomain(linkDomain)!==baseSiteDomain){var type=links[i].rel==='stylesheet'?'CSS':(links[i].rel||'Link');externalResources.push({type:type,url:links[i].href});}}}for(var j=0;j<scripts.length;j++){if(scripts[j].src){var scriptDomain=extractDomain(scripts[j].src);if(getBaseDomain(scriptDomain)!==baseSiteDomain){externalResources.push({type:'JS',url:scripts[j].src});}}}var c=d.createElement('div');c.style.cssText='position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:9999!important;background:#fff!important;color:#000!important;padding:15px!important;border-bottom:2px solid #000!important;max-height:80vh!important;overflow:auto!important;font:14px Arial!important;box-shadow:0 2px 10px rgba(0,0,0,0.3)!important;';var html='<h3 style=\\'margin:0 0 15px!important;font:bold 18px Arial!important;color:#000!important;\\'>External Resources</h3>';if(externalResources.length===0){html+='<div style=\\'padding:10px!important;background:#f5f5f5!important;color:#000!important;border-left:3px solid #f33!important;\\'>No external resources found.</div>';}else{html+='<div style=\\'margin-bottom:10px!important;color:#000!important;\\'>Found <strong>'+externalResources.length+'</strong> truly external resources:</div>';externalResources.forEach(function(resource,index){var color=resource.type==='CSS'?'#06a':(resource.type==='JS'?'#850':'#444');html+='<div style=\\'margin:10px 0!important;padding:10px!important;background:#f5f5f5!important;border:1px solid #ddd!important;border-radius:3px!important;\\'><div style=\\'color:'+color+'!important;font:bold 14px monospace!important;margin-bottom:5px!important;\\'>'+resource.type+' #'+(index+1)+'</div><pre style=\\'margin:0!important;padding:8px!important;background:#fff!important;color:#333!important;font:13px monospace!important;overflow:auto!important;white-space:pre-wrap!important;border:1px solid #eee!important;word-break:break-all!important;\\'>'+resource.url+'</pre></div>';});}html+='<div id=\\'external-resources-close-btn\\' style=\\'position:absolute!important;top:10px!important;right:10px!important;background:#f33!important;color:#fff!important;border:none!important;padding:5px 10px!important;border-radius:3px!important;cursor:pointer!important;\\'>Close</div>';c.innerHTML=html;d.body.appendChild(c);document.getElementById('external-resources-close-btn').addEventListener('click',function(){c.remove();});})();","description":"Lists all external CSS and JavaScript files loaded from external domains","author":"Stuart Robson","categories":["Network"]}}

{"id":"Touch Fuzzy.json-0-0","name":"Touch Fuzzy","description":"A Super FX2-powered snippet","language":"javascript","executionMode":"activate","content":"(function(){function touchFuzzy() { var style = document.createElement('style'); style.innerHTML = ':root {        --animation-delay: 10s;        --animation-duration: 30s;        --animation-warp: 8s;        --degree-warp: 0deg;        image-rendering: pixelated;      }      * {        animation-duration: var(--animation-duration),          calc(var(--animation-duration) + var(--animation-warp)),          calc(var(--animation-duration) + var(--animation-warp) * 2);        animation-iteration-count: infinite;        animation-direction: alternate;        animation-delay: var(--animation-delay);      }      body {        animation-name: skew;        animation-delay: 60s;      }      figure,      img,      picture,      video,      iframe,      svg,      canvas,      input,      textarea,      button,      pre,      hr,      details,      summary {        animation-name: hueRotate, scale3D, origin;      }      p,      li,      dd,      dt,      dl,      figcaption,      blockquote,      cite,      h1,      h2,      h3,      h4,      h5,      h6,      a,      strong,      em {        --animation-duration: 5s;        animation-name: blur, skew;      }      @keyframes hueRotate {        from {          filter: hue-rotate(0deg) saturate(100%);        }        to {          filter: hue-rotate(180deg) saturate(120%);        }      }      @keyframes scale3D {        from {          transform: scale3D(0.95, 0.95, 1) skew(-1deg, -1deg);        }        to {          transform: scale3D(1.25, 1.25, 1) skew(1deg, 1deg);        }      }      @keyframes skew {        0% {          transform: skew(0deg, 0deg);        }        33% {          transform: skew(0.5deg, 0.5deg);        }        66% {          transform: skew(-0.5deg, -0.5deg);        }        100% {          transform: skew(0deg, 0deg);        }      }      @keyframes origin {        0% {          transform-origin: 50% 50%;        }        20% {          transform-origin: 40% 50%;        }        40% {          transform-origin: 60% 40%;        }        60% {          transform-origin: 40% 60%;        }        80% {          transform-origin: 50% 40%;        }        100% {          transform-origin: 50% 50%;        }      }      @keyframes blur {        from {          filter: blur(0em) contrast(100%);        }        to {          filter: blur(0.05em) contrast(200%);        }      }'; document.head.appendChild(style); }      function getDizzy() {        if (          \"matchMedia\" in window &&          \"CSS\" in window &&          CSS.supports(\"animation\", \"var(--primary)\")        ) {          var reducedMotionMediaQuery = window.matchMedia(            \"(prefers-reduced-motion: reduce)\"          );        } else {          return false;        }        if (reducedMotionMediaQuery && reducedMotionMediaQuery.matches) {          if (            window.confirm(              \"Your browser and/or operating system has reduced motion enabled, and an excessive amount of motion is the joke of this bookmarklet. Would you like to continue?\"            )          ) {          } else {            var styleForceReducedMotion = document.createElement(\"style\");            styleForceReducedMotion.innerHTML =              \"@media (prefers-reduced-motion: reduce) { *, ::before, ::after { animation-delay: -1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; background-attachment: initial !important; scroll-behavior: auto !important; transition-duration: 0s !important; transition-delay: 0s !important; } }\";            document.head.appendChild(styleForceReducedMotion);          }        }        var things = document.querySelectorAll(\"*\");        for (var thing of things) {          var time = 5 + Math.floor(Math.random() * Math.floor(30));          thing.style.setProperty(\"--animation-delay\", time * 1.5 + \"s\");          thing.style.setProperty(\"--animation-warp\", time * 2.5 + \"s\");          var deg = Math.random();          thing.style.setProperty(\"--degree-warp\", deg + deg * 0.5 + \"deg\");        }      }    touchFuzzy(); getDizzy();})();","author":"Cory Birdsong","authorUrl":"https://cbirdsong.github.io/touchfuzzy/","categories":["CSS","Fun"],"folderName":null,"folderDescription":null,"sourceFile":"Touch Fuzzy.json","download":{"name":"Touch Fuzzy","language":"javascript","executionMode":"activate","content":"(function(){function touchFuzzy() { var style = document.createElement('style'); style.innerHTML = ':root {        --animation-delay: 10s;        --animation-duration: 30s;        --animation-warp: 8s;        --degree-warp: 0deg;        image-rendering: pixelated;      }      * {        animation-duration: var(--animation-duration),          calc(var(--animation-duration) + var(--animation-warp)),          calc(var(--animation-duration) + var(--animation-warp) * 2);        animation-iteration-count: infinite;        animation-direction: alternate;        animation-delay: var(--animation-delay);      }      body {        animation-name: skew;        animation-delay: 60s;      }      figure,      img,      picture,      video,      iframe,      svg,      canvas,      input,      textarea,      button,      pre,      hr,      details,      summary {        animation-name: hueRotate, scale3D, origin;      }      p,      li,      dd,      dt,      dl,      figcaption,      blockquote,      cite,      h1,      h2,      h3,      h4,      h5,      h6,      a,      strong,      em {        --animation-duration: 5s;        animation-name: blur, skew;      }      @keyframes hueRotate {        from {          filter: hue-rotate(0deg) saturate(100%);        }        to {          filter: hue-rotate(180deg) saturate(120%);        }      }      @keyframes scale3D {        from {          transform: scale3D(0.95, 0.95, 1) skew(-1deg, -1deg);        }        to {          transform: scale3D(1.25, 1.25, 1) skew(1deg, 1deg);        }      }      @keyframes skew {        0% {          transform: skew(0deg, 0deg);        }        33% {          transform: skew(0.5deg, 0.5deg);        }        66% {          transform: skew(-0.5deg, -0.5deg);        }        100% {          transform: skew(0deg, 0deg);        }      }      @keyframes origin {        0% {          transform-origin: 50% 50%;        }        20% {          transform-origin: 40% 50%;        }        40% {          transform-origin: 60% 40%;        }        60% {          transform-origin: 40% 60%;        }        80% {          transform-origin: 50% 40%;        }        100% {          transform-origin: 50% 50%;        }      }      @keyframes blur {        from {          filter: blur(0em) contrast(100%);        }        to {          filter: blur(0.05em) contrast(200%);        }      }'; document.head.appendChild(style); }      function getDizzy() {        if (          \"matchMedia\" in window &&          \"CSS\" in window &&          CSS.supports(\"animation\", \"var(--primary)\")        ) {          var reducedMotionMediaQuery = window.matchMedia(            \"(prefers-reduced-motion: reduce)\"          );        } else {          return false;        }        if (reducedMotionMediaQuery && reducedMotionMediaQuery.matches) {          if (            window.confirm(              \"Your browser and/or operating system has reduced motion enabled, and an excessive amount of motion is the joke of this bookmarklet. Would you like to continue?\"            )          ) {          } else {            var styleForceReducedMotion = document.createElement(\"style\");            styleForceReducedMotion.innerHTML =              \"@media (prefers-reduced-motion: reduce) { *, ::before, ::after { animation-delay: -1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; background-attachment: initial !important; scroll-behavior: auto !important; transition-duration: 0s !important; transition-delay: 0s !important; } }\";            document.head.appendChild(styleForceReducedMotion);          }        }        var things = document.querySelectorAll(\"*\");        for (var thing of things) {          var time = 5 + Math.floor(Math.random() * Math.floor(30));          thing.style.setProperty(\"--animation-delay\", time * 1.5 + \"s\");          thing.style.setProperty(\"--animation-warp\", time * 2.5 + \"s\");          var deg = Math.random();          thing.style.setProperty(\"--degree-warp\", deg + deg * 0.5 + \"deg\");        }      }    touchFuzzy(); getDizzy();})();","description":"A Super FX2-powered snippet","author":"Cory Birdsong","categories":["CSS","Fun"]}}

{"id":"A11y-tools.com: Hidden content.json-0-1","name":"Visually Hidden?","description":"Reveals text that has been set as visually hidden.","language":"javascript","executionMode":"activate","content":"(function(){var allElements=document.querySelectorAll(\"*\");function findAllVisuallyHiddenElements(){document.querySelector(\"body\").classList.add(\"a11y-tools-active\"),Array.from(allElements).forEach(i=>{cs=getComputedStyle(i);for(var t=!1,e=!1,a=!1,l=!1,o=!1,n=!1,s=!1,d=!1,r=0;r<cs.length;r++)cssProperty=cs[r],cssValue=cs.getPropertyValue(cssProperty),\"clip\"===cssProperty&&\"rect(1px, 1px, 1px, 1px)\"===cssValue&&(t=!0),\"clip-path\"===cssProperty&&\"inset(100%)\"===cssValue&&(e=!0),\"height\"===cssProperty&&\"1px\"===cssValue&&(a=!0),\"overflow-x\"===cssProperty&&\"hidden\"===cssValue&&(l=!0),\"overflow-y\"===cssProperty&&\"hidden\"===cssValue&&(o=!0),\"position\"===cssProperty&&\"absolute\"===cssValue&&(n=!0),\"white-space\"===cssProperty&&\"nowrap\"===cssValue&&(s=!0),\"width\"===cssProperty&&\"1px\"===cssValue&&(d=!0);!0===t&&!0===e&&!0===a&&!0===l&&!0===o&&!0===n&&!0===s&&!0===d&&i.classList.add(\"a11y-tools-was-visually-hidden\");let c=i.classList;c.forEach(t=>{-1!==t.indexOf(\"-offscreen\")&&i.classList.add(\"a11y-tools-was-visually-hidden\")}),(i.classList.contains(\"sr-only\")||i.classList.contains(\"screenreader-only\")||i.classList.contains(\"visually-hidden\")||i.classList.contains(\"visuallyhidden\"))&&i.classList.add(\"a11y-tools-was-visually-hidden\")})}function indicateAriaHiddenElements(i){findAllVisuallyHiddenElements(),!function i(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"VisuallyHiddenStyles\"),t.textContent=`body.a11y-tools-active [aria-hidden=true] {background:black;color:black;}body.a11y-tools-active [aria-hidden=true] img {opacity:0;}body.a11y-tools-active [aria-hidden=true] [aria-hidden=true] {opacity:1}.a11y-tools-was-visually-hidden {clip-path: initial!important;clip: initial!important;height: auto!important;overflow: initial!important;position: initial!important;white-space: initial!important;width: auto!important;opacity:initial!important;z-index:initial!important;background:black!important;color:lime!important;}`,document.head.appendChild(t)}(),document.addEventListener(\"keydown\",function(i){\"q\"===i.key&&(i.preventDefault(),function i(){document.querySelector(\"body\").classList.remove(\"a11y-tools-active\");let t=document.querySelectorAll(\".a11y-tools-was-visually-hidden\");Array.from(t).forEach(i=>{i.classList.remove(\"a11y-tools-was-visually-hidden\")});let e=document.querySelector(\"#VisuallyHiddenStyles\");e&&e.remove()}())})}indicateAriaHiddenElements(document);var iframes=document.querySelectorAll(\"iframe\");Array.from(iframes).forEach(i=>{indicateAriaHiddenElements(i.contentWindow.document)})})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Content"],"folderName":"Hidden content","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Hidden content.json","download":{"name":"Visually Hidden?","language":"javascript","executionMode":"activate","content":"(function(){var allElements=document.querySelectorAll(\"*\");function findAllVisuallyHiddenElements(){document.querySelector(\"body\").classList.add(\"a11y-tools-active\"),Array.from(allElements).forEach(i=>{cs=getComputedStyle(i);for(var t=!1,e=!1,a=!1,l=!1,o=!1,n=!1,s=!1,d=!1,r=0;r<cs.length;r++)cssProperty=cs[r],cssValue=cs.getPropertyValue(cssProperty),\"clip\"===cssProperty&&\"rect(1px, 1px, 1px, 1px)\"===cssValue&&(t=!0),\"clip-path\"===cssProperty&&\"inset(100%)\"===cssValue&&(e=!0),\"height\"===cssProperty&&\"1px\"===cssValue&&(a=!0),\"overflow-x\"===cssProperty&&\"hidden\"===cssValue&&(l=!0),\"overflow-y\"===cssProperty&&\"hidden\"===cssValue&&(o=!0),\"position\"===cssProperty&&\"absolute\"===cssValue&&(n=!0),\"white-space\"===cssProperty&&\"nowrap\"===cssValue&&(s=!0),\"width\"===cssProperty&&\"1px\"===cssValue&&(d=!0);!0===t&&!0===e&&!0===a&&!0===l&&!0===o&&!0===n&&!0===s&&!0===d&&i.classList.add(\"a11y-tools-was-visually-hidden\");let c=i.classList;c.forEach(t=>{-1!==t.indexOf(\"-offscreen\")&&i.classList.add(\"a11y-tools-was-visually-hidden\")}),(i.classList.contains(\"sr-only\")||i.classList.contains(\"screenreader-only\")||i.classList.contains(\"visually-hidden\")||i.classList.contains(\"visuallyhidden\"))&&i.classList.add(\"a11y-tools-was-visually-hidden\")})}function indicateAriaHiddenElements(i){findAllVisuallyHiddenElements(),!function i(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"VisuallyHiddenStyles\"),t.textContent=`body.a11y-tools-active [aria-hidden=true] {background:black;color:black;}body.a11y-tools-active [aria-hidden=true] img {opacity:0;}body.a11y-tools-active [aria-hidden=true] [aria-hidden=true] {opacity:1}.a11y-tools-was-visually-hidden {clip-path: initial!important;clip: initial!important;height: auto!important;overflow: initial!important;position: initial!important;white-space: initial!important;width: auto!important;opacity:initial!important;z-index:initial!important;background:black!important;color:lime!important;}`,document.head.appendChild(t)}(),document.addEventListener(\"keydown\",function(i){\"q\"===i.key&&(i.preventDefault(),function i(){document.querySelector(\"body\").classList.remove(\"a11y-tools-active\");let t=document.querySelectorAll(\".a11y-tools-was-visually-hidden\");Array.from(t).forEach(i=>{i.classList.remove(\"a11y-tools-was-visually-hidden\")});let e=document.querySelector(\"#VisuallyHiddenStyles\");e&&e.remove()}())})}indicateAriaHiddenElements(document);var iframes=document.querySelectorAll(\"iframe\");Array.from(iframes).forEach(i=>{indicateAriaHiddenElements(i.contentWindow.document)})})()","description":"Reveals text that has been set as visually hidden.","author":"Ian Lloyd","categories":["Accessibility","Content"]}}

{"id":"A11y-tools.com: Focus.json-0-1","name":"WTFocus","description":"Provides information about any element as you tab through.","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";function WTFocus(){let e=1,t=\"\",o=document.activeElement,l=document.querySelectorAll('a[href],button,select,input:not([type=\"hidden\"]),textarea,summary,area,[tabindex]:not(#WTFocusPanel):not([tabindex^=\"-1\"]),[contenteditable]:not([contenteditable=\"false\"])'),n=\"background:#fff;color:darkgreen;font-weight:bold;text-decoration:line-through\",a=\"font-weight:bold;color:#99f170;background:#333;display:inline-block;padding:3px;\",i=\"color:pink;background:#333;padding:3px;\",r=\"color:black;background:#fefbe3;font-weight:bold;\",s=\"color:#333;background:#fff;\",u=document.createElement(\"div\"),c=document.createElement(\"div\"),d=\"Accessible name: \",b=\"\",p=!1,m=!1,f=!1,g=!1,h,y=!1,x=!1;function A(){p=!1,m=!1}function $(e){t+=e}function v(e,t,o,l,n){t=t.split(\"<\").join(\"&lt;\").split(\">\").join(\"&gt;\"),b+=\"<li\",(n||l)&&(b+=' class=\"',n&&(b+=\"visible\"),l&&(b+=\"outline\"),b+='\"'),b+=' role=\"listitem\"><span style=\"'+o+'\">',p&&(b+='<span aria-hidden=\"true\">\\uD83D\\uDC49\\uD83C\\uDFFD</span><span class=\"visually-hidden\">Accessible name provided by</span> '),m&&(b+='<span aria-hidden=\"true\">\\uD83D\\uDEA8</span> <span class=\"visually-hidden\">Warning</span>'),b+=e+\"</span>&nbsp;\"+t+\"</li>\\n\",t=t.replace(\"&lt;\",\"<\").replace(\"&gt;\",\">\")}function T(){let e=document.createElement(\"button\");e.textContent=\"Close (Esc)\",e.setAttribute(\"type\",\"button\"),e.setAttribute(\"class\",\"panel-btn\"),e.addEventListener(\"click\",()=>{F()});let o=document.createElement(\"button\");o.textContent=\"Change Mode (M)\",o.setAttribute(\"type\",\"button\"),o.setAttribute(\"class\",\"panel-btn\"),o.addEventListener(\"click\",e=>{_()});let l=document.createElement(\"a\");l.textContent=\"Download summary (S)\",l.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(t)),l.setAttribute(\"download\",\"simple-screen-reader-emulation\"),l.addEventListener(\"click\",e=>{alert('IMPORTANT DISCLAIMER!\\n\\nThis text file is a *very approximate representation* \\nof what this page may be like for screen reader users:\\n\\n• It lists all the focusable elements (at the point \\n  of running the script) but may not include every \\n  element. For example, any element that is temporarily \\n  set to be non-focusable with `tabindex=\"-1\"`, such as \\n  an inactive tab in a group of tab controls, will not \\n  be shown here.\\n• It lists the accessible name and the role \\n  (e.g. link, button)\\n• Where there is an accessible description \\n  (provided by `aria-describedby` or a `title` \\n  attribute), this is included too')}),u.appendChild(e),u.appendChild(o),u.appendChild(l)}function _(){y?(document.querySelector(\"#WTFocusPanel\").classList.remove(\"curtainsMode\"),document.querySelector(\"#WTFocusPanel\").removeAttribute(\"style\"),document.querySelector(\"#WTFocusCurtain\").setAttribute(\"hidden\",\"hidden\"),y=!1,d=\"Accessible name: \"):(document.querySelector(\"#WTFocusPanel\").classList.add(\"curtainsMode\"),document.querySelector(\"#WTFocusCurtain\").removeAttribute(\"hidden\"),y=!0,d=\"\"),S(o),o.focus()}function F(){document.querySelector(\"#WTFocusCurtain\").remove(),document.querySelector(\"#WTFocusPanel\").remove(),document.querySelector(\"#panelStyles\").remove(),document.querySelector(\"#focusStyles\").remove()}function S(e){let t=e.getBoundingClientRect(),o=document.documentElement.scrollTop,l=t.right+20+400,n=u.offsetHeight,a=o+t.top+n,i=window.innerWidth,r=window.innerHeight;y?document.querySelector(\"#WTFocusPanel\").removeAttribute(\"style\"):l>i?(a>r?(u.style.top=\"auto\",u.style.bottom=r-(o+t.bottom)-10+\"px\",u.classList.add(\"toBottom\")):(u.style.top=o+t.top+\"px\",u.style.bottom=\"auto\",u.classList.remove(\"toBottom\")),u.style.left=\"auto\",u.style.right=i-t.left+20-7+\"px\",u.classList.add(\"toLeft\")):(a>r?(u.style.top=\"auto\",u.style.bottom=r-(o+t.bottom)-10+\"px\",u.classList.add(\"toBottom\")):(u.style.top=o+t.top+\"px\",u.style.bottom=\"auto\",u.classList.remove(\"toBottom\")),u.style.left=t.right+20-7+\"px\",u.style.right=\"auto\",u.classList.remove(\"toLeft\"))}!function e(){let t=document.createElement(\"style\");t.setAttribute(\"type\",\"text/css\"),t.setAttribute(\"id\",\"panelStyles\"),t.textContent=\".dupeAccName {outline:4px dashed #CC3300!important;outline-offset:7px!important;overflow:visible;} .WTFocusTempFocusStyle:focus {outline:7px solid black!important;outline-offset:7px!important;overflow:visible;/*background:yellow!important;color:black!important;*/} .WTFocusTempFocusStyle.dupeAccName:focus {outline-color:#CC3300!important;} .visually-hidden {clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;}#WTFocusCurtain {background:black;position: fixed;top: 0;bottom: 0;left: 0;right: 0;z-index:49999}\",document.querySelector(\"body\").appendChild(t)}(),document.querySelector(\"#WTFocusCurtain\")&&F(),b=\"\",function e(t){let o=document.createElement(\"style\");o.setAttribute(\"type\",\"text/css\"),o.setAttribute(\"id\",\"focusStyles\"),o.textContent=\"#WTFocusPanel.error {background:darkred;} #WTFocusPanel.warning {background:#CC3300;} #WTFocusPanel.curtainsMode.error {background:black;} #WTFocusPanel.curtainsMode {z-index:50000;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);} #WTFocusPanel.curtainsMode.warning {background:black;} #WTFocusPanel[hidden] {display:none;} #WTFocusPanel * {text-align:left} #WTFocusPanel {border:2px solid #fff;z-index:1000;text-shadow:none;font-family:sans-serif;display:block;text-align:left;position: absolute;z-index:10000;background: black;padding: 20px 20px;width:400px;font-size:16px;} #WTFocusPanel button {font-weight:bold;background:none;color:#fff;padding:3px 10px;font-size:14px;border:1px solid #fff;display:inline-block;margin:10px 1em -10px 0;} #WTFocusPanel ul,#WTFocusPanel li {margin:0;padding:0;list-style:none} #WTFocusPanel li {margin:3px 0;background:#fff;color:#333;padding:2px} #WTFocusPanel li.outline {outline:4px solid rgb(58, 190, 58);outline-offset:-4px;padding:8px} #WTFocusPanel.error:before {background:darkred} #WTFocusPanel.warning:before {background:#CC3300} #WTFocusPanel:before {content:'';display:block;height:20px;width:20px;transform:rotate(45deg);position:absolute;background:#000;left:-12px;top:3px;border:2px solid #fff;border-right:none;border-top:none;} #WTFocusPanel.toBottom:before {top:auto;bottom:3px} #WTFocusPanel.toLeft:before {left:auto;right:-12px;border:2px solid #fff;border-left:none;border-bottom:none;} #WTFocusPanel.curtainsMode {outline:10px solid orange;} #WTFocusPanel.curtainsMode:before {display:none;} #WTFocusPanel.curtainsMode li {display:none;} #WTFocusPanel.curtainsMode li.visible {display:block;} #WTFocusPanel.curtainsMode li span {display:none!important;} #WTFocusPanel details summary {color:white} #WTFocusPanel.curtainsMode details {display:none}#WTFocusPanel a[download]{display:block;margin:0.5em 0;color:#fff;text-decoration:underline;border:none;padding:0;}\",document.querySelector(\"head\").appendChild(o)}(400),c.setAttribute(\"id\",\"WTFocusCurtain\"),c.setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"body\").appendChild(c),u.setAttribute(\"id\",\"WTFocusPanel\"),y&&u.setAttribute(\"class\",\"curtainsMode\"),u.setAttribute(\"aria-live\",\"polite\"),u.setAttribute(\"tabindex\",\"-1\"),u.setAttribute(\"hidden\",\"hidden\"),u.setAttribute(\"role\",\"region\"),u.setAttribute(\"aria-label\",\"Accessibility properties panel\"),document.querySelector(\"body\").appendChild(u),window.addEventListener(\"keyup\",e=>{\"Escape\"===e.key&&document.querySelector(\"#WTFocusPanel\")&&F()}),window.addEventListener(\"keyup\",e=>{\"m\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&_(),\"d\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&(document.querySelector(\"#WTFocusPanel summary\").click(),x=!x),\"s\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&document.querySelector(\"#WTFocusPanel a[download]\").click()}),T();let W=[];Array.from(l).forEach(function(c){c.classList.add(\"WTFocusTempFocusStyle\");let h=c.querySelectorAll(\"style\");Array.from(h).forEach(function(e){e.remove()}),c.addEventListener(\"focus\",()=>{let h=c.getAttribute(\"role\"),y=c.tagName.toLowerCase();if(h);else if((\"article\"==y||\"button\"==y||\"dialog\"==y||\"figure\"==y||\"img\"==y||\"main\"==y||\"math\"==y)&&(h=y),\"summary\"==y&&(h=\"button\"),\"aside\"==y&&(h=\"complementary\"),\"dd\"==y&&(h=\"definition\"),\"html\"==y&&(h=\"document\"),(\"details\"==y||\"fieldset\"==y||\"optgroup\"==y)&&(h=\"group\"),(\"menu\"==y||\"ol\"==y||\"ul\"==y)&&(h=\"list\"),\"datalist\"==y&&(h=\"listbox\"),\"li\"==y&&(h=\"listitem\"),\"nav\"==y&&(h=\"navigation\"),\"progress\"==y&&(h=\"progressbar\"),\"hr\"==y&&(h=\"separator\"),\"output\"==y&&(h=\"status\"),(\"dfn\"==y||\"dt\"==y)&&(h=\"term\"),\"a\"==y&&(h=\"link\"),\"select\"==y&&(h=\"listbox\"),\"textarea\"==y&&(h=\"textbox\"),\"input\"==y){let $=c.getAttribute(\"type\").toLowerCase();\"email\"===$&&(h=\"textbox\"),\"text\"===$&&(h=\"textbox\"),\"range\"===$&&(h=\"slider\"),\"number\"===$&&(h=\"spinbutton\"),(\"checkbox\"===$||\"radio\"===$)&&(h=$),(\"button\"===$||\"image\"===$||\"reset\"===$||\"submit\"===$)&&(h=\"button\")}o=c,Array.from(l).forEach(function(e){e.classList.remove(\"dupeAccName\")});let _=!1;p=!1,m=!1;let F=c.querySelectorAll(\"img, [role='image'][aria-label], [role='img'][aria-label]\");(_=F.length>0)&&Array.from(F).forEach(function(e){let t=document.createElement(\"SPAN\");t.setAttribute(\"class\",\"visually-hidden\"),t.setAttribute(\"style\",\"clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;\"),t.setAttribute(\"data-temp-node\",\"true\"),e.getAttribute(\"alt\")&&(t.textContent=\" \"+e.getAttribute(\"alt\")+\" \"),e.getAttribute(\"role\")&&e.getAttribute(\"aria-label\")&&(t.textContent=\" \"+e.getAttribute(\"aria-label\")+\" \"),function e(t,o){o.parentNode.insertBefore(t,o.nextSibling)}(t,e)}),setTimeout(function(){c.classList.add(\"WTFocusTempFocusStyle\")},100),b=\"\";let C=c.tagName.toLowerCase(),N=c.getAttribute(\"role\");N&&(N=c.getAttribute(\"role\").toLowerCase());let P=\"<\"+C+\">\",w=!1,q=!1,L=!1;N&&(P=\"<\"+C+' role=\"'+N+'\">',(\"link\"===N&&\"a\"===C||\"button\"===N&&\"button\"===C||\"image\"===N&&\"img\"===C||\"img\"===N&&\"img\"===C||\"navigation\"===N&&\"nav\"===C||\"heading\"===N&&(\"h1\"===C||\"h2\"===C||\"h3\"===C||\"h4\"===C||\"h5\"===C||\"h6\"===C))&&(w=!0),(\"link\"!==N||\"a\"===C)&&(\"button\"!==N||\"button\"===C)&&(\"image\"!==N&&\"image\"!==N||\"img\"===C)&&(\"navigation\"!==N||\"nav\"===C)&&(\"heading\"!==N||\"h1\"===C||\"h2\"===C||\"h3\"===C||\"h4\"===C||\"h5\"===C||\"h6\"===C)||(L=!0)),c.getAttribute(\"aria-describedby\")&&(q=!0);let E=c.textContent,M=c.ariaLabel,B=c.getAttribute(\"aria-labelledby\"),I=c.getAttribute(\"placeholder\"),D,z,H=\"\",R=\"\",j=c.getAttribute(\"value\"),V=c.getAttribute(\"title\"),O=\"\",Y=\"\",G=!1,J=!1,K=\"\",Q=!1;S(c),E=E.trim();let U=function e(t,o){for(;(t=t.parentElement)&&!(t.matches||t.matchesSelector).call(t,o););return t}(c,\"label\");if(U&&(G=!0,O=Y=U.textContent.trim()),c.getAttribute(\"id\")){let X=document.querySelector(\"[for='\"+c.getAttribute(\"id\")+\"']\");X&&(J=!0,Y=X.textContent)}if(G||J||(Y=\"N/A\"),E||(E=\"N/A\"),j||(j=\"N/A\"),V||(V=\"N/A\"),I||(I=\"N/A\"),M||(M=\"N/A\"),B){D=B;let Z=D.split(\" \");Z.length>1?(Array.from(Z).forEach(function(e){document.querySelector(\"#\"+e)?H+=document.querySelector(\"#\"+e).textContent+\" \":H+=\"❓❓❓ \"}),H=H.trim()):H=document.querySelector(\"#\"+D).textContent}else B=\"N/A\";let ee=c.querySelectorAll(\"[aria-hidden='true'],[role='presentation']\"),et=E;if(ee.length>0&&(Q=!0,Array.from(ee).forEach(function(e){let t=e.textContent;\"\"!==t&&(et=et.split(t).join(\" \"))}),et=et.trim()),\"input\"===C){let eo=c.getAttribute(\"type\");\"submit\"===eo&&\"N/A\"===j&&(O=\"Submit\",K=\"Not provided (using default)\"),\"image\"===eo&&\"N/A\"===j&&(O=\"Submit\",K=\"Not provided (using default)\"),\"cancel\"===eo&&\"N/A\"===j&&(O=\"Cancel\",K=\"Not provided (using default)\")}if(\"N/A\"!==V&&(O=V,K=\"title attribute\"),\"N/A\"!==j&&(O=j,K=\"value attribute\"),\"N/A\"!==I&&(O=I,K=\"placeholder attribute\"),\"N/A\"!==E&&(O=et,K=\"Inner text content\"),\"N/A\"!==Y&&(O=Y,K=\"<label> text\"),\"N/A\"!==M&&(O=M,K=\"aria-label\"),\"N/A\"!==B&&(O=H,K=\"aria-labelledby\"),g=(f=\"true\"===c.getAttribute(\"data-dupe\"))&&\"\"===O,\"\"===O||f){if(\"\"===O){var el,en,ea,ei;m=!0,u.classList.add(\"error\"),v(d+\"No accessible name!\",\"\",i),t+=\"No accessible name!\",v(\"Accessible Name Source: N/A\",\"\",i)}if(f&&\"\"!==O){u.classList.add(\"warning\");let er=document.querySelectorAll(\"[data-accname='\"+O+\"']\"),es=er.length;v(d,O,i,!1,!0),t+=ei=e+\" \"+O,e++,g||(Array.from(er).forEach(function(e){e.classList.add(\"dupeAccName\")}),v(\"Duplicate warning!\",es+\" elements on page have the same accessible name\",i)),Array.from(er).forEach(function(e){}),v(\"Accessible Name Source: \",K,i)}}else u.classList.remove(\"error\"),u.classList.remove(\"warning\"),v(d,O,a,!1,!0),t+=el=e+\" \"+O,e++,v(\"Accessible Name Source: \",K,a);if(m=!1,v(\"Role: \",h,a,!1,!0),t+=en=\", \"+h,q){z=c.getAttribute(\"aria-describedby\");let eu=z.split(\" \");eu.length>1?(Array.from(eu).forEach(function(e){document.querySelector(\"#\"+e)?R+=document.querySelector(\"#\"+e).textContent+\" \":R+=\"❓❓❓ \"}),R=R.trim()):R=document.querySelector(\"#\"+z).textContent,v(\"Accessible Description: \",R,a),t+=ea=\", \"+R+\"\\n\"}else{v(\"Accessible Description: \",\"N/A\",a);t+=\"\\n\"}v(\"HTML Element: \",P,a),b+=\"</ul>\\n\",b+=\"<details\",x&&(b+=\" open\"),b+=\">\\n\",b+=\"<summary>More details (D)</summary>\\n\",b+='<ul role=\"list\">\\n',w&&(m=!0,v(\"Superfluous `role` attribute\",\"\",i)),L&&(m=!0,v(\"Better to use a native HTML element\",\"\",i)),E=E.trim(),Y=Y.trim(),V=V.trim(),M=M.trim(),B=B.trim(),A(),\"placeholder attribute\"===K?(p=!0,v(\"@placeholder: \",I,r,!0)):\"N/A\"===I?v(\"@placeholder: \",I,s):v(\"@placeholder: \",I,n),A(),\"title attribute\"===K?(p=!0,v(\"@title: \",V,r,!0)):\"N/A\"===V?v(\"@title: \",V,s):v(\"@title: \",V,n),A(),\"value attribute\"===K?(p=!0,v(\"@value: \",j,r,!0)):\"N/A\"===j?v(\"@value: \",j,s):v(\"@value: \",j,n),A(),\"Inner text content\"===K?(p=!0,_?v(\"Inner text content (includes image alt): \",E,r,!0):v(\"Inner text content: \",E,r,!0),Q&&v(\"! elements hidden to AT removed\",\"\",r)):\"N/A\"===E?v(\"Text Content: \",E,s):v(\"Text Content: \",E,n),A(),\"<label> text\"===K?(p=!0,v(\"Visible `label` text: \",Y,r,!0)):\"N/A\"===Y?v(\"Visible `label` text: \",Y,s):v(\"Visible `label` text: \",Y,n),A(),\"aria-label\"===K?M===E?(m=!0,v(\"`aria-label` content is same as inner text content\",\"\",i)):(p=!0,v(\"@aria-label value: \",M,r,!0)):\"N/A\"===M?v(\"@aria-label value: \",M,s):v(\"@aria-label value: \",M,n),A(),\"aria-labelledby\"===K?H===E?(m=!0,v(\"`aria-labelledby` source content is same as inner text content\",\"\",i)):(p=!0,v(\"@aria-labelledby value: \",B,r,!0),v(\"@aria-labelledby sources: \",H,r)):(v(\"@aria-labelledby value: \",B,s),v(\"@aria-labelledby sources: \",\"N/A\",s)),document.querySelector(\"#WTFocusPanel\").innerHTML='<ul role=\"list\">'+b+\"</ul></details>\",document.querySelector(\"#WTFocusPanel\").removeAttribute(\"hidden\"),T();let ec=document.querySelectorAll(\"[data-temp-node]\");Array.from(ec).forEach(function(e){e.remove()}),c.setAttribute(\"data-accname\",O),k||function e(t,o){let l=!1;if(Array.from(W).forEach(function(e){e===t&&(l=!0)}),l){o.setAttribute(\"data-dupe\",\"true\");let n=document.querySelector(\"[data-accname='\"+t+\"']\");n.setAttribute(\"data-dupe\",\"true\")}else W.push(t)}(O,c)})});let k=!1;!function e(){if(h=document.activeElement,Array.from(l).forEach(function(e){document.activeElement===e&&e.blur(),e.focus(),console.log(\"-------------------\")}),k=!0,\"BODY\"===h.tagName){let t=document.querySelector(\"body\");t.setAttribute(\"tabindex\",\"-1\"),t.focus(),document.querySelector(\"#WTFocusPanel\").setAttribute(\"hidden\",\"hidden\")}else h.focus()}(),console.log(t)}WTFocus()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["Accessibility","Focus"],"folderName":"Focus","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: Focus.json","download":{"name":"WTFocus","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";function WTFocus(){let e=1,t=\"\",o=document.activeElement,l=document.querySelectorAll('a[href],button,select,input:not([type=\"hidden\"]),textarea,summary,area,[tabindex]:not(#WTFocusPanel):not([tabindex^=\"-1\"]),[contenteditable]:not([contenteditable=\"false\"])'),n=\"background:#fff;color:darkgreen;font-weight:bold;text-decoration:line-through\",a=\"font-weight:bold;color:#99f170;background:#333;display:inline-block;padding:3px;\",i=\"color:pink;background:#333;padding:3px;\",r=\"color:black;background:#fefbe3;font-weight:bold;\",s=\"color:#333;background:#fff;\",u=document.createElement(\"div\"),c=document.createElement(\"div\"),d=\"Accessible name: \",b=\"\",p=!1,m=!1,f=!1,g=!1,h,y=!1,x=!1;function A(){p=!1,m=!1}function $(e){t+=e}function v(e,t,o,l,n){t=t.split(\"<\").join(\"&lt;\").split(\">\").join(\"&gt;\"),b+=\"<li\",(n||l)&&(b+=' class=\"',n&&(b+=\"visible\"),l&&(b+=\"outline\"),b+='\"'),b+=' role=\"listitem\"><span style=\"'+o+'\">',p&&(b+='<span aria-hidden=\"true\">\\uD83D\\uDC49\\uD83C\\uDFFD</span><span class=\"visually-hidden\">Accessible name provided by</span> '),m&&(b+='<span aria-hidden=\"true\">\\uD83D\\uDEA8</span> <span class=\"visually-hidden\">Warning</span>'),b+=e+\"</span>&nbsp;\"+t+\"</li>\\n\",t=t.replace(\"&lt;\",\"<\").replace(\"&gt;\",\">\")}function T(){let e=document.createElement(\"button\");e.textContent=\"Close (Esc)\",e.setAttribute(\"type\",\"button\"),e.setAttribute(\"class\",\"panel-btn\"),e.addEventListener(\"click\",()=>{F()});let o=document.createElement(\"button\");o.textContent=\"Change Mode (M)\",o.setAttribute(\"type\",\"button\"),o.setAttribute(\"class\",\"panel-btn\"),o.addEventListener(\"click\",e=>{_()});let l=document.createElement(\"a\");l.textContent=\"Download summary (S)\",l.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(t)),l.setAttribute(\"download\",\"simple-screen-reader-emulation\"),l.addEventListener(\"click\",e=>{alert('IMPORTANT DISCLAIMER!\\n\\nThis text file is a *very approximate representation* \\nof what this page may be like for screen reader users:\\n\\n• It lists all the focusable elements (at the point \\n  of running the script) but may not include every \\n  element. For example, any element that is temporarily \\n  set to be non-focusable with `tabindex=\"-1\"`, such as \\n  an inactive tab in a group of tab controls, will not \\n  be shown here.\\n• It lists the accessible name and the role \\n  (e.g. link, button)\\n• Where there is an accessible description \\n  (provided by `aria-describedby` or a `title` \\n  attribute), this is included too')}),u.appendChild(e),u.appendChild(o),u.appendChild(l)}function _(){y?(document.querySelector(\"#WTFocusPanel\").classList.remove(\"curtainsMode\"),document.querySelector(\"#WTFocusPanel\").removeAttribute(\"style\"),document.querySelector(\"#WTFocusCurtain\").setAttribute(\"hidden\",\"hidden\"),y=!1,d=\"Accessible name: \"):(document.querySelector(\"#WTFocusPanel\").classList.add(\"curtainsMode\"),document.querySelector(\"#WTFocusCurtain\").removeAttribute(\"hidden\"),y=!0,d=\"\"),S(o),o.focus()}function F(){document.querySelector(\"#WTFocusCurtain\").remove(),document.querySelector(\"#WTFocusPanel\").remove(),document.querySelector(\"#panelStyles\").remove(),document.querySelector(\"#focusStyles\").remove()}function S(e){let t=e.getBoundingClientRect(),o=document.documentElement.scrollTop,l=t.right+20+400,n=u.offsetHeight,a=o+t.top+n,i=window.innerWidth,r=window.innerHeight;y?document.querySelector(\"#WTFocusPanel\").removeAttribute(\"style\"):l>i?(a>r?(u.style.top=\"auto\",u.style.bottom=r-(o+t.bottom)-10+\"px\",u.classList.add(\"toBottom\")):(u.style.top=o+t.top+\"px\",u.style.bottom=\"auto\",u.classList.remove(\"toBottom\")),u.style.left=\"auto\",u.style.right=i-t.left+20-7+\"px\",u.classList.add(\"toLeft\")):(a>r?(u.style.top=\"auto\",u.style.bottom=r-(o+t.bottom)-10+\"px\",u.classList.add(\"toBottom\")):(u.style.top=o+t.top+\"px\",u.style.bottom=\"auto\",u.classList.remove(\"toBottom\")),u.style.left=t.right+20-7+\"px\",u.style.right=\"auto\",u.classList.remove(\"toLeft\"))}!function e(){let t=document.createElement(\"style\");t.setAttribute(\"type\",\"text/css\"),t.setAttribute(\"id\",\"panelStyles\"),t.textContent=\".dupeAccName {outline:4px dashed #CC3300!important;outline-offset:7px!important;overflow:visible;} .WTFocusTempFocusStyle:focus {outline:7px solid black!important;outline-offset:7px!important;overflow:visible;/*background:yellow!important;color:black!important;*/} .WTFocusTempFocusStyle.dupeAccName:focus {outline-color:#CC3300!important;} .visually-hidden {clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;}#WTFocusCurtain {background:black;position: fixed;top: 0;bottom: 0;left: 0;right: 0;z-index:49999}\",document.querySelector(\"body\").appendChild(t)}(),document.querySelector(\"#WTFocusCurtain\")&&F(),b=\"\",function e(t){let o=document.createElement(\"style\");o.setAttribute(\"type\",\"text/css\"),o.setAttribute(\"id\",\"focusStyles\"),o.textContent=\"#WTFocusPanel.error {background:darkred;} #WTFocusPanel.warning {background:#CC3300;} #WTFocusPanel.curtainsMode.error {background:black;} #WTFocusPanel.curtainsMode {z-index:50000;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);} #WTFocusPanel.curtainsMode.warning {background:black;} #WTFocusPanel[hidden] {display:none;} #WTFocusPanel * {text-align:left} #WTFocusPanel {border:2px solid #fff;z-index:1000;text-shadow:none;font-family:sans-serif;display:block;text-align:left;position: absolute;z-index:10000;background: black;padding: 20px 20px;width:400px;font-size:16px;} #WTFocusPanel button {font-weight:bold;background:none;color:#fff;padding:3px 10px;font-size:14px;border:1px solid #fff;display:inline-block;margin:10px 1em -10px 0;} #WTFocusPanel ul,#WTFocusPanel li {margin:0;padding:0;list-style:none} #WTFocusPanel li {margin:3px 0;background:#fff;color:#333;padding:2px} #WTFocusPanel li.outline {outline:4px solid rgb(58, 190, 58);outline-offset:-4px;padding:8px} #WTFocusPanel.error:before {background:darkred} #WTFocusPanel.warning:before {background:#CC3300} #WTFocusPanel:before {content:'';display:block;height:20px;width:20px;transform:rotate(45deg);position:absolute;background:#000;left:-12px;top:3px;border:2px solid #fff;border-right:none;border-top:none;} #WTFocusPanel.toBottom:before {top:auto;bottom:3px} #WTFocusPanel.toLeft:before {left:auto;right:-12px;border:2px solid #fff;border-left:none;border-bottom:none;} #WTFocusPanel.curtainsMode {outline:10px solid orange;} #WTFocusPanel.curtainsMode:before {display:none;} #WTFocusPanel.curtainsMode li {display:none;} #WTFocusPanel.curtainsMode li.visible {display:block;} #WTFocusPanel.curtainsMode li span {display:none!important;} #WTFocusPanel details summary {color:white} #WTFocusPanel.curtainsMode details {display:none}#WTFocusPanel a[download]{display:block;margin:0.5em 0;color:#fff;text-decoration:underline;border:none;padding:0;}\",document.querySelector(\"head\").appendChild(o)}(400),c.setAttribute(\"id\",\"WTFocusCurtain\"),c.setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"body\").appendChild(c),u.setAttribute(\"id\",\"WTFocusPanel\"),y&&u.setAttribute(\"class\",\"curtainsMode\"),u.setAttribute(\"aria-live\",\"polite\"),u.setAttribute(\"tabindex\",\"-1\"),u.setAttribute(\"hidden\",\"hidden\"),u.setAttribute(\"role\",\"region\"),u.setAttribute(\"aria-label\",\"Accessibility properties panel\"),document.querySelector(\"body\").appendChild(u),window.addEventListener(\"keyup\",e=>{\"Escape\"===e.key&&document.querySelector(\"#WTFocusPanel\")&&F()}),window.addEventListener(\"keyup\",e=>{\"m\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&_(),\"d\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&(document.querySelector(\"#WTFocusPanel summary\").click(),x=!x),\"s\"===e.key.toLowerCase()&&document.querySelector(\"#WTFocusPanel\")&&document.querySelector(\"#WTFocusPanel a[download]\").click()}),T();let W=[];Array.from(l).forEach(function(c){c.classList.add(\"WTFocusTempFocusStyle\");let h=c.querySelectorAll(\"style\");Array.from(h).forEach(function(e){e.remove()}),c.addEventListener(\"focus\",()=>{let h=c.getAttribute(\"role\"),y=c.tagName.toLowerCase();if(h);else if((\"article\"==y||\"button\"==y||\"dialog\"==y||\"figure\"==y||\"img\"==y||\"main\"==y||\"math\"==y)&&(h=y),\"summary\"==y&&(h=\"button\"),\"aside\"==y&&(h=\"complementary\"),\"dd\"==y&&(h=\"definition\"),\"html\"==y&&(h=\"document\"),(\"details\"==y||\"fieldset\"==y||\"optgroup\"==y)&&(h=\"group\"),(\"menu\"==y||\"ol\"==y||\"ul\"==y)&&(h=\"list\"),\"datalist\"==y&&(h=\"listbox\"),\"li\"==y&&(h=\"listitem\"),\"nav\"==y&&(h=\"navigation\"),\"progress\"==y&&(h=\"progressbar\"),\"hr\"==y&&(h=\"separator\"),\"output\"==y&&(h=\"status\"),(\"dfn\"==y||\"dt\"==y)&&(h=\"term\"),\"a\"==y&&(h=\"link\"),\"select\"==y&&(h=\"listbox\"),\"textarea\"==y&&(h=\"textbox\"),\"input\"==y){let $=c.getAttribute(\"type\").toLowerCase();\"email\"===$&&(h=\"textbox\"),\"text\"===$&&(h=\"textbox\"),\"range\"===$&&(h=\"slider\"),\"number\"===$&&(h=\"spinbutton\"),(\"checkbox\"===$||\"radio\"===$)&&(h=$),(\"button\"===$||\"image\"===$||\"reset\"===$||\"submit\"===$)&&(h=\"button\")}o=c,Array.from(l).forEach(function(e){e.classList.remove(\"dupeAccName\")});let _=!1;p=!1,m=!1;let F=c.querySelectorAll(\"img, [role='image'][aria-label], [role='img'][aria-label]\");(_=F.length>0)&&Array.from(F).forEach(function(e){let t=document.createElement(\"SPAN\");t.setAttribute(\"class\",\"visually-hidden\"),t.setAttribute(\"style\",\"clip-path: inset(100%);clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute;white-space: nowrap;width: 1px;\"),t.setAttribute(\"data-temp-node\",\"true\"),e.getAttribute(\"alt\")&&(t.textContent=\" \"+e.getAttribute(\"alt\")+\" \"),e.getAttribute(\"role\")&&e.getAttribute(\"aria-label\")&&(t.textContent=\" \"+e.getAttribute(\"aria-label\")+\" \"),function e(t,o){o.parentNode.insertBefore(t,o.nextSibling)}(t,e)}),setTimeout(function(){c.classList.add(\"WTFocusTempFocusStyle\")},100),b=\"\";let C=c.tagName.toLowerCase(),N=c.getAttribute(\"role\");N&&(N=c.getAttribute(\"role\").toLowerCase());let P=\"<\"+C+\">\",w=!1,q=!1,L=!1;N&&(P=\"<\"+C+' role=\"'+N+'\">',(\"link\"===N&&\"a\"===C||\"button\"===N&&\"button\"===C||\"image\"===N&&\"img\"===C||\"img\"===N&&\"img\"===C||\"navigation\"===N&&\"nav\"===C||\"heading\"===N&&(\"h1\"===C||\"h2\"===C||\"h3\"===C||\"h4\"===C||\"h5\"===C||\"h6\"===C))&&(w=!0),(\"link\"!==N||\"a\"===C)&&(\"button\"!==N||\"button\"===C)&&(\"image\"!==N&&\"image\"!==N||\"img\"===C)&&(\"navigation\"!==N||\"nav\"===C)&&(\"heading\"!==N||\"h1\"===C||\"h2\"===C||\"h3\"===C||\"h4\"===C||\"h5\"===C||\"h6\"===C)||(L=!0)),c.getAttribute(\"aria-describedby\")&&(q=!0);let E=c.textContent,M=c.ariaLabel,B=c.getAttribute(\"aria-labelledby\"),I=c.getAttribute(\"placeholder\"),D,z,H=\"\",R=\"\",j=c.getAttribute(\"value\"),V=c.getAttribute(\"title\"),O=\"\",Y=\"\",G=!1,J=!1,K=\"\",Q=!1;S(c),E=E.trim();let U=function e(t,o){for(;(t=t.parentElement)&&!(t.matches||t.matchesSelector).call(t,o););return t}(c,\"label\");if(U&&(G=!0,O=Y=U.textContent.trim()),c.getAttribute(\"id\")){let X=document.querySelector(\"[for='\"+c.getAttribute(\"id\")+\"']\");X&&(J=!0,Y=X.textContent)}if(G||J||(Y=\"N/A\"),E||(E=\"N/A\"),j||(j=\"N/A\"),V||(V=\"N/A\"),I||(I=\"N/A\"),M||(M=\"N/A\"),B){D=B;let Z=D.split(\" \");Z.length>1?(Array.from(Z).forEach(function(e){document.querySelector(\"#\"+e)?H+=document.querySelector(\"#\"+e).textContent+\" \":H+=\"❓❓❓ \"}),H=H.trim()):H=document.querySelector(\"#\"+D).textContent}else B=\"N/A\";let ee=c.querySelectorAll(\"[aria-hidden='true'],[role='presentation']\"),et=E;if(ee.length>0&&(Q=!0,Array.from(ee).forEach(function(e){let t=e.textContent;\"\"!==t&&(et=et.split(t).join(\" \"))}),et=et.trim()),\"input\"===C){let eo=c.getAttribute(\"type\");\"submit\"===eo&&\"N/A\"===j&&(O=\"Submit\",K=\"Not provided (using default)\"),\"image\"===eo&&\"N/A\"===j&&(O=\"Submit\",K=\"Not provided (using default)\"),\"cancel\"===eo&&\"N/A\"===j&&(O=\"Cancel\",K=\"Not provided (using default)\")}if(\"N/A\"!==V&&(O=V,K=\"title attribute\"),\"N/A\"!==j&&(O=j,K=\"value attribute\"),\"N/A\"!==I&&(O=I,K=\"placeholder attribute\"),\"N/A\"!==E&&(O=et,K=\"Inner text content\"),\"N/A\"!==Y&&(O=Y,K=\"<label> text\"),\"N/A\"!==M&&(O=M,K=\"aria-label\"),\"N/A\"!==B&&(O=H,K=\"aria-labelledby\"),g=(f=\"true\"===c.getAttribute(\"data-dupe\"))&&\"\"===O,\"\"===O||f){if(\"\"===O){var el,en,ea,ei;m=!0,u.classList.add(\"error\"),v(d+\"No accessible name!\",\"\",i),t+=\"No accessible name!\",v(\"Accessible Name Source: N/A\",\"\",i)}if(f&&\"\"!==O){u.classList.add(\"warning\");let er=document.querySelectorAll(\"[data-accname='\"+O+\"']\"),es=er.length;v(d,O,i,!1,!0),t+=ei=e+\" \"+O,e++,g||(Array.from(er).forEach(function(e){e.classList.add(\"dupeAccName\")}),v(\"Duplicate warning!\",es+\" elements on page have the same accessible name\",i)),Array.from(er).forEach(function(e){}),v(\"Accessible Name Source: \",K,i)}}else u.classList.remove(\"error\"),u.classList.remove(\"warning\"),v(d,O,a,!1,!0),t+=el=e+\" \"+O,e++,v(\"Accessible Name Source: \",K,a);if(m=!1,v(\"Role: \",h,a,!1,!0),t+=en=\", \"+h,q){z=c.getAttribute(\"aria-describedby\");let eu=z.split(\" \");eu.length>1?(Array.from(eu).forEach(function(e){document.querySelector(\"#\"+e)?R+=document.querySelector(\"#\"+e).textContent+\" \":R+=\"❓❓❓ \"}),R=R.trim()):R=document.querySelector(\"#\"+z).textContent,v(\"Accessible Description: \",R,a),t+=ea=\", \"+R+\"\\n\"}else{v(\"Accessible Description: \",\"N/A\",a);t+=\"\\n\"}v(\"HTML Element: \",P,a),b+=\"</ul>\\n\",b+=\"<details\",x&&(b+=\" open\"),b+=\">\\n\",b+=\"<summary>More details (D)</summary>\\n\",b+='<ul role=\"list\">\\n',w&&(m=!0,v(\"Superfluous `role` attribute\",\"\",i)),L&&(m=!0,v(\"Better to use a native HTML element\",\"\",i)),E=E.trim(),Y=Y.trim(),V=V.trim(),M=M.trim(),B=B.trim(),A(),\"placeholder attribute\"===K?(p=!0,v(\"@placeholder: \",I,r,!0)):\"N/A\"===I?v(\"@placeholder: \",I,s):v(\"@placeholder: \",I,n),A(),\"title attribute\"===K?(p=!0,v(\"@title: \",V,r,!0)):\"N/A\"===V?v(\"@title: \",V,s):v(\"@title: \",V,n),A(),\"value attribute\"===K?(p=!0,v(\"@value: \",j,r,!0)):\"N/A\"===j?v(\"@value: \",j,s):v(\"@value: \",j,n),A(),\"Inner text content\"===K?(p=!0,_?v(\"Inner text content (includes image alt): \",E,r,!0):v(\"Inner text content: \",E,r,!0),Q&&v(\"! elements hidden to AT removed\",\"\",r)):\"N/A\"===E?v(\"Text Content: \",E,s):v(\"Text Content: \",E,n),A(),\"<label> text\"===K?(p=!0,v(\"Visible `label` text: \",Y,r,!0)):\"N/A\"===Y?v(\"Visible `label` text: \",Y,s):v(\"Visible `label` text: \",Y,n),A(),\"aria-label\"===K?M===E?(m=!0,v(\"`aria-label` content is same as inner text content\",\"\",i)):(p=!0,v(\"@aria-label value: \",M,r,!0)):\"N/A\"===M?v(\"@aria-label value: \",M,s):v(\"@aria-label value: \",M,n),A(),\"aria-labelledby\"===K?H===E?(m=!0,v(\"`aria-labelledby` source content is same as inner text content\",\"\",i)):(p=!0,v(\"@aria-labelledby value: \",B,r,!0),v(\"@aria-labelledby sources: \",H,r)):(v(\"@aria-labelledby value: \",B,s),v(\"@aria-labelledby sources: \",\"N/A\",s)),document.querySelector(\"#WTFocusPanel\").innerHTML='<ul role=\"list\">'+b+\"</ul></details>\",document.querySelector(\"#WTFocusPanel\").removeAttribute(\"hidden\"),T();let ec=document.querySelectorAll(\"[data-temp-node]\");Array.from(ec).forEach(function(e){e.remove()}),c.setAttribute(\"data-accname\",O),k||function e(t,o){let l=!1;if(Array.from(W).forEach(function(e){e===t&&(l=!0)}),l){o.setAttribute(\"data-dupe\",\"true\");let n=document.querySelector(\"[data-accname='\"+t+\"']\");n.setAttribute(\"data-dupe\",\"true\")}else W.push(t)}(O,c)})});let k=!1;!function e(){if(h=document.activeElement,Array.from(l).forEach(function(e){document.activeElement===e&&e.blur(),e.focus(),console.log(\"-------------------\")}),k=!0,\"BODY\"===h.tagName){let t=document.querySelector(\"body\");t.setAttribute(\"tabindex\",\"-1\"),t.focus(),document.querySelector(\"#WTFocusPanel\").setAttribute(\"hidden\",\"hidden\")}else h.focus()}(),console.log(t)}WTFocus()})()","description":"Provides information about any element as you tab through.","author":"Ian Lloyd","categories":["Accessibility","Focus"]}}

{"id":"A11y-tools.com: DOM manipulation.json-0-4","name":"Xpath & Source Getter","description":"Get XPATH and formatted HTML source of any part of the page with a single click (also keyboard-operable).","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";console.clear();var tempDOMContent,currentEl,currentElTagName,thisTagName,searchScope,newCollection,useIDRefs=!0,hidePanels=!1,targetAndSourceCompilationReadable=\"\",targetAndSourceCompilationProcessed=\"\",newTargetsAddedCount=0,allowAlerts=!0,firstEntry=!0;function removeEl(e){document.querySelector(\"#\"+e)&&document.querySelector(\"#\"+e).remove()}function getXpath(e){currentEl=e,currentElTagName=e.tagName.toLowerCase();let t,a=\"\",n=\"\",r=\"\",o=\"\";for(;currentEl.parentNode;){if((t=currentEl.parentNode).tagName){a=t.tagName.toLowerCase();let i=t.querySelectorAll(\":scope > \"+currentEl.tagName);r=i.length>1?\"[\"+parseInt(Array.from(i).indexOf(currentEl)+1)+\"]\":\"\",currentElTagName=currentEl.tagName.toLowerCase();let l=currentEl.getAttribute(\"id\");n=l&&useIDRefs?'/*[@id=\"'+l+'\"]'+o+n:currentElTagName+r+o+n,o=\"/\"}currentEl=t}\"\"===a&&(a=currentElTagName),n=\"//\"+a+r+o+n;let s=n.split(\"//*\");return s.length>1&&(n=\"//*\"+(n=s[s.length-1])),n}function getXpathAndSource(){let e,t,a,n,r,o,i,l,s,d,u=!1;if(!document.querySelector(\"#tempDOMDumpingGround\")){let c=document.createElement(\"div\");c.setAttribute(\"id\",\"tempDOMDumpingGround\"),c.setAttribute(\"hidden\",\"hidden\"),document.body.appendChild(c)}let p=document.querySelectorAll(\"*\");function m(){n.remove(),document.querySelector(\"#xpathGetterStyles\").remove()}function g(){!function e(t,a){let n=document.querySelector(\"#allTargetsFileDownloadLinkReadable\");n.textContent=\"Download targets (Readable)\",n.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(a)),n.setAttribute(\"download\",t)}(\"xpaths-targets-selected.html\",targetAndSourceCompilationReadable),function e(t,a){let n=document.querySelector(\"#allTargetsFileDownloadLinkProcessed\");n.textContent=\"Download targets (Processed)\",n.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(a)),n.setAttribute(\"download\",t)}(\"xpaths-targets-selected-processed.html\",targetAndSourceCompilationProcessed)}function h(e,t=1){let a=\"string\"==typeof e?e:e.outerHTML;a=a.replace(/<!--(.*?)-->/g,\"\");let n=\"\",r=[0],o=\" \".repeat(t),i=new Set([\"area\",\"base\",\"br\",\"col\",\"embed\",\"hr\",\"img\",\"input\",\"link\",\"meta\",\"param\",\"source\",\"track\",\"wbr\"]),l=e=>{let t=e.match(/^<([^ >]+)/);return t&&i.has(t[1].toLowerCase())},s=(e=>{let t=[],a=/(<[^>]+>|[^<]+)/g,n;for(;null!==(n=a.exec(e));){let r=n[0].trim();r&&t.push(r)}return t})(a);for(let d=0;d<s.length;d++){let u=s[d],c=r[r.length-1];if(u.toLowerCase().startsWith(\"<!doctype\")){n+=u+\"\\n\";continue}if(u.startsWith(\"<\")&&!u.startsWith(\"</\")){if(l(u)){n+=o.repeat(c)+u+\"\\n\";continue}n+=o.repeat(c)+u+\"\\n\",u.endsWith(\"/>\")||r.push(c+1);continue}if(u.startsWith(\"</\")){r.length>1&&r.pop();let p=r[r.length-1];n+=o.repeat(p)+u+\"\\n\";continue}if(!u.startsWith(\"<\")){n+=o.repeat(c)+u+\"\\n\";continue}}return n.trim().replace(/^\\s+$/gm,\"\").replace(/\\n\\n+/g,\"\\n\")}function b(e,t){var a;u||((n=document.createElement(\"div\")).setAttribute(\"id\",\"outputPanel\"),n.setAttribute(\"tabindex\",\"-1\"),n.setAttribute(\"role\",\"region\"),n.setAttribute(\"aria-label\",\"Xpath and Source values\"),(i=document.createElement(\"input\")).setAttribute(\"id\",\"outputPanel_input\"),(r=document.createElement(\"textarea\")).setAttribute(\"id\",\"outputPanel_textarea\"),r.setAttribute(\"aria-label\",\"Source code\"),(l=document.createElement(\"label\")).setAttribute(\"for\",\"outputPanel_input\"),l.textContent=\"XPATH locator\",(o=document.createElement(\"label\")).setAttribute(\"for\",\"outputPanel_textarea\"),o.textContent=\"Source code (formatted/indented)\",(s=document.createElement(\"button\")).setAttribute(\"type\",\"button\"),s.textContent=\"Close\",(d=document.createElement(\"button\")).setAttribute(\"type\",\"button\"),d.setAttribute(\"title\",\"Adds a somewhat decrapulated version after the proper markup\"),d.innerHTML=\"<span aria-hidden='true'>\\uD83D\\uDCA9 </span>Decrapulate LITE [d]\",n.appendChild(l),n.appendChild(i),n.appendChild(o),n.appendChild(r),n.appendChild(s),n.appendChild(d),i.addEventListener(\"click\",e=>{i.select(),e.stopPropagation()}),r.addEventListener(\"click\",e=>{r.select(),e.stopPropagation()}),n.addEventListener(\"click\",e=>{e.stopPropagation()}),l.addEventListener(\"click\",e=>{e.stopPropagation()}),o.addEventListener(\"click\",e=>{e.stopPropagation()}),s.addEventListener(\"click\",e=>{m()}),d.addEventListener(\"click\",e=>{A()}),document.body.appendChild(n),u=!0),g(),w(e),i.value=getXpath(e);let c=h(e);(tempDOMContent=document.querySelector(\"#tempDOMDumpingGround\")).innerHTML=c;let p=tempDOMContent.querySelectorAll(\":scope *\");tempDOMContent.querySelectorAll(\":scope>*\");let b=0;Array.from(p).forEach(e=>{b++}),b>20&&allowAlerts&&confirm(\"There are quite a lot of child nodes in here (\"+b+\" in total). Do you want to only reference the parent node (all inner contents replaced with '...')?\\n\\nOK = Abbreviate\\nCancel = Leave as-is\")&&(b=0,Array.from(p).forEach(e=>{1!=++b&&e.remove()}),c=(c=h(tempDOMContent.innerHTML)).split(\"\\n\").join(\"\\n...\\n\")),c=c.split(\" class=''\").join(\"\"),r.value=c,firstEntry||(targetAndSourceCompilationReadable+=\"\\n<!-- ==== END target and source markup ==== -->\\n\\n\\n\"),targetAndSourceCompilationReadable+=\"<!--\\n\"+getXpath(e)+\"\\n-->\\n\"+c,targetAndSourceCompilationProcessed+=getXpath(e)+\"~~~//~~~\"+(a=c).replace(/>\\s+</g,\"><\").replace(/^\\s+|\\s+$/gm,\"\").replace(/\\n/g,\"\").replace(/\\s{2,}/g,\" \").replace(/\\s*=\\s*/g,\"=\").replace(/\\s+/g,\" \").replace(/\\s+>/g,\">\")+\"\\n\",console.log(\"LOGGED:\\n\",targetAndSourceCompilationReadable),firstEntry=!1}function f(){document.querySelector(\"#outputPanel\")&&document.querySelector(\"#outputPanel\").setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkProcessed\")&&document.querySelector(\"#allTargetsFileDownloadLinkProcessed\").setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkReadable\")&&document.querySelector(\"#allTargetsFileDownloadLinkReadable\").setAttribute(\"hidden\",\"hidden\")}function v(){document.querySelector(\"#outputPanel\")&&document.querySelector(\"#outputPanel\").removeAttribute(\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkProcessed\")&&document.querySelector(\"#allTargetsFileDownloadLinkProcessed\").removeAttribute(\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkReadable\")&&document.querySelector(\"#allTargetsFileDownloadLinkReadable\").removeAttribute(\"hidden\")}function k(){Array.from(p).forEach(e=>{w(e)})}function y(t,a){e=t,searchScope=t,a.stopPropagation(),E(t),x(e)}function w(e){e.classList.remove(\"tempHighlight\")}function E(e){e.classList.add(\"tempHighlight\")}function x(e){a.innerHTML=getXpath(e)}function A(){let e=document.querySelector(\"#outputPanel_textarea\"),t=function e(t){function a(e){let t=document.createElement(\"div\");t.innerHTML=e;let a=new Set([\"area\",\"base\",\"br\",\"col\",\"embed\",\"hr\",\"img\",\"input\",\"link\",\"meta\",\"param\",\"source\",\"track\",\"wbr\"]);return!function e(t){if(t.nodeType===Node.ELEMENT_NODE){if(!a.has(t.tagName.toLowerCase())){for(let n=t.childNodes.length-1;n>=0;n--)e(t.childNodes[n]);0!==t.childNodes.length||a.has(t.tagName.toLowerCase())||\"\"!==t.textContent.trim()||t.remove()}}else t.nodeType===Node.TEXT_NODE&&\"\"===t.textContent.trim()&&t.remove()}(t),t.innerHTML}let n=new Set([\"id\",\"class\",\"style\",\"title\",\"lang\",\"dir\",\"tabindex\",\"accesskey\",\"contenteditable\",\"hidden\",\"translate\",\"draggable\",\"spellcheck\",\"onabort\",\"onblur\",\"oncancel\",\"oncanplay\",\"oncanplaythrough\",\"onchange\",\"onclick\",\"onclose\",\"oncontextmenu\",\"oncuechange\",\"ondblclick\",\"ondrag\",\"ondragend\",\"ondragenter\",\"ondragexit\",\"ondragleave\",\"ondragover\",\"ondragstart\",\"ondrop\",\"ondurationchange\",\"onemptied\",\"onended\",\"onerror\",\"onfocus\",\"oninput\",\"oninvalid\",\"onkeydown\",\"onkeypress\",\"onkeyup\",\"onload\",\"onloadeddata\",\"onloadedmetadata\",\"onloadstart\",\"onmousedown\",\"onmouseenter\",\"onmouseleave\",\"onmousemove\",\"onmouseout\",\"onmouseover\",\"onmouseup\",\"onmousewheel\",\"onpause\",\"onplay\",\"onplaying\",\"onprogress\",\"onratechange\",\"onreset\",\"onresize\",\"onscroll\",\"onseeked\",\"onseeking\",\"onselect\",\"onshow\",\"onsort\",\"onstalled\",\"onsubmit\",\"onsuspend\",\"ontimeupdate\",\"ontoggle\",\"onvolumechange\",\"onwaiting\",\"accept\",\"accept-charset\",\"action\",\"autocomplete\",\"autofocus\",\"checked\",\"disabled\",\"enctype\",\"for\",\"form\",\"formaction\",\"formenctype\",\"formmethod\",\"formnovalidate\",\"formtarget\",\"height\",\"list\",\"max\",\"maxlength\",\"min\",\"minlength\",\"multiple\",\"name\",\"pattern\",\"placeholder\",\"readonly\",\"required\",\"size\",\"src\",\"step\",\"type\",\"value\",\"width\",\"autoplay\",\"controls\",\"crossorigin\",\"loop\",\"muted\",\"playsinline\",\"poster\",\"preload\",\"href\",\"hreflang\",\"media\",\"rel\",\"target\",\"download\",\"ping\",\"referrerpolicy\",\"colspan\",\"rowspan\",\"headers\",\"scope\",\"allowfullscreen\",\"allowpaymentrequest\",\"frameborder\",\"sandbox\",\"srcdoc\",\"alt\",\"ismap\",\"longdesc\",\"srcset\",\"sizes\",\"usemap\",\"async\",\"defer\",\"integrity\",\"nomodule\",\"nonce\",\"cite\",\"datetime\",\"kind\",\"label\",\"start\",\"coords\",\"shape\",\"aria-activedescendant\",\"aria-atomic\",\"aria-autocomplete\",\"aria-busy\",\"aria-checked\",\"aria-colcount\",\"aria-colindex\",\"aria-colspan\",\"aria-controls\",\"aria-current\",\"aria-describedby\",\"aria-description\",\"aria-details\",\"aria-disabled\",\"aria-dropeffect\",\"aria-errormessage\",\"aria-expanded\",\"aria-flowto\",\"aria-grabbed\",\"aria-haspopup\",\"aria-hidden\",\"aria-invalid\",\"aria-keyshortcuts\",\"aria-label\",\"aria-labelledby\",\"aria-level\",\"aria-live\",\"aria-modal\",\"aria-multiline\",\"aria-multiselectable\",\"aria-orientation\",\"aria-owns\",\"aria-placeholder\",\"aria-posinset\",\"aria-pressed\",\"aria-readonly\",\"aria-relevant\",\"aria-required\",\"aria-roledescription\",\"aria-rowcount\",\"aria-rowindex\",\"aria-rowspan\",\"aria-selected\",\"aria-setsize\",\"aria-sort\",\"aria-valuemax\",\"aria-valuemin\",\"aria-valuenow\",\"aria-valuetext\"]),r=document.createElement(\"div\");r.innerHTML=t;let o=r.getElementsByTagName(\"*\");function i(e,t){Array.from(e.attributes).filter(e=>e.name.startsWith(t)).forEach(t=>e.removeAttribute(t.name))}for(let l of o){let s=Array.from(l.attributes).filter(e=>!e.name.startsWith(\"data-\")&&!n.has(e.name));s.forEach(e=>{console.log(`Stripping invalid attribute: \\`${e.name}\\` from element:`,l),l.removeAttribute(e.name)}),l.removeAttribute(\"class\"),l.removeAttribute(\"style\"),l.removeAttribute(\"dir\"),l.removeAttribute(\"lang\"),l.removeAttribute(\"onclick\"),i(l,\"ng-\"),i(l,\"_ng\")}return r.innerHTML}(e.value);e.value=\"\\uD83D\\uDCA9 De-Crapulated version \\uD83D\\uDCA9\\n\"+t,targetAndSourceCompilationReadable+=\"\\n\\n\\uD83D\\uDCA9 De-Crapulated version \\uD83D\\uDCA9\\n\"+t,a.innerHTML='<span aria-hidden=\"true\">\\uD83D\\uDC4D\\uD83D\\uDCA9 </span>De-Crapulation Finished!<span aria-hidden=\"true\"> \\uD83D\\uDCA9\\uD83D\\uDC4D</span>'}function L(){a.innerHTML=`<p>Xpath and Source getter started.</p><ul><li>Hover over on elements on the page, then click when the correct element is highlighted</li><li>Or <kbd>TAB</kbd> to a focusable element on the page and then press the arrow keys to fine tune your selection (choose parent, child and sibling elements in the DOM) and confirm that selection with <kbd>Enter</kbd></li><li>You can toggle the xpath type (using \\`id\\` references where present or DOM position) by pressing <kbd>x</kbd> key</li><li>Find all elements at same DOM level by pressing <kbd>a</kbd> key (keep pressing <kbd>a</kbd> to move up the DOM tree while searching for same elements, then press <kbd>Y</kbd> to commit targets)</li><li>Press <kbd>i</kbd> to see these <strong>i</strong>nstructions again at any time</li><li>Press <kbd>h</kbd> to <strong>h</strong>ide/show the display of the output (capture) panel as needed (in case it is obscuring a target)</li><li>Press <kbd>q</kbd> to <strong>q</strong>uit the tool and restore page to previous state</li><li>Press <kbd>d</kbd> to <strong>d</strong>ecrapulate the markup (removes all invalid HTML attributes, but also strips \\`class\\`, \\`style\\`, \\`dir\\`, \\`lang\\`, \\`onclick\\`, \\`ng-\\`, \\`_ng\\` and any empty nodes)</li></ul>`}k(),Array.from(p).forEach(e=>{e.addEventListener(\"click\",t=>{\"allTargetsFileDownloadLinkReadable\"!==e.getAttribute(\"id\")&&(t.stopPropagation(),t.preventDefault(),b(e,t),a.innerHTML=\"Values captured for \"+getXpath(e))}),e.addEventListener(\"focus\",t=>{y(e,t)}),e.addEventListener(\"mouseover\",t=>{y(e,t)}),e.addEventListener(\"mouseout\",e=>{k()}),e.addEventListener(\"blur\",e=>{k()})}),!function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"xpathGetterStyles\"),t.textContent=`#outputPanel button {border:1px solid white;color:white!important;background:black;height:2em;margin-right:1em;}#outputPanel label {color:white;}#outputPanel, #outputPanel * {font-size:20px;font-family:sans-serif;}#outputPanel {position:fixed;bottom:80px;right:20px;padding:20px;background:black;width:50vw;z-index:10000;outline:3px solid white;border-radius:5px;}#outputPanel input, #outputPanel textarea {width:100%;display:block;margin:10px 0;background:white;color:black;}#outputPanel textarea {height:5em;}#outputPanel textarea {font-family:monospace;}.tempHighlight{outline:4px solid black!important;outline-offset:-4px!important;-webkit-box-shadow: 0px 0px 0px 4px #fff;box-shadow: 0px 0px 0px 4px #fff;}#infoPanel {z-index:100000;font-size:20px;background:rgba(0,0,0,0.8);color:#fff;font-weight:normal;padding:10px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-width:50vw;font-family:sans-serif;overflow-wrap: break-word;outline:3px solid white;border-radius:5px;}#infoPanel:empty {visibility:hidden;}#infoPanel code {color:lime}#allTargetsFileDownloadLinkReadable {right:20px;background:rgba(41, 98, 24,0.9);}#allTargetsFileDownloadLinkProcessed {right:280px;background:rgba(135, 48, 167,0.9);outline:3px solid white;border-radius:5px;}.allTargetsFileDownloadLink {position:fixed;bottom:20px;color:white!important;font-weight:bold;padding:10px;font-family:sans-serif;font-size:16px;z-index:10000;outline:3px solid white;border-radius:5px;}.allTargetsFileDownloadLink:empty{visibility:hidden}#infoPanel kbd {color:yellow;background:transparent!important;}`,document.head.appendChild(t)}(),(a=document.createElement(\"div\")).setAttribute(\"id\",\"infoPanel\"),a.setAttribute(\"role\",\"status\"),document.body.appendChild(a),function e(){let t=document.createElement(\"a\");t.setAttribute(\"id\",\"allTargetsFileDownloadLinkReadable\"),t.setAttribute(\"class\",\"allTargetsFileDownloadLink\"),t.addEventListener(\"click\",e=>{g(),allTargetsFileDownloadLinkReadable.setAttribute(\"download\",\"XPATH-and-Source-Code---human-readable.html\"),e.stopPropagation()}),document.body.appendChild(t)}(),function e(){let t=document.createElement(\"a\");t.setAttribute(\"id\",\"allTargetsFileDownloadLinkProcessed\"),t.setAttribute(\"class\",\"allTargetsFileDownloadLink\"),t.addEventListener(\"click\",e=>{g(),allTargetsFileDownloadLinkProcessed.setAttribute(\"download\",\"XPATH-and-Source-Code---machine-readable.log\"),e.stopPropagation()}),document.body.appendChild(t)}(),function n(){let r=function(n){if(\"Escape\"===n.key&&m(),\"h\"===n.key){n.preventDefault();let o=document.querySelector(\"#outputPanel\");o&&(o.hasAttribute(\"hidden\")?(o.removeAttribute(\"hidden\"),a.innerHTML=\"Output panel shown\"):(o.setAttribute(\"hidden\",\"hidden\"),a.innerHTML=\"Output panel hidden\"))}if(\"d\"===n.key&&(n.preventDefault(),A()),\"ArrowUp\"===n.key&&(n.preventDefault(),e.parentNode&&\"HTML\"!==e.tagName&&(w(e),e=t=e.parentNode,E(e)),x(e),a.textContent=a.textContent+\" \\uD83D\\uDC48 Press Return to get this element's details\"),\"ArrowLeft\"===n.key&&(n.preventDefault(),e.previousElementSibling&&(w(e),y(e=e.previousElementSibling,n))),\"ArrowRight\"===n.key&&(n.preventDefault(),e.nextElementSibling&&(w(e),y(e=e.nextElementSibling,n))),\"ArrowDown\"===n.key&&(n.preventDefault(),e.childNodes.length>1)){w(e);let i=!1,l;Array.from(e.childNodes).forEach(e=>{1!==e.nodeType||i||(i=!0,l=e)}),l&&y(e=l,n)}if(\"x\"===n.key&&((useIDRefs=!useIDRefs)?a.innerHTML=\"Using ID refs (where available) to get xpath\":a.innerHTML=\"Using element position in DOM to get xpath\"),\"y\"===n.key&&(a.innerHTML=\"Added \"+newTargetsAddedCount+\" targets to the list\",allowAlerts=!1,Array.from(newCollection).forEach(e=>{e.click()}),allowAlerts=!0),\"i\"===n.key&&L(),\"a\"===n.key){var s,d;thisTagName=e.tagName.toLowerCase(),searchScope.parentNode&&(searchScope=searchScope.parentNode),s=searchScope,d=thisTagName,newTargetsAddedCount=(newCollection=s.querySelectorAll(d)).length,k(),Array.from(newCollection).forEach(e=>{E(e)}),a.innerHTML=\"<p>\"+newTargetsAddedCount+\" Possible matching targets found (highlighted visually)</p>Searching:<br>\"+getXpath(s)+\"<br>for tagName `\"+d+\"`<p>Open console for matched elements.</p><p>Press <kbd>y</kbd> key to commit these targets</p>\"}if(\"Enter\"===n.key&&(n.preventDefault(),e.click()),\"q\"===n.key){n.preventDefault();let u=document.querySelectorAll(\"*\");Array.from(u).forEach(e=>{e.removeEventListener(\"click\",b),e.removeEventListener(\"focus\",y),e.removeEventListener(\"mouseover\",y),e.removeEventListener(\"mouseout\",k),e.removeEventListener(\"blur\",k),e.classList.remove(\"tempHighlight\")}),removeEl(\"tempDOMDumpingGround\"),removeEl(\"infoPanel\"),removeEl(\"allTargetsFileDownloadLinkReadable\"),removeEl(\"allTargetsFileDownloadLinkProcessed\"),removeEl(\"outputPanel\");let c=document.querySelector(\"#xpathGetterStyles\");c&&c.remove(),document.removeEventListener(\"keydown\",r),console.log(\"XPath getter script stopped and cleaned up.\")}};document.addEventListener(\"keydown\",r)}(),L()}removeEl(\"tempDOMDumpingGround\"),removeEl(\"infoPanel\"),removeEl(\"allTargetsFileDownloadLinkReadable\"),removeEl(\"allTargetsFileDownloadLinkProcessed\"),removeEl(\"outputPanel\"),getXpathAndSource()})()","author":"Ian Lloyd","authorUrl":"https://a11y-tools.com/","categories":["HTML"],"folderName":"DOM manipulation","folderDescription":"Accessibility Diagnostics from a11y-tools.com","sourceFile":"A11y-tools.com: DOM manipulation.json","download":{"name":"Xpath & Source Getter","language":"javascript","executionMode":"activate","content":"(function(){\"use strict\";console.clear();var tempDOMContent,currentEl,currentElTagName,thisTagName,searchScope,newCollection,useIDRefs=!0,hidePanels=!1,targetAndSourceCompilationReadable=\"\",targetAndSourceCompilationProcessed=\"\",newTargetsAddedCount=0,allowAlerts=!0,firstEntry=!0;function removeEl(e){document.querySelector(\"#\"+e)&&document.querySelector(\"#\"+e).remove()}function getXpath(e){currentEl=e,currentElTagName=e.tagName.toLowerCase();let t,a=\"\",n=\"\",r=\"\",o=\"\";for(;currentEl.parentNode;){if((t=currentEl.parentNode).tagName){a=t.tagName.toLowerCase();let i=t.querySelectorAll(\":scope > \"+currentEl.tagName);r=i.length>1?\"[\"+parseInt(Array.from(i).indexOf(currentEl)+1)+\"]\":\"\",currentElTagName=currentEl.tagName.toLowerCase();let l=currentEl.getAttribute(\"id\");n=l&&useIDRefs?'/*[@id=\"'+l+'\"]'+o+n:currentElTagName+r+o+n,o=\"/\"}currentEl=t}\"\"===a&&(a=currentElTagName),n=\"//\"+a+r+o+n;let s=n.split(\"//*\");return s.length>1&&(n=\"//*\"+(n=s[s.length-1])),n}function getXpathAndSource(){let e,t,a,n,r,o,i,l,s,d,u=!1;if(!document.querySelector(\"#tempDOMDumpingGround\")){let c=document.createElement(\"div\");c.setAttribute(\"id\",\"tempDOMDumpingGround\"),c.setAttribute(\"hidden\",\"hidden\"),document.body.appendChild(c)}let p=document.querySelectorAll(\"*\");function m(){n.remove(),document.querySelector(\"#xpathGetterStyles\").remove()}function g(){!function e(t,a){let n=document.querySelector(\"#allTargetsFileDownloadLinkReadable\");n.textContent=\"Download targets (Readable)\",n.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(a)),n.setAttribute(\"download\",t)}(\"xpaths-targets-selected.html\",targetAndSourceCompilationReadable),function e(t,a){let n=document.querySelector(\"#allTargetsFileDownloadLinkProcessed\");n.textContent=\"Download targets (Processed)\",n.setAttribute(\"href\",\"data:text/plain;charset=utf-8,\"+encodeURIComponent(a)),n.setAttribute(\"download\",t)}(\"xpaths-targets-selected-processed.html\",targetAndSourceCompilationProcessed)}function h(e,t=1){let a=\"string\"==typeof e?e:e.outerHTML;a=a.replace(/<!--(.*?)-->/g,\"\");let n=\"\",r=[0],o=\" \".repeat(t),i=new Set([\"area\",\"base\",\"br\",\"col\",\"embed\",\"hr\",\"img\",\"input\",\"link\",\"meta\",\"param\",\"source\",\"track\",\"wbr\"]),l=e=>{let t=e.match(/^<([^ >]+)/);return t&&i.has(t[1].toLowerCase())},s=(e=>{let t=[],a=/(<[^>]+>|[^<]+)/g,n;for(;null!==(n=a.exec(e));){let r=n[0].trim();r&&t.push(r)}return t})(a);for(let d=0;d<s.length;d++){let u=s[d],c=r[r.length-1];if(u.toLowerCase().startsWith(\"<!doctype\")){n+=u+\"\\n\";continue}if(u.startsWith(\"<\")&&!u.startsWith(\"</\")){if(l(u)){n+=o.repeat(c)+u+\"\\n\";continue}n+=o.repeat(c)+u+\"\\n\",u.endsWith(\"/>\")||r.push(c+1);continue}if(u.startsWith(\"</\")){r.length>1&&r.pop();let p=r[r.length-1];n+=o.repeat(p)+u+\"\\n\";continue}if(!u.startsWith(\"<\")){n+=o.repeat(c)+u+\"\\n\";continue}}return n.trim().replace(/^\\s+$/gm,\"\").replace(/\\n\\n+/g,\"\\n\")}function b(e,t){var a;u||((n=document.createElement(\"div\")).setAttribute(\"id\",\"outputPanel\"),n.setAttribute(\"tabindex\",\"-1\"),n.setAttribute(\"role\",\"region\"),n.setAttribute(\"aria-label\",\"Xpath and Source values\"),(i=document.createElement(\"input\")).setAttribute(\"id\",\"outputPanel_input\"),(r=document.createElement(\"textarea\")).setAttribute(\"id\",\"outputPanel_textarea\"),r.setAttribute(\"aria-label\",\"Source code\"),(l=document.createElement(\"label\")).setAttribute(\"for\",\"outputPanel_input\"),l.textContent=\"XPATH locator\",(o=document.createElement(\"label\")).setAttribute(\"for\",\"outputPanel_textarea\"),o.textContent=\"Source code (formatted/indented)\",(s=document.createElement(\"button\")).setAttribute(\"type\",\"button\"),s.textContent=\"Close\",(d=document.createElement(\"button\")).setAttribute(\"type\",\"button\"),d.setAttribute(\"title\",\"Adds a somewhat decrapulated version after the proper markup\"),d.innerHTML=\"<span aria-hidden='true'>\\uD83D\\uDCA9 </span>Decrapulate LITE [d]\",n.appendChild(l),n.appendChild(i),n.appendChild(o),n.appendChild(r),n.appendChild(s),n.appendChild(d),i.addEventListener(\"click\",e=>{i.select(),e.stopPropagation()}),r.addEventListener(\"click\",e=>{r.select(),e.stopPropagation()}),n.addEventListener(\"click\",e=>{e.stopPropagation()}),l.addEventListener(\"click\",e=>{e.stopPropagation()}),o.addEventListener(\"click\",e=>{e.stopPropagation()}),s.addEventListener(\"click\",e=>{m()}),d.addEventListener(\"click\",e=>{A()}),document.body.appendChild(n),u=!0),g(),w(e),i.value=getXpath(e);let c=h(e);(tempDOMContent=document.querySelector(\"#tempDOMDumpingGround\")).innerHTML=c;let p=tempDOMContent.querySelectorAll(\":scope *\");tempDOMContent.querySelectorAll(\":scope>*\");let b=0;Array.from(p).forEach(e=>{b++}),b>20&&allowAlerts&&confirm(\"There are quite a lot of child nodes in here (\"+b+\" in total). Do you want to only reference the parent node (all inner contents replaced with '...')?\\n\\nOK = Abbreviate\\nCancel = Leave as-is\")&&(b=0,Array.from(p).forEach(e=>{1!=++b&&e.remove()}),c=(c=h(tempDOMContent.innerHTML)).split(\"\\n\").join(\"\\n...\\n\")),c=c.split(\" class=''\").join(\"\"),r.value=c,firstEntry||(targetAndSourceCompilationReadable+=\"\\n<!-- ==== END target and source markup ==== -->\\n\\n\\n\"),targetAndSourceCompilationReadable+=\"<!--\\n\"+getXpath(e)+\"\\n-->\\n\"+c,targetAndSourceCompilationProcessed+=getXpath(e)+\"~~~//~~~\"+(a=c).replace(/>\\s+</g,\"><\").replace(/^\\s+|\\s+$/gm,\"\").replace(/\\n/g,\"\").replace(/\\s{2,}/g,\" \").replace(/\\s*=\\s*/g,\"=\").replace(/\\s+/g,\" \").replace(/\\s+>/g,\">\")+\"\\n\",console.log(\"LOGGED:\\n\",targetAndSourceCompilationReadable),firstEntry=!1}function f(){document.querySelector(\"#outputPanel\")&&document.querySelector(\"#outputPanel\").setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkProcessed\")&&document.querySelector(\"#allTargetsFileDownloadLinkProcessed\").setAttribute(\"hidden\",\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkReadable\")&&document.querySelector(\"#allTargetsFileDownloadLinkReadable\").setAttribute(\"hidden\",\"hidden\")}function v(){document.querySelector(\"#outputPanel\")&&document.querySelector(\"#outputPanel\").removeAttribute(\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkProcessed\")&&document.querySelector(\"#allTargetsFileDownloadLinkProcessed\").removeAttribute(\"hidden\"),document.querySelector(\"#allTargetsFileDownloadLinkReadable\")&&document.querySelector(\"#allTargetsFileDownloadLinkReadable\").removeAttribute(\"hidden\")}function k(){Array.from(p).forEach(e=>{w(e)})}function y(t,a){e=t,searchScope=t,a.stopPropagation(),E(t),x(e)}function w(e){e.classList.remove(\"tempHighlight\")}function E(e){e.classList.add(\"tempHighlight\")}function x(e){a.innerHTML=getXpath(e)}function A(){let e=document.querySelector(\"#outputPanel_textarea\"),t=function e(t){function a(e){let t=document.createElement(\"div\");t.innerHTML=e;let a=new Set([\"area\",\"base\",\"br\",\"col\",\"embed\",\"hr\",\"img\",\"input\",\"link\",\"meta\",\"param\",\"source\",\"track\",\"wbr\"]);return!function e(t){if(t.nodeType===Node.ELEMENT_NODE){if(!a.has(t.tagName.toLowerCase())){for(let n=t.childNodes.length-1;n>=0;n--)e(t.childNodes[n]);0!==t.childNodes.length||a.has(t.tagName.toLowerCase())||\"\"!==t.textContent.trim()||t.remove()}}else t.nodeType===Node.TEXT_NODE&&\"\"===t.textContent.trim()&&t.remove()}(t),t.innerHTML}let n=new Set([\"id\",\"class\",\"style\",\"title\",\"lang\",\"dir\",\"tabindex\",\"accesskey\",\"contenteditable\",\"hidden\",\"translate\",\"draggable\",\"spellcheck\",\"onabort\",\"onblur\",\"oncancel\",\"oncanplay\",\"oncanplaythrough\",\"onchange\",\"onclick\",\"onclose\",\"oncontextmenu\",\"oncuechange\",\"ondblclick\",\"ondrag\",\"ondragend\",\"ondragenter\",\"ondragexit\",\"ondragleave\",\"ondragover\",\"ondragstart\",\"ondrop\",\"ondurationchange\",\"onemptied\",\"onended\",\"onerror\",\"onfocus\",\"oninput\",\"oninvalid\",\"onkeydown\",\"onkeypress\",\"onkeyup\",\"onload\",\"onloadeddata\",\"onloadedmetadata\",\"onloadstart\",\"onmousedown\",\"onmouseenter\",\"onmouseleave\",\"onmousemove\",\"onmouseout\",\"onmouseover\",\"onmouseup\",\"onmousewheel\",\"onpause\",\"onplay\",\"onplaying\",\"onprogress\",\"onratechange\",\"onreset\",\"onresize\",\"onscroll\",\"onseeked\",\"onseeking\",\"onselect\",\"onshow\",\"onsort\",\"onstalled\",\"onsubmit\",\"onsuspend\",\"ontimeupdate\",\"ontoggle\",\"onvolumechange\",\"onwaiting\",\"accept\",\"accept-charset\",\"action\",\"autocomplete\",\"autofocus\",\"checked\",\"disabled\",\"enctype\",\"for\",\"form\",\"formaction\",\"formenctype\",\"formmethod\",\"formnovalidate\",\"formtarget\",\"height\",\"list\",\"max\",\"maxlength\",\"min\",\"minlength\",\"multiple\",\"name\",\"pattern\",\"placeholder\",\"readonly\",\"required\",\"size\",\"src\",\"step\",\"type\",\"value\",\"width\",\"autoplay\",\"controls\",\"crossorigin\",\"loop\",\"muted\",\"playsinline\",\"poster\",\"preload\",\"href\",\"hreflang\",\"media\",\"rel\",\"target\",\"download\",\"ping\",\"referrerpolicy\",\"colspan\",\"rowspan\",\"headers\",\"scope\",\"allowfullscreen\",\"allowpaymentrequest\",\"frameborder\",\"sandbox\",\"srcdoc\",\"alt\",\"ismap\",\"longdesc\",\"srcset\",\"sizes\",\"usemap\",\"async\",\"defer\",\"integrity\",\"nomodule\",\"nonce\",\"cite\",\"datetime\",\"kind\",\"label\",\"start\",\"coords\",\"shape\",\"aria-activedescendant\",\"aria-atomic\",\"aria-autocomplete\",\"aria-busy\",\"aria-checked\",\"aria-colcount\",\"aria-colindex\",\"aria-colspan\",\"aria-controls\",\"aria-current\",\"aria-describedby\",\"aria-description\",\"aria-details\",\"aria-disabled\",\"aria-dropeffect\",\"aria-errormessage\",\"aria-expanded\",\"aria-flowto\",\"aria-grabbed\",\"aria-haspopup\",\"aria-hidden\",\"aria-invalid\",\"aria-keyshortcuts\",\"aria-label\",\"aria-labelledby\",\"aria-level\",\"aria-live\",\"aria-modal\",\"aria-multiline\",\"aria-multiselectable\",\"aria-orientation\",\"aria-owns\",\"aria-placeholder\",\"aria-posinset\",\"aria-pressed\",\"aria-readonly\",\"aria-relevant\",\"aria-required\",\"aria-roledescription\",\"aria-rowcount\",\"aria-rowindex\",\"aria-rowspan\",\"aria-selected\",\"aria-setsize\",\"aria-sort\",\"aria-valuemax\",\"aria-valuemin\",\"aria-valuenow\",\"aria-valuetext\"]),r=document.createElement(\"div\");r.innerHTML=t;let o=r.getElementsByTagName(\"*\");function i(e,t){Array.from(e.attributes).filter(e=>e.name.startsWith(t)).forEach(t=>e.removeAttribute(t.name))}for(let l of o){let s=Array.from(l.attributes).filter(e=>!e.name.startsWith(\"data-\")&&!n.has(e.name));s.forEach(e=>{console.log(`Stripping invalid attribute: \\`${e.name}\\` from element:`,l),l.removeAttribute(e.name)}),l.removeAttribute(\"class\"),l.removeAttribute(\"style\"),l.removeAttribute(\"dir\"),l.removeAttribute(\"lang\"),l.removeAttribute(\"onclick\"),i(l,\"ng-\"),i(l,\"_ng\")}return r.innerHTML}(e.value);e.value=\"\\uD83D\\uDCA9 De-Crapulated version \\uD83D\\uDCA9\\n\"+t,targetAndSourceCompilationReadable+=\"\\n\\n\\uD83D\\uDCA9 De-Crapulated version \\uD83D\\uDCA9\\n\"+t,a.innerHTML='<span aria-hidden=\"true\">\\uD83D\\uDC4D\\uD83D\\uDCA9 </span>De-Crapulation Finished!<span aria-hidden=\"true\"> \\uD83D\\uDCA9\\uD83D\\uDC4D</span>'}function L(){a.innerHTML=`<p>Xpath and Source getter started.</p><ul><li>Hover over on elements on the page, then click when the correct element is highlighted</li><li>Or <kbd>TAB</kbd> to a focusable element on the page and then press the arrow keys to fine tune your selection (choose parent, child and sibling elements in the DOM) and confirm that selection with <kbd>Enter</kbd></li><li>You can toggle the xpath type (using \\`id\\` references where present or DOM position) by pressing <kbd>x</kbd> key</li><li>Find all elements at same DOM level by pressing <kbd>a</kbd> key (keep pressing <kbd>a</kbd> to move up the DOM tree while searching for same elements, then press <kbd>Y</kbd> to commit targets)</li><li>Press <kbd>i</kbd> to see these <strong>i</strong>nstructions again at any time</li><li>Press <kbd>h</kbd> to <strong>h</strong>ide/show the display of the output (capture) panel as needed (in case it is obscuring a target)</li><li>Press <kbd>q</kbd> to <strong>q</strong>uit the tool and restore page to previous state</li><li>Press <kbd>d</kbd> to <strong>d</strong>ecrapulate the markup (removes all invalid HTML attributes, but also strips \\`class\\`, \\`style\\`, \\`dir\\`, \\`lang\\`, \\`onclick\\`, \\`ng-\\`, \\`_ng\\` and any empty nodes)</li></ul>`}k(),Array.from(p).forEach(e=>{e.addEventListener(\"click\",t=>{\"allTargetsFileDownloadLinkReadable\"!==e.getAttribute(\"id\")&&(t.stopPropagation(),t.preventDefault(),b(e,t),a.innerHTML=\"Values captured for \"+getXpath(e))}),e.addEventListener(\"focus\",t=>{y(e,t)}),e.addEventListener(\"mouseover\",t=>{y(e,t)}),e.addEventListener(\"mouseout\",e=>{k()}),e.addEventListener(\"blur\",e=>{k()})}),!function e(){let t=document.createElement(\"style\");t.setAttribute(\"id\",\"xpathGetterStyles\"),t.textContent=`#outputPanel button {border:1px solid white;color:white!important;background:black;height:2em;margin-right:1em;}#outputPanel label {color:white;}#outputPanel, #outputPanel * {font-size:20px;font-family:sans-serif;}#outputPanel {position:fixed;bottom:80px;right:20px;padding:20px;background:black;width:50vw;z-index:10000;outline:3px solid white;border-radius:5px;}#outputPanel input, #outputPanel textarea {width:100%;display:block;margin:10px 0;background:white;color:black;}#outputPanel textarea {height:5em;}#outputPanel textarea {font-family:monospace;}.tempHighlight{outline:4px solid black!important;outline-offset:-4px!important;-webkit-box-shadow: 0px 0px 0px 4px #fff;box-shadow: 0px 0px 0px 4px #fff;}#infoPanel {z-index:100000;font-size:20px;background:rgba(0,0,0,0.8);color:#fff;font-weight:normal;padding:10px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-width:50vw;font-family:sans-serif;overflow-wrap: break-word;outline:3px solid white;border-radius:5px;}#infoPanel:empty {visibility:hidden;}#infoPanel code {color:lime}#allTargetsFileDownloadLinkReadable {right:20px;background:rgba(41, 98, 24,0.9);}#allTargetsFileDownloadLinkProcessed {right:280px;background:rgba(135, 48, 167,0.9);outline:3px solid white;border-radius:5px;}.allTargetsFileDownloadLink {position:fixed;bottom:20px;color:white!important;font-weight:bold;padding:10px;font-family:sans-serif;font-size:16px;z-index:10000;outline:3px solid white;border-radius:5px;}.allTargetsFileDownloadLink:empty{visibility:hidden}#infoPanel kbd {color:yellow;background:transparent!important;}`,document.head.appendChild(t)}(),(a=document.createElement(\"div\")).setAttribute(\"id\",\"infoPanel\"),a.setAttribute(\"role\",\"status\"),document.body.appendChild(a),function e(){let t=document.createElement(\"a\");t.setAttribute(\"id\",\"allTargetsFileDownloadLinkReadable\"),t.setAttribute(\"class\",\"allTargetsFileDownloadLink\"),t.addEventListener(\"click\",e=>{g(),allTargetsFileDownloadLinkReadable.setAttribute(\"download\",\"XPATH-and-Source-Code---human-readable.html\"),e.stopPropagation()}),document.body.appendChild(t)}(),function e(){let t=document.createElement(\"a\");t.setAttribute(\"id\",\"allTargetsFileDownloadLinkProcessed\"),t.setAttribute(\"class\",\"allTargetsFileDownloadLink\"),t.addEventListener(\"click\",e=>{g(),allTargetsFileDownloadLinkProcessed.setAttribute(\"download\",\"XPATH-and-Source-Code---machine-readable.log\"),e.stopPropagation()}),document.body.appendChild(t)}(),function n(){let r=function(n){if(\"Escape\"===n.key&&m(),\"h\"===n.key){n.preventDefault();let o=document.querySelector(\"#outputPanel\");o&&(o.hasAttribute(\"hidden\")?(o.removeAttribute(\"hidden\"),a.innerHTML=\"Output panel shown\"):(o.setAttribute(\"hidden\",\"hidden\"),a.innerHTML=\"Output panel hidden\"))}if(\"d\"===n.key&&(n.preventDefault(),A()),\"ArrowUp\"===n.key&&(n.preventDefault(),e.parentNode&&\"HTML\"!==e.tagName&&(w(e),e=t=e.parentNode,E(e)),x(e),a.textContent=a.textContent+\" \\uD83D\\uDC48 Press Return to get this element's details\"),\"ArrowLeft\"===n.key&&(n.preventDefault(),e.previousElementSibling&&(w(e),y(e=e.previousElementSibling,n))),\"ArrowRight\"===n.key&&(n.preventDefault(),e.nextElementSibling&&(w(e),y(e=e.nextElementSibling,n))),\"ArrowDown\"===n.key&&(n.preventDefault(),e.childNodes.length>1)){w(e);let i=!1,l;Array.from(e.childNodes).forEach(e=>{1!==e.nodeType||i||(i=!0,l=e)}),l&&y(e=l,n)}if(\"x\"===n.key&&((useIDRefs=!useIDRefs)?a.innerHTML=\"Using ID refs (where available) to get xpath\":a.innerHTML=\"Using element position in DOM to get xpath\"),\"y\"===n.key&&(a.innerHTML=\"Added \"+newTargetsAddedCount+\" targets to the list\",allowAlerts=!1,Array.from(newCollection).forEach(e=>{e.click()}),allowAlerts=!0),\"i\"===n.key&&L(),\"a\"===n.key){var s,d;thisTagName=e.tagName.toLowerCase(),searchScope.parentNode&&(searchScope=searchScope.parentNode),s=searchScope,d=thisTagName,newTargetsAddedCount=(newCollection=s.querySelectorAll(d)).length,k(),Array.from(newCollection).forEach(e=>{E(e)}),a.innerHTML=\"<p>\"+newTargetsAddedCount+\" Possible matching targets found (highlighted visually)</p>Searching:<br>\"+getXpath(s)+\"<br>for tagName `\"+d+\"`<p>Open console for matched elements.</p><p>Press <kbd>y</kbd> key to commit these targets</p>\"}if(\"Enter\"===n.key&&(n.preventDefault(),e.click()),\"q\"===n.key){n.preventDefault();let u=document.querySelectorAll(\"*\");Array.from(u).forEach(e=>{e.removeEventListener(\"click\",b),e.removeEventListener(\"focus\",y),e.removeEventListener(\"mouseover\",y),e.removeEventListener(\"mouseout\",k),e.removeEventListener(\"blur\",k),e.classList.remove(\"tempHighlight\")}),removeEl(\"tempDOMDumpingGround\"),removeEl(\"infoPanel\"),removeEl(\"allTargetsFileDownloadLinkReadable\"),removeEl(\"allTargetsFileDownloadLinkProcessed\"),removeEl(\"outputPanel\");let c=document.querySelector(\"#xpathGetterStyles\");c&&c.remove(),document.removeEventListener(\"keydown\",r),console.log(\"XPath getter script stopped and cleaned up.\")}};document.addEventListener(\"keydown\",r)}(),L()}removeEl(\"tempDOMDumpingGround\"),removeEl(\"infoPanel\"),removeEl(\"allTargetsFileDownloadLinkReadable\"),removeEl(\"allTargetsFileDownloadLinkProcessed\"),removeEl(\"outputPanel\"),getXpathAndSource()})()","description":"Get XPATH and formatted HTML source of any part of the page with a single click (also keyboard-operable).","author":"Ian Lloyd","categories":["HTML"]}}