chore: update yarn to v4 #5010

rubencarvalho · 2025-01-08T10:54:28Z

Description

This PR upgrades our package management from Yarn Classic to Yarn 4.6.0 and modernizes our build pipeline.

Motivation and context

Our build pipeline needed some love (aka modernization) to take advantage of newer package management features and to align our project with our upstream Spectrum CSS dependency. The upgrade to Yarn 4 should provide better dependency resolution, improved performance, and more reliable builds. (Also, no more wireit warning logs filling up the terminal!)

Screenshots (if appropriate)

Types of changes

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to change)
Chore (minor updates related to the tooling or maintenance of the repository, does not impact compiled assets)

Checklist

I have signed the Adobe Open Source CLA.
My code follows the code style of this project.
If my change required a change to the documentation, I have updated the documentation in this pull request.
I have read the CONTRIBUTING document.
I have added tests to cover my changes.
All new and existing tests passed.
I have reviewed at the Accessibility Practices for this feature, see: Aria Practices

Best practices

This repository uses conventional commit syntax for each commit message; note that the GitHub UI does not use this by default so be cautious when accepting suggested changes. Avoid the "Update branch" button on the pull request and opt instead for rebasing your branch against main.

changeset-bot · 2025-01-08T10:54:32Z

⚠️ No Changeset found

Latest commit: a21bd04

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

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

github-actions · 2025-01-08T12:18:16Z

Branch preview

Review the following VRT differences

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

github-actions · 2025-01-08T12:20:49Z

Tachometer results

Currently, no packages are changed by this PR...

coveralls · 2025-01-08T12:24:10Z

Pull Request Test Coverage Report for Build 12776475618

Details

0 of 0 changed or added relevant lines in 0 files are covered.
No unchanged relevant lines lost coverage.
Overall coverage decreased (-0.003%) to 98.206%

Totals
Change from base Build 12766815724:	-0.003%
Covered Lines:	33006
Relevant Lines:	33430

💛 - Coveralls

github-actions · 2025-01-14T14:10:57Z

Lighthouse scores

Category	Latest (report)	Main (report)	Branch (report)
Performance	0.99	0.99	0.99
Accessibility	1	1	1
Best Practices	1	1	1
SEO	1	0.92	0.92
PWA	1	1	1

What is this?

Lighthouse scores comparing the documentation site built from the PR ("Branch") to that of the production documentation site ("Latest") and the build currently on main ("Main"). Higher scores are better, but note that the SEO scores on Netlify URLs are artifically constrained to 0.92.

Transfer Size

Category	Latest	Main	Branch
Total	251.297 kB	236.557 kB	236.499 kB 🏆
Scripts	61.413 kB	54.21 kB	54.067 kB 🏆
Stylesheet	53.767 kB	47.854 kB 🏆	47.881 kB
Document	6.242 kB	5.486 kB 🏆	5.488 kB
Font	126.85 kB	126.596 kB	126.596 kB

Request Count

Category	Latest	Main	Branch
Total	52	52	52
Scripts	41	41	41
Stylesheet	5	5	5
Document	1	1	1
Font	2	2	2

rubencarvalho · 2025-01-14T16:57:27Z

packages/icon/package.json

We had two different versions being pinned—one byicons (.17) and another by icons-workflow (.16). In Yarn Classic, both were resolved to the lowest version, but in Yarn V4, they were resolved to the highest version. This difference caused some regressions. Pinning both to the same (older, lower) version fixed the issue.

rubencarvalho · 2025-01-14T16:59:36Z

.circleci/config.yml

    downstream:
        steps:
            - checkout
-            # - restore_cache:


We had commented these lines out earlier to cache-bust. Although it doesn’t provide a significant benefit (just sub-minute run time improvements), I’ve re-added it.

rubencarvalho · 2025-01-14T17:00:23Z

.yarnrc.yml

+cacheFolder: ~/.cache/yarn
+nodeLinker: node-modules
+yarnPath: .yarn/releases/yarn-4.6.0.cjs
+enableScripts: true


enableScripts is needed while we still have pre/post install commands

can we make this comment with a @todo remove when pre/post install commands are moved to the new yarn 4 recommended pattern

feel free to wordsmith that lol

Good call - just did! :)

rubencarvalho · 2025-01-14T17:02:00Z

tasks/build-preview-urls-comment.js

