update deprecated properties

src/components/image-comparer/image-comparer.test.ts

@@ -231,8 +231,8 @@ describe('<sl-image-comparer>', () => {
     const handle = el.shadowRoot!.querySelector<HTMLElement>('[part~="handle"]')!;
     const base = el.shadowRoot!.querySelector<HTMLElement>('[part~="base"]')!;
     const rect = base.getBoundingClientRect();
-    const offsetX = rect.left + window.pageXOffset;
-    const offsetY = rect.top + window.pageYOffset;
+    const offsetX = rect.left + window.scrollX;
+    const offsetY = rect.top + window.scrollY;
 
     handle.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
 

src/internal/drag.ts

@@ -16,8 +16,8 @@ export function drag(container: HTMLElement, options?: Partial<DragOptions>) {
   function move(pointerEvent: PointerEvent) {
     const dims = container.getBoundingClientRect();
     const defaultView = container.ownerDocument.defaultView!;
-    const offsetX = dims.left + defaultView.pageXOffset;
-    const offsetY = dims.top + defaultView.pageYOffset;
+    const offsetX = dims.left + defaultView.scrollX;
+    const offsetY = dims.top + defaultView.scrollY;
     const x = pointerEvent.pageX - offsetX;
     const y = pointerEvent.pageY - offsetY;
 

src/internal/test.ts

@@ -2,8 +2,8 @@ import { sendMouse } from '@web/test-runner-commands';
 
 function determineMousePosition(el: Element, position: string, offsetX: number, offsetY: number) {
   const { x, y, width, height } = el.getBoundingClientRect();
-  const centerX = Math.floor(x + window.pageXOffset + width / 2);
-  const centerY = Math.floor(y + window.pageYOffset + height / 2);
+  const centerX = Math.floor(x + window.scrollX + width / 2);
+  const centerY = Math.floor(y + window.scrollY + height / 2);
   let clickX: number;
   let clickY: number;