From 041533fa3a4abee26e1a5f679cd67e0f09f469e2 Mon Sep 17 00:00:00 2001 From: Frederik Bolding Date: Tue, 5 Mar 2024 11:00:24 +0100 Subject: [PATCH] Add `InputChangeEvent` event (#2237) Add an `InputChangeEvent` dynamic UI event to be triggered when an input in a form has changed. The event may be debounced in the client implementation and is not triggered instantly. --------- Co-authored-by: MetaMask Bot --- .../examples/packages/bip32/snap.manifest.json | 2 +- .../examples/packages/bip44/snap.manifest.json | 2 +- .../examples/packages/cronjobs/snap.manifest.json | 2 +- .../examples/packages/dialogs/snap.manifest.json | 2 +- .../packages/ethers-js/snap.manifest.json | 2 +- .../packages/get-entropy/snap.manifest.json | 2 +- .../packages/home-page/snap.manifest.json | 2 +- .../examples/packages/images/snap.manifest.json | 2 +- .../packages/interactive-ui/snap.manifest.json | 2 +- .../packages/core-signer/snap.manifest.json | 2 +- .../packages/lifecycle-hooks/snap.manifest.json | 2 +- .../packages/manage-state/snap.manifest.json | 2 +- .../packages/notifications/snap.manifest.json | 2 +- .../signature-insights/snap.manifest.json | 2 +- .../transaction-insights/snap.manifest.json | 2 +- .../src/common/validation.test.ts | 8 ++++++++ .../src/types/handlers/user-input.test.ts | 3 ++- .../snaps-sdk/src/types/handlers/user-input.ts | 15 ++++++++++++++- 18 files changed, 39 insertions(+), 17 deletions(-) diff --git a/packages/examples/packages/bip32/snap.manifest.json b/packages/examples/packages/bip32/snap.manifest.json index 2ef41ebbbd..1139f65bf3 100644 --- a/packages/examples/packages/bip32/snap.manifest.json +++ b/packages/examples/packages/bip32/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "jXB7m0SEAB1g2n8E23KElZVG6cipIB8bk7tMInGTGHE=", + "shasum": "DtqCkGevlAXjYPpejmh0PW3OXNVm4zYi/PHYVu1U+is=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/bip44/snap.manifest.json b/packages/examples/packages/bip44/snap.manifest.json index 92880a4de6..afc9ae4264 100644 --- a/packages/examples/packages/bip44/snap.manifest.json +++ b/packages/examples/packages/bip44/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "C9TwxeFksZjLcFlkiee3rwbU075F10AIBrxp2B1Vc3A=", + "shasum": "lzjiI94y3QWSHvxvwWPJ3QiLoVpRoDK9aI0KfiFGaO0=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/cronjobs/snap.manifest.json b/packages/examples/packages/cronjobs/snap.manifest.json index 69afb2537b..c1ffb4deac 100644 --- a/packages/examples/packages/cronjobs/snap.manifest.json +++ b/packages/examples/packages/cronjobs/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "OltG2NDvqyXlQ63rnYbgs3E04Jkp7xDfoERPYjivJoI=", + "shasum": "+RV6eu1bUJwI64Ia+87nzVt7w5hEvGG+DjvWRd1ds3E=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/dialogs/snap.manifest.json b/packages/examples/packages/dialogs/snap.manifest.json index f7d80b2ccf..76e198ab06 100644 --- a/packages/examples/packages/dialogs/snap.manifest.json +++ b/packages/examples/packages/dialogs/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "sJFkvJ7Hw/mL7nsUV2zacpbXagg/vbaWrlwx6m3kZv8=", + "shasum": "HrY2Q07bwZLKbP7UYbLU2fVMVMjGWgwhmlTGUgEQNMo=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/ethers-js/snap.manifest.json b/packages/examples/packages/ethers-js/snap.manifest.json index 90bf2556e6..e88c2a518e 100644 --- a/packages/examples/packages/ethers-js/snap.manifest.json +++ b/packages/examples/packages/ethers-js/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "BrtFgMRty4l3lFai0ZRzvsOMi+GD35wU2L8e4rC4Pzs=", + "shasum": "75eFrFWMaWVoN+SB0Dx6zuMuW6wkW9TAyfTJ2pmkXxU=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/get-entropy/snap.manifest.json b/packages/examples/packages/get-entropy/snap.manifest.json index e39322f4df..5e78610ae1 100644 --- a/packages/examples/packages/get-entropy/snap.manifest.json +++ b/packages/examples/packages/get-entropy/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "L5ZAAUcWucgTLY16I6pX7rzkhW/Am6eW8/6AtHQikuQ=", + "shasum": "Bk/N5TeC923rK569D6o7eEusaTZ4ENeqakMXPcAR/tY=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/home-page/snap.manifest.json b/packages/examples/packages/home-page/snap.manifest.json index 7be773792b..6679fe00e3 100644 --- a/packages/examples/packages/home-page/snap.manifest.json +++ b/packages/examples/packages/home-page/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "c4TP0ESTAYG4AVILxhjNk8PfPNRZA+m1W+IF+8GIFiM=", + "shasum": "g97yy0ykpflNFVzBfFablH4DsLNr+eZKCEoDbLQpmgY=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/images/snap.manifest.json b/packages/examples/packages/images/snap.manifest.json index e73d9050e9..70efc19aa4 100644 --- a/packages/examples/packages/images/snap.manifest.json +++ b/packages/examples/packages/images/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "KZD5RWnfjvokfDoLsN3NDVZwmJ5VuhiBC9N8gOpLe48=", + "shasum": "AI+NqKyNjL6pvJv2CapYwFbHSm9EoTINoXl/ZLnZP0E=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/interactive-ui/snap.manifest.json b/packages/examples/packages/interactive-ui/snap.manifest.json index 38b0aa2326..ea7bdb109b 100644 --- a/packages/examples/packages/interactive-ui/snap.manifest.json +++ b/packages/examples/packages/interactive-ui/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "HAaFlDfI6+0VX5v5GtYliD2l8PRw74OgSidyU31hdYI=", + "shasum": "PPCmPNzFzjg4596Rs/LnTuHAaJq3oAqv+XMSjpTjq0w=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/invoke-snap/packages/core-signer/snap.manifest.json b/packages/examples/packages/invoke-snap/packages/core-signer/snap.manifest.json index bcf262e129..13b2c87f37 100644 --- a/packages/examples/packages/invoke-snap/packages/core-signer/snap.manifest.json +++ b/packages/examples/packages/invoke-snap/packages/core-signer/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "2ZO74x0nI5E7je1hVrWFRbsACAuN5XAu6NSyiSnMZ5s=", + "shasum": "Af0qYFlaZB9ublbw/EdKs/zKfWsSXAG2Mi/XTRmAHOU=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/lifecycle-hooks/snap.manifest.json b/packages/examples/packages/lifecycle-hooks/snap.manifest.json index 60c49b4f75..175ae7d075 100644 --- a/packages/examples/packages/lifecycle-hooks/snap.manifest.json +++ b/packages/examples/packages/lifecycle-hooks/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "qliiMjjWRT7RkwORjS15Uhyfo5AJo3gCUIC+/z4qB5Q=", + "shasum": "DSVf2LLECYZqXVe8EInjs5uZ7Ey+UA/ANfbe+XYlCOs=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/manage-state/snap.manifest.json b/packages/examples/packages/manage-state/snap.manifest.json index 03da30f450..0d5d02d263 100644 --- a/packages/examples/packages/manage-state/snap.manifest.json +++ b/packages/examples/packages/manage-state/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "nPzGIoWTNhgD9GP8yM1jg8gQOR7LdDCXbfCiiQY6u6E=", + "shasum": "D1RxlgTDi5cCPn6Cf2hO2WzvBnn56ipuSGf6Z96HhIE=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/notifications/snap.manifest.json b/packages/examples/packages/notifications/snap.manifest.json index 89c9db8c03..a7f1761b24 100644 --- a/packages/examples/packages/notifications/snap.manifest.json +++ b/packages/examples/packages/notifications/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "JaGuDtOA+RSa+rMvlvVgFG/oIy7o1BafN6WEIetbKqY=", + "shasum": "HcZ87SrdWWI7kPX5pId8h8wNMgltlMXqXjGnG+7nN8k=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/signature-insights/snap.manifest.json b/packages/examples/packages/signature-insights/snap.manifest.json index 9aa97a0d9e..82bafa0cd1 100644 --- a/packages/examples/packages/signature-insights/snap.manifest.json +++ b/packages/examples/packages/signature-insights/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "z6FH7b1/dv0jY5p7EQ2TclzPjDAb3LGdGybVCK6N3AQ=", + "shasum": "yisG8u7h5r9IBpGfapBj8RM2wr5YQh5QA/3cjrBCklU=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/examples/packages/transaction-insights/snap.manifest.json b/packages/examples/packages/transaction-insights/snap.manifest.json index ec17a2bb39..21468852eb 100644 --- a/packages/examples/packages/transaction-insights/snap.manifest.json +++ b/packages/examples/packages/transaction-insights/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/MetaMask/snaps.git" }, "source": { - "shasum": "D9w45JEFlH+OlHKwOFPtNjBGX0d6rZPXMDnndk+zs0k=", + "shasum": "sV8xD5zSmYjW5L6L0cY7kZS3UyzlScEyk13lSkYCRhA=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/snaps-execution-environments/src/common/validation.test.ts b/packages/snaps-execution-environments/src/common/validation.test.ts index b9b9ec766a..dfe1d246ba 100644 --- a/packages/snaps-execution-environments/src/common/validation.test.ts +++ b/packages/snaps-execution-environments/src/common/validation.test.ts @@ -165,6 +165,14 @@ describe('assertIsOnUserInputRequestArguments', () => { value: { foo: 'bar' }, }, }, + { + id: 'foo', + event: { + type: UserInputEventType.InputChangeEvent, + name: 'input', + value: 'bar', + }, + }, ])('does not throw for a valid user input param object', (value) => { expect(() => assertIsOnUserInputRequestArguments(value)).not.toThrow(); }); diff --git a/packages/snaps-sdk/src/types/handlers/user-input.test.ts b/packages/snaps-sdk/src/types/handlers/user-input.test.ts index d7be7575f9..97194fc796 100644 --- a/packages/snaps-sdk/src/types/handlers/user-input.test.ts +++ b/packages/snaps-sdk/src/types/handlers/user-input.test.ts @@ -2,8 +2,9 @@ import { UserInputEventType } from './user-input'; describe('UserInputEventType', () => { it('has the correct values', () => { - expect(Object.values(UserInputEventType)).toHaveLength(2); + expect(Object.values(UserInputEventType)).toHaveLength(3); expect(UserInputEventType.ButtonClickEvent).toBe('ButtonClickEvent'); expect(UserInputEventType.FormSubmitEvent).toBe('FormSubmitEvent'); + expect(UserInputEventType.InputChangeEvent).toBe('InputChangeEvent'); }); }); diff --git a/packages/snaps-sdk/src/types/handlers/user-input.ts b/packages/snaps-sdk/src/types/handlers/user-input.ts index 89d5d44c93..306269a81c 100644 --- a/packages/snaps-sdk/src/types/handlers/user-input.ts +++ b/packages/snaps-sdk/src/types/handlers/user-input.ts @@ -11,14 +11,16 @@ import { /** * The type of user input event fired. - * Currently only two events are supported: + * Currently only three events are supported: * * - `ButtonClickEvent` - A button has been clicked in the UI. * - `FormSubmitEvent` - A Form has been submitted in the UI. + * - `InputChangeEvent` - The value of an input field has changed in the UI. */ export enum UserInputEventType { ButtonClickEvent = 'ButtonClickEvent', FormSubmitEvent = 'FormSubmitEvent', + InputChangeEvent = 'InputChangeEvent', } export const GenericEventStruct = object({ @@ -30,6 +32,7 @@ export const ButtonClickEventStruct = assign( GenericEventStruct, object({ type: literal(UserInputEventType.ButtonClickEvent), + name: optional(string()), }), ); @@ -42,9 +45,19 @@ export const FormSubmitEventStruct = assign( }), ); +export const InputChangeEventStruct = assign( + GenericEventStruct, + object({ + type: literal(UserInputEventType.InputChangeEvent), + name: string(), + value: string(), + }), +); + export const UserInputEventStruct = union([ ButtonClickEventStruct, FormSubmitEventStruct, + InputChangeEventStruct, ]); /**