[web][a11y] On Android, removing the semantics placeholder mid-touch can leave a Flutter pointer down forever #194104

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:web/web.dart' as web;

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(home: HomePage());
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final Set<int> _pointersDown = <int>{};
  String _listState = 'idle';
  late final Timer _timer;

  @override
  void initState() {
    super.initState();
    // Refreshes the placeholder status, which changes outside Flutter.
    _timer = Timer.periodic(
      const Duration(milliseconds: 250),
      (_) => setState(() {}),
    );
  }

  @override
  void dispose() {
    _timer.cancel();
    super.dispose();
  }

  bool _onScroll(ScrollNotification notification) {
    final String state = switch (notification) {
      ScrollStartNotification() => 'scrolling',
      ScrollUpdateNotification(dragDetails: _?) => 'dragging',
      ScrollUpdateNotification() => 'flinging',
      ScrollEndNotification() => 'idle',
      _ => _listState,
    };
    if (state != _listState) {
      setState(() => _listState = state);
    }
    return false;
  }

  @override
  Widget build(BuildContext context) {
    final bool placeholder =
        web.document.querySelector('flt-semantics-placeholder') != null;
    return Listener(
      behavior: HitTestBehavior.translucent,
      onPointerDown: (PointerDownEvent event) {
        setState(() => _pointersDown.add(event.pointer));
      },
      onPointerUp: (PointerUpEvent event) {
        setState(() => _pointersDown.remove(event.pointer));
      },
      onPointerCancel: (PointerCancelEvent event) {
        setState(() => _pointersDown.remove(event.pointer));
      },
      child: Scaffold(
        appBar: AppBar(title: const Text('Semantics placeholder pointer')),
        body: Column(
          children: <Widget>[
            Container(
              width: double.infinity,
              color: _pointersDown.isEmpty ? Colors.white : Colors.yellow,
              padding: const EdgeInsets.all(8),
              child: Text(
                'Pointers down: ${_pointersDown.length}\n'
                'List: $_listState\n'
                'Semantics placeholder: ${placeholder ? 'present' : 'removed'}',
              ),
            ),
            Expanded(
              child: NotificationListener<ScrollNotification>(
                onNotification: _onScroll,
                child: ListView.builder(
                  itemCount: 100,
                  itemBuilder: (BuildContext context, int index) {
                    return ListTile(title: Text('Item $index'));
                  },
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}