diff --git a/dev/optimized-appear/resync.html b/dev/optimized-appear/resync.html
index c15348ca0f..b2902b08e8 100644
--- a/dev/optimized-appear/resync.html
+++ b/dev/optimized-appear/resync.html
@@ -33,6 +33,7 @@
startOptimizedAppearAnimation,
optimizedAppearDataAttribute,
motionValue,
+ frame,
} = window.Motion
const { matchViewportBox } = window.Assert
const root = document.getElementById("root")
@@ -66,12 +67,17 @@
* On animation start, check the values we expect to see here
*/
onAnimationStart: () => {
- // matchViewportBox(document.getElementById("box"), {
- // top: 100,
- // right: 250,
- // left: 150,
- // bottom: 200,
- // })
+ frame.postRender(() => {
+ const box = document.getElementById("box")
+
+ if (!box) return
+
+ const { opacity } = window.getComputedStyle(box)
+
+ if (parseFloat(opacity) < 0.7) {
+ showError(box, "Resync failed")
+ }
+ })
},
[optimizedAppearDataAttribute]: "a",
})