[Feature] Form POS UI extension

Hey,

Shopify have changed from using controlled inputs with Polaris React to uncontrolled with the web components model.
This allows you to wrap the inputs with a form component on Admin (iframe) Save bar and integrate with the save bar.

On Shopify Admin UI Extensions, there is an s-form which can be used to get the results of a user submission Form

But there isn’t this option on Shopify POS, which means we need to add more event listeners and store more state.
This is less efficient as we need to run more javascript code and event listeners on lower end devices which tend to be used for POS and means we can’t use any of the native form validation options which the browser gives us again requiring more code and wiring.

It’s also leading to inconsistencies across the surfaces which the components are designed to resolve.

https://shopify.dev/docs/api/pos-ui-extensions/latest/web-components/forms/text-area#handle-text-input-events

Please could it be considered to support the browser form component on Shopify POS.

Hey @JordanFinners - thanks for flagging this as always.

Just confirming on our end here, there isn’t currently an s-form equivalent available for POS UI extensions in the same way there is for Admin UI extensions like you mentioned, so the current path would be wiring the field state/validation manually.

A couple of possible workarounds here would be:

  • Using change events instead of input events where possible, so you’re not updating state on every keystroke.
  • Keeping the form values in a single object/reducer and running validation from the submit/save action.
  • Setting field error props after blur or submit, rather than continuously validating while the merchant is typing.

Would one of those patterns work for your use case here, or is the main blocker specifically needing native form-level submit/validation behavior in POS? If the workaround path doesn’t cover it, I’m happy to pass this along as a feature request as always as well!

Hey Alan,

Yeah thats what I’m using right now, however thats more javascript to run and monitor the inputs which means more processing for lower end devices to do, I’d love to see HTML form or custom s-form support on POS in future :folded_hands:

Sounds good @JordanFinners , thanks again for the context. I’ve passed this along as a feature request for you :slight_smile: