Skip to content

Clear omitted props in React remote components - #737

Open
RaphaelFakhri wants to merge 1 commit into
Shopify:mainfrom
RaphaelFakhri:fix-react-removed-remote-props
Open

RaphaelFakhri wants to merge 1 commit into
Shopify:mainfrom
RaphaelFakhri:fix-react-removed-remote-props

Conversation

@RaphaelFakhri

Copy link
Copy Markdown

Summary

The layout effect in createRemoteComponent() (@remote-dom/react) iterates only over the props of the current render. A prop that was passed in the previous render and is omitted from the next one is never visited, so the remote element keeps the stale attribute, property, or eventProps listener. The host keeps rendering the old value, and a removed listener keeps firing.

This change iterates over the union of the current and previous prop names. An omitted prop is handled like a prop set to undefined: the attribute is removed, the property is set to undefined, and the eventProps listener is removed.

Tests

  • Adds clears props that are omitted when a remote React component re-renders to packages/react/source/tests/e2e.test.tsx. The test renders a RemoteButton with tooltip, disabled, and onPress, re-renders it without them, and checks the remote element, the host props, and that press no longer calls the removed handler.
  • Without the source change, the new test fails: the tooltip attribute is still present. With the change, it passes.
  • pnpm test (67 files, 1102 tests), pnpm lint, pnpm type-check, and pnpm size pass.

Adds a patch changeset for @remote-dom/react.

Fixes #736

@RaphaelFakhri

Copy link
Copy Markdown
Author

I have signed the CLA.

This branch has not been deployed

No deployments
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.

createRemoteComponent() in @remote-dom/react does not clear props that are omitted on re-render

1 participant