[web] Enable address bar collapse on mobile by switching touch input - #184281

import 'package:material_ui/material_ui.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Address Bar Controller Test',
      home: const TestMenu(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Tests')),
      body: ListView(
        padding: const .all(16),
        children: [
          _TestTile(
            title: 'Basic Vertical ListView',
            subtitle: 'Address bar should collapse when scrolling down',
            destination: const BasicVerticalListTest(),
          ),
          _TestTile(
            title: 'Nested Scrollables',
            subtitle: 'Horizontal PageView inside a vertical ListView',
            destination: const NestedScrollTest(),
          ),
          _TestTile(
            title: 'Interactive Widgets',
            subtitle: 'Buttons, sliders, text fields inside a scroll view',
            destination: const InteractiveWidgetsTest(),
          ),
          _TestTile(
            title: 'Tap-Only Page (No Scroll)',
            subtitle: 'Non-scrollable page with tappable buttons',
            destination: const TapOnlyTest(),
          ),
        ],
      ),
    );
  }
}

class _TestTile extends StatelessWidget {
  const _TestTile({
    required this.title,
    required this.subtitle,
    required this.destination,
  });

  final String title;
  final String subtitle;
  final Widget destination;

  @override
  Widget build(BuildContext context) {
    return Card(
      child: ListTile(
        title: Text(title),
        subtitle: Text(subtitle),
        trailing: const Icon(Icons.arrow_forward_ios, size: 16),
        onTap: () {
          Navigator.of(context)
              .push(MaterialPageRoute<void>(builder: (_) => destination));
        },
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Basic Vertical List')),
      body: ListView.builder(
        itemCount: 100,
        itemBuilder: (context, index) => ListTile(
          leading: CircleAvatar(child: Text('${index + 1}')),
          title: Text('Item ${index + 1}'),
          subtitle: Text('Scroll to collapse the address bar'),
          tileColor: index.isEven ? null : Colors.grey.shade50,
        ),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Nested Scrollables')),
      body: ListView(
        children: [
          const Padding(
            padding: .all(16),
            child: Text(
              'Vertical scroll should collapse address bar.\n'
              'Horizontal swipe should switch pages without interfering.',
              style: TextStyle(fontSize: 14, color: Colors.grey),
            ),
          ),
          // Horizontal PageView
          SizedBox(
            height: 200,
            child: PageView.builder(
              itemCount: 10,
              itemBuilder: (context, index) => Card(
                margin: const .symmetric(horizontal: 16, vertical: 8),
                color:
                    Colors.primaries[index % Colors.primaries.length].shade200,
                child: Center(
                  child: Text(
                    'Page ${index + 1}',
                    style: const TextStyle(
                      fontSize: 24,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ),
            ),
          ),
          // More vertical content
          for (int i = 0; i < 50; i++)
            ListTile(
              leading: CircleAvatar(
                backgroundColor: Colors.teal.shade100,
                child: Text('${i + 1}'),
              ),
              title: Text('List item ${i + 1}'),
            ),
        ],
      ),
    );
  }
}

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

  @override
  State<InteractiveWidgetsTest> createState() => _InteractiveWidgetsTestState();
}

class _InteractiveWidgetsTestState extends State<InteractiveWidgetsTest> {
  double _sliderValue = 0.5;
  bool _switchValue = false;
  int _tapCount = 0;
  final _textController = TextEditingController();

  @override
  void dispose() {
    _textController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Interactive Widgets')),
      body: ListView(
        padding: const .all(16),
        children: [
          const Text(
            'All widgets below should remain fully interactive '
            'even with the address bar controller active.',
            style: TextStyle(color: Colors.grey),
          ),
          const SizedBox(height: 16),

          // Tap counter
          Card(
            child: Padding(
              padding: const .all(16),
              child: Column(
                children: [
                  Text(
                    'Tap count: $_tapCount',
                    style: const TextStyle(fontSize: 18),
                  ),
                  const SizedBox(height: 8),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      ElevatedButton(
                        onPressed: () => setState(() => _tapCount++),
                        child: const Text('Tap me'),
                      ),
                      const SizedBox(width: 12),
                      OutlinedButton(
                        onPressed: () => setState(() => _tapCount = 0),
                        child: const Text('Reset'),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
          const SizedBox(height: 12),

          // Slider
          Card(
            child: Padding(
              padding: const .all(16),
              child: Column(
                children: [
                  Text('Slider: ${_sliderValue.toStringAsFixed(2)}'),
                  Slider(
                    value: _sliderValue,
                    onChanged: (v) => setState(() => _sliderValue = v),
                  ),
                ],
              ),
            ),
          ),
          const SizedBox(height: 12),

          // Switch
          Card(
            child: SwitchListTile(
              title: const Text('Toggle switch'),
              value: _switchValue,
              onChanged: (v) => setState(() => _switchValue = v),
            ),
          ),
          const SizedBox(height: 12),

          // TextField
          Card(
            child: Padding(
              padding: const .all(16),
              child: TextField(
                controller: _textController,
                decoration: const InputDecoration(
                  labelText: 'Type something',
                  border: OutlineInputBorder(),
                ),
              ),
            ),
          ),
          const SizedBox(height: 12),

          // GestureDetector with long press
          Card(
            child: GestureDetector(
              onLongPress: () {
                ScaffoldMessenger.of(context).showSnackBar(
                  const SnackBar(content: Text('Long press detected!')),
                );
              },
              child: Container(
                padding: const .all(24),
                alignment: Alignment.center,
                child: const Text('Long press me'),
              ),
            ),
          ),

          // Spacer items to make scrollable
          for (int i = 0; i < 30; i++)
            ListTile(
              title: Text('Filler item ${i + 1}'),
              tileColor: i.isEven ? Colors.grey.shade50 : null,
            ),
        ],
      ),
    );
  }
}

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

  @override
  State<TapOnlyTest> createState() => _TapOnlyTestState();
}

class _TapOnlyTestState extends State<TapOnlyTest> {
  Color _color = Colors.blue;
  int _counter = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Tap Only (No Scroll)')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text(
              'This page has no scrollable content.\n'
              'Taps, drags, and other gestures should work normally.',
              textAlign: TextAlign.center,
              style: TextStyle(color: Colors.grey),
            ),
            const SizedBox(height: 32),
            GestureDetector(
              onTap: () {
                setState(() {
                  _counter++;
                  _color = Colors.primaries[_counter % Colors.primaries.length];
                });
              },
              child: AnimatedContainer(
                duration: const Duration(milliseconds: 300),
                width: 150,
                height: 150,
                decoration: BoxDecoration(
                  color: _color,
                  borderRadius: BorderRadius.circular(24),
                ),
                alignment: Alignment.center,
                child: Text(
                  '$_counter',
                  style: const TextStyle(
                    color: Colors.white,
                    fontSize: 48,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
            ),
            const SizedBox(height: 24),
            const Text('Tap the box to change color'),
          ],
        ),
      ),
    );
  }
}