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
745 stars 252 forks source link

installing edge generates warning messages from webHints and offers no obvious recourse other than uninstalling it all #596

Open BobFrankston opened 2 years ago

BobFrankston commented 2 years ago

Describe the bug:

Installing edge tools forces me to use WebHints. Eventually, I'll figure out how to stop annoying me by constantly warning me if I say "removeComments" false, but for now, I have to disable edge tools

Repro steps: Install edge tools

find out that it is warning me that I don't have removeComments in my tsconfig and if I do add it, it warns me if I set it to false.

Expected behavior: For it to mind it's own damn business and if not, give me a simple way to tell it to stop bothering me.

Additional context: The byproduct of installing EdgeTools must not be a blizzard of annoying messages based on someone's notion of what code should look like. It could ask politely and I say, go away kid, it should go away.

I tried to keep this toned down but wreaking havoc on my code without simple remedies inline is a terrible imposition and (to use a very very mild word) impolite.

codepo8 commented 2 years ago

Hello there, and sorry about the delay in answering (I am in Europe and weekends I am AFK). I understand your frustration and we already have a better UX in the works that makes it easier for you to enable/disable parts of the reporting and turn off the inline reports for certain files. For now, you can always turn off the reporting as a whole in the settings:

image

thanks again for taking the time to report this and we hear you and will soon have a better solution for this issues. I tracked this as an enhancement and we'll get to it in our next UX review.

BobFrankston commented 2 years ago

Thanks. I did a quick but didn't find it in a quick look. But I can wait for the UX upgrade

As an FYI I did ctrl-shift-p settings and looked at the various settings. Since VSCode is more a tool for me than a focus it's easier to wait than spend much time on it. Thanks.

darkgrayknight commented 2 years ago

I finally found that setting and was disappointed that it can't be refined yet. Please work on allowing adjustments to the webhints (error vs warning settings and turning particular hints on/off as needed). This is actually pretty great to have. Thanks.

antross commented 2 years ago

@darkgrayknight thanks for the feedback! While we don't have a UI for it yet, the webhint integration can be configured using webhint's existing config file format by adding a .hintrc file to the root of your project. See the webhint docs for full details: https://webhint.io/docs/user-guide/configuring-webhint/summary/

But for some quick examples, say you were getting this CSS report from webhint about backdrop-filter not being supported in all your target browsers: image

You could turn off all CSS compat warnings with this .hintrc (pretty heavy-handed still):

{
    "extends": ["development"],
    "hints": {
        "compat-api/css": "off"
    }
}

Or you could adjust your target browsers to exclude browsers you don't care about (maybe Internet Explorer?) with this .hintrc:

{
    "extends": ["development"],
    "browserslist": ["defaults", "not IE 11"]
}

Or you could ignore just the backdrop-filter CSS property and still get feedback for others with this .hintrc:

{
    "extends": ["development"],
    "hints": {
        "compat-api/css": ["default", {
            "ignore": ["backdrop-filter"]
        }]
    }
}
shepazu commented 2 years ago

Thanks for the tip about creating a .hintrc file, and the specific code for excluding IE 11 hints. That was just what I was looking for, and it does work on per-project basis. I'd prefer to set this in VSCode globally, rather than include a .hintrc file in every project. I see the webhint documentation for setting environment variables, but I wasn't able to get that to work. Has anyone else gotten this working?

niemyjski commented 9 months ago

Please fix.