diff --git a/app/assets/javascripts/discourse/app/lib/after-frame-paint.js b/app/assets/javascripts/discourse/app/lib/after-frame-paint.js
index 9105167eaad..0e7a0f77d97 100644
--- a/app/assets/javascripts/discourse/app/lib/after-frame-paint.js
+++ b/app/assets/javascripts/discourse/app/lib/after-frame-paint.js
@@ -1,8 +1,13 @@
+import { registerWaiter } from "@ember/test";
+
 /**
  * Runs `callback` shortly after the next browser Frame is produced.
  * ref: https://webperf.tips/tip/measuring-paint-time
  */
 export default function runAfterFramePaint(callback) {
+  let done = false;
+  registerWaiter(() => done);
+
   // Queue a "before Render Steps" callback via requestAnimationFrame.
   requestAnimationFrame(() => {
     // MessageChannel is one of the highest priority task queues
@@ -10,7 +15,10 @@ export default function runAfterFramePaint(callback) {
     const messageChannel = new MessageChannel();
 
     // Setup the callback to run in a Task
-    messageChannel.port1.onmessage = callback;
+    messageChannel.port1.onmessage = () => {
+      done = true;
+      callback();
+    };
 
     // Queue the Task on the Task Queue
     messageChannel.port2.postMessage(undefined);