search

microsoft / vscode-edge-devtools

A VSCode extension that allows you to use browser devtools from within the editor. The devtools will connect to an instance of Microsoft Edge giving you the ability to alter CSS styling, perform diagnostics, and debugging. Get it now at http://aka.ms/devtools-for-code
https://docs.microsoft.com/microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension
MIT License
756 stars 259 forks source link

Live reload server #1453

Open SilasRodrigues19 opened 1 year ago

SilasRodrigues19 commented 1 year ago

Is your feature request related to a problem? Please describe.

No, it's an improvement to display updates in real time, without having to refresh the page.

Describe the solution you'd like:

I would like to request a new feature for the extension that would greatly improve the workflow. Currently, when we make changes to the code, we have to manually reload the page to see the changes. Could you implement an automatic update similar to Live Server Or does this function already exist and is it defective?

Describe alternatives you've considered: I'm using it the way it is, always clicking the Reload button when I need to preview the changes.

Additional context: The following video shows how it is currently working:

https://user-images.githubusercontent.com/47532703/230163432-55c675b8-a583-4814-966b-61fa4ff4d5e2.mp4

captainbrosset commented 1 year ago

This should help: https://marketplace.visualstudio.com/items?itemName=ms-vscode.live-server#external-browser-debugging

@vidorteg @codepo8 I didn't really follow the integration of vscode-edge-devtools and live-preview in detail. What's the best way to get browser preview embedding + devtools + live preview these days?

codepo8 commented 1 year ago

I don't think there is any integration happening right now.

season101 commented 1 year ago

image This is the current workaround I have to solve live reload with a live-preview along with vscode-edge-devtools. The browser in edge-dev-tools points to the url of live-preview. Whenever there is change in html or even js, these changes are reflected in the browser and devtools in vscode-edge-devtools.

captainbrosset commented 1 year ago

Thanks a lot for sharing this @season101.

captainbrosset commented 9 months ago

Marking as a tracked enhancement because this feature request comes up again and again.