Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix: Improve stability of initial state sync in Snaps UI (#25375)
<!-- Please submit this PR as a draft initially. Do not mark it as "Ready for review" until the template has been completely filled out, and PR status checks have passed at least once. --> ## **Description** Improves stability of initial state sync when using Snaps UI. Previously, sometimes, the `initialState` in the `SnapInterfaceContext` wouldn't be updated when the content of the interface changed and thus initial values would be missing. This PR changes the implementation to use one selector in the renderer, which only changes when the content does, but passes the `initialState` and `context` to the `SnapInterfaceContext` itself. This way we are guaranteed for the content and state to stay in sync. [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/25375?quickstart=1) Can be tested with a Snap like: ```ts export const onRpcRequest: OnRpcRequestHandler = async ({ origin, request, }) => { switch (request.method) { case 'hello': { const id = await snap.request({ method: 'snap_createInterface', params: { ui: ( <Box> <Text>foo</Text> <Button>Click me</Button> </Box> ), context: { foo: 'bar' }, }, }); return snap.request({ method: 'snap_dialog', params: { type: 'confirmation', id, }, }); } default: throw new Error('Method not found.'); } }; export const onUserInput: OnUserInputHandler = async ({ id, event, context, }) => { if (event.type === 'ButtonClickEvent') { await snap.request({ method: 'snap_updateInterface', params: { id, ui: ( <Box> <Heading>Settings</Heading> <Input name="foo" value="foo" /> <Form name="settingsForm"> <Field label="foo"> <Input name="foo" value="foo" /> </Field> </Form> </Box> ), }, }); return; } }; ```
- Loading branch information