[clang-doc] `<ul>` must be nested in `<li>` (#168972)

The HTML spec states that only `<li>` can be children of `<ul>`. Nested
`<ul>` tags in an unordered list must be children of `<li>`.

3 files changed, 80 insertions, 62 deletions

diff --git a/clang-tools-extra/clang-doc/assets/class-template.mustache b/clang-tools-extra/clang-doc/assets/class-template.mustache
index 8eb28f33e65f..c5187026a239 100644
--- a/clang-tools-extra/clang-doc/assets/class-template.mustache
+++ b/clang-tools-extra/clang-doc/assets/class-template.mustache
@@ -50,18 +50,21 @@
                 <li class="sidebar-section">
                     <a class="sidebar-item" href="#PublicMembers">Public Members</a>
                 </li>
-                <ul>
-                    {{#PublicMembers}}
-                    <li class="sidebar-item-container">
-                        <a class="sidebar-item" href="#{{Name}}">{{Name}}</a>
-                    </li>
-                    {{/PublicMembers}}
-                </ul>
+                <li>
+                    <ul>
+                        {{#PublicMembers}}
+                        <li class="sidebar-item-container">
+                            <a class="sidebar-item" href="#{{Name}}">{{Name}}</a>
+                        </li>
+                        {{/PublicMembers}}
+                    </ul>
+                </li>
                 {{/HasPublicMembers}}
                 {{#ProtectedMembers}}
-                    <li class="sidebar-section">
-                        <a class="sidebar-item" href="#PublicMethods">Protected Members</a>
-                    </li>
+                <li class="sidebar-section">
+                    <a class="sidebar-item" href="#PublicMethods">Protected Members</a>
+                </li>
+                <li>
                     <ul>
                         {{#Obj}}
                             <li class="sidebar-item-container">
@@ -69,42 +72,49 @@
                             </li>
                         {{/Obj}}
                     </ul>
+                </li>
                 {{/ProtectedMembers}}
                 {{#HasPublicFunctions}}
                 <li class="sidebar-section">
                     <a class="sidebar-item" href="#PublicMethods">Public Method</a>
                 </li>
-                <ul>
-                    {{#PublicFunctions}}
-                    <li class="sidebar-item-container">
-                        <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
-                    </li>
-                    {{/PublicFunctions}}
-                </ul>
+                <li>
+                    <ul>
+                        {{#PublicFunctions}}
+                        <li class="sidebar-item-container">
+                            <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
+                        </li>
+                        {{/PublicFunctions}}
+                    </ul>
+                </li>
                 {{/HasPublicFunctions}}
                 {{#ProtectedFunction}}
                 <li class="sidebar-section">
                     <a class="sidebar-item" href="#ProtectedFunction">Protected Method</a>
                 </li>
-                <ul>
-                    {{#Obj}}
-                    <li class="sidebar-item-container">
-                        <a class="sidebar-item" href="#{{ID}}">{{Name}}</a>
-                    </li>
-                    {{/Obj}}
-                </ul>
+                <li>
+                    <ul>
+                        {{#Obj}}
+                        <li class="sidebar-item-container">
+                            <a class="sidebar-item" href="#{{ID}}">{{Name}}</a>
+                        </li>
+                        {{/Obj}}
+                    </ul>
+                </li>
                 {{/ProtectedFunction}}
                 {{#Enums}}
                 <li class="sidebar-section">
                     <a class="sidebar-item" href="#Enums">Enums</a>
                 </li>
-                <ul>
-                    {{#Obj}}
-                    <li class="sidebar-item-container">
-                        <a class="sidebar-item" href="#{{USR}}">{{EnumName}}</a>
-                    </li>
-                    {{/Obj}}
-                </ul>
+                <li>
+                    <ul>
+                        {{#Obj}}
+                        <li class="sidebar-item-container">
+                            <a class="sidebar-item" href="#{{USR}}">{{EnumName}}</a>
+                        </li>
+                        {{/Obj}}
+                    </ul>
+                </li>
                 {{/Enums}}
                 {{#Typedef}}
                 <li class="sidebar-section">Typedef</li>
@@ -113,13 +123,15 @@
                 <li class="sidebar-section">
                     <a class="sidebar-item" href="#Classes">Inner Classes</a>
                 </li>
-                <ul>
-                    {{#Links}}
-                    <li class="sidebar-item-container">
-                        <a class="sidebar-item" href="#{{ID}}">{{Name}}</a>
-                    </li>
-                    {{/Links}}
-                </ul>
+                <li>
+                    <ul>
+                        {{#Links}}
+                        <li class="sidebar-item-container">
+                            <a class="sidebar-item" href="#{{ID}}">{{Name}}</a>
+                        </li>
+                        {{/Links}}
+                    </ul>
+                </li>
                 {{/Record}}
             </ul>
         </div>
diff --git a/clang-tools-extra/clang-doc/assets/namespace-template.mustache b/clang-tools-extra/clang-doc/assets/namespace-template.mustache
index 614023b9f672..8a5be46aee28 100644
--- a/clang-tools-extra/clang-doc/assets/namespace-template.mustache
+++ b/clang-tools-extra/clang-doc/assets/namespace-template.mustache
@@ -50,25 +50,29 @@
                         <li class="sidebar-section">
                             <a class="sidebar-item" href="#Enums">Enums</a>
                         </li>
-                        <ul>
-                            {{#Enums}}
-                            <li class="sidebar-item-container">
-                                <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
-                            </li>
-                            {{/Enums}}
-                        </ul>
+                        <li>
+                            <ul>
+                                {{#Enums}}
+                                <li class="sidebar-item-container">
+                                    <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
+                                </li>
+                                {{/Enums}}
+                            </ul>
+                        </li>
                         {{/HasEnums}}
                         {{#HasRecords}}
                         <li class="sidebar-section">
                             <a class="sidebar-item" href="#Classes">Inner Classes</a>
                         </li>
-                        <ul>
-                            {{#Records}}
-                            <li class="sidebar-item-container">
-                                <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
-                            </li>
-                            {{/Records}}
-                        </ul>
+                        <li>
+                            <ul>
+                                {{#Records}}
+                                <li class="sidebar-item-container">
+                                    <a class="sidebar-item" href="#{{USR}}">{{Name}}</a>
+                                </li>
+                                {{/Records}}
+                            </ul>
+                        </li>
                         {{/HasRecrods}}
                     </ul>
                 </div>
diff --git a/clang-tools-extra/test/clang-doc/mustache-index.cpp b/clang-tools-extra/test/clang-doc/mustache-index.cpp
index 7b98c6b7c988..19e0b32d3d4a 100644
--- a/clang-tools-extra/test/clang-doc/mustache-index.cpp
+++ b/clang-tools-extra/test/clang-doc/mustache-index.cpp
@@ -13,19 +13,21 @@ class Foo;
 // CHECK:       <li class="sidebar-section">
 // CHECK-NEXT:      <a class="sidebar-item" href="#Enums">Enums</a>
 // CHECK-NEXT:  </li>
-// CHECK-NEXT:  <ul>
-// CHECK-NEXT:      <li class="sidebar-item-container">
-// CHECK-NEXT:          <a class="sidebar-item" href="#{{[0-9A-F]*}}">Color</a>
-// CHECK-NEXT:      </li>
-// CHECK-NEXT:  </ul>
+// CHECK-NEXT:  <li>
+// CHECK-NEXT:      <ul>
+// CHECK-NEXT:          <li class="sidebar-item-container">
+// CHECK-NEXT:              <a class="sidebar-item" href="#{{[0-9A-F]*}}">Color</a>
+// CHECK-NEXT:          </li>
+// CHECK-NEXT:      </ul>
 // CHECK:           <li class="sidebar-section">
 // CHECK-NEXT:          <a class="sidebar-item" href="#Classes">Inner Classes</a>
 // CHECK-NEXT:      </li>
-// CHECK-NEXT:  <ul>
-// CHECK-NEXT:      <li class="sidebar-item-container">
-// CHECK-NEXT:          <a class="sidebar-item" href="#{{[0-9A-F]*}}">Foo</a>
-// CHECK-NEXT:      </li>
-// CHECK-NEXT:  </ul>
+// CHECK-NEXT:  <li>
+// CHECK-NEXT:      <ul>
+// CHECK-NEXT:          <li class="sidebar-item-container">
+// CHECK-NEXT:              <a class="sidebar-item" href="#{{[0-9A-F]*}}">Foo</a>
+// CHECK-NEXT:          </li>
+// CHECK-NEXT:      </ul>
 
 // CHECK:       <section id="Enums" class="section-container">
 // CHECK-NEXT:      <h2>Enumerations</h2>