Angular karma phantom before each hook error

Question

I am running my tests with karma and phantom, i am using mocha and sinon and sometimes the tests pass and sometimes without any reason i get this errors:

    ✖ "before each" hook: workFn
      ✔ should call get user api
  ✖ "after each" hook for "should call get user api"

Finished in 1.04 secs / 0.2 secs

SUMMARY:
✔ 42 tests completed
✖ 3 tests failed

FAILED TESTS:
  UserService
    ✖ "before each" hook: workFn
      PhantomJS 1.9.8 (Mac OS X 0.0.0)
    TypeError: 'null' is not an object (evaluating 'document.querySelector('.arrow' + index).classList') (public/client/build/main.js:3195)

  ✖ "after each" hook for "should call get user api"
    PhantomJS 1.9.8 (Mac OS X 0.0.0)
    PhantomJS 1.9.8 (Mac OS X 0.0.0)
  TypeError: 'null' is not an object (evaluating 'currentSpec.$injector')
      at public/vendor/angular-mocks/angular-mocks.js:2229

What can cause to this problem?

Answer 1

In my experience, DOM calls using Karma and/or PhantomJS can be a problem. The DOM in PhantomJS doesn't operate exactly like a standard browser and, as such, it tends to error on GUI operations a lot.

My advice (although it might not be the best) is to spy on or mock out the document methods you're using off of document since what they do is out of your hands anyways.