Skip to content

Commit beb0068

Browse files
committed
fix(scrollspy): support nested smooth-scroll links
1 parent e8c978d commit beb0068

2 files changed

Lines changed: 19 additions & 1 deletion

File tree

js/src/scrollspy.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ class ScrollSpy extends BaseComponent {
133133
EventHandler.off(this._config.target, EVENT_CLICK)
134134

135135
EventHandler.on(this._config.target, EVENT_CLICK, SELECTOR_TARGET_LINKS, event => {
136-
const observableSection = this._observableSections.get(event.target.hash)
136+
const observableSection = this._observableSections.get(event.delegateTarget.hash)
137137
if (observableSection) {
138138
event.preventDefault()
139139
const root = this._rootElement || window

js/tests/unit/scrollspy.spec.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -943,6 +943,24 @@ describe('ScrollSpy', () => {
943943
link.click()
944944
})
945945

946+
it('should smoothScroll when clicking an element nested in an anchor', () => {
947+
fixtureEl.innerHTML = getDummyFixture()
948+
949+
const div = fixtureEl.querySelector('.content')
950+
const link = fixtureEl.querySelector('[href="#div-jsm-1"]')
951+
const observable = fixtureEl.querySelector('#div-jsm-1')
952+
const clickSpy = getElementScrollSpy(div)
953+
link.innerHTML = '<span>div 1</span>'
954+
// eslint-disable-next-line no-new
955+
new ScrollSpy(div, {
956+
offset: 1,
957+
smoothScroll: true
958+
})
959+
960+
link.querySelector('span').click()
961+
expect(clickSpy).toHaveBeenCalledWith({ top: observable.offsetTop - div.offsetTop, behavior: 'smooth' })
962+
})
963+
946964
it('should smoothscroll to observable with anchor link that contains a french word as id', done => {
947965
fixtureEl.innerHTML = [
948966
'<nav id="navBar" class="navbar">',

0 commit comments

Comments
 (0)