Skip to content

[code-infra] Optimize dependency definition#22006

Merged
LukasTy merged 1 commit intomui:masterfrom
LukasTy:core/optimize-dep-graph-renovate
Apr 8, 2026
Merged

[code-infra] Optimize dependency definition#22006
LukasTy merged 1 commit intomui:masterfrom
LukasTy:core/optimize-dep-graph-renovate

Conversation

@LukasTy
Copy link
Copy Markdown
Member

@LukasTy LukasTy commented Apr 7, 2026

Follow-up on #21999.

Further attempt to make life for Renovate easier and tighten the dependency graph along the way.

Changes

Renovate

  • renovate.json — added "ignorePaths": ["**/bug-reproductions/**"]. Both bug-reproductions/x-charts/package.json and bug-reproductions/x-data-grid/package.json pin every dep to "latest", so there is nothing for Renovate to update there. The mui-public preset already ignores **/examples/**, but not bug-reproductions/**.

Catalog hoists

Hoisted into the pnpm-workspace.yaml catalog: to remove duplicated pinned versions and shrink Renovate's per-PR diff churn:

  • @atlaskit/pragmatic-drag-and-drop ^1.7.7 (was duplicated in docs/ and packages/x-scheduler-headless)
  • @base-ui/react ^1.3.0 (was duplicated across all four x-scheduler* packages)
  • @mui/types 7.4.12 (was duplicated in x-data-grid and x-virtualizer)
  • execa 9.6.1 (was duplicated in root and x-charts-vendor)
  • jsdom 26.1.0 (was duplicated in root and test/performance-charts)

Cleanup

  • package.json — dropped chai-dom and @types/chai-dom from root devDependencies. Both are already direct deps of @mui/internal-test-utils, so the runtime matchers and type augmentation keep flowing in transitively.
  • packages/x-virtualizer/tsconfig.json — removed the stale "chai-dom" entry from compilerOptions.types. x-virtualizer has no test files of its own; the entry was leftover cruft from when this code lived in x-data-grid.

Robust ForwardRef(...) test expectations

Relaxed the reactMajor < 19 assertions in layout.DataGrid.test.tsx, slots.DataGrid.test.tsx, and TreeViewItemsPlugin.test.tsx to match only the component-name prefix instead of the exact <ForwardRef(DataGrid2)> component string. See the "vite / vitest catalog bump — investigated, deferred" section below for why.

vite / vitest catalog bump — investigated, deferred

The initial plan for this PR also bumped vite ^7.3.1 → ^8.0.2, vitest ^4.0.18 → ^4.1.3, @vitest/* → ^4.1.3, @vitejs/plugin-react ^5.1.4 → ^5.2.0, and @vitejs/plugin-react-swc ^4.2.3 → ^4.3.0 to align the catalog with @mui/internal-bundle-size-checker, which already pulls vite@^8 into the tree. That bump was reverted before merge after CI feedback.

Why it was attempted

On master, @mui/internal-bundle-size-checker having vite@^8 as a direct dep means pnpm materializes both vite@7.3.1 (for the catalog) and vite@8.0.2 (for bundle-size-checker) in the tree. Any edit to any workspace package.json then causes pnpm install to re-resolve peers and cascades the vite@8 instantiation across ~36 peer-resolved sites, producing an ~80-line lockfile churn and these install-time warnings:

@codspeed/vitest-plugin@5.2.0   ✕ unmet peer vite@"^4-^7": found 8.0.2
@vitest/mocker@4.0.18           ✕ unmet peer vite@"^6 || ^7.0.0-0": found 8.0.2
@vitejs/plugin-react@5.1.4      ✕ unmet peer vite@"^4-^7": found 8.0.2
@vitejs/plugin-react-swc@4.2.3  ✕ unmet peer vite@"^4-^7": found 8.0.2

Bumping the catalog to vite@8 was meant to consolidate everything on a single major and stop the cascade, making future Renovate runs and PRs much cheaper.

What the bump did break

  1. @vitejs/plugin-react@5.1.4 → 5.2.0 changes JSX scope handling such that inner named function expressions inside React.forwardRef(function DataGrid(...) {...}) no longer get the 2 suffix that previously disambiguated them from the outer const DataGrid. Five reactMajor < 19 tests in layout.DataGrid.test.tsx, slots.DataGrid.test.tsx, and TreeViewItemsPlugin.test.tsx asserted on the exact <ForwardRef(DataGrid2)> component string. Fixed by relaxing them to substring-prefix matches — kept in this PR for forward compatibility.
  2. vitest@4.1.3 + vite@8 + chromium headless browser mode crashed pages repeatedly during the React 19 browser CI job in test/e2e and test/regressions, with the runner eventually dying on:
    [vitest] Browser connection was closed while running tests. Was the page closed unexpectedly?
    [birpc] rpc is closed, cannot call "createTesters"
    
    The failing file was describeValidation.MobileDateRangePicker.test.tsx, which is one of the larger describe suites we have (~40+ test cases sharing a single long-lived browser page under isolate: false + maxWorkers: 1). React 18 browser CI was unaffected.

Why that could not be stabilized in this PR

The vitest/vite upgrade chain is tightly coupled by peer ranges:

  • @vitest/mocker@4.0.18 requires vite: ^6 || ^7.0.0-0 → forces vitest@4.0.18 onto vite@7
  • @vitest/mocker@4.1.3 requires vite: ^6 || ^7 || ^8 → happy on vite@8

So we can't cherry-pick "vite@8 but keep vitest@4.0.18", or vice versa, without overrides. And the root cause of the chromium page crash looks like an existing vitest browser-mode memory accumulation issue that is not specific to this repo:

Workarounds discussed in the vitest tracker (isolate: false, fileParallelism: false, maxWorkers: 1) are already all enabled in vitest.shared.mts, so there was nothing left to tune from our side.

Decision

  • Revert the vite / vitest / @vitest/* / @vitejs/plugin-react* catalog bumps. All of those catalog entries stay at their current master values.
  • Keep the substring-match test expectations. They still pass against the current plugin-react 5.1.4 (<ForwardRef(DataGrid2)> naming), so they're a no-op today, but they make the next @vitejs/plugin-react bump a drop-in with no test changes required.
  • Keep the catalog hoists and chai-dom cleanup, which were the core goal of this PR.

Follow-up for when we revisit the vite bump:

  • Wait for the next @mui/internal-test-utils / @mui/internal-bundle-size-checker rev that moves everything to a single vite major.
  • Or wait for a new vitest browser-mode release with better page-lifecycle memory behaviour (the open issues above are being tracked by the vitest team).
  • At that point, this PR's test changes will already be in place and only pnpm-workspace.yaml catalog entries will need touching.

Lockfile impact

pnpm-lock.yaml: +46 lines vs master (+28 / −18), vite@8 footprint unchanged at 2 entries (same as master — the 38-entry cascade only shows up mid-install and pnpm dedupe collapses it again).

Test plan

  • pnpm install — clean, only the pre-existing @eslint/js@10 vs eslint@9 and react-runner@1.0.5 vs react@19 peer warnings that are already on master
  • pnpm typescript — all 23 projects pass
  • pnpm eslint — exit 0
  • pnpm prettier — clean
  • pnpm deduplicate — no lockfile changes
  • pnpm dlx --package=renovate renovate-config-validator renovate.json — config valid
  • pnpm test:unit --project x-data-grid --project x-tree-view --project x-scheduler --run on React 19 — 1594 passed
  • The 5 previously-failing <ForwardRef(X2)> tests (layout.DataGrid, slots.DataGrid, TreeViewItemsPlugin) pass on both React 18 and React 19

@LukasTy LukasTy self-assigned this Apr 7, 2026
@LukasTy LukasTy added dependencies Update of dependencies. scope: code-infra Involves the code-infra product (https://www.notion.so/mui-org/5562c14178aa42af97bc1fa5114000cd). labels Apr 7, 2026
@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Apr 7, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 7, 2026

This pull request has conflicts, please resolve those before we can evaluate the pull request.

@mui-bot
Copy link
Copy Markdown

mui-bot commented Apr 7, 2026

Deploy preview: https://deploy-preview-22006--material-ui-x.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/x-data-grid 0B(0.00%) 0B(0.00%)
@mui/x-data-grid-pro 0B(0.00%) 0B(0.00%)
@mui/x-data-grid-premium 0B(0.00%) 0B(0.00%)
@mui/x-charts 0B(0.00%) 0B(0.00%)
@mui/x-charts-pro 0B(0.00%) 0B(0.00%)
@mui/x-charts-premium 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers-pro 0B(0.00%) 0B(0.00%)
@mui/x-tree-view 0B(0.00%) 0B(0.00%)
@mui/x-tree-view-pro 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 6385529

@LukasTy LukasTy force-pushed the core/optimize-dep-graph-renovate branch from 30c2e9e to 2eef463 Compare April 7, 2026 13:17
@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Apr 7, 2026
@LukasTy LukasTy force-pushed the core/optimize-dep-graph-renovate branch 4 times, most recently from 43ac0c5 to 52f05d8 Compare April 7, 2026 21:06
Follow-up on mui#21999. Reduces Renovate's per-PR memory pressure and
tightens the dependency graph.

- renovate.json: add `ignorePaths: ["**/bug-reproductions/**"]`. The
  mui-public preset already ignores `examples/`, but `bug-reproductions/`
  packages pin every dep to `"latest"`, so there is nothing for Renovate
  to do there.
- pnpm-workspace.yaml: hoist `@atlaskit/pragmatic-drag-and-drop`,
  `@base-ui/react`, `@mui/types`, `execa`, and `jsdom` into the catalog.
  Each was duplicated with the same pinned version across 2-4
  package.json files; moving them to the catalog removes the duplication
  and cuts per-package Renovate PRs.
- Drop `chai-dom` and `@types/chai-dom` from root devDeps. Both are
  already direct deps of `@mui/internal-test-utils`, so the matchers
  and type augmentation keep flowing in transitively. Also drop the
  stale `"chai-dom"` entry from `packages/x-virtualizer/tsconfig.json`
  (x-virtualizer has no tests at all; the entry was leftover cruft).
- Relax the `reactMajor < 19` assertions in `layout.DataGrid`,
  `slots.DataGrid`, and `TreeViewItemsPlugin` to a substring prefix.
  `@vitejs/plugin-react` 5.2+ changes JSX scope handling so the inner
  named function expression no longer gets a `2` suffix in the
  `<ForwardRef(DataGrid2)>` frame. The prefix match is forward
  compatible with both the current `ForwardRef(DataGrid2)` form and
  the future `ForwardRef(DataGrid)` form, so a future `vite` /
  `vitest` / `@vitejs/plugin-react` catalog bump won't need to touch
  these tests again.
@LukasTy LukasTy force-pushed the core/optimize-dep-graph-renovate branch from 52f05d8 to 6385529 Compare April 7, 2026 21:39
@LukasTy LukasTy requested review from a team and Copilot April 7, 2026 21:45
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR is a code-infra follow-up aimed at reducing Renovate noise and tightening dependency version management across the monorepo by centralizing repeated versions in the pnpm workspace catalog, plus small test expectation tweaks for forward compatibility.

Changes:

  • Update renovate.json to ignore bug-reproductions/** so Renovate doesn’t open pointless PRs for “latest”-pinned fixtures.
  • Hoist several duplicated dependency pins into pnpm-workspace.yaml catalog: and convert package.json entries to catalog: references (plus corresponding lockfile updates).
  • Remove root chai-dom deps and clean up a stale chai-dom TS types entry; relax a few <ForwardRef(...)>-name assertions to be resilient across @vitejs/plugin-react versions.

Reviewed changes

Copilot reviewed 16 out of 17 changed files in this pull request and generated no comments.

Show a summary per file
File Description
renovate.json Ignores bug-reproductions/** to reduce Renovate churn.
pnpm-workspace.yaml Adds catalog entries for several previously duplicated pinned deps.
pnpm-lock.yaml Reflects catalog hoists and root dependency cleanup.
package.json Removes chai-dom / @types/chai-dom from root; switches execa/jsdom to catalog:.
docs/package.json Uses catalog for @atlaskit/pragmatic-drag-and-drop.
packages/x-charts-vendor/package.json Uses catalog for execa.
test/performance-charts/package.json Uses catalog for jsdom.
packages/x-data-grid/package.json Uses catalog for @mui/types.
packages/x-virtualizer/package.json Uses catalog for @mui/types.
packages/x-virtualizer/tsconfig.json Removes stale chai-dom from compilerOptions.types.
packages/x-scheduler/package.json Uses catalog for @base-ui/react.
packages/x-scheduler-premium/package.json Uses catalog for @base-ui/react.
packages/x-scheduler-headless/package.json Uses catalog for @atlaskit/pragmatic-drag-and-drop and @base-ui/react.
packages/x-scheduler-headless-premium/package.json Uses catalog for @base-ui/react.
packages/x-data-grid/src/tests/layout.DataGrid.test.tsx Relaxes <ForwardRef(...)> assertion to a prefix match for plugin-react compatibility.
packages/x-data-grid/src/tests/slots.DataGrid.test.tsx Same prefix-match relaxation for <ForwardRef(...)>.
packages/x-tree-view/src/internals/plugins/items/TreeViewItemsPlugin.test.tsx Same prefix-match relaxation for <ForwardRef(...)> across plugin-react versions.
Files not reviewed (1)
  • pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@LukasTy LukasTy marked this pull request as ready for review April 7, 2026 21:59
@LukasTy LukasTy changed the title [code-infra] Optimize dependencies [code-infra] Optimize dependency definition Apr 7, 2026
'The Data Grid component requires all rows to have a unique `id` property',
reactMajor < 19 && 'The above error occurred in the <ForwardRef(DataGrid2)> component',
// `ForwardRef(DataGrid)` on newer `@vitejs/plugin-react`, `ForwardRef(DataGrid2)` on older ones.
reactMajor < 19 && 'The above error occurred in the <ForwardRef(DataGrid',
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Adding a displayName to the grid should stabilize this

Copy link
Copy Markdown
Member

@Janpot Janpot left a comment

Choose a reason for hiding this comment

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

🙂 Another proof that catalogs are the wrong solution to the problem. There's nothing enforcing them to be used. You now need a linter to verify al these dependencies have the catalog: value. At which point you may as well just verify they have the same value and get rid of the catalog.

reactMajor >= 19 &&
'The Data Grid component requires all rows to have a unique `id` property',
reactMajor < 19 && 'The above error occurred in the <ForwardRef(DataGrid2)> component',
// `ForwardRef(DataGrid)` on newer `@vitejs/plugin-react`, `ForwardRef(DataGrid2)` on older ones.
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Do we ever use older plugins? Can't we just use the value without the 2 at the end now? <ForwardRef(DataGrid)>

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

We currently use the older plugin, which builds the name with 2.
After upgrading to the latest plugin, it's to without the 2.
So, this prepares for the plugin bump, when other packages are read and don't break when running browser tests.

Are you suggesting ditching the comment altogether?

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

No, I was under the impression we were using the newer plugin. It is fine then until we change.

@LukasTy
Copy link
Copy Markdown
Member Author

LukasTy commented Apr 8, 2026

🙂 Another proof that catalogs are the wrong solution to the problem. There's nothing enforcing them to be used. You now need a linter to verify al these dependencies have the catalog: value. At which point you may as well just verify they have the same value and get rid of the catalog.

Agreed. There isn't too much benefit to it. In any case, you need diligence or linting to ensure the same version is used in the repo. 🙈
It makes a few things slightly easier:

  • quicker and smaller PR for bumping deps
  • DRY 😊

@LukasTy LukasTy merged commit 82805d0 into mui:master Apr 8, 2026
27 checks passed
@LukasTy LukasTy deleted the core/optimize-dep-graph-renovate branch April 8, 2026 07:20
@LukasTy
Copy link
Copy Markdown
Member Author

LukasTy commented Apr 8, 2026

Not sure if it's temporary, but Renovate was able to run after this got merged: https://developer.mend.io/github/mui/mui-x/-/job/b1cbddb4-6bba-4176-8f4b-ee1fcd33b887.
Will monitor the state and look for any possible further improvements.
But for now, we are eagerly awaiting the vite updates to avoid tests hanging. 🙈

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

dependencies Update of dependencies. scope: code-infra Involves the code-infra product (https://www.notion.so/mui-org/5562c14178aa42af97bc1fa5114000cd).

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants