Skip to content
This repository has been archived by the owner on Oct 4, 2022. It is now read-only.

Updated styled-components to v4+ #184

Merged
merged 6 commits into from Apr 5, 2019

Conversation

abotteram
Copy link
Contributor

@abotteram abotteram commented Apr 2, 2019

Summary

This PR can be summarized in the following changelog entry:

  • Updated the styled-components package to v4+.

Relevant technical choices:

  • jest-styled-components doesn't play nicely with styled-components v4 yet. That's why the snapshot css has been replaced by classnames. As soon as Bring compatibility with v4 styled-components/jest-styled-components#191 is solved we can fix this.
  • See https://www.styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v4 if all necessary upgrades for v4+ have been applied. A new notes regarding this:
    • I've checked whether we use at least react 16.3 and react-dom 16.3
    • Point 3 has been fixed using the described codemod.
    • Point 4 isn't applicable because we didn't use injectGlobal anywhere (altough please verify this).
    • Point 5 has been fixed manually, so please double check is I missed some innerRef props on styled components.
    • Point 6 isn't applicable because we didn't use keyframes anywhere (altough please verify this).
    • Point 7, we only use attrs in packages/search-metadata-previews/src/shared.js, and since we don't pass any attributes as a function the recommandation to switch to the new API doesn't apply.
  • Removed applyFontStyles from @yoast/components because it caused unexpected behaviour in wordpress-seo and is no longer relevant.

Test instructions

This PR can be tested by following these steps:

  • Make sure you have the console open at all times.
  • Walk through the examples in the stand-alone app. Make sure no errors or warnings regarding styled components occur.
  • Link yoast-components to wordpress-seo and check out snippet-preview-modal-background-color
  • In wordpress-seo install all dependencies and build the project.
  • Walk through all react components in the plugin.
    • Onboarding wizard
    • Dashboard widget
    • Metabox
    • Sidebar (gutenberg)
    • Search appearance pages

UI changes

  • This PR changes the UI in the plugin. I have added the 'UI change' label to this PR.

Created instead of Yoast/yoast-components#825.

Fixes #

@abotteram abotteram changed the base branch from develop to release-yoast-seo/11.0 April 4, 2019 11:21
@moorscode moorscode merged commit 35a88ae into release-yoast-seo/11.0 Apr 5, 2019
@moorscode moorscode deleted the upgrade-styled-components-to-v4 branch April 5, 2019 13:44
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants