Sentry's minified CDN bundle of moduleMetadataIntegration doesn't work

[gilisho]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/browser

SDK Version

7.120.0

Framework Version

React 18

Link to Sentry event

No response

Reproduction Example/SDK Setup

This is the Sentry load+init code part of the HTML's page:

<!-- Sentry initialization -->
<script>
  // Configure sentryOnLoad before adding the Loader Script https://docs.sentry.io/platforms/javascript/install/loader/#custom-configuration
  window.sentryOnLoad = function () {
    const transport = window.Sentry.makeMultiplexedTransport ?
      window.Sentry.makeMultiplexedTransport(window.Sentry.makeFetchTransport, (args) => {
          const event = args.getEvent();
          if (
            event &&
            event.extra &&
            event.extra.ROUTE_TO &&
            Array.isArray(event.extra.ROUTE_TO)
          ) {
            return event.extra.ROUTE_TO;
          }
          return [];
      }) : window.Sentry.makeFetchTransport;

    window.Sentry.init({
      transport,
      beforeSend: function(event){
        if (event?.exception?.values?.[0].stacktrace.frames) {
          const frames = event.exception.values[0].stacktrace.frames;

          // Find the last frame with module metadata containing a DSN
          const framesModuleMetadata = frames
            .filter(
              (frame) => frame.module_metadata && frame.module_metadata.dsn,
            )
            .map((v) => ({
              dsn: v.module_metadata.dsn,
              release: v.module_metadata.release,
            }));

          const routeTo = framesModuleMetadata.slice(-1); // using top frame only

          if (routeTo.length) {
            event.extra = {
              ...event.extra,
              ROUTE_TO: routeTo,
            };
          }
        }

        return event;
      }
    });

    if (window.Sentry.moduleMetadataIntegration) {
      Sentry.addIntegration(Sentry.moduleMetadataIntegration());
    }
  }
</script>
<!-- Sentry Loader Script -->
<script id="sentry">
	!function(n,e,r,t,o,i,a,c,s){for(var u=s,f=0;f<document.scripts.length;f++)if(document.scripts[f].src.indexOf(i)>-1){u&&"no"===document.scripts[f].getAttribute("data-lazy")&&(u=!1);break}var p=[];function l(n){return"e"in n}function d(n){return"p"in n}function _(n){return"f"in n}var v=[];function y(n){u&&(l(n)||d(n)||_(n)&&n.f.indexOf("capture")>-1||_(n)&&n.f.indexOf("showReportDialog")>-1)&&L(),v.push(n)}function h(){y({e:[].slice.call(arguments)})}function g(n){y({p:n})}function E(){try{n.SENTRY_SDK_SOURCE="loader";var e=n[o],i=e.init;e.init=function(o){n.removeEventListener(r,h),n.removeEventListener(t,g);var a=c;for(var s in o)Object.prototype.hasOwnProperty.call(o,s)&&(a[s]=o[s]);!function(n,e){var r=n.integrations||[];if(!Array.isArray(r))return;var t=r.map((function(n){return n.name}));n.tracesSampleRate&&-1===t.indexOf("BrowserTracing")&&(e.browserTracingIntegration?r.push(e.browserTracingIntegration({enableInp:!0})):e.BrowserTracing&&r.push(new e.BrowserTracing));(n.replaysSessionSampleRate||n.replaysOnErrorSampleRate)&&-1===t.indexOf("Replay")&&(e.replayIntegration?r.push(e.replayIntegration()):e.Replay&&r.push(new e.Replay));n.integrations=r}(a,e),i(a)},setTimeout((function(){return function(e){try{"function"==typeof n.sentryOnLoad&&(n.sentryOnLoad(),n.sentryOnLoad=void 0)}catch(n){console.error("Error while calling `sentryOnLoad` handler:"),console.error(n)}try{for(var r=0;r<p.length;r++)"function"==typeof p[r]&&p[r]();p.splice(0);for(r=0;r<v.length;r++){_(i=v[r])&&"init"===i.f&&e.init.apply(e,i.a)}m()||e.init();var t=n.onerror,o=n.onunhandledrejection;for(r=0;r<v.length;r++){var i;if(_(i=v[r])){if("init"===i.f)continue;e[i.f].apply(e,i.a)}else l(i)&&t?t.apply(n,i.e):d(i)&&o&&o.apply(n,[i.p])}}catch(n){console.error(n)}}(e)}))}catch(n){console.error(n)}}var O=!1;function L(){if(!O){O=!0;var n=e.scripts[0],r=e.createElement("script");r.src=a,r.crossOrigin="anonymous",r.addEventListener("load",E,{once:!0,passive:!0}),n.parentNode.insertBefore(r,n)}}function m(){var e=n.__SENTRY__,r=void 0!==e&&e.version;return r?!!e[r]:!(void 0===e||!e.hub||!e.hub.getClient())}n[o]=n[o]||{},n[o].onLoad=function(n){m()?n():p.push(n)},n[o].forceLoad=function(){setTimeout((function(){L()}))},["init","addBreadcrumb","captureMessage","captureException","captureEvent","configureScope","withScope","showReportDialog"].forEach((function(e){n[o][e]=function(){y({f:e,a:arguments})}})),n.addEventListener(r,h),n.addEventListener(t,g),u||setTimeout((function(){L()}))}(window,document,"error","unhandledrejection","Sentry",'___SENTRY_ID___','https://browser.sentry-cdn.com/7.120.0/bundle.tracing.es5.min.js',{"dsn":"___MY_DSN___","tracesSampleRate":1},false);
</script>
<!-- Sentry's makeMultiplexedTransport -->
<script>
    !function(n){var r={},t=function(){return t=Object.assign||function(n){for(var r,t=1,e=arguments.length;t<e;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(n[o]=r[o]);return n},t.apply(this,arguments)};function e(n,r,t,e){return new(t||(t=Promise))((function(o,i){function u(n){try{f(e.next(n))}catch(n){i(n)}}function c(n){try{f(e.throw(n))}catch(n){i(n)}}function f(n){var r;n.done?o(n.value):(r=n.value,r instanceof t?r:new t((function(n){n(r)}))).then(u,c)}f((e=e.apply(n,r||[])).next())}))}function o(n,r){var t,e,o,i,u={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return i={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function c(c){return function(f){return function(c){if(t)throw new TypeError("Generator is already executing.");for(;i&&(i=0,c[0]&&(u=0)),u;)try{if(t=1,e&&(o=2&c[0]?e.return:c[0]?e.throw||((o=e.return)&&o.call(e),0):e.next)&&!(o=o.call(e,c[1])).done)return o;switch(e=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return u.label++,{value:c[1],done:!1};case 5:u.label++,e=c[1],c=[0];continue;case 7:c=u.ops.pop(),u.trys.pop();continue;default:if(!(o=u.trys,(o=o.length>0&&o[o.length-1])||6!==c[0]&&2!==c[0])){u=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){u.label=c[1];break}if(6===c[0]&&u.label<o[1]){u.label=o[1],o=c;break}if(o&&u.label<o[2]){u.label=o[2],u.ops.push(c);break}o[2]&&u.ops.pop(),u.trys.pop();continue}c=r.call(n,u)}catch(n){c=[6,n],e=0}finally{t=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}([c,f])}}}function i(n){var r="function"==typeof Symbol&&Symbol.iterator,t=r&&n[r],e=0;if(t)return t.call(n);if(n&&"number"==typeof n.length)return{next:function(){return n&&e>=n.length&&(n=void 0),{value:n&&n[e++],done:!n}}};throw new TypeError(r?"Object is not iterable.":"Symbol.iterator is not defined.")}function u(n,r){var t="function"==typeof Symbol&&n[Symbol.iterator];if(!t)return n;var e,o,i=t.call(n),u=[];try{for(;(void 0===r||r-- >0)&&!(e=i.next()).done;)u.push(e.value)}catch(n){o={error:n}}finally{try{e&&!e.done&&(t=i.return)&&t.call(i)}finally{if(o)throw o.error}}return u}function c(n){return n&&n.Math==Math?n:void 0}var f="object"==typeof globalThis&&c(globalThis)||"object"==typeof window&&c(window)||"object"==typeof self&&c(self)||"object"==typeof global&&c(global)||function(){return this}()||{},a={};var s=/^(?:(\w+):)\/\/(?:(\w+)(?::(\w+)?)?@)([\w.-]+)(?::(\d+))?\/(.+)/;function v(n){var r=s.exec(n);if(r){var t,e=u(r.slice(1),6),o=e[0],i=e[1],c=e[2],v=void 0===c?"":c,l=e[3],y=e[4],d=void 0===y?"":y,p="",h=e[5],b=h.split("/");if(b.length>1&&(p=b.slice(0,-1).join("/"),h=b.pop()),h){var w=h.match(/^\d+/);w&&(h=w[0])}return{protocol:(t={host:l,pass:v,path:p,projectId:h,port:d,protocol:o,publicKey:i}).protocol,publicKey:t.publicKey||"",pass:t.pass||"",host:t.host,port:t.port||"",path:t.path||"",projectId:t.projectId}}!function(n){if(!("console"in f))return n();var r=f.console,t={},e=Object.keys(a);e.forEach((function(n){var e=a[n];t[n]=r[n],r[n]=e}));try{n()}finally{e.forEach((function(n){r[n]=t[n]}))}}((function(){console.error("Invalid Sentry Dsn: ".concat(n))}))}function l(n,r){return e=t({sentry_key:n.publicKey,sentry_version:"7"},r&&{sentry_client:"".concat(r.name,"/").concat(r.version)}),Object.keys(e).map((function(n){return"".concat(encodeURIComponent(n),"=").concat(encodeURIComponent(e[n]))})).join("&");var e}function y(n,r){var t;return function(n,r){var t,e,o=n[1];try{for(var u=i(o),c=u.next();!c.done;c=u.next()){var f=c.value;if(r(f,f[0].type))return!0}}catch(n){t={error:n}}finally{try{c&&!c.done&&(e=u.return)&&e.call(u)}finally{if(t)throw t.error}}}(n,(function(n,e){return r.includes(e)&&(t=Array.isArray(n)?n[1]:void 0),!!t})),t}for(var d in r.makeMultiplexedTransport=function(n,r){return function(c){var f=n(c),a=new Map;function s(r,i){var u=i?"".concat(r,":").concat(i):r,f=a.get(u);if(!f){var s=v(r);if(!s)return;var d=function(n,r){void 0===r&&(r={});var t="string"==typeof r?r:r.tunnel,e="string"!=typeof r&&r.t?r.t.sdk:void 0;return t||"".concat(function(n){return"".concat(function(n){var r=n.protocol?"".concat(n.protocol,":"):"",t=n.port?":".concat(n.port):"";return"".concat(r,"//").concat(n.host).concat(t).concat(n.path?"/".concat(n.path):"","/api/")}(n)).concat(n.projectId,"/envelope/")}(n),"?").concat(l(n,e))}(s,c.tunnel);f=i?function(n,r){var i=this;return function(u){var c=n(u);return t(t({},c),{send:function(n){return e(i,void 0,void 0,(function(){var t;return o(this,(function(e){return(t=y(n,["event","transaction","profile","replay_event"]))&&(t.release=r),[2,c.send(n)]}))}))}})}}(n,i)(t(t({},c),{url:d})):n(t(t({},c),{url:d})),a.set(u,f)}return[r,f]}return{send:function(n){return e(this,void 0,void 0,(function(){function e(r){var t=r&&r.length?r:["event"];return y(n,t)}var i;return o(this,(function(o){switch(o.label){case 0:return 0===(i=r({envelope:n,getEvent:e}).map((function(n){return"string"==typeof n?s(n,void 0):s(n.dsn,n.release)})).filter((function(n){return!!n}))).length&&i.push(["",f]),[4,Promise.all(i.map((function(r){var e=u(r,2),o=e[0];return e[1].send(function(n,r){return e=r?t(t({},n[0]),{dsn:r}):n[0],void 0===(o=n[1])&&(o=[]),[e,o];var e,o}(n,o))})))];case 1:return[2,o.sent()[0]]}}))}))},flush:function(n){return e(this,void 0,void 0,(function(){var r,t,e,c,s,v,l,y,d,p;return o(this,(function(o){switch(o.label){case 0:return[4,f.flush(n)];case 1:r=[o.sent()],o.label=2;case 2:o.trys.push([2,7,8,9]),t=i(a),e=t.next(),o.label=3;case 3:return e.done?[3,6]:(c=u(e.value,2),s=c[1],l=(v=r).push,[4,s.flush(n)]);case 4:l.apply(v,[o.sent()]),o.label=5;case 5:return e=t.next(),[3,3];case 6:return[3,9];case 7:return y=o.sent(),d={error:y},[3,9];case 8:try{e&&!e.done&&(p=t.return)&&p.call(t)}finally{if(d)throw d.error}return[7];case 9:return[2,r.every((function(n){return n}))]}}))}))}}}},n.Sentry=n.Sentry||{},n.Sentry.Integrations=n.Sentry.Integrations||{},r)Object.prototype.hasOwnProperty.call(r,d)&&(n.Sentry.Integrations[d]=r[d],n.Sentry[d]=r[d])}(window);
</script>
<!-- Sentry's moduleMetadataIntegration | minified version of this integration is not working -->
<script src="https://browser.sentry-cdn.com/7.120.0/modulemetadata.es5.min.js" crossorigin="anonymous"></script>

Steps to Reproduce

In continuation of #13822 (see comment here).

When loading the unminified version (https://browser.sentry-cdn.com/7.120.0/modulemetadata.es5.js), I can see that the module metadata is added to event.extra as I need, which is great. But when I use the minified version (https://browser.sentry-cdn.com/7.120.0/modulemetadata.es5.min.js), the module metadata is not added to the stacktrace frames, suggesting that something in the minification is breaking.

I've seen these kind of issues are possible, like #5527.

Expected Result

module_metadata should be added to the stack frames.

Actual Result

module_metadata is not added to the stack frames, preventing me to load and use the minified bundle.

[mydea]

Thanks for opening this! I opened a PR to fix this: #14344

[gilisho]

Wow! Thanks for the super-fast response!!
Will the fix be available also for major 7? 🙏
I can create a PR for it (I believe it should be the same as in the fix you pushed?)

[mydea]

Wow! Thanks for the super-fast response!! Will the fix be available also for major 7? 🙏 I can create a PR for it (I believe it should be the same as in the fix you pushed?)

That would be appreciated, yes the fix is the same for v7, then we can also release a fix for v7!

[gilisho]

Here you go: #14357
Thank you in advance 🙏

[github-actions]

A PR closing this issue has just been released 🚀

This issue was referenced by PR #14344, which was included in the 8.39.0 release.