Dart-code: Web - VSCode launches on localhost:8080 by default, refused to connect

Created on 28 Oct 2020 · 3Comments · Source: Dart-Code/Dart-Code

Describe the bug
It is concerning that the default Flutter app created in VSCode has a configuration that prevents a workable launch, following the official doc instructions. There is also no official documentation (and limited online community) coverage on this issue.

To Reproduce
Steps to reproduce the behavior:

Install VSCode and Flutter according to https://flutter.dev/docs/get-started/install/macos#web-setup
Create a new Flutter app in VSCode
Click Run > Run Without Debugging
Chrome window opens with localhost:8080, page shows refused to connect error
If I launch by terminal, or replace the default "pwa-chrome" config in launch.json by the following

        {
            "name": "Flutter for web",
            "type": "dart",
            "request": "launch",
            "program": "lib/main.dart",
            "args": [
              "-d",
              "chrome"
            ]
        }

then it launches as desired

Expected behavior

Click Run > Run Without Debugging
Chrome window launches with the app

Screenshots
If applicable, add screenshots to help explain your problem.

Versions (please complete the following information):

VS Code version: 1.50.1
Dart extension version: 3.15.1
Dart/Flutter SDK version: 1.23.0-18.1.pre

Source

awfin

Most helpful comment

Ah, I see. pwa-chrome is not related to this extension, and therefore we can't control what it does. I suspect when you tried to run the project you didn't have a Dart file open, so it should've shown this prompt:

Screenshot 2020-11-02 at 12 07 58

Here only the "Dart & Flutter" option will invoke our code. If you run the others, it will invoke their debuggers.

Let me know if you have any further issues/questions!

DanTup on 2 Nov 2020

👍3

All 3 comments

I'm not unable to reproduce this, by creating a new project and clicking Run -> Run Without Debugging it ran on a random port:

Screenshot 2020-10-29 at 12 24 20

Could you capture a log?

Run the Dart: Capture Logs command
Untick Analysis Server but leave everything else ticked and click OK
Reproduce the issue
Click Cancel on the logging notification
Attach the log here

Thanks!

DanTup on 29 Oct 2020

👍1

I tried to launch a new project with VSCode Flutter extension, however this time I got the right launch config

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "test2911",
            "request": "launch",
            "type": "dart"
        }
    ]
}

instead of the one that caused the error which contained

        {
            "type": "pwa-chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        },

awfin on 30 Oct 2020

Screenshot 2020-11-02 at 12 07 58

Here only the "Dart & Flutter" option will invoke our code. If you run the others, it will invoke their debuggers.

Let me know if you have any further issues/questions!

DanTup on 2 Nov 2020

👍3

Was this page helpful?

0 / 5 - 0 ratings