microsoft
In my opinion, launch instance opens wrong page
Environment (please complete the following information):
- OS: macOS 12.1
- Extension version: v1.4.5
Describe the bug:
I clicked on launch project in the extension view, and a page that has nothing to do with my project is opened.
Repro steps:
- created a new project with a basic html file. body contained only an h1 tag.
- with the html file active, clicked on launch project in the dev tools view.
- two tabs are opened. one with the dev tools and one with dev tools screen cast
- the screen cast tab shows contents of file:///Users/chris/.vscode/extensions/ms-edgedevtools.vscode-edge-devtools-1.4.5/out/startpage/index.html
Expected behavior:
I expected the screen cast tab to show a page related to my project. (e.g. my only html file titled index.html)
Additional context:
I closed the instance listed under targets in the edge view and clicked on launch instance again after selecting the index.html for a second time. This time the screen cast tab opened for "about:blank". Also unexpected.
After reading more documentation, it looks like this is the way it is supposed to work. Personally, I'd rather it loaded-up the html page I'm currently editing rather than having to create the launch.json file and then edit the url/file entry. So I guess this would be a feature request related to a better initial use experience.
Thanks for the detailed write-up. I think the main confusion here is that you want to edit a single file rather than run a local server. As any file is most likely to have other dependencies (styles, scripts and so on) it makes a lot more sense to run a server in the folder of the file and that is then what the localhost in the launch.json is for.
If you check the docs, we have a write-up how to use the reload server for that which should be pretty straight forward: https://docs.microsoft.com/en-us/microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension#setting-up-your-project-to-show-live-changes-in-the-extension Happy to help if there is a still confusion.
you want to edit a single file rather than run a local server. As any file is most likely to have other dependencies (styles, scripts and so on) it makes a lot more sense to run a server in the folder
We'll, I expected to see my file in the browser is the key thing. That's not unreasonable. Certainly not an about:blank file on the second attempt.
Besides, while I'd normally use a web-server, this isn't, strictly speaking, necessary.
If I open a file directly off the file system, the browser will happily pull in referenced resources even without the support of a (web)server. So while a server, (thanks for the link) started with the Live Server extension, npx http-server, npx reload, or any number of other options is more normal, it still might be nice if it worked "out of the box" by opening the file I'm currently editing. This is really the heart of the matter.
I tend to agree with @chris-miner here. Very often when I start a new web project, I start with a simple index.html file and no web server. I put in my content, and quickly after I need devtools to start styling the page.
When using the extension, the first-run experience in that workflow could be a bit better. I think it would be fair for the extension to detect the main index.html file and load it in the browser using the file:// protocol.
