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

UX-373 Upgrade styled-components to 5.2 #686

Merged
merged 5 commits into from Nov 16, 2020
Merged

UX-373 Upgrade styled-components to 5.2 #686

merged 5 commits into from Nov 16, 2020

Conversation

jonambas
Copy link
Contributor

@jonambas jonambas commented Nov 13, 2020

What Changed

  • Upgrades to styled-components v5.2
  • Upgrades to jest-styled-components v7
  • Replaces package peer-dependencies with styled-components v5.1.0.
  • Globally installs jest-styled-components in jest's setup file instead of in every test file
  • Modifies some tests that were failing from the dependency upgrades
    • Needed to scope some wrappers within arrow function
    • Needed to specify .at(x) in a few places that were detecting multiple DOM nodes
  • Adds a cleanProps helper to filter out styling props

How To Test or Verify

PR Checklist

  • Add the correct type label
  • Pull request approval from #uxfe or #design-guild

@jonambas
Copy link
Contributor Author

For reference: styled-components/jest-styled-components#297

@jonambas jonambas changed the title UX-373 Upgrade styled-components to 5.2 & Add clean helper function UX-373 Upgrade styled-components to 5.2 Nov 13, 2020
import toJson from 'enzyme-to-json';
import * as matchers from './matchers'
import * as matchers from './matchers';
import 'jest-styled-components';
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Globally importing jest-styled-components instead of in every test - this fixed the "could not resolve SC internals" errors

@@ -30,6 +30,7 @@
"^react-native$": "react-native-web",
"\\.(css|scss)$": "identity-obj-proxy",
"@sparkpost/matchbox-icons(.*)": "<rootDir>/packages/matchbox-icons/src",
"@sparkpost/matchbox(.*)": "<rootDir>/packages/matchbox/src"
"@sparkpost/matchbox(.*)": "<rootDir>/packages/matchbox/src",
"^styled-components": "<rootDir>/node_modules/styled-components"
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Turns out we needed to resolve one styled-components module

shouldForwardProp: (prop, defaultFn) => !arr.includes(prop) && defaultFn(prop),
...config,
};
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Here is the helper function

@jonambas jonambas merged commit b683fd4 into main Nov 16, 2020
jonambas added a commit that referenced this pull request Nov 16, 2020
jonambas added a commit that referenced this pull request Nov 16, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant