Skip to content

Commit 30956bd

Browse files
committed
refactor(datepicker): cut the focus-dismiss comments
Keep one note on why the listener is on document. Drop the rest.
1 parent 1d83017 commit 30956bd

2 files changed

Lines changed: 1 addition & 17 deletions

File tree

js/src/datepicker.ts

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -191,8 +191,6 @@ class Datepicker extends BaseComponent {
191191
this._themeObserver = null
192192
}
193193

194-
// The focus listener lives on `document`, so `BaseComponent.dispose()`, which
195-
// only clears listeners on `this._element`, cannot remove it.
196194
if (this._onFocusIn) {
197195
EventHandler.off(document, EVENT_FOCUSIN, this._onFocusIn)
198196
}
@@ -354,11 +352,7 @@ class Datepicker extends BaseComponent {
354352
})
355353
}
356354

357-
// Vanilla Calendar Pro closes the popup on an outside click and on Escape, but
358-
// it ignores focus. It also mounts the popup on `<body>`, not inside the
359-
// trigger, so a listener on the trigger never sees focus leave the calendar.
360-
// Watch focus on the document instead, and close when focus lands outside both
361-
// the trigger and the calendar.
355+
// VCP ignores focus and mounts the popup on `<body>`.
362356
protected _setupDismissOnFocus(): void {
363357
if (this._isInline) {
364358
return
@@ -372,9 +366,6 @@ class Datepicker extends BaseComponent {
372366
const { target } = event
373367
const mainElement = this._calendar?.context?.mainElement
374368

375-
// Focus stayed on the trigger or moved into the calendar popup. A focusin
376-
// only fires when focus actually moves, so a click on the calendar's own
377-
// padding raises no event and leaves the popup open, which VCP owns.
378369
if (target instanceof Node && (this._element.contains(target) || mainElement?.contains(target))) {
379370
return
380371
}
@@ -408,7 +399,6 @@ class Datepicker extends BaseComponent {
408399
this._syncThemeAttribute(self.context.mainElement)
409400
},
410401
onShow: () => {
411-
// Vanilla Calendar Pro defers the popup, so this can land after `dispose()`.
412402
if (!this._calendar) {
413403
return
414404
}

js/tests/unit/datepicker.spec.js

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -872,10 +872,6 @@ describe('Datepicker', () => {
872872
})
873873
})
874874

875-
// Vanilla Calendar Pro hides the popup on an outside click and on Escape, but
876-
// it never reacts to focus, and it mounts the popup on `<body>`. A document
877-
// focus listener closes the popup when focus lands outside both the trigger
878-
// and the calendar.
879875
describe('dismiss on focus', () => {
880876
const showDatepicker = (html = '<input type="text" data-bs-toggle="datepicker">') => {
881877
fixtureEl.innerHTML = `${html}<button type="button" id="outside">Outside</button>`
@@ -910,8 +906,6 @@ describe('Datepicker', () => {
910906
})
911907
})
912908

913-
// The popup mounts on `<body>`, so focus moving into it never bubbles
914-
// through the trigger. The listener must still keep the popup open.
915909
it('should not hide when focus moves into the calendar', () => {
916910
return showDatepicker().then(({ datepicker }) => {
917911
const dateBtn = datepicker._calendar.context.mainElement.querySelector('[data-vc-date-btn]')

0 commit comments

Comments
 (0)