Using Jest With AngularJS

This is a summary of the exeperiences I had intergrating Jest into an AngularJs project.

This is a living document - work in progress.

angular.mock.module is not a function

This took sometime to investigate. There are some info on the web regarding this:

• Mismatch of angular and angular-mock versions.
• Order of loading angular and angular-mocks regarding the test framework.

In my case it was something more sinister. AngularJs itself skip and does not load the nessasery logic for angular.mock.module to work.

In angular-mocks.js file, Angular load the mock.module logic only if it detects Jamsine or Mocha test framework presents.

(function(jasmineOrMocha) {

  if (!jasmineOrMocha) {
    return;
  }

...

})(window.jasmine || window.mocha);

They describe it in a oneliner of the api site also:

NOTE: This function is declared ONLY WHEN running tests with jasmine or mocha

Solution

Before loading angular-mocks, set the global jasmine or mocha to truthy value.

setup-jest.js

global.mocha = true;
...

jest-config.js

...
setupFiles: [
  './src/setup-jest.js',
],
...

Comments

[Olha]

Thanks a lot, really helpful article!

[Alessandro Pagiaro]

I think this only happens from jest 27 that removes jasmine.