Skip to content

Commit a8e9b39

Browse files
Seray CiftciSeray Ciftci
authored andcommitted
Put target and requestPointerLock inside the pointerDown handler to fix dragging bug in Safari and Nightly
1 parent e89cded commit a8e9b39

1 file changed

Lines changed: 9 additions & 8 deletions

File tree

frontend/src/components/widgets/inputs/NumberInput.svelte

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -315,6 +315,13 @@
315315
// Don't drag the text value from is input element
316316
e.preventDefault();
317317
318+
// Get the click target and set the requestPointerLock immediately
319+
// Safari and Firefox Nightly require requestPointerLock() to be called directly inside the pointerdown handler.
320+
const target = e.target || undefined;
321+
if (!(target instanceof HTMLElement)) return;
322+
323+
target.requestPointerLock();
324+
318325
// Now we need to wait and see if the user follows this up with a mousemove or mouseup.
319326
320327
// For some reason, both events can get fired before their event listeners are removed, so we need to guard against both running.
@@ -325,7 +332,7 @@
325332
if (alreadyActedGuard) return;
326333
alreadyActedGuard = true;
327334
isDragging = true;
328-
beginDrag(e);
335+
beginDrag();
329336
removeEventListener("pointermove", onMove);
330337
};
331338
// If it's a mouseup, we'll begin editing the text field.
@@ -340,13 +347,7 @@
340347
addEventListener("pointerup", onUp);
341348
}
342349
343-
function beginDrag(e: PointerEvent) {
344-
// Get the click target
345-
const target = e.target || undefined;
346-
if (!(target instanceof HTMLElement)) return;
347-
348-
// Enter dragging state
349-
target.requestPointerLock();
350+
function beginDrag() {
350351
initialValueBeforeDragging = value;
351352
cumulativeDragDelta = 0;
352353

0 commit comments

Comments
 (0)