Enable HTML validation in CI

eXpl0it3r · eXpl0it3r · commit 1b3db5791074 · 2026-01-06T11:12:43.000+01:00
Fix invalid or outdated HTML
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -1,4 +1,4 @@
-name: Build
+name: Build, Validate, Package & Publish
 
 on: [push, pull_request, workflow_dispatch]
 
@@ -82,3 +82,20 @@ jobs:
         foreach ($file in (Get-ChildItem ${{ env.NuGetDirectory }} -Recurse -Include *.*nupkg)) {
           dotnet nuget push $file --skip-duplicate --api-key ${{steps.login.outputs.NUGET_API_KEY}} --source https://api.nuget.org/v3/index.json
         }
+
+  validate:
+    name: Validate HTML and CSS
+    runs-on: ubuntu-24.04
+    steps:
+    - name: Checkout HTML Renderer
+      uses: actions/checkout@v6
+
+    - name: Validate HTML
+      uses: anishathalye/proof-html@v2
+      with:
+        directory: ./Source
+        check_html: true
+        check_css: true
+        check_favicon: false
+        check_opengraph: false
+        validator_ignore: '.*Use CSS instead.*|.*An “img” element must have an “alt” attribute.*|.*abcdef-data.*|.*“&” did not start a character reference.*'
diff --git a/Source/Demo/Common/PerfSamples/1.Big table.htm b/Source/Demo/Common/PerfSamples/1.Big table.htm
@@ -1,7 +1,7 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<!DOCTYPE html>
 <html>
     <head>
