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.

Sign up for GitHub

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

Jump to bottom

[bug] Falsy properties are not discarded #491

Open
Looky1173 opened this issue Oct 8, 2022 · 4 comments · May be fixed by #492
Open

[bug] Falsy properties are not discarded #491

Looky1173 opened this issue Oct 8, 2022 · 4 comments · May be fixed by #492

Comments

@Looky1173
Copy link
Contributor 

const Title = styled("h1")`
  font-weight: bold;
  color: dodgerblue;
  background-color: ${(props) => (props.background ? "lightblue" : null)};
`;

When the background property is null or false, background-color is not stripped from the generated CSS.

image

CodeSandbox demontrating the issue
@Looky1173
Copy link
Contributor Author

Looky1173 commented Oct 8, 2022 •
edited
Loading

The culprit seems to be the following line: } else if (val != undefined) { in parse.js. Since "" != undefined" evaluates to true, falsy CSS property values could leak into the DOM. The fix is delightfully simple:

- } else if (val != undefined) {
+ } else if (val) {

It even saves some bytes! I will submit a PR once I have made sure that all the tests pass. 😀

@cristianbote
Copy link
Owner

Thanks for digging into the issue 🙏

As for that fix, I would assume that of the value is zero that will not go through. I might be wrong though. looking forward to your findings.

@Looky1173
Copy link
Contributor Author

Oops, you're right! I will try to come up with another solution…

Looky1173 added a commit to Looky1173/goober that referenced this issue Oct 8, 2022
@Looky1173
Fix cristianbote#491
3ad60a8
@Looky1173 Looky1173 linked a pull request Oct 8, 2022 that will close this issue
Open
@Looky1173
Copy link
Contributor Author

@cristianbote I've got it: #492!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix #491 Looky1173/goober
2 participants
@cristianbote @Looky1173