Black screen when calling Navigator.popUntil() - flutter

Question

I am making a Flutter app where I navigate from the home screen to other pages. I then want to go back to the home screen by popping the Navigator stack. When I do this I get a black screen and I assume I pop until the stack is empty. I do not however understand where my mistake is.
In page2.dart, if I replace the Navigator.popUntil() call with two calls to Navigator.pop(context) after each other, it pops successfully back to the home screen.
To demonstrate the issue I have I made a stand alone application that has this behavior.
main.dart
import 'package:flutter/cupertino.dart';
import 'package:test/router.dart' as router;
import 'package:flutter/widgets.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
#override
Widget build(BuildContext context) {
return const CupertinoApp(
title: 'Test',
initialRoute: router.home,
onGenerateRoute: router.generateRoute);
}
}
router.dart
import 'package:flutter/cupertino.dart';
import 'package:test/home.dart';
import 'package:test/page1.dart';
import 'package:test/page2.dart';
import 'package:flutter/widgets.dart';
const home = '/';
const page1 = '/page1';
const page2 = '/page2';
Route<dynamic> generateRoute(RouteSettings settings) {
switch (settings.name) {
case home:
return CupertinoPageRoute(builder: (context) => const Home());
case page1:
return CupertinoPageRoute(builder: (context) => const Page1());
case page2:
return CupertinoPageRoute(builder: (context) => const Page2());
default:
print('Undefined view');
return CupertinoPageRoute(
builder: (context) => UndefinedView(
name: settings.name ?? 'No Name',
));
}
}
class UndefinedView extends StatelessWidget {
final String name;
const UndefinedView({Key? key, required this.name}) : super(key: key);
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
child: Center(
child: Text('Route for $name is not defined'),
),
);
}
}
home.dart
import 'package:flutter/cupertino.dart';
import 'package:test/router.dart' as router;
import 'package:flutter/widgets.dart';
class Home extends StatefulWidget {
const Home({Key? key}) : super(key: key);
#override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
CupertinoButton(
child: const Text(
'Go to page 1',
style: TextStyle(color: Color.fromRGBO(0xFF, 0xFF, 0xFF, 1)),
),
onPressed: () => {Navigator.pushNamed(context, router.page1)},
),
Container(
height: 50,
)
],
));
}
}
page1.dart
import 'package:flutter/cupertino.dart';
import 'package:test/router.dart' as router;
import 'package:flutter/widgets.dart';
class Page1 extends StatefulWidget {
const Page1({Key? key}) : super(key: key);
#override
_Page1State createState() => _Page1State();
}
class _Page1State extends State<Page1> {
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
CupertinoButton(
child: const Text(
'Go to Page 2',
style: TextStyle(color: Color.fromRGBO(0xFF, 0xFF, 0xFF, 1)),
),
onPressed: () => {Navigator.pushNamed(context, router.page2)},
),
Container(
height: 50,
)
],
));
}
}
page2.dart
import 'package:flutter/cupertino.dart';
import 'package:test/router.dart' as router;
import 'package:flutter/widgets.dart';
class Page2 extends StatefulWidget {
const Page2({Key? key}) : super(key: key);
#override
_Page2State createState() => _Page2State();
}
class _Page2State extends State<Page2> {
#override
Widget build(BuildContext context) {
return CupertinoPageScaffold(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
CupertinoButton(
child: const Text(
'Go home',
style: TextStyle(color: Color.fromRGBO(0xFF, 0xFF, 0xFF, 1)),
),
onPressed: () =>
{Navigator.popUntil(context, ModalRoute.withName(router.home))},
),
Container(
height: 50,
)
],
));
}
}

Answer 1

When returning CupertinoPageRoute inside generateRoute, try passing settings too, i.e.
return CupertinoPageRoute(
settings: settings,
builder: (context) => const Home()
);
or
return CupertinoPageRoute(
settings: const RouteSettings(name: home),
builder: (context) => const Home()
);
I believe otherwise the Navigator is not aware of the route names, which causes popUntil to pop until there are no more routes (thus the black screen).