flutter
DevTools V 2.15.0 broken when not accessed at root
Our team runs devtools under a path instead of at the root like host:port.
For example: Dev tools runs like this https://<host>/r/9100/ instead of https://<host>:9100.
This used to work until 2.12.2 and started failing when we upgraded flutter. New devtools version where it's broken: 2.15.0
Before:
After:
@DanTup I think https://github.com/flutter/devtools/pull/3585 is the cause of this. Any ideas?
I'm not sure I understand how this is being run. @kaushiksathupadi how are you starting the server and serving the contents at that location?
Before #3585, the full URL didn't really matter as Flutter was only reading the fragment from the end. After switching to Page URL strategy, the part of the URL relative to the <base href=> is what's used. DevTools server should emit a base href that matches where it's being served - if you view the source of the page, what is it set to in this case?
@DanTup we front devtools through a ngnix server so that /r/9001 maps to localhost:9001 locally.
RE: base tag:
In the version where it's not working(2.15.0) <base href="/">
In the version where it's working (2.12.2) : I don't see this tag.
As a quick fix, Is there a way to change this base tag either when starting devtools or through some headers?
@kaushiksathupadi that's correct, the tag was not necessary before because DevTools was using URL fragments. It's required when using path URLs (see https://docs.flutter.dev/development/ui/navigation/url-strategies#hosting-a-flutter-app-at-a-non-root-location).
The replacement is done by the DevTools server as it serves up the index.html file:
https://github.com/dart-lang/sdk/blob/0f0f045128ac9eac855987a08f760be72216ed9c/pkg/dds/lib/src/devtools/handler.dart#L140-L149
There is currently no way to override this. You could perhaps modify the index.html inside the SDK resources folder (the replacement won't happen if the source tag has been modified, as it only replaces href="/"), although I couldn't say for sure there wouldn't be other issues with doing this.
Out of interest, why are you going through nginx? Are you in some kind of remote workspace?
@DanTup Thanks! Modifying index.html like you suggested works for us.
Yeah, we're doing ngnix because vscode is running on a remote workspace where not all ports are securely open.
I'll leave it you to close the issue. The workaround is hacky but we are unblocked, not sure if we need a more permanent solution to this. (Perhaps a http header value in addition to this
Glad to hear. I'm not sure what your setup looks like, but if you're using VS Code with its remoting support, DevTools should be run on the remote machine and ports forwarded automatically.
If not, is there any reason you can't map DevTools to the root on its own port so the URLs are still the same?
Perhaps a http header value in addition to this tag ?
Do you mean an inbound HTTP header you can set, which overrides the base href included? That might work, though I think a cli flag might make more sense (it's more visible and would be static for the whole server, not needing to be read per-request). I don't know if this workflow is standard or common enough to warrant that though (@kenzieschmoll - your thoughts?).