@vaadin-component-factory/vcf-anchor-nav - npm Package Compare versions

Comparing version 0.1.5 to 0.1.6

package.json

 {
   "name": "@vaadin-component-factory/vcf-anchor-nav",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Component with tabs used as anchor navigation and content sections. Automates the linking of tabs and sections.",
@@ -5,0 +5,0 @@ "main": "theme/lumo/vcf-anchor-nav.js",

src/vcf-anchor-nav.js

@@ -84,3 +84,3 @@ /**
   static get version() {
-    return '0.1.5';
+    return '0.1.6';
   }
@@ -147,7 +147,10 @@
       this._initTabHighlight();
-      // Scroll to URL hash if possible
-      if (location.hash) {
-        const section = this.querySelector(location.hash);
-        if (section) this.scrollTo({ top: section.offsetTop - this.$.tabs.clientHeight });
-      }
+      // Hack to fix initial scroll on Firefox
+      setTimeout(() => {
+        // Scroll to URL hash if possible
+        if (location.hash) {
+          const section = this.querySelector(location.hash);
+          if (section) this.scrollTo({ top: section.offsetTop - this.$.tabs.clientHeight });
+        }
+      });
     }
@@ -164,6 +167,10 @@ }
     this.sections.forEach(element => {
+      // This factor value can be adjusted however
+      // Below 0.7 in Firefox the highlighting is inconsistent
+      // Above 0.9 all browsers may not work correctly
+      const factor = 0.75;
       const height = this.clientHeight - this.$.tabs.clientHeight;
       const options = {
         root: this,
-        threshold: element.clientHeight > height ? (height / element.clientHeight) * 0.6 : 1
+        threshold: element.clientHeight > height ? (height / element.clientHeight) * factor : 1
       };
@@ -170,0 +177,0 @@ const observer = new IntersectionObserver(callback, options);

No alert changes

Improved metrics

Total package byte prevSize

166388

increased by0.18%

Lines of code

1758

increased by0.4%

No dependency changes