Unordered lists nested within ordered lists force the remaining ordered list items to use bullets

[superheroben]

Having an issue that whenever an ordered list has a sub unordered list its any of the following ordered list items are no longer numbered but are presented as bullets

Here is the HTML that was provided to DOMPDF:

<ol>
   <li>Make sure you're prepared to safely make observations during the eclipse. Never look directly at the Sun without specialized eclipse viewing glasses. Do not point any viewing devices or cameras at the Sun without specially made protective solar film securely attached over the lenses.</li>
   <li>Prepare your materials at least two hours before the eclipse reaches its peak in your area.</li>
      <ul>
          <li><span>Download the&nbsp;</span><a href="https://observer.globe.gov/about/get-the-app" target="_blank"><b>GLOBE Observer app</b></a><span>&nbsp;on your smartphone.</span></li>
          <li><span>Familiarize yourself with the types of data to record, and how to take recordings:&nbsp;</span><a href="https://observer.globe.gov/do-globe-observer/eclipse/taking-observations" target="_blank">https://observer.globe.gov/do-globe-observer/eclipse/taking-observations</a></li>
          <li>Optional: assemble a team! This project will involve taking many data recordings over a span of four hours. Having a team of fellow citizen scientists will make it much easier to collect data.</li>
      </ul>
   <li>Start taking observations two hours before the eclipse reaches its peak, and continue making observations for two hours afterward.</li>
      <ul>
          <li>Cloud type and cover: Record the types of clouds and the overall level of cloud cover every 15-30 minutes.</li>
          <li>Air temperature: Record the air temperature every 10 minutes. Be sure to take your recordings in a shaded area.</li>
      </ul>
   <li>Submit your data!</li>
</ol>

[superheroben]

Sorry that image should say "Should be 3 and 4"....Not enough coffee today

[bsweeney]

Indentation is all wonky as well. Seems to be an issue starting with the 2.0.0 release. The 1.2.2 release renders this correctly.

Reviewing the DOM after document ingestion it looks like the rendering difference is caused by the HTML5 parser. It's attempting to clean up the HTML since the document structure is not strictly valid. Your nested lists should be within an LI since LI elements are the only allowed children of OL/UL elements, per the spec.

The following renders as expected:

<ol>
   <li>Make sure you're prepared to safely make observations during the eclipse. Never look directly at the Sun without specialized eclipse viewing glasses. Do not point any viewing devices or cameras at the Sun without specially made protective solar film securely attached over the lenses.</li>
   <li>Prepare your materials at least two hours before the eclipse reaches its peak in your area.
      <ul>
          <li><span>Download the&nbsp;</span><a href="https://observer.globe.gov/about/get-the-app" target="_blank"><b>GLOBE Observer app</b></a><span>&nbsp;on your smartphone.</span></li>
          <li><span>Familiarize yourself with the types of data to record, and how to take recordings:&nbsp;</span><a href="https://observer.globe.gov/do-globe-observer/eclipse/taking-observations" target="_blank">https://observer.globe.gov/do-globe-observer/eclipse/taking-observations</a></li>
          <li>Optional: assemble a team! This project will involve taking many data recordings over a span of four hours. Having a team of fellow citizen scientists will make it much easier to collect data.</li>
      </ul>
      </li>
   <li>Start taking observations two hours before the eclipse reaches its peak, and continue making observations for two hours afterward.
      <ul>
          <li>Cloud type and cover: Record the types of clouds and the overall level of cloud cover every 15-30 minutes.</li>
          <li>Air temperature: Record the air temperature every 10 minutes. Be sure to take your recordings in a shaded area.</li>
      </ul>
      </li>
   <li>Submit your data!</li>
</ol>

This is probably a common enough scenario it's worth further review for improved handling.

[superheroben]

Ok that makes sense. That HTML comes from a wisiwig somewhere. I might just write a function to look for incorrectly nested elements and correct them. Thanks for your response.

…

On April 17, 2024 at 2:24:22 PM, Brian Sweeney ***@***.***) wrote: Indentation is all wonky as well. Seems to be an issue starting with the 2.0.0 release. The 1.2.2 release renders this correctly. Reviewing the DOM after document ingestion it looks like the rendering difference is caused by the HTML5 parser. It's attempting to clean up the HTML since the document structure is not strictly valid. Your nested lists should be within an LI since LI elements are the only allowed children of OL/UL elements, per the spec. The following renders as expected: <ol> <li>Make sure you're prepared to safely make observations during the eclipse. Never look directly at the Sun without specialized eclipse viewing glasses. Do not point any viewing devices or cameras at the Sun without specially made protective solar film securely attached over the lenses.</li> <li>Prepare your materials at least two hours before the eclipse reaches its peak in your area. <ul> <li><span>Download the&nbsp;</span><a href="https://observer.globe.gov/about/get-the-app" target="_blank"><b>GLOBE Observer app</b></a><span>&nbsp;on your smartphone.</span></li> <li><span>Familiarize yourself with the types of data to record, and how to take recordings:&nbsp;</span><a href="https://observer.globe.gov/do-globe-observer/eclipse/taking-observations" target="_blank">https://observer.globe.gov/do-globe-observer/eclipse/taking-observations</a></li> <li>Optional: assemble a team! This project will involve taking many data recordings over a span of four hours. Having a team of fellow citizen scientists will make it much easier to collect data.</li> </ul> </li> <li>Start taking observations two hours before the eclipse reaches its peak, and continue making observations for two hours afterward. <ul> <li>Cloud type and cover: Record the types of clouds and the overall level of cloud cover every 15-30 minutes.</li> <li>Air temperature: Record the air temperature every 10 minutes. Be sure to take your recordings in a shaded area.</li> </ul> </li> <li>Submit your data!</li> </ol> This is probably a common enough scenario it's worth further review for improved handling. — Reply to this email directly, view it on GitHub <#3440 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AABSZLR4ZDLQKHRO5GC2HKDY5245NAVCNFSM6AAAAABGLYIZU6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDANRRHE2DANBRG4> . You are receiving this because you authored the thread.Message ID: ***@***.***>