[csswg-drafts] [css-view-transitions] Automatically start view transitions for `<dialog>`, Popover, etc. (#8083)

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

== [css-view-transitions] Automatically start view transitions for `<dialog>`, Popover, etc. ==
This possibility was raised in https://github.com/whatwg/html/issues/7785#issuecomment-1316821685. The idea is that perhaps a ViewTransition could be automatically started, with appropriate modifications to existing algorithms, for `<dialog>`, [Popover](https://open-ui.org/components/popup.research.explainer), and perhaps even any element moving to/from `display:none`.

### Option 1: content attribute

One option would be to add a content attribute that confers this behavior:

```html
<dialog autostartatransition>
  When shown/closed, a View Transition will start
</dialog>
```

When that attribute is present, existing algorithms [such as `showModal()`](https://html.spec.whatwg.org/multipage/interactive-elements.html#dom-dialog-showmodal) would be modified to 1) start a ViewTransition, **then** 2) run existing steps for the algorithm that show/hide the element.

The content attribute approach would seem to work for most element types, including perhaps even when `<div autostartatransition>` becomes `<div style="display:none" autostartatransition>`. All of these would require thought about how to incorporate this behavior into all of the relevant spec algorithms.

### Option 2: individual APIs

Another alternative would be to modify existing APIs:

```javascript
myDialog.show({autostartatransition: true});
myDialog.showModal({autostartatransition: true});
myDialog.close({autostartatransition: true});
myPopover.showPopover({autostartatransition: true});
myPopover.hidePopover({autostartatransition: true});
```

I'm not sure how that would look for the plain `<div style="display:none">` example.


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


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

Received on Wednesday, 16 November 2022 20:07:33 UTC