diff --git a/news/changelog-1.5.md b/news/changelog-1.5.md index 110f73a47b7..cb8e6a4bfb6 100644 --- a/news/changelog-1.5.md +++ b/news/changelog-1.5.md @@ -11,6 +11,7 @@ All changes included in 1.5: - ([#9125](https://github.com/quarto-dev/quarto-cli/issues/9125)): Fix issue in browser console with TOC selection when the document is using ids for headers with specific characters (e.g russian language headers). - ([#9539](https://github.com/quarto-dev/quarto-cli/issues/9539)): Improve SCSS of title blocks to avoid overwide columns in grid layout. - Improve accessibility `role` for `aria-expandable` elements by ensuring their role supports the `aria-expanded` attribute. +- ([#3178](https://github.com/quarto-dev/quarto-cli/issues/3178)): TOC now correctly expands when web page has no content to scroll to. ## PDF Format diff --git a/src/resources/formats/html/quarto.js b/src/resources/formats/html/quarto.js index 11803b02a70..260f0af417b 100644 --- a/src/resources/formats/html/quarto.js +++ b/src/resources/formats/html/quarto.js @@ -134,8 +134,10 @@ window.document.addEventListener("DOMContentLoaded", function (_event) { window.innerHeight + window.pageYOffset >= window.document.body.offsetHeight ) { + // This is the no-scroll case where last section should be the active one sectionIndex = 0; } else { + // This finds the last section visible on screen that should be made active sectionIndex = [...sections].reverse().findIndex((section) => { if (section) { return window.pageYOffset >= section.offsetTop - sectionMargin; @@ -739,6 +741,7 @@ window.document.addEventListener("DOMContentLoaded", function (_event) { // Process the collapse state if this is an UL if (el.tagName === "UL") { if (tocOpenDepth === -1 && depth > 1) { + // toc-expand: false el.classList.add("collapse"); } else if ( depth <= tocOpenDepth || @@ -757,10 +760,9 @@ window.document.addEventListener("DOMContentLoaded", function (_event) { }; // walk the TOC and expand / collapse any items that should be shown - if (tocEl) { - walk(tocEl, 0); updateActiveLink(); + walk(tocEl, 0); } // Throttle the scroll event and walk peridiocally @@ -779,6 +781,10 @@ window.document.addEventListener("DOMContentLoaded", function (_event) { window.addEventListener( "resize", throttle(() => { + if (tocEl) { + updateActiveLink(); + walk(tocEl, 0); + } if (!isReaderMode()) { hideOverlappedSidebars(); }