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
743 stars 249 forks source link

how to add devices in vscode #1551

Open Mazhar012 opened 1 year ago

Mazhar012 commented 1 year ago

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

Describe the solution you'd like:

Describe alternatives you've considered:

Additional context:

captainbrosset commented 1 year ago

I don't think you can add your own custom devices in the VSCode DevTools extension right now. @vidorteg is this something you're tracking already?

codepo8 commented 1 year ago

I think the extension inherits the list from Edge, but there is no way to edit it. Might be good to have a setting for that.

dsine-de commented 6 months ago

This would be a great feature because currently there is no way to keep a aspect ratio of i.e. 16:9 or a fixed viewport size of 1920x1080. If the dropdown is set to "Responsive", the values change as soon as you resize the devtools panel.

The values are not inherited from the device list in Edge unfortunately.

KotKarol commented 5 months ago

Has anyone found a workaround for this issue? I couldn't find any chromium launch options that would help. I develop mainly on Smart TVs so i would like to toggle between 720p and 1080p predefined viewport, and not be forced to resize it when i change the vs code layout.

Currently the only workaround for me that is good enough is to set the device to "Laptop with MDPI screen", which keeps the ratio.

captainbrosset commented 5 months ago

Unfortunately this has not been added to our extension yet.