Flutter Web – error output points to JS file instead of dart file

Issue

I have a Flutter Web project, and when an error is thrown, I can’t open the dart file where the error was thrown, because the error line points to a JS file:

Launching lib\main.dart on Chrome in debug mode...
Waiting for connection from debug service on Chrome...
This app is linked to the debug service: ws://127.0.0.1:63045/gOvW2paMrLg=/ws
Debug service listening on ws://127.0.0.1:63045/gOvW2paMrLg=/ws

 Running with sound null safety 
Debug service listening on ws://127.0.0.1:63045/gOvW2paMrLg=/ws
Error: Invalid argument(s): A value must be provided. Supported values: 0, 1
    at Object.throw_ [as throw] (http://localhost:53846/dart_sdk.js:5061:11)
    at Object._$36enumDecode [as _$enumDecode] (http://localhost:53846/packages/web_app/core/models/pessoa/pessoa.dart.lib.js:482:17)
    at Object._$36PessoaFromJson [as _$PessoaFromJson] (http://localhost:53846/packages/web_app/core/models/pessoa/pessoa.dart.lib.js:473:54)
    at Function.fromJson (http://localhost:53846/packages/web_app/core/models/pessoa/pessoa.dart.lib.js:375:21)
    at http://localhost:53846/packages/web_app/repository/pessoa_repository.dart.lib.js:60:193
    at repository.RepositoryGetter.new.getRecurso (http://localhost:53846/packages/web_app/repository/repository.dart.lib.js:33:18)
    at getRecurso.next (<anonymous>)
    at http://localhost:53846/dart_sdk.js:38640:33
    at _RootZone.runUnary (http://localhost:53846/dart_sdk.js:38511:59)
    at _FutureListener.thenAwait.handleValue (http://localhost:53846/dart_sdk.js:33713:29)
    at handleValueCallback (http://localhost:53846/dart_sdk.js:34265:49)
    at Function._propagateToListeners (http://localhost:53846/dart_sdk.js:34303:17)
    at _Future.new.[_completeWithValue] (http://localhost:53846/dart_sdk.js:34151:23)
    at async._AsyncCallbackEntry.new.callback (http://localhost:53846/dart_sdk.js:34172:35)
    at Object._microtaskLoop (http://localhost:53846/dart_sdk.js:38778:13)
    at _startMicrotaskLoop (http://localhost:53846/dart_sdk.js:38784:13)
    at http://localhost:53846/dart_sdk.js:34519:9

How can I make it to show the dart file where the error occurred, instead of a JS file?

I’m using Flutter Channel stable 2.5.2, Android Studio version 2020.3.

Solution

I have found a workaround for this issue.

You basically have to install a third-party patch; it will translate the paths in JS and point to the right line in dart file.

Download the patch and follow the instructions here: https://github.com/obeobe/flutter-web-exception-mapper

Answered By – THelloThere

Answer Checked By – Pedro (FlutterFixes Volunteer)