- [Storybook](https://${branchSlug}--spectrum-web-components.netlify.app/storybook/)`;
+- [Storybook](https://${branchSlug}--spectrum-web-components.netlify.app/storybook/)

-    // If there are changed packages, add a section with visual regression test results


I believe we should always have links for VRTs posted. For example, some dependency changes don’t trigger getChangedPackages(), but they can still cause regressions. Since the VRTs run regardless, it’s just a matter of ensuring we see the links.

caseyisonit · 2025-01-14T17:30:58Z

.circleci/config.yml

+                  command: yarn docs:build
+            - run:
+                  name: Build Storybook
+                  command: yarn storybook:build


you have no clue how happy this makes me!! thank you for breaking the steps out and moving away from an overly complex command!

castastrophe

This looks perfect! A good, focused update to the latest package. I haven't pulled down locally but the code itself is approved pending validations.

caseyisonit

good work 🚀

rubencarvalho force-pushed the ruben/bump-yarn branch 3 times, most recently from b92016a to 901848e Compare January 8, 2025 12:15

rubencarvalho force-pushed the ruben/bump-yarn branch 3 times, most recently from 27a63f7 to bafc5e9 Compare January 10, 2025 10:16

chore: bump yarn to version 4

1fe0168

rubencarvalho force-pushed the ruben/bump-yarn branch from a8c9e9c to 1fe0168 Compare January 14, 2025 11:23

rubencarvalho added 2 commits January 14, 2025 13:39

chore: add linted spectrum-icon.css

137cfc1

chore: add debugging logs

7186094

rubencarvalho force-pushed the ruben/bump-yarn branch from 2b3a589 to 7186094 Compare January 14, 2025 12:42

rubencarvalho and others added 11 commits January 14, 2025 13:48

chore: add nmMode

d5d1ebc

chore: change import strategy

e5564b3

chore: assert import

e064393

Merge branch 'main' into ruben/bump-yarn

9b924b5

chore: try a normal js import

453cde6

chore: a little bit of logging

0461856

chore: try other import path

18774c0

chore: yet another try

86f0f95

chore: clean up experiences and debugging

d5a7a6b

chore: always post VRT links

2ab2c9e

chore: actually build the docs

43d5668

rubencarvalho added 3 commits January 14, 2025 15:23

chore: revert icon changes

5dde1d6

chore: commiting this spectrum-icon css because it always pops up

0368343

chore: bump icon version

dc3ef21

rubencarvalho added 2 commits January 14, 2025 16:56

chore: bump icon version

1f6cd55

chore: revert icon version 🤷

5552eff

rubencarvalho commented Jan 14, 2025

View reviewed changes

rubencarvalho marked this pull request as ready for review January 14, 2025 17:02

rubencarvalho requested a review from a team as a code owner January 14, 2025 17:02

caseyisonit reviewed Jan 14, 2025

View reviewed changes

castastrophe approved these changes Jan 14, 2025

View reviewed changes

chore: always publish VRT and docs

2c6b3de

rubencarvalho force-pushed the ruben/bump-yarn branch from e787b2b to 2c6b3de Compare January 14, 2025 18:21

caseyisonit approved these changes Jan 14, 2025

View reviewed changes

chore: add @todo to remove enableScripts

a21bd04

rubencarvalho merged commit 29b4959 into main Jan 14, 2025
27 checks passed

rubencarvalho deleted the ruben/bump-yarn branch January 14, 2025 22:45

nikkimk pushed a commit that referenced this pull request Feb 27, 2025

chore: update yarn to v4 (#5010)

186625c

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

chore: update yarn to v4 #5010

chore: update yarn to v4 #5010

Uh oh!

rubencarvalho commented Jan 8, 2025 •

edited

Loading

Uh oh!

changeset-bot bot commented Jan 8, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Jan 8, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Jan 8, 2025

Uh oh!

coveralls commented Jan 8, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Jan 14, 2025 •

edited

Loading

Uh oh!

rubencarvalho Jan 14, 2025

Uh oh!

rubencarvalho Jan 14, 2025 •

edited

Loading

Uh oh!

rubencarvalho Jan 14, 2025

Uh oh!

caseyisonit Jan 14, 2025

Uh oh!

rubencarvalho Jan 14, 2025

Uh oh!

rubencarvalho Jan 14, 2025

Uh oh!

caseyisonit Jan 14, 2025

Uh oh!

castastrophe left a comment

Uh oh!

caseyisonit left a comment

Uh oh!

Uh oh!

Uh oh!

chore: update yarn to v4 #5010

chore: update yarn to v4 #5010

Uh oh!

Conversation

rubencarvalho commented Jan 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Motivation and context

Screenshots (if appropriate)

Types of changes

Checklist

Best practices

Uh oh!

changeset-bot bot commented Jan 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

github-actions bot commented Jan 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Branch preview

Review the following VRT differences

Uh oh!

github-actions bot commented Jan 8, 2025

Tachometer results

Uh oh!

coveralls commented Jan 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pull Request Test Coverage Report for Build 12776475618

Details

💛 - Coveralls

Uh oh!

github-actions bot commented Jan 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Lighthouse scores

Transfer Size

Request Count

Uh oh!

rubencarvalho Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

rubencarvalho Jan 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rubencarvalho Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

caseyisonit Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

rubencarvalho Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

rubencarvalho Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

caseyisonit Jan 14, 2025

Choose a reason for hiding this comment

Uh oh!

castastrophe left a comment

Choose a reason for hiding this comment

Uh oh!

caseyisonit left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

rubencarvalho commented Jan 8, 2025 •

edited

Loading

changeset-bot bot commented Jan 8, 2025 •

edited

Loading

github-actions bot commented Jan 8, 2025 •

edited

Loading

coveralls commented Jan 8, 2025 •

edited

Loading

github-actions bot commented Jan 14, 2025 •

edited

Loading

rubencarvalho Jan 14, 2025 •

edited

Loading