search

guardian / dotcom-rendering

The Guardian web rendering service (aka DCR/DCAR)
https://www.theguardian.com
Apache License 2.0
253 stars 30 forks source link

Update to Source v8 #12151

Closed jamesmockett closed 1 month ago

jamesmockett commented 2 months ago

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 commented 2 months ago

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

jamesmockett commented 2 months ago

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.

cemms1 commented 1 month ago

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

jamesmockett commented 1 month ago

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.