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

Bug - shadow variable clash with destructured props #1193

Merged
merged 17 commits into from
May 9, 2022

Conversation

harshmalde
Copy link
Contributor

@harshmalde harshmalde commented Apr 12, 2022

Issue Description:
When shadow variable name and deconstructed props property are same, babel is unable to differentiate between them (since both the property will be of type Identifier and you can have a look at the storybook that has been created with this PR).

Implementation:
This pull request helps to reconstruct the destructed props in the Arrow function.

@changeset-bot
Copy link

changeset-bot bot commented Apr 12, 2022

🦋 Changeset detected

Latest commit: ccefa7f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@compiled/babel-plugin Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

packages/babel-plugin/src/utils/css-builders.ts Outdated Show resolved Hide resolved
packages/babel-plugin/src/utils/css-builders.ts Outdated Show resolved Hide resolved
stories/css-shadow-variable-clash.tsx Outdated Show resolved Hide resolved
stories/css-shadow-variable-clash.tsx Show resolved Hide resolved
stories/css-shadow-variable-clash.tsx Outdated Show resolved Hide resolved
stories/css-shadow-variable-clash.tsx Outdated Show resolved Hide resolved
@pancaspe87
Copy link
Collaborator

@harshmalde run yarn changeset and follow the prompt so that you can describe the type of change

Copy link
Collaborator

@pancaspe87 pancaspe87 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is still a VR fail to address.

FAIL chrome.docker/chrome.laptop/conditional rules/styled/Condition With Destructured Props Key Value String: Failed to render with error "primary is not defined"

This is caused by a story within stories/conditional-rules-styled.tsx

The fix doesn't seem to take into account cases such as

const DestructuredPropsKeyValueString = styled.div<TextProps>`
  ${({ isPrimary: primary }) => (primary ? 'color: green' : 'color: red')};
`;

@pancaspe87 pancaspe87 linked an issue Apr 27, 2022 that may be closed by this pull request
@pancaspe87 pancaspe87 self-requested a review April 28, 2022 03:07
pancaspe87
pancaspe87 previously approved these changes Apr 28, 2022
Copy link
Collaborator

@JakeLane JakeLane left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! Just the leftover console log

stories/css-shadow-variable-clash.tsx Outdated Show resolved Hide resolved
@pancaspe87 pancaspe87 merged commit 4f8f2aa into master May 9, 2022
@pancaspe87 pancaspe87 deleted the bug/shadowed-var-clash-with-destructured-props branch May 9, 2022 10:53
@pancaspe87 pancaspe87 mentioned this pull request May 10, 2022
at-nathan added a commit that referenced this pull request Jul 13, 2022
at-nathan added a commit that referenced this pull request Jul 13, 2022
…1261)

* Revert "Bug - shadow variable clash with destructured props (#1193)"

This reverts commit 4f8f2aa.

* Add change set
@atlas-dst-bot atlas-dst-bot mentioned this pull request Jul 13, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Shadowed variables can clash with destructured props
3 participants