[Feature request] Support for Source Maps for upload into bug tracking tools like Sentry

As requested in [IMPORTANT] Stop creating issues here, use the Shopify Community forum instead · Issue #2521 · Shopify/ui-extensions · GitHub, I am re-raising this issue.

Please find below the details of Support for Source Maps for upload into bug tracking tools like Sentry · Issue #2198 · Shopify/ui-extensions · GitHub

Please list the related package(s)

checkout-ui-extensions

If this related to specific APIs or components, please list them here

I’ve followed the guide on Error handling.

Is your feature request related to a problem? Please describe.

We are getting a number of errors from our new Shopify Checkout Extension(s).

The errors are cryptic, like:

While I can probably work out what it is, it’d be delightful to be able to have proper source mapping in the error reporting so that we can easily map our code to the error.

From looking at the link above, and from browsing other documentation (e.g. Sentry Issue and a guide someone produced), I can’t see anything about source maps.

Describe the changes you are looking for

I would like an update to the documentation linked above to explain how to extract a source map from Shopify to upload into Sentry.

Describe alternatives you’ve considered

I haven’t tried anything else - I wouldn’t know where to begin!

Additional context

An example of this which we’re seeing today:

(t,i=>n+=Hc(i));return function(c,f){let d=0,p=0;for(;(p=c.indexOf("&",p))>=0;){n+=c.slice(d,p),u.startEntity(f);let g=u.write(c,p+1);if(g<0

It’s impossible to tell what this relates to.

2 Likes

Oh, and one thing I have found helpful.

I’ve identified that the method bundleExtension in node_modules/@shopify/cli/dist/index.js has a minify option. Set to false to get the function buildUIExtension to build unminified code.

This can be deployed to Shopify, which can make reading the code easier. I am sure I’m not supposed to do this…!