fix(ui): defer scroll restoration

static/app/components/core/useScrollLock.spec.tsx

@@ -6,12 +6,14 @@ describe('useScrollLock', () => {
   let container: HTMLElement;
 
   beforeEach(() => {
+    jest.useFakeTimers();
     container = document.createElement('div');
     container.style.overflow = 'auto';
     document.body.appendChild(container);
   });
 
   afterEach(() => {
+    jest.useRealTimers();
     document.body.removeChild(container);
   });
 
@@ -197,6 +199,7 @@ describe('useScrollLock', () => {
     expect(document.body).toHaveStyle({right: ''});
     expect(document.body).toHaveStyle({width: ''});
     expect(document.body).toHaveStyle({paddingRight: ''});
+    jest.runAllTimers();
     expect(scrollToSpy).toHaveBeenCalledWith(scrollX, scrollY);
 
     Object.defineProperty(window, 'innerWidth', {

static/app/components/core/useScrollLock.tsx

@@ -11,8 +11,7 @@ class Lock {
     top: string;
     width: string;
   } | null = null;
-  private scrollX = 0;
-  private scrollY = 0;
+  private scroll: {x: number; y: number} = {x: 0, y: 0};
   private container: HTMLElement;
 
   constructor(container: HTMLElement) {
@@ -23,8 +22,7 @@ class Lock {
     if (this.acquiredBy.size === 0) {
       if (this.container === document.body) {
         // Keep root overflow unchanged so sticky sidebars stay visible.
-        this.scrollX = window.scrollX;
-        this.scrollY = window.scrollY;
+        this.scroll = {x: window.scrollX, y: window.scrollY};
         this.initialBodyStyles = {
           position: document.body.style.position,
           top: document.body.style.top,
@@ -39,7 +37,7 @@ class Lock {
         const existingPaddingRight =
           Number.parseFloat(getComputedStyle(document.body).paddingRight) || 0;
         document.body.style.position = 'fixed';
-        document.body.style.top = `-${this.scrollY}px`;
+        document.body.style.top = `-${this.scroll.y}px`;
         document.body.style.left = '0';
         document.body.style.right = '0';
         document.body.style.width = '100%';
@@ -63,7 +61,12 @@ class Lock {
         document.body.style.right = this.initialBodyStyles.right;
         document.body.style.width = this.initialBodyStyles.width;
         document.body.style.paddingRight = this.initialBodyStyles.paddingRight;
-        window.scrollTo(this.scrollX, this.scrollY);
+        const {x, y} = this.scroll;
+        requestAnimationFrame(() => {
+          if (this.acquiredBy.size === 0) {
+            window.scrollTo(x, y);
+          }
+        });
         this.initialBodyStyles = null;
       }