Infrastructure: Fix color contrast failure in HTML source display (pull

#2939) Fixes syntax highlighting bug in the HTML source display on example pages (issue #2815): * Update highlightjs to latest version and replace references to highlight.pack.js * Rename highlight.min.js to highlight.pack.js * Updating init script highlight js * Replace break element with new line
w3c · Apr 7, 2024 · 994d35f · 994d35f
1 parent 003ffd2
commit 994d35f
Show file tree

Hide file tree

Showing 3 changed files with 343 additions and 8 deletions.
diff --git a/content/shared/js/app.js b/content/shared/js/app.js
@@ -4,7 +4,7 @@
 
 (function () {
   // Load syntax highlighting
-  hljs.initHighlightingOnLoad();
+  hljs.highlightAll();
 
   // Add usage warning to all examples
   window.addEventListener('DOMContentLoaded', addExampleUsageWarning, false);

diff --git a/content/shared/js/examples.js b/content/shared/js/examples.js
@@ -129,7 +129,7 @@ aria.widget.SourceCode.prototype.createCode = function (
     var openTag = '';
     var nodeNameStr = node.nodeName.toLowerCase();
 
-    openTag += '<br/>' + indentation(indentLevel) + '&lt;' + nodeNameStr;
+    openTag += '\n' + indentation(indentLevel) + '&lt;' + nodeNameStr;
 
     var wrapAttributes = node.attributes.length > 2;
 
@@ -143,7 +143,7 @@ aria.widget.SourceCode.prototype.createCode = function (
         node.attributes[attrPos].nodeName + '="' + attributeValue + '"';
 
       if (wrapAttributes && attrPos !== node.attributes.length - 1) {
-        openTag += '<br/>' + indentation(indentLevel);
+        openTag += '\n' + indentation(indentLevel);
         openTag += '&nbsp;'.repeat(nodeNameStr.length + 2);
       }
     }
@@ -173,7 +173,7 @@ aria.widget.SourceCode.prototype.createCode = function (
             indentation(indentLevel)
           );
 
-          sourceCodeNode.innerHTML += '<br/>' + textNodeContent;
+          sourceCodeNode.innerHTML += '\n' + textNodeContent;
         }
         break;
 
@@ -186,7 +186,7 @@ aria.widget.SourceCode.prototype.createCode = function (
             indentation(indentLevel)
           );
 
-          sourceCodeNode.innerHTML += '<br/>' + commentNodeContent;
+          sourceCodeNode.innerHTML += '\n' + commentNodeContent;
         }
         break;
     }
@@ -198,7 +198,7 @@ aria.widget.SourceCode.prototype.createCode = function (
     var closeTag = '&lt;/' + node.nodeName.toLowerCase() + '&gt;';
 
     if (node.childNodes.length > 0) {
-      sourceCodeNode.innerHTML += '<br/>' + indentation(indentLevel);
+      sourceCodeNode.innerHTML += '\n' + indentation(indentLevel);
     }
 
     sourceCodeNode.innerHTML += closeTag;