Autoformat not working after latest VScode update

[hamsterkacke]

Hey, CSSComb won't autoformat my css files.

Trough F1 and CSSComb format it works, tough. So maybe an issue with a breaking change in vscode?

Best, Philipp

[ryanbowden]

Still working for me!

[hamsterkacke]

How can i debug this issue to give you more information, mrmlnc?

[mrmlnc]

@Hamsterkacke, I think you can create GIF or video for your situation and provide steps to reproduce :)

[hamsterkacke]

I hit save and nothing happens. Don't know how to capture that with a GIF.

I didn't change anything, just updated to the last version of vscode. After that, CSSComb won't format after hitting save. Didn't change my settings and other plugins, that format on save, are still working.

If i hit save, the debugging console is empty. Is there a verbose option i can add?

[mrmlnc]

Please, provide version of VS Code and CSS Comb plugin. Also, please, file your CSS file and settings for CSS Comb plugin.

Is there a verbose option i can add?

Nope. But you can use this guide for debug plugin: https://github.com/mrmlnc/vscode-csscomb/blob/master/CONTRIBUTING.md#setup

[hamsterkacke]

Give me a second, there is a new update for vscode. Installing right now. After that i give you the details you need. :)

[hamsterkacke]

Alright:

Vscode 1.19.1 CSSComb 5.2.1

CSS File is working if if run CSSComb trough the F1 Section, so shouldn't matter, right?

CSS Settings:

"csscomb.formatOnSave": true, "csscomb.preset": { "remove-empty-rulesets": false, "always-semicolon": true, "color-case": "lower", "block-indent": "\t", "color-shorthand": true, "element-case": "lower", "eof-newline": true, "leading-zero": true, "lines-between-rulesets": 0, "quotes": "single", "sort-order-fallback": "abc", "space-before-colon": "", "space-after-colon": " ", "space-before-combinator": " ", "space-after-combinator": " ", "space-between-declarations": "\n", "space-before-opening-brace": " ", "space-after-opening-brace": "\n", "space-after-selector-delimiter": "\n", "space-before-selector-delimiter": "", "space-before-closing-brace": "\n", "strip-spaces": true, "unitless-zero": true }

[mrmlnc]

Hm, it's works for me with VS Code 1.19.1. Please file list of your plugins. You can use code --list-extensions.

[hamsterkacke]

anthonydiametrix.ACF-Snippet bmewburn.vscode-intelephense-client donjayamanne.jquerysnippets joelday.docthis junstyle.php-cs-fixer mrmlnc.vscode-autoprefixer mrmlnc.vscode-csscomb octref.vetur sidthesloth.html5-boilerplate tungvn.wordpress-snippet whatwedo.twig xabikos.JavaScriptSnippets

[mrmlnc]

Very strange. You can disable all extensions, enable CSSComb and then run CSSComb formatter?

[hamsterkacke]

Already testing that. everything deactivated except of csscomb. Same output.

Now i deactivate cssscomb and reactivate. Maybe that works.

[hamsterkacke]

Still the same result. I delete csscomb now completely and reinstall it. :)

[hamsterkacke]

