👨🔬 Experiment/Hack: Automatically triggered View Transitions thanks to MutationObserver
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
Reposted from
Bramus
You can hack your way into this using MutationObserver.
POC: codepen.io/bramus/pen/z...
The observer undoes mutations like remove, and then reapplies that mutation wrapped in document.startViewTransition.
(This is a remake of codepen.io/bramus/pen/o..., which has View Transition JS intermixed)
POC: codepen.io/bramus/pen/z...
The observer undoes mutations like remove, and then reapplies that mutation wrapped in document.startViewTransition.
(This is a remake of codepen.io/bramus/pen/o..., which has View Transition JS intermixed)
Comments
It’s a very hacky workaround that, unfortunately, has a 1 frame glitch because I rely on my DIY CSS StyleObserver which can only respond to changes after rendering.
It was a nice experiment though :)