Update fixture

facebook · Jan 10, 2025 · d122cad · d122cad
1 parent 6e23a51
commit d122cad
Showing 1 changed file with 10 additions and 14 deletions.
diff --git a/fixtures/view-transition/src/components/Page.js b/fixtures/view-transition/src/components/Page.js
@@ -37,21 +37,17 @@ function Component() {
 }
 
 export default function Page({url, navigate}) {
-  const ref = useRef();
   const show = url === '/?b';
-  useLayoutEffect(() => {
-    const viewTransition = ref.current;
-    requestAnimationFrame(() => {
-      const keyframes = [
-        {rotate: '0deg', transformOrigin: '30px 8px'},
-        {rotate: '360deg', transformOrigin: '30px 8px'},
-      ];
-      viewTransition.old.animate(keyframes, 300);
-      viewTransition.new.animate(keyframes, 300);
-    });
-  }, [show]);
+  function onTransition(viewTransition) {
+    const keyframes = [
+      {rotate: '0deg', transformOrigin: '30px 8px'},
+      {rotate: '360deg', transformOrigin: '30px 8px'},
+    ];
+    viewTransition.old.animate(keyframes, 250);
+    viewTransition.new.animate(keyframes, 250);
+  }
   const exclamation = (
-    <ViewTransition name="exclamation">
+    <ViewTransition name="exclamation" onShare={onTransition}>
       <span>!</span>
     </ViewTransition>
   );
@@ -76,7 +72,7 @@ export default function Page({url, navigate}) {
               {a}
             </div>
           )}
-          <ViewTransition ref={ref}>
+          <ViewTransition>
             {show ? <div>hello{exclamation}</div> : <section>Loading</section>}
           </ViewTransition>
           <p>scroll me</p>