Re: [csswg-drafts] [css-view-transitions-1] User input should be ignored when rendering is suppressed. (#7797)

> With the pseudos, input goes to the document element.

Input doesn't necessarily go to the document element for the transition pseudos case. Try the following example:

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <style>
    .before {
      background: grey;
    }
    .after {
      background: lightblue;
    }
   
    #target {
      view-transition-name: target;
      contain: layout;
    }
    html {
      view-transition-name: none;
    }
    html::view-transition-new(*) {
      animation-duration: 5s;
    }
  </style>
</head>
<body>
  <script>
    function flip() {
      direct.classList.toggle("before");
      direct.classList.toggle("after");
    }
   
    function doTransition() {
      document.startViewTransition(() => {
        target.classList.toggle("before");
        target.classList.toggle("after");
      });
    }
  </script>
  <button class="before" onclick="doTransition()" id="target">Animate</button>
  <button class="before" onclick="flip()" id="direct">Flip</button>
</body>
</html>

```

Event handlers on DOM elements not participating in the transition continue to work throughout the transition. This is handy if your transitions changes a subset of the page.

The spec intent was to handle the pseudo DOM case the same as we would for hit-testing on any other pseudo-element. For example if the pointer location of the event is `::before`, the event is dispatched to its originating element. But `pointer-events: none` set on the pseudo-element will cause the hit-test to continue to the next possible target. Same way if the pointer location of the event is on any of the generated pseudos, the event is dispatched on their ultimate originating element (the document element). Otherwise it can resolve to a DOM element, if the location is different or the developer adds `pointer-events: none` to the pseudos.

That said, I'm ok with dispatching events to the document element while rendering is paused instead of dropping them entirely. I was hard pressed to think of a use-case where the developer could do anything meaningful with the events. Rendering is paused so its not like visuals can be updated in response to the event. But, if the transition is being driven by a gesture then the curve of the gesture could be used to influence the animation. The developer would need all touch move events to keep track of the curve.

-- 
GitHub Notification of comment by khushalsagar
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7797#issuecomment-1370244721 using your GitHub account


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

Received on Tuesday, 3 January 2023 21:31:37 UTC