From 7f4affff5a56d2b36743de5b92d4753940e33b95 Mon Sep 17 00:00:00 2001
From: Volker Schukai <volker.schukai@schukai.com>
Date: Sat, 16 Nov 2024 18:49:46 +0100
Subject: [PATCH] fix(table-of-content): fix scroll down
---
.../navigation/table-of-content.mjs | 26 ++++++++++++++++---
1 file changed, 22 insertions(+), 4 deletions(-)
diff --git a/source/components/navigation/table-of-content.mjs b/source/components/navigation/table-of-content.mjs
index 6f44fa43f..862b4547e 100644
--- a/source/components/navigation/table-of-content.mjs
+++ b/source/components/navigation/table-of-content.mjs
@@ -162,7 +162,7 @@ class TableOfContent extends CustomElement {
if (this[scrollableParentSymbol] === getWindow()) {
if (
["absolute", "relative", "fixed", "sticky"].indexOf(
- this[scrollableParentSymbol].style.position,
+ this[scrollableParentSymbol]?.style?.position,
) === -1
) {
this.style.position = "relative";
@@ -176,7 +176,7 @@ class TableOfContent extends CustomElement {
} else {
if (
["absolute", "relative", "fixed", "sticky"].indexOf(
- this[scrollableParentSymbol].style.position,
+ this[scrollableParentSymbol]?.style?.position,
) === -1
) {
this[scrollableParentSymbol].style.position = "relative";
@@ -229,6 +229,25 @@ class TableOfContent extends CustomElement {
}
}
+/**
+ * @private
+ * @param element
+ * @returns {number|number|*|number}
+ */
+function getScrollHeight(element) {
+
+ if (element instanceof ShadowRoot) {
+ return element.host.scrollHeight;
+ }
+
+ if (element === getWindow()) {
+ return element.document.documentElement.scrollHeight;
+ }
+
+ return element.scrollHeight;
+
+}
+
/**
* @private
* @return {void}
@@ -339,7 +358,7 @@ function initNavigation() {
this[scrollableParentSymbol].scrollTo(
0,
- this[scrollableParentSymbol].scrollHeight,
+ getScrollHeight(this[scrollableParentSymbol]),
);
});
footer.appendChild(scrollToBottom);
@@ -428,7 +447,6 @@ function getHeadings() {
const headings = element.querySelectorAll("h1, h2, h3, h4, h5, h6");
let nodeList = Array.from(headings);
- // remove all with attribute data-monster-table-of-content-omit
nodeList = nodeList.filter((node) => {
return !node.hasAttribute("data-monster-table-of-content-omit");
});
--
GitLab