When karma-jasmine gives `WARN:` messages, how do I track down which spec file or component is causing them?

user_3217863 0
Viewed 1587

I have a lot of tests that give warnings.

Example of a ng test output

It's almost impossible to track down which spec file is causing each error without sifting through each spec one by one, enabling and disabling each one. Is there any way I can get the WARN: to show the file/component/service that's causing it?

karma-runner karma-jasmine angular
2 Answers

2021 January

I was looking for a good solution (like enable some option in karma.conf.js for example) but didn't find any...

One way I found is to install this library karma-spec-reporter (https://www.npmjs.com/package/karma-spec-reporter). It shows you each test executed in order. So to track down warnings you just have to look at the component's name below the warning message.

Example: screen_capture_running_tests.png

In my example warnings are related to EditGroupComponent

To install:

npm i karma-spec-reporter

Then add these lines to your karma.conf.js:

config.set({
  ...

  plugins: [
    ...
    require('karma-spec-reporter')
  ],

  // With extra options if you want
  specReporter: {
    suppressErrorSummary: false, // do not print error summary
    suppressFailed: false,       // do not print information about failed tests
    suppressPassed: false,       // do not print information about passed tests
    suppressSkipped: true,       // do not print information about skipped tests
    showSpecTiming: false,       // print the time elapsed for each spec
    failFast: false              // test would finish with error when a first fail occurs. 
  },

  // And replace 'progress' by 'spec'
  reporters: ['spec'],

  ...
});

If you don't like having another dependencie in your project. Install it, correct all and uninstall it.

user_53623330

Instead of looking at the terminal output, open Devtools (F12) in karma's launched google chrome window. Switch to Console tab. Carefully look at the relevant stacktrace, and click on the line number which generates error, now set a breakpoint in the opened file.

Reload the chrome window and next time, you get the error, chrome will pause at the breakpoint. There should be lot of debug info to pinpoint which *.spec.ts is generating the error.

user_51710090
Related