diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js
index 368092de45c9..f4dd91947e37 100644
--- a/js/src/scrollspy.js
+++ b/js/src/scrollspy.js
@@ -133,7 +133,7 @@ class ScrollSpy extends BaseComponent {
EventHandler.off(this._config.target, EVENT_CLICK)
EventHandler.on(this._config.target, EVENT_CLICK, SELECTOR_TARGET_LINKS, event => {
- const observableSection = this._observableSections.get(event.target.hash)
+ const observableSection = this._observableSections.get(event.delegateTarget.hash)
if (observableSection) {
event.preventDefault()
const root = this._rootElement || window
diff --git a/js/tests/unit/scrollspy.spec.js b/js/tests/unit/scrollspy.spec.js
index fc44471c42da..b4cb2c29ac2e 100644
--- a/js/tests/unit/scrollspy.spec.js
+++ b/js/tests/unit/scrollspy.spec.js
@@ -943,6 +943,24 @@ describe('ScrollSpy', () => {
link.click()
})
+ it('should smoothScroll when clicking an element nested in an anchor', () => {
+ fixtureEl.innerHTML = getDummyFixture()
+
+ const div = fixtureEl.querySelector('.content')
+ const link = fixtureEl.querySelector('[href="#div-jsm-1"]')
+ const observable = fixtureEl.querySelector('#div-jsm-1')
+ const clickSpy = getElementScrollSpy(div)
+ link.innerHTML = 'div 1'
+ // eslint-disable-next-line no-new
+ new ScrollSpy(div, {
+ offset: 1,
+ smoothScroll: true
+ })
+
+ link.querySelector('span').click()
+ expect(clickSpy).toHaveBeenCalledWith({ top: observable.offsetTop - div.offsetTop, behavior: 'smooth' })
+ })
+
it('should smoothscroll to observable with anchor link that contains a french word as id', done => {
fixtureEl.innerHTML = [
'