Skip to content

fix(Link): destructure muted prop to prevent unintentional DOM attribute leakage#7631

Draft
Copilot wants to merge 3 commits intomainfrom
copilot/fix-muted-prop-leak
Draft

fix(Link): destructure muted prop to prevent unintentional DOM attribute leakage#7631
Copilot wants to merge 3 commits intomainfrom
copilot/fix-muted-prop-leak

Conversation

Copy link
Contributor

Copilot AI commented Mar 6, 2026

  • Add assertion to the existing muted test that the bare muted HTML attribute is not present on the DOM element
Original prompt

Bug

In packages/react/src/Link/Link.tsx, the muted prop is not destructured out of restProps, causing it to leak to the DOM element via the {...restProps} spread.

Current code (line 23):

const {as: Component = 'a', className, inline, hoverColor, ...restProps} = props

inline and hoverColor are correctly extracted, but muted is not. Later in the JSX:

<Component
  className={clsx(className, classes.Link)}
  data-muted={restProps.muted}   // reads muted from restProps
  data-inline={inline}
  data-hover-color={hoverColor}
  {...restProps}                  // ⚠️ spreads restProps which STILL contains `muted`
  ref={innerRef as any}
/>

This means the rendered DOM element gets both data-muted="true" (intentional, used by CSS) and a bare muted HTML attribute (unintentional). React may warn: "Warning: Received 'true' for a non-boolean attribute 'muted'.".

Fix

Destructure muted from props alongside inline and hoverColor:

const {as: Component = 'a', className, inline, muted, hoverColor, ...restProps} = props

And update the JSX to use the extracted muted variable:

<Component
  className={clsx(className, classes.Link)}
  data-muted={muted}
  data-inline={inline}
  data-hover-color={hoverColor}
  {...restProps}
  ref={innerRef as any}
/>

This ensures muted is consumed by the component and only passed to the DOM as the data-muted data attribute, which is what the CSS module (Link.module.css) expects.

This pull request was created from Copilot chat.


🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.

@changeset-bot
Copy link

changeset-bot bot commented Mar 6, 2026

⚠️ No Changeset found

Latest commit: 61eb747

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.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

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

Co-authored-by: mattcosta7 <8616962+mattcosta7@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix muted prop leaking into DOM element fix(Link): destructure muted prop to prevent unintentional DOM attribute leakage Mar 6, 2026
Co-authored-by: mattcosta7 <8616962+mattcosta7@users.noreply.github.com>
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.

2 participants