Replace remaining calls to nextAnimationFrame by nextRepaint (hotwire…

…d#1102)

This ensures that page refreshes work properly when the page is in the background.

src/core/drive/visit.js

@@ -1,7 +1,7 @@
 import { FetchMethod, FetchRequest } from "../../http/fetch_request"
 import { getAnchor } from "../url"
 import { PageSnapshot } from "./page_snapshot"
-import { getHistoryMethodForAction, uuid } from "../../util"
+import { getHistoryMethodForAction, uuid, nextRepaint } from "../../util"
 import { StreamMessage } from "../streams/stream_message"
 import { ViewTransitioner } from "./view_transitioner"
 
@@ -418,9 +418,7 @@ export class Visit {
 
   async render(callback) {
     this.cancelRender()
-    await new Promise((resolve) => {
-      this.frame = requestAnimationFrame(() => resolve())
-    })
+    this.frame = await nextRepaint()
     await callback()
     delete this.frame
   }

src/core/frames/frame_renderer.js

@@ -1,4 +1,4 @@
-import { activateScriptElement, nextAnimationFrame } from "../../util"
+import { activateScriptElement, nextRepaint } from "../../util"
 import { Renderer } from "../renderer"
 
 export class FrameRenderer extends Renderer {
@@ -25,14 +25,14 @@ export class FrameRenderer extends Renderer {
   }
 
   async render() {
-    await nextAnimationFrame()
+    await nextRepaint()
     this.preservingPermanentElements(() => {
       this.loadFrameElement()
     })
     this.scrollFrameIntoView()
-    await nextAnimationFrame()
+    await nextRepaint()
     this.focusFirstAutofocusableElement()
-    await nextAnimationFrame()
+    await nextRepaint()
     this.activateScriptElements()
   }
 

src/core/streams/stream_message_renderer.js

@@ -1,6 +1,6 @@
 import { Bardo } from "../bardo"
 import { getPermanentElementById, queryPermanentElementsAll } from "../snapshot"
-import { around, elementIsFocusable, nextAnimationFrame, queryAutofocusableElement, uuid } from "../../util"
+import { around, elementIsFocusable, nextRepaint, queryAutofocusableElement, uuid } from "../../util"
 
 export class StreamMessageRenderer {
   render({ fragment }) {
@@ -57,7 +57,7 @@ async function withAutofocusFromFragment(fragment, callback) {
   }
 
   callback()
-  await nextAnimationFrame()
+  await nextRepaint()
 
   const hasNoActiveElement = document.activeElement == null || document.activeElement == document.body