Flutter Web — Modular.setInitialRoute is not working (flutter_modular: ^6.3.2)

[cecruzbrito]

Describe the bug
If the initial route ("/") returns a RouterOutlet() and it is necessary for one of its children to be the actual initial route, declared by the method Modular.setInitialRoute('/page1'), it does not work.

However, the example provided in the documentation itself does not work on Flutter Web.

Environment

flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.5, on Microsoft Windows [versÆo 10.0.19045.3930], locale pt-BR)
[✓] Windows Version (Installed version of Windows is version 10 or higher)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
[✓] Chrome - develop for the web
[✓] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.4.4)
[✓] Android Studio (version 2022.2)
[✓] VS Code (version 1.71.1)
[✓] Connected device (4 available)
[✓] Network resources

• No issues found!

To Reproduce

import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';

void main() {
  return runApp(ModularApp(module: AppModule(), child: AppWidget()));
}

class AppWidget extends StatelessWidget {
  Widget build(BuildContext context) {
    Modular.setInitialRoute('/page1');

    return MaterialApp.router(
      title: 'My Smart App',
      theme: ThemeData(primarySwatch: Colors.blue),
      routerConfig: Modular.routerConfig,
    );
  }
}

class AppModule extends Module {
  @override
  void binds(i) {}

  @override
  void routes(r) {
    r.child('/', child: (context) => HomePage(), children: [
      ChildRoute('/page1', child: (context) => InternalPage(title: 'page 1', color: Colors.red)),
      ChildRoute('/page2', child: (context) => InternalPage(title: 'page 2', color: Colors.amber)),
      ChildRoute('/page3', child: (context) => InternalPage(title: 'page 3', color: Colors.green)),
    ]);
  }
}

class HomePage extends StatelessWidget {
  Widget build(BuildContext context) {
    final leading = SizedBox(
      width: MediaQuery.of(context).size.width * 0.3,
      child: Column(
        children: [
          ListTile(
            title: Text('Page 1'),
            onTap: () => Modular.to.navigate('/page1'),
          ),
          ListTile(
            title: Text('Page 2'),
            onTap: () => Modular.to.navigate('/page2'),
          ),
          ListTile(
            title: Text('Page 3'),
            onTap: () => Modular.to.navigate('/page3'),
          ),
        ],
      ),
    );

    return Scaffold(
      appBar: AppBar(title: Text('Home Page')),
      body: Row(
        children: [
          leading,
          Container(width: 2, color: Colors.black45),
          Expanded(child: RouterOutlet()),
        ],
      ),
    );
  }
}

class InternalPage extends StatelessWidget {
  final String title;
  final Color color;
  const InternalPage({Key? key, required this.title, required this.color}) : super(key: key);

  Widget build(BuildContext context) {
    return Material(
      color: color,
      child: Center(child: Text(title)),
    );
  }
}

Expected behavior
The idea is to do exactly as stated in the usage example of the flutter_modular's RouterOutlet documentation: set an initial route ("/") that returns RouterOutlet() displaying its children, and use the method Modular.setInitialRoute('/page1') to make the initial page a child of the initial route.

[eduardocontiero]

mesmo problema aqui

[Miqueiasousa011]

Mesmo problema. o exemplo citado na documentação funciona no mobile mas nas web não funciona.

obs: a versão flutter_modular: ^5.0.3 funcoina na web.

[Arthurius]

Any news on this issue? I'm facing the same problem on web

[Pachebel]

To com o mesmo problema aqui, dei um upvote pra ganhar mais visibilidade.

[roneylf]

alguem conseguiu contornar este problema?

[GustavoFigueira]

Still not working with the last Flutter version 3.24.0 (only works on mobile, Android and iOS)

[roneylf]

mesmo problema aqui