more reliable scrollspy

[git-user-hub]

Why not keep it simple?

window.addEventListener('DOMContentLoaded', () => {
	const options = {
		rootMargin: '0px 0px -70%'
	}
	const observer = new IntersectionObserver((entries) => {
		entries.forEach((entry) => {
			const id = entry.target.id;
			const activeLink = document.querySelector(`a.nav-link[href="#${id}"]`);
			if (entry.isIntersecting) {
				activeLink.classList.add('active');
			} else {
				activeLink.classList.remove('active');
			}
		});
	}, options);

	const navLinks = document.querySelectorAll('a.nav-link[href^="#"]');
	navLinks.forEach((link) => {
		const id = link.hash.slice(1);
		const idContainer = document.querySelector(`[id="${id}"]`);
		if (idContainer) {
			observer.observe(idContainer);
		}
	});
});

Maybe take these defaults:
rootMargin: '0px 0px -70%'
and default threshold of 0

Edit:
That should be quite universal now.
Taking into account all id's, but checking if a corresponding nav link exists.

Edit:
Only check for id's that appear in a.nav-link.
Adding and removing .active for current id is more robust when scrolling up / down right after each other.

[GeoSot]

This would be a fine change as it would be more stable. However any behavior change, would be breaking, until, we change to the next major version

[git-user-hub]

v6 is fine - thank you for your efforts