Vincenzo
Vincenzo

Reputation: 6368

Another exception was thrown: Instance of 'ErrorSummary' when performing platform check Flutter web

I have bottom navigation bar that switches between two screens BookingsScreen and OpeningTimesScreen. My problem is that OpeningTimesScreen UI doesn't load properly the first time. It does load if tap on its icon again or if I select BookingsScreen first and then select it. As the full UI is quite crowded with 28 textfields and 14 switches, I just reduced it to only one textfield and did some tests. It seems that the problem is with textfield declared inside a ternary, thing that I do as the app runs on web and on tablets..

If I declare the textfield as Column's direct child UI builds correctly.

TextField(
                keyboardType: TextInputType.numberWithOptions(),
                controller: monMorOp,
                onChanged: (value) {
                  monMorOp.text = validateTimeFormat(value);
                },
              ),

If I declare it in an expanded widget UI still builds correctly.

Expanded(
                flex: 1,
                child: TextField(
                  keyboardType: TextInputType.numberWithOptions(),
                  controller: monMorOp,
                  onChanged: (value) {
                    monMorOp.text = validateTimeFormat(value);
                  },
                ),
              ),

If I declare it without checkin platform UI still builds correctly.

Expanded(
                flex: 1,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.max,
                  //title row
                  children: <Widget>[
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Monday'),
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: TextField(
                        keyboardType: TextInputType.numberWithOptions(),
                        controller: monMorOp,
                        onChanged: (value) {
                          monMorOp.text = validateTimeFormat(value);
                        },
                      ),
                    ),
                  ],
                ),
              ),

When I do perform the platform checking then I get the error and a grey screen at first load only. Once you tap on the BottomNavigationBar icon again it loads fine.

Expanded(
                flex: 1,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.max,
                  //title row
                  children: <Widget>[
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Monday'),
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: Platform.isIOS
                          ? CupertinoTextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            )
                          : TextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            ),
                    ),

From Chrome console I see the Another exception was thrown: Instance of 'ErrorSummary' with js_primitives.dart:47 link.

Clicking it opens a tab with this:

Could not load content for org-dartlang-sdk:///lib/_internal/js_runtime/lib/js_primitives.dart (HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME)

..I also have another error when app starts and I don't know if they're related..

favicon.ico:1 GET http://localhost:5000/favicon.ico 404 (Not Found)

What can I check to see what's causing it? As always thank you very much for your time and help.

I also put the entire class :

class OpeningTimesScreen extends StatefulWidget {
  final FixitUser user;
  final LatLng coordinates;
  final String cityDb;
  final String regionDb;
  final String countryDb;
  const OpeningTimesScreen(
      {Key key,
      @required this.user,
      @required this.coordinates,
      @required this.cityDb,
      @required this.regionDb,
      @required this.countryDb})
      : super(key: key);

  @override
  _OpeningTimesScreenState createState() => _OpeningTimesScreenState();
}

// TODO expanded causes error : Another exception was thrown: Instance of 'ErrorSummary'
class _OpeningTimesScreenState extends State<OpeningTimesScreen> {
  TextEditingController monMorOp = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return BlocProvider<OpeningTimesBloc>(
      lazy: false,
      create: (BuildContext context) =>
          OpeningTimesBloc()..add(LoadOpeningTimes(widget.user)),
      child: BlocConsumer<OpeningTimesBloc, OpeningTimesState>(
        listener: (BuildContext context, OpeningTimesState state) {},
        builder: (context, state) => Container(
          color: Colors.black54,
          padding: EdgeInsets.symmetric(horizontal: 100, vertical: 50),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              //                                                              TODO titles
              Expanded(
                flex: 1,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.max,
                  children: <Widget>[
                    Expanded(
                      flex: 2,
                      child: Text(
                        '',
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Opening'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Closing'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 1,
                      child: Text(
                        AppLocalizations.instance.text('Active'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 40,
                    ),
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Opening'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Closing'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 1,
                      child: Text(
                        AppLocalizations.instance.text('Active'),
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                  ],
                ),
              ),

              // TODO UI builds without a problem
//              TextField(
//                keyboardType: TextInputType.numberWithOptions(),
//                controller: monMorOp,
//                onChanged: (value) {
//                  monMorOp.text = validateTimeFormat(value);
//                },
//              ),

              // TODO UI builds without a problem
//              Expanded(
//                flex: 1,
//                child: TextField(
//                  keyboardType: TextInputType.numberWithOptions(),
//                  controller: monMorOp,
//                  onChanged: (value) {
//                    monMorOp.text = validateTimeFormat(value);
//                  },
//                ),
//              ),
              // TODO UI builds without a problem
              //                                                              TODO monday
//              Expanded(
//                flex: 1,
//                child: Row(
//                  mainAxisAlignment: MainAxisAlignment.center,
//                  mainAxisSize: MainAxisSize.max,
//                  //title row
//                  children: <Widget>[
//                    Expanded(
//                      flex: 2,
//                      child: Text(
//                        AppLocalizations.instance.text('Monday'),
//                        style: TextStyle(color: Colors.white, fontSize: 20),
//                      ),
//                    ),
//                    SizedBox(
//                      width: 20,
//                    ),
//                    Expanded(
//                      flex: 2,
//                      child: TextField(
//                        keyboardType: TextInputType.numberWithOptions(),
//                        controller: monMorOp,
//                        onChanged: (value) {
//                          monMorOp.text = validateTimeFormat(value);
//                        },
//                      ),
//                    ),
//                  ],
//                ),
//              ),

              // TODO UI build problem
              //                                                              TODO monday
              Expanded(
                flex: 1,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.max,
                  //title row
                  children: <Widget>[
                    Expanded(
                      flex: 2,
                      child: Text(
                        AppLocalizations.instance.text('Monday'),
                        style: TextStyle(color: Colors.white, fontSize: 20),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      flex: 2,
                      child: Platform.isIOS
                          ? CupertinoTextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            )
                          : TextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

Upvotes: 3

Views: 5280

Answers (1)

Vincenzo
Vincenzo

Reputation: 6368

Found the problem.

As the first thing it get checked is a dart.io library it throws an exception..

Adding a first check kISWeb solved it. I actually thought that failing the Platform.isIOS check automatically unfolded in the other option for web as well, but it needs its own check ..

Expanded(
                  flex: 2,
                  child: kIsWeb
                      ? TextField(
                          keyboardType: TextInputType.numberWithOptions(),
                          controller: monMorOp,
                          onChanged: (value) {
                            monMorOp.text = validateTimeFormat(value);
                          },
                        )
                      : Platform.isIOS
                          ? CupertinoTextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            )
                          : TextField(
                              keyboardType: TextInputType.numberWithOptions(),
                              controller: monMorOp,
                              onChanged: (value) {
                                monMorOp.text = validateTimeFormat(value);
                              },
                            ),
                ),

Hope it helps others. Cheers

Upvotes: 2

Related Questions