Support Previewing Static HTML Files

[qJake]

Extension version: 0.2.5
Environment: Windows 10 Pro x64, VS Code 1.30.2, Chrome 71.0.3578.98 (Official)

Request:

Support opening a preview window for basic *.html files.

Current behavior:

1. Open a local HTML file
2. F1 > Browser Preview: Open Preview
3. Browser window displays VS Code homepage

Expected behavior:

1. Open a local HTML file
2. F1 > Browser Preview: Open Preview
3. Browser window displays contents of the open HTML file
   • Changes saved to the HTML file cause the browser to refresh instantly

[coxfrederic]

Same expectations here. Installed the extension and thought it was broken when the first attempt I made was opening it with a local html file.

[yourhead]

Yep. Same.
Nothing in the description, read-me, instructions, etc. seems to indicate that it is only for a web app.

If there is some way to use this extension to view static content, could someone give me a hint? Thanks.

[auchenberg]

Opening local file:// urls aren't supported at this time, but should be trivial to add, as we are just controlling a Chrome instance. This work is tracked in ttps://github.com//issues/18

For BrowserSync/LiveReload capabilities, then I intent to keep Browser Preview a browser. Any live reloading functionality should be provided by WebPack's HMR, injected scripts into the page, etc, so if you want this my recommendation would be to find a npm/cli tool that hosts your local static files through a wrapper/webserver that adds this functionality such as https://www.browsersync.io/

[qJake]

@auchenberg Would that issue also cover HTML files that only exist in the VS Code workspace that were not saved to disk?

I think there'd be a lot of confusion if someone could preview my-saved-file.html but not Untitled-1 with Language mode set to HTML.

How would that be handled via a file:// URL?

[auchenberg]

@qJake The purpose of this extension is to not to provide a preview of html files, but to embed a real browser inside VS Code. So on a principle level if a real browser can preview the given file, so should the browser preview extension.

[qJake]

@auchenberg Totally understand that reasoning. I guess I was just hoping for something along the lines of this or this (which support in-memory files) but with a better browser engine behind it - because whatever implementation those plugins use often crashes or the live reload ends up failing at some point.

I figured Browser Preview would be the answer here, but I can understand and appreciate that this plugin is meant for a different use-case than that.

[auchenberg]

@qJake Virtual document support could sure be added, so a given editors buffer could be sent to the browser instance, but I'm just worried that it would be a slippery slope, as the next request would be imagine and css support, etc. The easiest solution would simply to be to start the integrated terminal npm install http-server && http-server and point Browser Preview to the url.

[Taariqq]

Just continue to use Brackets, I guess.