No rebuild on web url queryParameter change

[mcmikecreations]

auto_route: ^3.0.4
[√] Flutter (Channel stable, 2.5.3, on Microsoft Windows [Version 10.0.22000.282], locale uk-UA)
[√] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
[√] Chrome - develop for the web
[√] Android Studio (version 2020.3)
[√] Connected device (3 available)

In my app I have the following routes:

...
RedirectRoute(redirectTo: '/booking/services', path: '/booking',),
AutoRoute<Object>(page: BookingServicesView, path: '/booking/services',),
AutoRoute<Object>(page: BookingDetailsView, path: '/booking/details',),
...

BookingDetailsView accepts an id query parameter, it works when navigating ordinarily. However, when I try navigating using typing in browser address bar and pressing Enter, navigating '/booking' -> '/booking/services' works, '/booking/services' -> '/booking/details?id=5' works, but '/booking/details?id=5' -> '/booking/details?id=7' doesn't work, or at least doesn't trigger a rebuild of my BookingDetailsView. Doing '/booking/details?id=5' -> '/booking/services' -> /booking/details?id=7' actually still opens id=5. The routes are pushed using pushNamed with the appropriate encoded queryParameters. I am not using guards, wrappers or nested navigators, just plain scaffolds with content.

[Milad-Akarie]

@mcmikecreations I just tested this and ti works just fine, can you provide more info? how are you reading the query (id)? are you using a declarative router?

[mcmikecreations]

routing_test.zip @Milad-Akarie I have made a small example to reproduce the issue. It looks like '/booking/details?id=5' -> '/booking/services' -> /booking/details?id=7' works correctly here for some reason, but '/booking/details?id=5' -> '/booking/details?id=7' doesn't work.

[Milad-Akarie]

@mcmikecreations Your app wouldn't build on web for me, no Idea why, but any ways I recreated your router setup in a new App and everything seems to work fine

https://user-images.githubusercontent.com/55059449/140648416-62ccadcd-8ca3-482e-9578-8bb5f97698aa.mp4

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

part 'main.gr.dart';

@MaterialAutoRouter(
  replaceInRouteName: 'View,Rout',
  routes: <AutoRoute>[
    AutoRoute(
      page: BookingServiceView,
      path: '/booking/services',
      initial: true,
    ),
    AutoRoute(
      page: BookingDetailsView,
      path: '/booking/details',
    ),
    RedirectRoute(
      redirectTo: '/booking/services',
      path: '/booking',
    ),
  ],
)
class AppRouter extends _$AppRouter {}

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  MyApp({Key? key}) : super(key: key);
  final AppRouter _appRouter = AppRouter();
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerDelegate: _appRouter.delegate(),
      routeInformationParser: _appRouter.defaultRouteParser(),
      routeInformationProvider: _appRouter.routeInfoProvider(),
    );
  }
}

class BookingServiceView extends StatelessWidget {
  const BookingServiceView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: MaterialButton(
          child: const Text("Navigate"),
          onPressed: () {
            navigateToDetails(context, 5);
          },
        ),
      ),
      // body: body,
    );
  }
}

void navigateToDetails(BuildContext context, int? id) async {
  context.router.pushNamed('/booking/details?id=$id');
}

class BookingDetailsView extends StatelessWidget {
  const BookingDetailsView({Key? key, @QueryParam('id') this.id})
      : super(key: key);

  final int? id;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(child: Text('id: $id')),
    );
  }
}

[mcmikecreations]

I think the component you're missing is provider/riverpod connection, maybe it is the problem. How does auto_route check if path has changed and it should change the routing stack?

[Milad-Akarie]

@mcmikecreations is this still an issue in the latest build?

[mcmikecreations]

@mcmikecreations is this still an issue in the latest build?

I'll check it out and get back to you!

[mcmikecreations]

@Milad-Akarie Unfortunately I can still reproduce the issue:

https://user-images.githubusercontent.com/17436789/141806939-3fb4a801-0985-4095-a57f-246580bef4a1.mp4

[MilosKarakas]

I have the same issue eg. navigating from /home/invoices to /home/invoices?id=1 does not trigger page refresh. It only changes the browser bar content. Moving from /home/invoices to some other path and then to /home/invoices?id=1 works fine. Basically, query params are not taken into account when checking if page should refresh or not.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions

[mcmikecreations]

Has any progress been done on this?

[MilosKarakas]

I've just refactored the logic to use different paths. Although, it is counter-intuitive that navigating with different query params does not refresh the state.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions

[mcmikecreations]

Can anyone post a commit where this has been fixed?