Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix false negatives for template literal declarations in declaration-empty-line-before #4003

Closed
hudochenkov opened this issue Apr 2, 2019 · 6 comments
Labels
syntax: css-in-js relates to JS objects & template literals type: bug a problem with a feature or rule

Comments

@hudochenkov
Copy link
Member

Clearly describe the bug

Warning is not shown for declaration-empty-line-before in styled component.

Which rule, if any, is the bug related to?

declaration-empty-line-before

What CSS is needed to reproduce the bug?

const Separator = styled.div`
  margin-bottom: 20px;
  
  border: 0;
`;

What stylelint configuration is needed to reproduce the bug?

e.g.

{
  "rules": {
    "declaration-empty-line-before": ["never"]
  }
}

Which version of stylelint are you using?

9.10.1

How are you running stylelint: CLI, PostCSS plugin, Node.js API?

CLI with stylelint "**/*.styled.js". Also in demo

Does the bug relate to non-standard syntax (e.g. SCSS, Less etc.)?

Yes, it's related to CSS-in-JS (styled components).

What did you expect to happen?

Warnings to be flagged for border.

What actually happened (e.g. what warnings or errors did you get)?

No warnings.

@hudochenkov hudochenkov added type: bug a problem with a feature or rule syntax: css-in-js relates to JS objects & template literals labels Apr 2, 2019
@hudochenkov
Copy link
Member Author

The issue in

if (!isStandardSyntaxDeclaration(decl)) {
return;
}

if (parent.type === "root") {
return false;
}

In postcss-jsx parser properties are children of root.

@jeddy3 jeddy3 changed the title No warnings flagged for declaration-empty-line-before in CSS-in-JS Fix false negatives for template literal declarations in declaration-empty-line-before Apr 2, 2019
@jeddy3
Copy link
Member

jeddy3 commented Apr 2, 2019

In postcss-jsx parser properties are children of root.

I believe that's there because we don't want this rule to pick up on "declarations" outside of rules e.g. dollar variables. We can either work out another heuristic for this or change postcss-jsx behaviour so these declarations are children of a rule node with selector "div".

@alexander-akait
Copy link
Member

I think fix postcss-jsx behavior is right way

@hudochenkov
Copy link
Member Author

@evilebottnawi what this change could be? If postcss-jsx will wrap styles in div on parse, then it will introduce false positives for selector-max-type: 0, for example.

@alexander-akait
Copy link
Member

@hudochenkov hm, maybe we can add context.isStyled (same we can do for markdown/html/etc if needed) and handle this cases?

@hudochenkov
Copy link
Member Author

I was reviewing PRs and found #3933 which should fix this problem. This issue renders to be a duplicate of #3930.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
syntax: css-in-js relates to JS objects & template literals type: bug a problem with a feature or rule
Development

No branches or pull requests

3 participants