Can't clear stack while navigation on auto_route

Question

I have a question about auto_route in Flutter: I can't clear the stacks while navigating.

I have initialized auto_route in MyApp like this:

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

  final AppRouter router = AppRouter();

  final CurrentUser _user = CurrentUser();

  @override
  Widget build(BuildContext context) {
    return MultiBlocProvider(
      providers: [
        BlocProvider(create: (context) => HomeBloc(context)),
        BlocProvider(create: (context) => ProductBloc(context)),
      ],
      child: MaterialApp.router(
          title: _user.brandName,
          themeMode: ThemeMode.light,
          theme: MyTheme.lightTheme,
          routerConfig: router.config()),
    );
  }}

For AppRouter:

import 'package:auto_route/auto_route.dart';
import 'app_router.gr.dart';

@AutoRouterConfig(replaceInRouteName: 'Page,Route')
class AppRouter extends $AppRouter {
  @override
  RouteType get defaultRouteType => const RouteType.material();

  @override
  List<AutoRoute> get routes => [
        AutoRoute(page: TestRoute1.page, path: '/page1', initial: true, fullscreenDialog: true),
        AutoRoute(page: TestRoute2.page, path: '/page2', fullscreenDialog: true),
        AutoRoute(page: TestRoute3.page, path: '/page3', fullscreenDialog: true),
        // AutoRoute(page: Login.page, path: '/login',initial: true),
        AutoRoute(page: SignUp.page, path: '/signup'),
      ];
}

Example pages for routing

@RoutePage()
class TestPage1 extends StatelessWidget {
  const TestPage1({super.key});

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            AutoRouter.of(context).push(const TestRoute2());
          },
          child: const Text("First"),
        ),
      ),
    ));
  }
}
@RoutePage()
class TestPage2 extends StatelessWidget {
  const TestPage2({super.key});

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            AutoRouter.of(context).push(const TestRoute3());
          },
          child: const Text("Second"),
        ),
      ),
    ));
  }
}

@RoutePage()
class TestPage3 extends StatelessWidget {
  const TestPage3({super.key});

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            var list = AutoRouter.of(context).stack;
            for(var i in list){
              Log.d("Route ${i.name}");
            }
            // AutoRouter.of(context).stack.clear();
            // AutoRouter.of(context).pushAndPopUntil(const TestRoute1(), predicate:(_) => false);
            AutoRouter.of(context).navigate(const TestRoute1());
            // context.router.pushAndPopUntil(const TestRoute1(), predicate: (_) => false);
          },
          child: const Text("Third"),
        ),
      ),
    ));
  }
}

Did I make any mistakes? I'm trying to navigate to 'page1' by clearing all previous stacks in TestPage3 button tap, but the steps I've attempted aren't working. Can anyone help me fix this issue?