Karma JSPM Horrible Trace Log Karma JSPM Horrible Trace Log angularjs angularjs

Karma JSPM Horrible Trace Log


I was seeing the same Potentially unhandled rejection... errors too. They're just awful and completely unhelpful. What I did to debug my issue was to put phantomjs into debug mode, and place a debugger; statement just before the line of code referenced in the error and then I was able to step through and find the exact issue I was having.

In your case, the error is being thrown on line 1252 of jspm_packages/system-polyfills.src.js, at which is a method tryCatchReject. I would place a debugger; statement like so and then view the value of e.message while debugging:

    /**     * Return f.call(thisArg, x), or if it throws return a rejected promise for     * the thrown exception     */    function tryCatchReject(f, x, thisArg, next) {        try {            next.become(getHandler(f.call(thisArg, x)));        } catch(e) {            debugger;            next.become(new Rejected(e));        }    }

The karma-phantomjs-launcher readme gives a good example of how to configure Karma to pass the right flags to phantomjs for debugging as well as some good instructions:

// karma.conf.jsmodule.exports = function(config) {  config.set({    browsers: ['PhantomJS', 'PhantomJS_custom'],    // you can define custom flags    customLaunchers: {      'PhantomJS_custom': {        base: 'PhantomJS',        options: {          windowName: 'my-window',          settings: {            webSecurityEnabled: false          },        },        flags: ['--load-images=true'],        debug: true      }    },    phantomjsLauncher: {      // Have phantomjs exit if a ResourceError is encountered (useful if karma exits without killing phantom)      exitOnResourceError: true    }  })}

If you set the debug option to true, you will be instructed to launch a web browser to bring up the debugger. Note that you will want to put debugger; statements in your JavaScript to hit breakpoints. You should be able to put breakpoints in both your test code and your client code. Note that the debug option automatically adds the --remote-debugger-port=9000 and --remote-debugger-autorun=yes switches to PhantomJS.

When you start running your tests you should see a prompt to navigate to http://localhost:9000/webkit/inspector/inspector.html?page=2. There you can enabled debugging and step through the code.