Skip to content

fix(mui): apply Link styling props to MuiLink instead of span in Breadcrumb#7464

Open
Purav-Kanda wants to merge 1 commit into
refinedev:mainfrom
Purav-Kanda:fix/mui-breadcrumb-link-styling
Open

fix(mui): apply Link styling props to MuiLink instead of span in Breadcrumb#7464
Purav-Kanda wants to merge 1 commit into
refinedev:mainfrom
Purav-Kanda:fix/mui-breadcrumb-link-styling

Conversation

@Purav-Kanda

@Purav-Kanda Purav-Kanda commented Jun 22, 2026

Copy link
Copy Markdown

Resolves #7462

#7463 already proposes the same one-line fix, but adds no test coverage. The issue itself calls out that the existing breadcrumbTests suite only checks structure (text/href/icon), never styling — which is exactly why this regression shipped unnoticed. This PR includes the fix and closes that gap with a regression test that fails against the buggy <span> implementation and passes against the fix.

What's the problem?

@refinedev/mui's Breadcrumb renders links through an internal LinkRouter helper, typed to accept MUI LinkProps (sx, underline, color, variant) but spreading them onto a bare <span> instead of an MUI component — so the props do nothing and leak as invalid DOM attributes (e.g. sx="[object Object]").

Regression from the v5 migration (#6945, commit 5d63ada), which rewrote LinkRouter for the new useLink() API but never re-wired the styling props to an actual MUI component.

Fix

Wrap the content in MUI's real Link (component="span" to avoid nesting two <a> tags, same precaution as #7428):

const LinkRouter = (props: LinkProps & { to?: string }) => {
  const { to, children, ...restProps } = props;
  return (
    <Link to={to || ""}>
      <MuiLink component="span" {...restProps}>
        {children}
      </MuiLink>
    </Link>
  );
};

Test added

packages/mui/src/components/breadcrumb/index.spec.tsx asserts the rendered link's inner element carries the MuiLink-root class and that none of sx/underline/color/variant leak through as literal DOM attributes.

Checklist

  • Reproduced the bug
  • Verified the fix resolves it
  • Added a changeset
  • Added a regression test
  • Existing tests pass (pnpm test in packages/mui — 420 passed, 4 pre-existing/unrelated failures: timezone-dependent DateField tests and a flaky useDataGrid timeout, neither touched by this change)

@changeset-bot

changeset-bot Bot commented Jun 22, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: a655fd4

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

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

@Purav-Kanda Purav-Kanda changed the title fix(mui): apply Link styling props to MuiLink instead of span in Brea… fix(mui): apply Link styling props to MuiLink instead of span in Breadcrumb Jun 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] MUI Breadcrumb links lose all styling — sx/underline/color/variant spread onto a plain <span>

1 participant