dotcom-rendering icon indicating copy to clipboard operation
dotcom-rendering copied to clipboard

Update to Source v7

Open jamesmockett opened this issue 1 year ago • 2 comments

Charlotte has an open PR (#12063) to bump Source from 1.0.3 to 6.1.0 as this includes new typography presets that are required for work on Fairground. There are a number of breaking changes due to the leap in versions which this PR addresses.

Alex has opened a follow-on PR to bump Source to 7.0.0 (#12145) which has been subsequently released. This removes the deprecated typography API which is still referenced in a handful of places in the codebase. These need to be updated in order to update to the latest version of Source and any future versions.

DCR

Errors  Files
     1  src/components/ArticleBody.tsx:6
     1  src/components/ContainerTitle.tsx:5
     1  src/components/DropCap.tsx:3
     1  src/components/ExpandableAtom/Summary.tsx:3
     1  src/components/HighlightBlockComponent.tsx:2
     1  src/components/LatestLinks.importable.tsx:3
     1  src/components/ManyNewslettersForm.tsx:4
     1  src/components/ManyNewsletterSignUp.importable.tsx:4
     2  src/components/NewsletterCard.tsx:3
     2  src/components/RichLink.tsx:4
     1  src/components/SignInGate/gateDesigns/SignInGateMainCheckoutComplete.tsx:5
     1  src/components/TimelineAtom.importable.tsx:3
     1  src/components/YoutubeBlockComponent.importable.tsx:3

AR

Errors  Files
     5  src/components/editions/byline/index.tsx:7
     3  src/components/editions/headline/index.tsx:7
     4  src/components/editions/standfirst/index.tsx:7
     1  src/components/SpecialReportAltAtom/index.tsx:5

jamesmockett avatar Aug 15 '24 16:08 jamesmockett

Moving to blocked as #12063 needs updating first. I'm talking to Charlotte to co-ordinate.

jamesmockett avatar Aug 23 '24 09:08 jamesmockett

On further investigation we've discovered that Source v4 introduced a regression that prevents styles overrides added with the css prop from being applied. This has broken dark mode theming in a handful of places.

Source officially supports overrides via the cssOverrides and theme props, but never officially supported the css prop which is added by Emotion. Nonetheless, it's used in a number of places in the codebase.

I've spoken to the end to end team who are looking into why the behaviour as changed, but as this was never supported it seems like the best way forward is to replace any use of css on Source components with cssOverrides. The difficulty is in finding all instances given the size of the codebase. Many are covered by Chromatic, but there may be instances that are not and get overlooked.

jamesmockett avatar Aug 29 '24 14:08 jamesmockett

This should be unblocked now that https://github.com/guardian/dotcom-rendering/pull/12218 has been merged

cemms1 avatar Sep 10 '24 08:09 cemms1

Moving back into blocked for the moment as this requires an update to braze-components which has Source as a peer dependency and has to be updated to account for the breaking changes introduced in v7 and 8.

jamesmockett avatar Sep 13 '24 13:09 jamesmockett