Hi all. We’ve been building UI extensions for a couple of years and have never managed to find or elicit any documentation (or even basic guidance) on how Shopify expects developers to test their UI extension components. While we may be writing JSX and feel like we’re in the comfortable familiarity of React-land, once it comes to testing the components we’re writing for UI extensions it quickly becomes clear that this is not the case. There is a @remote-dom/testing
package (ref) which has some very minimal documentation in its README, but nothing that demonstrates how developers can leverage it to render their components for testing. There were one or two community-supplied examples elsewhere which I’ve since been unable to find, but I recall that neither of them were particularly “clean”.
Shopify’s adoption of an “exotic” rendering approach for UI extensions – which they themselves created and maintained – without supplying information as to how developers are expected to automate tests for the things they’re building on top of it, results in a lack of quality control and increased developer pain.
Would someone on Shopify’s side who’s involved in the UI extension/remote-dom
side of things be able to share examples of how Shopify expects developers to be testing their components, from test setup to teardown? Thanks! 
1 Like
I’d also really love to see this and also performance testing/profiling of components in remote-ui too please 
Have you had a look at Shopify Subscriptions Reference app.
They use these libraries:
@testing-library/user-event
@testing-library/jest-dom
@testing-library/react
You can check how they test UI extension as an example here.
Just a note - I have never tried but this is what I saw 
@remy727 thanks for sharing this. It seems like that code is just rendering the UI extension’s component as if it’s a regular React component rather than one intended to be used under Remote DOM. Testing in this way seems to me like it’d be fragile since we’re not testing under the same context as the code will actually be run in 
I’ve just tried this approach quickly to test one of our custom POS UI extension components (which is just a wrapper around a List
at this point) and after jumping through some hoops to get the tests to actually build – installing @testing-library/react
and react-dom
(specifically 18.3.0 because the @shopify/ui-extensions-react
is still incompatible with React 19) I run into an old “friend” thrown by Shopify:
No remote-ui Render instance found in context
This error has plagued us on and off for over a year now, and despite multiple attempts to get some guidance from anyone from Shopify who may be in the know, we’re still very much in the dark. I know we aren’t the only ones running into this. It’d be great if Shopify could support developers that are helping to make their ecosystem what they want it to be 