[csswg-drafts] [css-view-transitions-2] Interacting with transition states (#8682)

jakearchibald has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-view-transitions-2] Interacting with transition states ==
With SPA transitions:

```js
const transition = document.startViewTransition(callback);

transition.updateCallbackDone.then(() => …);
transition.ready.then(() => …);
transition.finished.then(() => …);
transition.skipTransition();
```

`ready` is at the start of the transition. The pseudos exist at this point, so you can animate them with JavaScript.

`finished` is when the final state is visible and the pseudos are gone.

We want something similar for MPA transitions, except for `updateCallbackDone` which doesn't make sense for MPA, as the browser handles the update, and script can't span the update (the new page is a new scripting context).

Some options:

```js
document.addEventListener('crossdocviewtransition', (event) => {
  event.ready.then(() => …);
  event.finished.then(() => …);
  event.skipTransition();
});
```

Or:

```js
document.addEventListener('crossdocviewtransition', (event) => {
  event.transition.ready.then(() => …);
  event.transition.finished.then(() => …);
  event.transition.skipTransition();
});
```

The latter might be preferable, because it means a helper function can do things with a transition instance, and in most cases it won't matter if it's an MPA or SPA transition.

We could have a `ViewTransition` class that omits `updateCallbackDone`, and `document.startViewTransition` would return a `SameDocumentViewTransition` that inherits from `ViewTransition` and adds `updateCallbackDone`. Or, an MPA `ViewTransition` instance could just have a `updateCallbackDone` promise that's already fulfilled.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8682 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 4 April 2023 12:44:02 UTC