DevToolsSnippets
A collection of front-end debugging script snippets to be used in the Sources panel in Chrome DevTools.
You can copy these scripts and add them to your collection of snippets.
This not a replacement for automatic testing tools like the HTML validator, Lighthouse, axe, or Wave. This collection of scripts is meant to be used in addition to automatic testing tools.
Scripts
Document Info
- Logs the page
<title> - Logs the page description
- Logs the defined natural language
- Logs the charset
- Logs the number of DOM nodes in
<head> - Logs the number of DOM nodes in
<body> - Lists headings and document outline
Debug images
- Lists images without
widthand/orheightattributes - Lists images with empty
altattributes - Lists images with suspicious
altattributes
Remove CSS
For testing HTML output without CSS.
- Removes all
<link>s to CSS files - Removes all
styleelements - Removes all
styleattributes
Is x present?
- Checks if elements that usually should be present, are actually there.
- Checks if elements that probabaly shouldn’t be present, aren’t there.
