fix(svelte): Data/code preloading doesn't work when using panels (#63339)

Fixes srch-507

The panels code prevents event propagation of mouse move events, which
in turn seems to prevent SvelteKit from its own preloading logic.

Looking at the event handlers it seems they are global only (per
document), so I don't think that stopping the propagation is necessary
for the panel itself to work. However, I think it makes sense to stop
any of default event behavior when the mouse is currently pressed, since
that means the user is currently dragging a resize handler. Would love
to get @vovakulikov's confirmation that my understanding is correct.

## Test plan

Manual testing. Changing the size of a panel (e.g. repo page) seems to
work as expected. Hovering over a file tree entry preloads data and code
now, as visible in the network tab.

Author: fkling

client/web-sveltekit/src/lib/wildcard/resizable-panel/PanelResizeHandleRegistry.ts

@@ -83,11 +83,11 @@ export class PanelResizeHandleRegistry {
             const { body } = ownerDocument
 
             body.removeEventListener('contextmenu', PanelResizeHandleRegistry.handlePointerUp)
-            body.removeEventListener('mousedown', PanelResizeHandleRegistry.handlePointerDown)
+            body.removeEventListener('mousedown', PanelResizeHandleRegistry.handlePointerDown, { capture: true })
             body.removeEventListener('mouseleave', PanelResizeHandleRegistry.handlePointerMove)
             body.removeEventListener('mousemove', PanelResizeHandleRegistry.handlePointerMove)
             body.removeEventListener('touchmove', PanelResizeHandleRegistry.handlePointerMove)
-            body.removeEventListener('touchstart', PanelResizeHandleRegistry.handlePointerDown)
+            body.removeEventListener('touchstart', PanelResizeHandleRegistry.handlePointerDown, { capture: true })
         })
 
         window.removeEventListener('mouseup', PanelResizeHandleRegistry.handlePointerUp)
@@ -119,12 +119,18 @@ export class PanelResizeHandleRegistry {
                     const { body } = ownerDocument
 
                     if (count > 0) {
-                        body.addEventListener('mousedown', PanelResizeHandleRegistry.handlePointerDown)
+                        // Capturing to prevent any other listeners from being triggered when the user really wants
+                        // to resize a panel
+                        body.addEventListener('mousedown', PanelResizeHandleRegistry.handlePointerDown, {
+                            capture: true,
+                        })
                         body.addEventListener('mousemove', PanelResizeHandleRegistry.handlePointerMove)
                         body.addEventListener('touchmove', PanelResizeHandleRegistry.handlePointerMove, {
                             passive: false,
                         })
-                        body.addEventListener('touchstart', PanelResizeHandleRegistry.handlePointerDown)
+                        body.addEventListener('touchstart', PanelResizeHandleRegistry.handlePointerDown, {
+                            capture: true,
+                        })
                     }
                 })
             }
@@ -169,16 +175,18 @@ export class PanelResizeHandleRegistry {
     static handlePointerMove(event: ResizeEvent) {
         const { x, y } = getResizeEventCoordinates(event)
 
-        event.preventDefault()
-        event.stopImmediatePropagation()
-
         if (!PanelResizeHandleRegistry.isPointerDown) {
             const { target } = event
 
             // Recalculate intersecting handles whenever the pointer moves, except if it has already been pressed
             // at that point, the handles may not move with the pointer (depending on constraints)
             // but the same set of active handles should be locked until the pointer is released
             PanelResizeHandleRegistry.recalculateIntersectingHandles({ target, x, y })
+        } else {
+            // These are required to prevent default browser behavior when dragging started not precisely on the handle
+            // For example when starting to drag the history panel up, the file content would be selected without these
+            event.preventDefault()
+            event.stopImmediatePropagation()
         }
 
         PanelResizeHandleRegistry.updateResizeHandlerStates('move', event)