express-html-validator
Version:
✅ Automatic HTML validation middleware for Express applications.
133 lines (115 loc) • 3.16 kB
HTML
<html lang='en'>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<meta name='format-detection' content='telephone=no'>
<title>HTML did not pass validation</title>
</head>
<body>
<main>
<article>
<style>
/* prism styles */
${prismStyle}
/* roosevelt customizations */
h1 {
color: #000;
}
body {
margin-left: 15px;
}
h1 {
float: left;
}
button {
margin-top: 25px;
float: right;
}
button + p {
float: right;
}
h2 {
clear: both;
}
.validatorErrors {
color: #f00;
white-space: pre-wrap;
}
.validatorWarnings {
color: #ffa500;
white-space: pre-wrap;
}
.markup {
font-family: monospace;
background-color: #fff;
padding: 0.5em;
border-radius: .25em;
line-height: 0;
counter-reset: line;
}
.markup .line-numbers {
display: block;
line-height: 1.5rem;
}
.markup .line-numbers::before {
counter-increment: line;
content: counter(line);
display: inline-block;
border-right: 1px solid #ddd;
padding: 0 .5em;
margin-right: .5em;
width: ${preWidth}px;
}
.markup .error::before {
background-color: #ffb2b2;
}
input {
margin-top: 25px;
}
</style>
<h1>HTML did not pass validator:</h1>
${errors}
${markup}
</article>
</main>
<textarea hidden>${rawMarkup}</textarea>
<script>
var rawMarkup = document.querySelectorAll('textarea')[0].value
var displayAnywayButton = document.createElement('button')
displayAnywayButton.innerHTML = 'Display anyway'
displayAnywayButton.addEventListener('click', function () {
var iframe = document.createElement('iframe')
document.body.appendChild(iframe)
var doc = iframe.contentWindow.document
doc.open()
doc.write(rawMarkup)
var html = doc.querySelectorAll('html')[0].innerHTML
doc.close()
document.querySelectorAll('html')[0].innerHTML = html
inertScriptReplace(document.getElementsByTagName('body')[0])
})
document.querySelectorAll('h1')[0].insertAdjacentElement('afterend', displayAnywayButton)
function inertScriptReplace (node) {
if (node.tagName === 'SCRIPT') {
node.parentNode.replaceChild(nodeScriptClone(node), node)
} else {
var i = 0
var children = node.childNodes
while (i < children.length) {
inertScriptReplace(children[i++])
}
}
return node
function nodeScriptClone (node) {
var script = document.createElement('script')
script.text = node.innerHTML
for (var i = node.attributes.length - 1; i >= 0; i--) {
script.setAttribute(node.attributes[i].name, node.attributes[i].value)
}
return script
}
}
</script>
</body>
</html>