Minor Fixes to View Transition Fixture (#32664)
Follow up to #32656. Remove touchAction from SwipeRecognizer. I was under the wrong impression that this was only the touch-action applied to this particular element, but that parents would still win but in fact this blocks the parent from scrolling in the other direction. By specifying a fixed direction it also blocked rage-swiping in the other direction early on. Disable pointer-events on view-transition so that the scroll can be hit. This means that touches hit below the items animating above. This allows swiping to happen again before momentum scroll has finished. Previously they were ignored. This only works as long as the SwipeRecognizer is itself not animating. This means you can now rage-swipe in both directions quickly.
Sebastian Markbåge committed
Mar 18, 2025 at 19:20 UTC
c2a196174763e0b4f16ed1c512ed4442b062395e
2 files changed
+7
-1
fixtures/view-transition/src/components/Chrome.css
+7
@@ -7,3 +7,10 @@ body {
7
padding: 0;
8
font-family: sans-serif;
9
}
10
+
11
+::view-transition-group(*),
12
+::view-transition-image-pair(*),
13
+::view-transition-old(*),
14
+::view-transition-new(*) {
15
+ pointer-events: none;
16
+}
fixtures/view-transition/src/components/SwipeRecognizer.js
-1
@@ -92,7 +92,6 @@ export default function SwipeRecognizer({
92
width: axis === 'x' ? '100%' : null,
93
height: axis === 'y' ? '100%' : null,
94
overflow: 'scroll hidden',
95
- touchAction: 'pan-' + direction,
95
// Disable overscroll on Safari which moves the sticky content.
96
// Unfortunately, this also means that we disable chaining. We should only disable
97
// it if the parent is not scrollable in this axis.