Same result. :(

[mrmlnc]

Oh, I can see full settings of your editor?

[hamsterkacke]

{
    "window.zoomLevel": 0,
    "terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
    "workbench.colorTheme": "Monokai",
    "editor.formatOnSave": true,
    "editor.wordWrap": true,
    "editor.tabSize": 4,
    "php.suggest.basic": false,
    "emmet.includeLanguages": {
        "php": "html",
        "twig": "html"
    },
    "files.associations": {
        "*.twig": "twig"
    },
    "typescript.check.npmIsInstalled": false,
    "csscomb.formatOnSave": true,
    "csscomb.preset": {
        "remove-empty-rulesets": false,
        "always-semicolon": true,
        "color-case": "lower",
        "block-indent": "\t",
        "color-shorthand": true,
        "element-case": "lower",
        "eof-newline": true,
        "leading-zero": true,
        "lines-between-rulesets": 0,
        "quotes": "single",
        "sort-order-fallback": "abc",
        "space-before-colon": "",
        "space-after-colon": " ",
        "space-before-combinator": " ",
        "space-after-combinator": " ",
        "space-between-declarations": "\n",
        "space-before-opening-brace": " ",
        "space-after-opening-brace": "\n",
        "space-after-selector-delimiter": "\n",
        "space-before-selector-delimiter": "",
        "space-before-closing-brace": "\n",
        "strip-spaces": true,
        "unitless-zero": true,
        "sort-order": [
            [
                "$extend"
            ],
            [
                "content",
                "font",
                "font-family",
                "src",
                "font-size",
                "font-weight",
                "font-style",
                "font-variant",
                "font-size-adjust",
                "font-stretch",
                "font-effect",
                "font-emphasize",
                "font-emphasize-position",
                "font-emphasize-style",
                "font-smooth",
                "line-height",
                "position",
                "z-index",
                "top",
                "right",
                "bottom",
                "left",
                "display",
                "visibility",
                "float",
                "clear",
                "overflow",
                "overflow-x",
                "overflow-y",
                "-ms-overflow-x",
                "-ms-overflow-y",
                "clip",
                "zoom",
                "flex-direction",
                "flex-order",
                "flex-pack",
                "flex-align",
                "flex",
                "align-items",
                "justify-content",
                "-webkit-box-sizing",
                "-moz-box-sizing",
                "box-sizing",
                "width",
                "min-width",
                "max-width",
                "height",
                "min-height",
                "max-height",
                "margin",
                "margin-top",
                "margin-right",
                "margin-bottom",
                "margin-left",
                "padding",
                "padding-top",
                "padding-right",
                "padding-bottom",
                "padding-left",
                "table-layout",
                "empty-cells",
                "caption-side",
                "border-spacing",
                "border-collapse",
                "list-style",
                "list-style-position",
                "list-style-type",
                "list-style-image",
                "quotes",
                "counter-reset",
                "counter-increment",
                "resize",
                "cursor",
                "-webkit-user-select",
                "-moz-user-select",
                "-ms-user-select",
                "user-select",
                "nav-index",
                "nav-up",
                "nav-right",
                "nav-down",
                "nav-left",
                "-webkit-transition",
                "-moz-transition",
                "-ms-transition",
                "-o-transition",
                "transition",
                "-webkit-transition-delay",
                "-moz-transition-delay",
                "-ms-transition-delay",
                "-o-transition-delay",
                "transition-delay",
                "-webkit-transition-timing-function",
                "-moz-transition-timing-function",
                "-ms-transition-timing-function",
                "-o-transition-timing-function",
                "transition-timing-function",
                "-webkit-transition-duration",
                "-moz-transition-duration",
                "-ms-transition-duration",
                "-o-transition-duration",
                "transition-duration",
                "-webkit-transition-property",
                "-moz-transition-property",
                "-ms-transition-property",
                "-o-transition-property",
                "transition-property",
                "-webkit-transform",
                "-moz-transform",
                "-ms-transform",
                "-o-transform",
                "transform",
                "-webkit-transform-origin",
                "-moz-transform-origin",
                "-ms-transform-origin",
                "-o-transform-origin",
                "transform-origin",
                "-webkit-animation",
                "-moz-animation",
                "-ms-animation",
                "-o-animation",
                "animation",
                "-webkit-animation-name",
                "-moz-animation-name",
                "-ms-animation-name",
                "-o-animation-name",
                "animation-name",
                "-webkit-animation-duration",
                "-moz-animation-duration",
                "-ms-animation-duration",
                "-o-animation-duration",
                "animation-duration",
                "animation-fill-mode",
                "-webkit-animation-play-state",
                "-moz-animation-play-state",
                "-ms-animation-play-state",
                "-o-animation-play-state",
                "animation-play-state",
                "-webkit-animation-timing-function",
                "-moz-animation-timing-function",
                "-ms-animation-timing-function",
                "-o-animation-timing-function",
                "animation-timing-function",
                "-webkit-animation-delay",
                "-moz-animation-delay",
                "-ms-animation-delay",
                "-o-animation-delay",
                "animation-delay",
                "-webkit-animation-iteration-count",
                "-moz-animation-iteration-count",
                "-ms-animation-iteration-count",
                "-o-animation-iteration-count",
                "animation-iteration-count",
                "-webkit-animation-direction",
                "-moz-animation-direction",
                "-ms-animation-direction",
                "-o-animation-direction",
                "animation-direction",
                "text-align",
                "-webkit-text-align-last",
                "-moz-text-align-last",
                "-ms-text-align-last",
                "text-align-last",
                "vertical-align",
                "white-space",
                "text-decoration",
                "text-emphasis",
                "text-emphasis-color",
                "text-emphasis-style",
                "text-emphasis-position",
                "text-indent",
                "-ms-text-justify",
                "text-justify",
                "letter-spacing",
                "word-spacing",
                "-ms-writing-mode",
                "text-outline",
                "text-transform",
                "text-wrap",
                "text-overflow",
                "-ms-text-overflow",
                "text-overflow-ellipsis",
                "text-overflow-mode",
                "-ms-word-wrap",
                "word-wrap",
                "word-break",
                "-ms-word-break",
                "-moz-tab-size",
                "-o-tab-size",
                "tab-size",
                "-webkit-hyphens",
                "-moz-hyphens",
                "hyphens",
                "pointer-events",
                "opacity",
                "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
                "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha",
                "-ms-interpolation-mode",
                "color",
                "border",
                "border-width",
                "border-style",
                "border-color",
                "border-top",
                "border-top-width",
                "border-top-style",
                "border-top-color",
                "border-right",
                "border-right-width",
                "border-right-style",
                "border-right-color",
                "border-bottom",
                "border-bottom-width",
                "border-bottom-style",
                "border-bottom-color",
                "border-left",
                "border-left-width",
                "border-left-style",
                "border-left-color",
                "-webkit-border-radius",
                "-moz-border-radius",
                "border-radius",
                "-webkit-border-top-left-radius",
                "-moz-border-radius-topleft",
                "border-top-left-radius",
                "-webkit-border-top-right-radius",
                "-moz-border-radius-topright",
                "border-top-right-radius",
                "-webkit-border-bottom-right-radius",
                "-moz-border-radius-bottomright",
                "border-bottom-right-radius",
                "-webkit-border-bottom-left-radius",
                "-moz-border-radius-bottomleft",
                "border-bottom-left-radius",
                "-webkit-border-image",
                "-moz-border-image",
                "-o-border-image",
                "border-image",
                "-webkit-border-image-source",
                "-moz-border-image-source",
                "-o-border-image-source",
                "border-image-source",
                "-webkit-border-image-slice",
                "-moz-border-image-slice",
                "-o-border-image-slice",
                "border-image-slice",
                "-webkit-border-image-width",
                "-moz-border-image-width",
                "-o-border-image-width",
                "border-image-width",
                "-webkit-border-image-outset",
                "-moz-border-image-outset",
                "-o-border-image-outset",
                "border-image-outset",
                "-webkit-border-image-repeat",
                "-moz-border-image-repeat",
                "-o-border-image-repeat",
                "border-image-repeat",
                "outline",
                "outline-width",
                "outline-style",
                "outline-color",
                "outline-offset",
                "background",
                "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
                "background-color",
                "background-image",
                "background-repeat",
                "background-attachment",
                "background-position",
                "background-position-x",
                "-ms-background-position-x",
                "background-position-y",
                "-ms-background-position-y",
                "-webkit-background-clip",
                "-moz-background-clip",
                "background-clip",
                "background-origin",
                "-webkit-background-size",
                "-moz-background-size",
                "-o-background-size",
                "background-size",
                "box-decoration-break",
                "-webkit-box-shadow",
                "-moz-box-shadow",
                "box-shadow",
                "filter:progid:DXImageTransform.Microsoft.gradient",
                "-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient",
                "text-shadow",
                "$include"
            ]
        ]
    },
    "workbench.startupEditor": "newUntitledFile",
    "php-cs-fixer.executablePath": "c:/Users/Philipp/AppData/Roaming/Composer/vendor/bin/php-cs-fixer",
    "php-cs-fixer.executablePathWindows": "c:/Users/Philipp/AppData/Roaming/Composer/vendor/bin/php-cs-fixer.bat",
    "php-cs-fixer.onsave": true,
    "php-cs-fixer.formatHtml": true,
    "php-cs-fixer.config": "c:/Users/Philipp/.php_cs"
}

[mrmlnc]

Yeap! Bingo! Problem is here "editor.formatOnSave": false. Same issue as here: https://github.com/mrmlnc/vscode-attrs-sorter/issues/31

Sorry, but this is conflict with embedded VS Code formatter.

[hamsterkacke]

Mh, alright, thank you. That works. But i never touched that setting, strange why it fails just now. Thank you!

[mrmlnc]

Sorry for this situation and I am happy that this issue is resolved 🎉

[hamsterkacke]

You are very welcome. Thanks for the amazin plugin and the fast support. <3