1b55d4a389
This adds dynamic navigation of headers of the current page in the sidebar. This is intended to help the user see what is on the current page, and to be able to more easily navigate it. The "current" header is tracked based on the scrolling behavior of the user, and is marked with a small circle. This includes automatic folding to help keep it from being too unwieldy on a page with a lot of nested headers. This includes the `output.html.sidebar-header-nav` option to disable it. I'm sure there are tweaks, fixes, and improvements that can be made. I'd like to get this out now, and iterate on it over time to make improvements.
19 lines
852 B
Text
19 lines
852 B
Text
// When a header has various markup, the sidebar should replicate it.
|
|
|
|
set-window-size: (1400, 800)
|
|
go-to: |DOC_PATH| + "headings/markup.html"
|
|
|
|
assert-count: (".header-item", 5)
|
|
assert-count: (".current-header", 1)
|
|
assert-text: (".current-header", "Heading with code or italic or bold or strike")
|
|
assert-property: (".current-header", {"innerHTML": "Heading with <code>code</code> or <em>italic</em> or <strong>bold</strong> or <del>strike</del>"})
|
|
|
|
// Clicking the custom one should work and should make it current.
|
|
click: "a.header-in-summary[href='#custom-id']"
|
|
assert-count: (".current-header", 1)
|
|
assert-text: (".current-header", "Heading with a custom id")
|
|
|
|
// Click the one with HTML, and check it.
|
|
click: "a.header-in-summary[href='#heading-with-html']"
|
|
assert-count: (".current-header", 1)
|
|
assert-text: (".current-header", "Heading with html")
|