-        <title></title>
+        <title>Big table</title>
         <style type="text/css">
             * {
                 margin: 0;
@@ -3082,6 +3082,5 @@ <h2 style="color: #666666; margin: 0 0 0 0; font-weight: normal; font-size: 24px
                 </tr>
             </tbody>
         </table>
-    </div>
     </body>
 </html>
diff --git a/Source/Demo/Common/Samples/00.Intro.htm b/Source/Demo/Common/Samples/00.Intro.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>Intro</title>
diff --git a/Source/Demo/Common/Samples/01.History.htm b/Source/Demo/Common/Samples/01.History.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <link rel="Stylesheet" href="StyleSheet" />
diff --git a/Source/Demo/Common/Samples/02.Text.htm b/Source/Demo/Common/Samples/02.Text.htm
@@ -1,4 +1,5 @@
-﻿<html>
+﻿<!DOCTYPE html>
+<html>
     <head>
         <title>Text</title>
         <link rel="Stylesheet" href="StyleSheet" />
diff --git a/Source/Demo/Common/Samples/03.Tables.htm b/Source/Demo/Common/Samples/03.Tables.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>Tables</title>
diff --git a/Source/Demo/Common/Samples/04.Links.htm b/Source/Demo/Common/Samples/04.Links.htm
@@ -1,7 +1,8 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>Links</title>
-        <link rel="Stylesheet" href="StyleSheet" />
+        <link rel="Stylesheet" href="StyleSheet">
     </head>
     <body>
         <h1>Links
diff --git a/Source/Demo/Common/Samples/05.Images.htm b/Source/Demo/Common/Samples/05.Images.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title></title>
diff --git a/Source/Demo/Common/Samples/06.Embeded video.htm b/Source/Demo/Common/Samples/06.Embeded video.htm
@@ -1,6 +1,8 @@
+<!DOCTYPE html>
 <html>
     <head>
-        <link rel="Stylesheet" href="StyleSheet" />
+        <title>Embeded video</title>
+        <link rel="Stylesheet" href="StyleSheet">
     </head>
     <body>
         <h1>
@@ -33,8 +35,8 @@ <h3>
             <h2>
                 Example
             </h2>
-            <iframe height="360" width="480" src="https://www.youtube.com/embed/2l_PmSOreGc" /><br /><br />
-            <iframe height="270" width="480" src="https://player.vimeo.com/video/170338499" />
+            <iframe height="360" width="480" src="https://www.youtube.com/embed/2l_PmSOreGc"></iframe><br /><br />
+            <iframe height="270" width="480" src="https://player.vimeo.com/video/170338499"></iframe>
         </blockquote>
     </body>
 </html>
diff --git a/Source/Demo/Common/Samples/07.Additional features.htm b/Source/Demo/Common/Samples/07.Additional features.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>Additional features</title>
diff --git a/Source/Demo/Common/Samples/08.Tooltip.htm b/Source/Demo/Common/Samples/08.Tooltip.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlToolTip</title>
diff --git a/Source/Demo/Common/Samples/09.Using the library.htm b/Source/Demo/Common/Samples/09.Using the library.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <link rel="Stylesheet" href="StyleSheet" />
diff --git a/Source/Demo/Common/Samples/10.HtmlPanel.htm b/Source/Demo/Common/Samples/10.HtmlPanel.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlPanel</title>
diff --git a/Source/Demo/Common/Samples/11.HtmlLabel.htm b/Source/Demo/Common/Samples/11.HtmlLabel.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlLabel</title>
diff --git a/Source/Demo/Common/Samples/12.HtmlToolTip.htm b/Source/Demo/Common/Samples/12.HtmlToolTip.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlToolTip</title>
diff --git a/Source/Demo/Common/Samples/13.HtmlRender.htm b/Source/Demo/Common/Samples/13.HtmlRender.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlRender Class</title>
diff --git a/Source/Demo/Common/Samples/14.HtmlContainer.htm b/Source/Demo/Common/Samples/14.HtmlContainer.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>HtmlContainer</title>
diff --git a/Source/Demo/Common/Samples/20.About.htm b/Source/Demo/Common/Samples/20.About.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <title>About</title>
diff --git a/Source/Demo/Common/TestSamples/01.Header.htm b/Source/Demo/Common/TestSamples/01.Header.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <span style="background-color: #eee">Stub simple text</span>
diff --git a/Source/Demo/Common/TestSamples/02.Line break.htm b/Source/Demo/Common/TestSamples/02.Line break.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <h1 style="background-color: #eee;">
diff --git a/Source/Demo/Common/TestSamples/03.Paragraphs.htm b/Source/Demo/Common/TestSamples/03.Paragraphs.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <h1 style="background-color: #aae;">Case 1</h1>
diff --git a/Source/Demo/Common/TestSamples/04.Blockquotes.htm b/Source/Demo/Common/TestSamples/04.Blockquotes.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <h1 style="background-color: #aea;">Case 1</h1>
diff --git a/Source/Demo/Common/TestSamples/05.Images.htm b/Source/Demo/Common/TestSamples/05.Images.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <h1 style="background-color: #aea;">Inline image</h1>
diff --git a/Source/Demo/Common/TestSamples/06.External Image.htm b/Source/Demo/Common/TestSamples/06.External Image.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/07.Background Image.htm b/Source/Demo/Common/TestSamples/07.Background Image.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <style>
diff --git a/Source/Demo/Common/TestSamples/08.White-space.htm b/Source/Demo/Common/TestSamples/08.White-space.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <p>
diff --git a/Source/Demo/Common/TestSamples/09.Inline.htm b/Source/Demo/Common/TestSamples/09.Inline.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/10.BlockInInline.htm b/Source/Demo/Common/TestSamples/10.BlockInInline.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/11.LineHeight.htm b/Source/Demo/Common/TestSamples/11.LineHeight.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body style="font: 10pt tahoma;">
         <h2>Control line height</h2>
diff --git a/Source/Demo/Common/TestSamples/12.Text.htm b/Source/Demo/Common/TestSamples/12.Text.htm
@@ -1,82 +1,83 @@
-﻿<html>
-    <head>
-        <title>Text</title>
-        <link rel="Stylesheet" href="StyleSheet" />
+﻿<!DOCTYPE html>
+<html>
+    <head>
+        <title>Text</title>
+        <link rel="Stylesheet" href="StyleSheet" />
         <style>
             .right {
                 text-align: right;
                 border-width: 1px;
                 border-style: solid;
                 border-color: blue;
             }
-        </style>
-    </head>
-    <body>
-        <h2>Case 1</h2>
-        <p>
-            <font size="5" color="red">Warning:</font>P tags must be closed. In fact all tags with the
-            end tag <a href="http://www.w3.org/TR//REC-html401-19991224/index/elements.html">marked as optional</a>, must be closed. It may be fixed by next release.
-        </p>
-        <hr />
-        <h2>Text align justify with background colors</h2>
-        <p style="text-align: justify">
-            <div>
-                Lorem ipsum dolor sit amet, <span style="background-color: gold;">consectetur</span> adipisicing
-                elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua tempor incididunt ut labore et dolore magna aliqua incididunt ut labore et dolore magna aliqua.
-            </div>
-        </p>
-        <hr />
-        <h2>Right align adjusts</h2>
-        <table style="border-spacing: 0px;">
-            <tr>
-                <td class="right">978</td>
-            </tr>
-            <tr>
-                <td class="right">32</td>
-            </tr>
-        </table>
-        <hr />
-        <h2>Transparent text</h2>
-        <p style="color: rgba(255, 0, 0, 100)">
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer sagittis. Fusce elementum commodo felis. Vivamus lacinia eleifend libero. Donec 
-            lacus. Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
-            elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
-        </p>
-
-        <p style="background-color: rgba(255, 215, 0, 50)">
-            <div style="color: rgba(0, 255, 0, 140)">
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer sagittis. Fusce elementum commodo felis. Vivamus lacinia eleifend libero. Donec 
-                lacus.
-            </div>
-
-            <div style="color: rgba(0, 0, 255, 100)">
-                Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
-                elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
-            </div>
-        </p>
-        <p style="background-color: #a33; background-gradient: rgb(255, 215, 0); background-gradient-angle: 0">
-            <div style="color: rgba(0, 255, 0, 140)">
-                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer_sagittis_Fusce_elementum_commodo_felis_Vivamus_lacinia_eleifend_libero_Donec 
-                lacus.
-            </div>
-
-            <div style="color: rgba(0, 0, 255, 100)">
-                Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
-                elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
-            </div>
-        </p>
-        <hr />
-        <h2>RTL text</h2>
-        <p>
-            <p style="text-align: right; direction: Rtl;">
-                <span>בדיקה של טקסט ימין לשמאל</span>
-            </p>
-            <p>
-                <span dir="rTL" lang="HE">בדיקה של טקסט ימין לשמאל</span> normal text
-            </p>
-            <p>
-                <span>בדיקה של טקסט ימין לשמאל</span> normal text
-            </p>
-        </p>
-    </body>
+        </style>
+    </head>
+    <body>
+        <h2>Case 1</h2>
+        <p>
+            <font size="5" color="red">Warning:</font>P tags must be closed. In fact all tags with the
+            end tag <a href="http://www.w3.org/TR//REC-html401-19991224/index/elements.html">marked as optional</a>, must be closed. It may be fixed by next release.
+        </p>
+        <hr />
+        <h2>Text align justify with background colors</h2>
+        <p style="text-align: justify">
+            <div>
+                Lorem ipsum dolor sit amet, <span style="background-color: gold;">consectetur</span> adipisicing
+                elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua tempor incididunt ut labore et dolore magna aliqua incididunt ut labore et dolore magna aliqua.
+            </div>
+        </p>
+        <hr />
+        <h2>Right align adjusts</h2>
+        <table style="border-spacing: 0px;">
+            <tr>
+                <td class="right">978</td>
+            </tr>
+            <tr>
+                <td class="right">32</td>
+            </tr>
+        </table>
+        <hr />
+        <h2>Transparent text</h2>
+        <p style="color: rgba(255, 0, 0, 100)">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer sagittis. Fusce elementum commodo felis. Vivamus lacinia eleifend libero. Donec 
+            lacus. Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
+            elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
+        </p>
+
+        <p style="background-color: rgba(255, 215, 0, 50)">
+            <div style="color: rgba(0, 255, 0, 140)">
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer sagittis. Fusce elementum commodo felis. Vivamus lacinia eleifend libero. Donec 
+                lacus.
+            </div>
+
+            <div style="color: rgba(0, 0, 255, 100)">
+                Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
+                elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
+            </div>
+        </p>
+        <p style="background-color: #a33; background-gradient: rgb(255, 215, 0); background-gradient-angle: 0">
+            <div style="color: rgba(0, 255, 0, 140)">
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare mollis elit. Integer_sagittis_Fusce_elementum_commodo_felis_Vivamus_lacinia_eleifend_libero_Donec 
+                lacus.
+            </div>
+
+            <div style="color: rgba(0, 0, 255, 100)">
+                Nam sit amet urna. Nullam nulla. Donec accumsan porta magna. Mauris a dolor eu elit rutrum commodo. Nam iaculis turpis non augue. Nullam lobortis egestas risus. Nulla 
+                elementum dolor ac mauris. Ut tristique. In varius volutpat metus. Integer leo dolor, tristique a, dignissim ac, iaculis eget, elit. Donec arcu.
+            </div>
+        </p>
+        <hr />
+        <h2>RTL text</h2>
+        <p>
+            <p style="text-align: right; direction: Rtl;">
+                <span>בדיקה של טקסט ימין לשמאל</span>
+            </p>
+            <p>
+                <span dir="rTL" lang="HE">בדיקה של טקסט ימין לשמאל</span> normal text
+            </p>
+            <p>
+                <span>בדיקה של טקסט ימין לשמאל</span> normal text
+            </p>
+        </p>
+    </body>
 </html>
diff --git a/Source/Demo/Common/TestSamples/13.Tables.htm b/Source/Demo/Common/TestSamples/13.Tables.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <head>
         <style type="text/css">
diff --git a/Source/Demo/Common/TestSamples/14.Iframes.htm b/Source/Demo/Common/TestSamples/14.Iframes.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/15.MaxWidth.htm b/Source/Demo/Common/TestSamples/15.MaxWidth.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/16.Borders.htm b/Source/Demo/Common/TestSamples/16.Borders.htm
@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
     <body>
         <div>
diff --git a/Source/Demo/Common/TestSamples/17.Languages.htm b/Source/Demo/Common/TestSamples/17.Languages.htm
@@ -1,4 +1,5 @@
-﻿<html>
+﻿<!DOCTYPE html>
+<html>
     <body>
         <div>
             <h2>Validate Unicode rendering</h2>
diff --git a/Source/Demo/Common/TestSamples/18.Anchors.htm b/Source/Demo/Common/TestSamples/18.Anchors.htm
@@ -1,4 +1,5 @@
-﻿<html>
+﻿<!DOCTYPE html>
+<html>
     <body>
         <p>
             <a href="#C4">See also Chapter 4.</a>
diff --git a/Source/Demo/Common/TestSamples/19.Many images.htm b/Source/Demo/Common/TestSamples/19.Many images.htm
diff --git a/Source/Demo/Common/TestSamples/20.Fonts decorations.htm b/Source/Demo/Common/TestSamples/20.Fonts decorations.htm
diff --git a/Source/Demo/Common/TestSamples/21.Bullets.htm b/Source/Demo/Common/TestSamples/21.Bullets.htm
diff --git a/Source/Demo/Common/TestSamples/22.RTL.htm b/Source/Demo/Common/TestSamples/22.RTL.htm
diff --git a/Source/Demo/Common/TestSamples/30.Misc.htm b/Source/Demo/Common/TestSamples/30.Misc.htm
diff --git a/Source/Demo/Common/TestSamples/31.ACID 1.htm b/Source/Demo/Common/TestSamples/31.ACID 1.htm
diff --git a/Source/Demo/Common/TestSamples/32.Image in css content.htm b/Source/Demo/Common/TestSamples/32.Image in css content.htm
diff --git a/Source/Demo/Common/TestSamples/33.Fixed position.htm b/Source/Demo/Common/TestSamples/33.Fixed position.htm
diff --git a/Source/Demo/Common/TestSamples/34.Breaking pages 1 - Paragraphs.htm b/Source/Demo/Common/TestSamples/34.Breaking pages 1 - Paragraphs.htm
diff --git a/Source/Demo/Common/TestSamples/35.Breaking pages 2 - Tables.htm b/Source/Demo/Common/TestSamples/35.Breaking pages 2 - Tables.htm

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,4 @@`
	`1`	`+<!DOCTYPE html>`
`1`	`2`	`<html>`
`2`	`3`	`<head>`
`3`	`4`	`<title>Intro</title>`