fix(player): releasing slider should not trigger other elements

closes #1226
vidstack · Apr 22, 2024 · 5548a15 · 5548a15
1 parent e7e5d65
commit 5548a15
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/packages/vidstack/src/components/ui/sliders/slider/events-controller.ts b/packages/vidstack/src/components/ui/sliders/slider/events-controller.ts
@@ -149,7 +149,7 @@ export class SliderEventsController extends ViewController<
   private _attachPointerListeners() {
     if (this._delegate._isDisabled() || !this.$state.dragging()) return;
 
-    listenEvent(document, 'pointerup', this._onDocumentPointerUp.bind(this));
+    listenEvent(document, 'pointerup', this._onDocumentPointerUp.bind(this), { capture: true });
     listenEvent(document, 'pointermove', this._onDocumentPointerMove.bind(this));
     listenEvent(document, 'touchmove', this._onDocumentTouchMove.bind(this), {
       passive: false,
@@ -359,6 +359,10 @@ export class SliderEventsController extends ViewController<
 
   private _onDocumentPointerUp(event: PointerEvent) {
     if (event.button !== 0) return;
+
+    event.preventDefault();
+    event.stopImmediatePropagation();
+
     const value = this._getPointerValue(event);
     this._updatePointerValue(value, event);
     this._onStopDragging(value, event);

diff --git a/packages/vidstack/src/utils/dom.ts b/packages/vidstack/src/utils/dom.ts
@@ -142,7 +142,7 @@ export function onPress(
   handler: (event: PointerEvent | KeyboardEvent) => void,
 ) {
   listenEvent(target, 'pointerup', (event) => {
-    if (event.button === 0) handler(event);
+    if (event.button === 0 && !event.defaultPrevented) handler(event);
   });
   listenEvent(target, 'keydown', (event) => {
     if (isKeyboardClick(event)) handler(event);