[Bug]: Fix feature does not work #369
Comments
|
I seem to have a similar issue (I am trying stylelint for the first time with vscode)
Here is a GIF explaining my behavior |
|
An additional note: As described in #25 (comment) |
|
@AbdealiJK Thanks for the key binding method It actually try to fix something! But nothing to edit And I didn't know there should be autofix method appeared on editor. It shows lint warning or error, but don't provide autofix method |
|
@Front-line-dev the keybinding above is for css - I see your file is a .scss file. But either way ... This is just a workaround. A fix for this is really required. Seems like a Major issue |
|
I hit this problem in my project and narrowed it down to rules with Edit: This was with VSCode extension v1.2.2 and stylelint version 14.5.3 |
ota-meshi
added
the
status: needs reproducible example
|
I have narrowed it down even further thanks to the hint by @justindm234. It seems to be an issue with the stylelint node api. import * as stylelint from "stylelint";
const cssContent = `.border-top-default{
border: 1px solid red;
margin: 0;
}`
const lintResult = await stylelint.lint({
code: cssContent,
fix: true,
});
console.log(lintResult.output);If my config does not contain any .border-top-default {
margin: 0;
border-top: : 1px solid red;
}But if such a disable exists, the output looks unexpected: [{
"source": "<input css rPadxH>",
"deprecations": [],
"invalidOptionWarnings": [],
"parseErrors": [],
"errored": false,
"warnings": []
}]It then looks pretty similar to the output without the Output without the fix option: [{
"source": "<input css qETqql>",
"deprecations": [],
"invalidOptionWarnings": [],
"parseErrors": [],
"errored": true,
"warnings": [
{
"line": 3,
"column": 5,
"endLine": 3,
"endColumn": 15,
"rule": "order/properties-order",
"severity": "error",
"text": "Expected \"margin\" to come before \"border-top\" (order/properties-order)"
}
]
}]So I think it is a problem of the stylelint itself. Example stylelint config: module.exports = {
customSyntax: "postcss-scss",
plugins: ["stylelint-declaration-strict-value", "stylelint-order"],
rules: {
"order/properties-order": [["margin", "border"], { unspecified: "bottom" }],
"scale-unlimited/declaration-strict-value": [
"/border/",
{ disableFix: true }, // this one breaks the autofix
],
},
}; |
…ue` stylelint#6542 fixes stylelint#6542 and bv that should also fix stylelint/vscode-stylelint#369 Issue: The API did not return the fixed css in `output` if any rule contained `ruleDisableFix`. I have removed the `ruleDisableFix` code, because it did not affect the code fixing itself and was assumingly wrongly used to change the content format of `output`. I have adjusted some tests to adapt to the changed behaviour and extended the test conditions to check that the returned code has the correct fixes applied. Issue was introduced in stylelint#5460
|
I have found the issue in stylelint itself and opened a pull request. |
How did you encounter this bug?
I try to fix code using vscode stylelint
Fix all auto-fixable problemscommand on vscode"source.fixAll.stylelint": trueto settings.json and saveBoth method make no change.
Manually command
stylelint --fixon terminal worksInstalled vscode-stylelint works fine except fix function. It tells where and what is problem using stylelint config file.
Code Snippet
No response
Stylelint Configuration
{ "extends": ["stylelint-config-standard-scss"], "plugins": ["stylelint-order"], "defaultSeverity": "warning", "ignoreFiles": ["**/editor.scss"], "rules": { "indentation": 4, "at-rule-empty-line-before": null, "rule-empty-line-before": ["always", { "disableFix": true }], "string-quotes": "single", "declaration-empty-line-before": null, "comment-empty-line-before": null, "selector-list-comma-newline-after": "always", "declaration-bang-space-after": "never", "function-calc-no-unspaced-operator": true, "declaration-colon-newline-after": null, "value-no-vendor-prefix": null, "property-no-vendor-prefix": null, "selector-no-vendor-prefix": null, "value-keyword-case": null, "color-function-notation": null, "color-named": "never", "color-hex-case": "lower", "color-hex-length": "short", "number-leading-zero": "always", "alpha-value-notation": "number", "declaration-block-no-redundant-longhand-properties": [ true, { "ignoreShorthands": ["transition"] } ], "selector-class-pattern": null, "number-no-trailing-zeros": true, "no-descending-specificity": null, "function-name-case": null, "function-url-quotes": "never", "at-rule-disallowed-list": ["debug"], "declaration-block-no-duplicate-properties": true, "block-no-empty": true, "declaration-no-important": true, "declaration-block-single-line-max-declarations": 0, "selector-no-qualifying-type": [true, { "ignore": ["attribute"] }], "max-nesting-depth": 3, "scss/at-function-pattern": null, "scss/at-mixin-pattern": null, "scss/percent-placeholder-pattern": null, "scss/dollar-variable-pattern": null, "scss/at-import-partial-extension": null, "scss/at-extend-no-missing-placeholder": true, "scss/operator-no-unspaced": true, "scss/comment-no-empty": null, "scss/dollar-variable-empty-line-before": null, "scss/double-slash-comment-empty-line-before": null, "order/order": [ { "type": "at-rule", "name": "extends" }, "declarations", { "type": "rule", "selector": "&:hover" }, { "type": "rule", "selector": "&:focus" }, { "type": "rule", "selector": "&:active" }, { "type": "rule", "selector": "&:first-child" }, { "type": "rule", "selector": "&:nth-child" }, { "type": "rule", "selector": "&:last-child" }, { "type": "rule", "selector": "&::before" }, { "type": "rule", "selector": "&::after" } ], "order/properties-order": [ [ { "groupName": "Position", "properties": [ "position", "z-index", "top", "right", "bottom", "left" ] }, { "groupName": "Layout", "properties": ["float", "clear"] }, { "groupName": "Display", "properties": ["display", "table-layout"] }, { "groupName": "Grid", "properties": [ "grid", "grid-area", "grid-auto-columns", "grid-auto-flow", "grid-auto-rows", "grid-column", "grid-column-end", "grid-column-gap", "grid-column-start", "grid-gap", "grid-row", "grid-row-end", "grid-row-gap", "grid-row-start", "grid-template", "grid-template-areas", "grid-template-columns", "grid-template-rows", "gap" ] }, { "groupName": "Flex box", "properties": [ "flex-flow", "flex-direction", "flex-wrap", "justify-content", "align-content", "align-items", "order", "flex", "flex-grow", "flex-shrink", "flex-basis", "align-self" ] }, { "groupName": "Visibility", "properties": [ "visibility", "overflow", "overflow-x", "overflow-y", "clip" ] }, { "groupName": "Box model", "properties": [ "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" ] }, { "groupName": "Background", "properties": [ "background", "background-attachment", "background-clip", "background-color", "background-image", "background-repeat", "background-position", "background-position-x", "background-position-y", "background-size", "background-origin", "background-attachment", "background-blend-mode" ] }, { "groupName": "Border", "properties": [ "border", "border-top", "border-right", "border-bottom", "border-left", "border-width", "border-top-width", "border-right-width", "border-bottom-width", "border-left-width", "border-style", "border-top-style", "border-right-style", "border-bottom-style", "border-left-style", "border-color", "border-top-color", "border-right-color", "border-bottom-color", "border-left-color", "border-radius", "border-top-left-radius", "border-top-right-radius", "border-bottom-left-radius", "border-bottom-right-radius" ] }, { "groupName": "Color", "properties": ["box-shadow", "color", "opacity"] }, { "groupName": "Typographic", "properties": [ "font", "font-family", "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" ] }, { "groupName": "Text align", "properties": [ "line-height", "letter-spacing", "white-space", "word-spacing", "word-break", "word-wrap", "text-align", "text-decoration", "text-indent", "text-overflow", "text-rendering", "text-shadow", "text-transform", "text-wrap", "list-style", "vertical-align" ] }, { "groupName": "Animation", "properties": [ "transform", "transform-box", "transform-origin", "transform-style", "transition", "transition-delay", "transition-duration", "transition-property", "transition-timing-function", "animation", "animation-name", "animation-duration", "animation-timing-function", "animation-delay", "animation-iteration-count", "animation-direction", "animation-fill-mode", "animation-play-state" ] }, { "groupName": "Others", "properties": [ "border-collapse", "border-spacing", "caption-side", "content", "cursor", "empty-cells", "quotes", "speak", "outline", "outline-color", "outline-offset", "outline-style", "outline-width" ] } ], { "unspecified": "bottom" } ] } }Extension Configuration
{ "eslint.validate": [ "javascript" ], "stylelint.enable": true, "prettier.enable": false, "stylelint.validate": [ "css", "scss" ], "stylelint.configFile": "/Users/user/Documents/stylelintrc.json", "stylelint.configBasedir": "/Users/user/.nvm/versions/node/v14.18.2/lib/node_modules", "editor.codeActionsOnSave": { "source.fixAll.eslint": true, "source.fixAll.stylelint": true }, "stylelint.stylelintPath": "/Users/user/.nvm/versions/node/v14.18.2/lib/node_modules/stylelint" }Actual Behaviour
Fix feature does not work.
It seems running something, but returns no edit (nothing to fix)
Expected Behaviour
The file should be fixed and saved using FormatOnSave or fix-all command
Logs
Stylelint Version
14.2.0
vscode-stylelint Version
1.2.1
Node.js Version
14.18.2
Operating System
macOS 12.1
Windows Subsystem for Linux
No response
Code of Conduct
The text was updated successfully, but these errors were encountered: