0

I have sourcemaps working when error are thrown but React has some special warnings that create stacktraces of its own in reactdom (when development mode). Is it possible to have sourcemaps loaded in these stacktraces?

We are building using webpack and I have tried almost all config setups :) Not sure if its actually possible to get sourcemaps loaded when stacktraces are logged like this?

The output comes from the following code in react-dom.development.js:

function printWarning(level, format, args) {
  // When changing this logic, you might want to also
  // update consoleWithStackDev.www.js as well.
  {
    var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
    var stack = ReactDebugCurrentFrame.getStackAddendum();

    if (stack !== '') {
      format += '%s';
      args = args.concat([stack]);
    } // eslint-disable-next-line react-internal/safe-string-coercion


    var argsWithFormat = args.map(function (item) {
      return String(item);
    }); // Careful: RN currently depends on this prefix

    argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
    // breaks IE9: https://github.com/facebook/react/issues/13610
    // eslint-disable-next-line react-internal/no-production-logging

    Function.prototype.apply.call(console[level], console, argsWithFormat);
  }
}

The stacktraces is fetched using this:

if (prefix === undefined) {
      // Extract the VM specific prefix used by each line.
      try {
        throw Error();
      } catch (x) {
        var match = x.stack.trim().match(/\n( *(at )?)/);
        prefix = match && match[1] || '';
      }
    } // We use the prefix to ensure our stacks line up with native stack frames.


    return '\n' + prefix + name;
react-dom.development.js:86 Warning: Prop `sizes` did not match. Server: "246px" Client: ""
    at source
    at Source (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:9062:5)
    at picture
    at Picture (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:8942:5)
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:1952:5
    at CardMedia (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:4476:5)
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:1952:5
    at CardContent (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:4359:5)
    at a
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:10323:5
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:1952:5
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:1952:5
    at CardFrame (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:4403:5)
    at CategoryCard (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:3213:5)
    at CardRenderer (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:3077:5)
    at li
    at ScrollerItem (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:11893:5)
    at ol
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:11453:5
    at div
    at Scroller (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:11771:5)
    at div
    at div
    at Container (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:5586:5)
    at ConditonalWrapper (https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:14324:5)
    at div
    at https://sitecore.nw.local/static/hbd/hbd-core.7ba76711.js:1952:5
    at CardList (https://sitecore.nw.local/static/hbd/hbd.86c176f3.js:1248:5)
    at ConnectFunction (https://sitecore.nw.local/static/hbd/vendors.c78f2057.js:45074:68)
    at IntlProvider (https://sitecore.nw.local/static/hbd/vendors.c78f2057.js:44228:43)
    at Provider (https://sitecore.nw.local/static/hbd/vendors.c78f2057.js:44815:20)
    at StoreProvider (https://sitecore.nw.local/static/hbd/hbd.86c176f3.js:34359:5)
    at HydratingCardList (https://sitecore.nw.local/static/hbd/hbd.86c176f3.js:1168:5)

Is is possible to map this through my sourcemaps in some way? Or am I chasing something impossible? :)

Magnus O.
  • 468
  • 5
  • 17

0 Answers0