[web] ignore pointer events on plain text spans (#53694)

A semantic node may be tappable without having a more concrete role set on it, such as "button". It will just have a tap handler. This could lead to the sized span to be chosen as the label representation. However, when pointer events land on the span the DOM `target` becomes the span rather than the tappable element, and that breaks the debouncing logic in `pointer_binding.dart`.

This PR removes pointer event handling from inert text spans. This fixes the click debounce logic.

Fixes flutter/flutter#151265

Author: yjbanov

lib/web_ui/lib/src/engine/semantics/label_and_value.dart

@@ -248,7 +248,15 @@ final class SizedSpanRepresentation extends LabelRepresentationBehavior {
 
       // The origin of the coordinate system is the top-left corner of the
       // parent element.
-      ..transformOrigin = '0 0 0';
+      ..transformOrigin = '0 0 0'
+
+      // The node may be tappable without having a more concrete role set on it,
+      // such as "button". It will just have a tap handler. This could lead to
+      // sized span to be chosen as the label representation strategy. However,
+      // when pointer events land on the span the DOM `target` becomes the span
+      // rather than the tappable element, and that breaks the debouncing logic
+      // in `pointer_binding.dart`.
+      ..pointerEvents = 'none';
     semanticsObject.element.appendChild(_domText);
   }
 

lib/web_ui/test/engine/semantics/semantics_text_test.dart

@@ -285,4 +285,27 @@ Future<void> testMain() async {
 
     semantics().semanticsEnabled = false;
   });
+
+  test('The <span> ignores pointer events', () async {
+    semantics()
+      ..debugOverrideTimestampFunction(() => _testTime)
+      ..semanticsEnabled = true;
+
+    final SemanticsTester tester = SemanticsTester(owner());
+    tester.updateNode(
+      id: 0,
+      label: 'Ignore pointer events',
+      transform: Matrix4.identity().toFloat64(),
+      rect: const ui.Rect.fromLTRB(0, 0, 100, 50),
+    );
+    tester.apply();
+
+    expectSemanticsTree(owner(), '''
+      <sem>
+        <span style="pointer-events: none">Ignore pointer events</span>
+      </sem>'''
+    );
+
+    semantics().semanticsEnabled = false;
+  });
 }