Inconsistent URL decoding and unexpected browser URL replacement in GoRouter (web) #180373

import 'package:flutter/material.dart';
import 'package:flutter_web_plugins/url_strategy.dart';
import 'package:go_router/go_router.dart';

void main() {
  usePathUrlStrategy();

  runApp(const MyApp());
}

final _router = GoRouter(
  routes: [
    GoRoute(path: '/', builder: (context, state) => const HomePage()),
    GoRoute(
      path: '/item/:value',
      builder: (context, state) {
        final value = state.pathParameters['value'] ?? '';
        return DetailPage(value: value);
      },
    ),
  ],
);

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      title: 'GoRouter Web Minimal',
      routerConfig: _router,
      theme: ThemeData(useMaterial3: true),
    );
  }
}

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

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

class _HomePageState extends State<HomePage> {
  final _controller = TextEditingController(text: 'foo bar');

  @override
  void initState() {
    super.initState();
  }

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

  void _goToDetail() {
    var raw = _controller.text.trim();
    raw = Uri.encodeComponent(raw);
    if (raw.isEmpty) {
      return;
    }
    // Encode to keep the URL valid on web.
    context.go('/item/${Uri.encodeComponent(raw)}');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home')),
      body: Center(
        child: ConstrainedBox(
          constraints: const BoxConstraints(maxWidth: 400),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              TextField(
                controller: _controller,
                decoration: const InputDecoration(
                  labelText: 'Enter raw id',
                  border: OutlineInputBorder(),
                ),
                onSubmitted: (_) => _goToDetail(),
              ),
              const SizedBox(height: 12),
              ElevatedButton(
                onPressed: _goToDetail,
                child: const Text('Go to second page'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class DetailPage extends StatelessWidget {
  final String value;
  const DetailPage({super.key, required this.value});

  @override
  Widget build(BuildContext context) {
    final encoded = value;
    final decoded = Uri.decodeComponent(encoded);
    return Scaffold(
      appBar: AppBar(title: const Text('Second Page')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text(
              'Encoded: $encoded',
              style: Theme.of(context).textTheme.titleLarge,
              textAlign: TextAlign.center,
            ),
            Text(
              'Decoded: $decoded',
              style: Theme.of(context).textTheme.titleLarge,
              textAlign: TextAlign.center,
            ),
          ],
        ),
      ),
    );
  }
}