Karma: cannot read property 'style' of undefined - angularjs

Question

I'm trying to do unit tests on my Angularjs code using karma.
This is my conf file:
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: './',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js',
'https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js',
'https://code.angularjs.org/1.2.26/angular-mocks.js',
'test/unit/**/*.js',
'js/app.js',
'js/controllers/AffairesCtrl.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_DEBUG,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};
I'm testing a function which has the following code:
document.getElementById('case').style.display="none";
When I run the test, I get this error:
TypeError: Cannot read property 'style' of undefined
But, if I replace the javascript code with jQuery code:
$("#case").css("display","none");
Then, the test is a success and the previous error disappear.
Do you know why I get this error?
Thank you!

Answer 1

Likely because your document has no element with an id of "case".
See the documentation on getElementById
jQuery on the other hand does not return null if no elements exist as mentioned in this stackoverflow post. Therefore no error.