Karma - Jasmine失败并出现错误" TypeError:null不是对象"

时间:2017-07-31 20:01:33

标签: javascript html phantomjs karma-jasmine gulp-karma

我正在尝试测试我非常简单的vanilla javascript代码。

我正在使用PhantomJS启动器。我怀疑,它以某种方式无法看到DOM元素,因此DOM元素分配的对象为null。

我是否需要在karma.conf.js中包含HTML?

这是我从karma命令行获得的输出:

[22:44:33] Starting 'test'...
31 07 2017 22:44:33.901:INFO [karma]: Karma v1.7.0 server started at http://0.0.0.0:9876/
31 07 2017 22:44:33.901:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
31 07 2017 22:44:33.901:INFO [launcher]: Starting browser PhantomJS
31 07 2017 22:44:36.850:INFO [PhantomJS 2.1.1 (Windows 7 0.0.0)]: Connected on socket AJGzUqkYiuWudLwyAAAA with id 48481682
PhantomJS 2.1.1 (Windows 7 0.0.0) ERROR
  TypeError: null is not an object (evaluating 'radarImageDiv.appendChild')
  at src/app.js:260

它给出错误的函数:

function placeRadarImageToDom(currentRadarImage) {
    var radarImageDiv = document.getElementById("radar-image");
    var table = document.createElement("table");
    table.setAttribute("id", "radar-image-table");

    for (var i = 0; i < verticalLimit; i++) {
        var tr = document.createElement('tr');

        for (var j = 0; j < horizontalLimit; j++) {
            var td = document.createElement('td');
            var char = document.createTextNode(currentRadarImage[i].charAt(j));
            td.appendChild(char);
            tr.appendChild(td);
        }
        table.appendChild(tr);
    }
    // error is given to below line
    radarImageDiv.appendChild(table);
}

HTML:

<div class="main-content">
   <div id="radar-image"></div>
       <div class="right-panel">
           Radar map
           <select onchange="changeRadarImage(this)">
               <option value="default">Default</option>
               <option value="alternate">Alternate</option>
           </select>

           Scanning speed
           <select id="speed-select">
               <option value="very-slow">Very slow</option>
               <option value="slow">Slow</option>
               <option value="normal">Normal</option>
               <option value="fast">Fast</option>
               <option value="fastest">Fastest</option>
           </select>

           <button class="search-btn" onclick="startScanning()">
               Scan
           </button>
           </div>
       </div>
   </div>

karma.conf.js:

module.exports = function(config) {
    config.set({
        frameworks: ['jasmine'],
        reporters: ['spec'],
        browsers: ['PhantomJS'],
        files: [
            'src/shapes.js',
            'src/app.js',
            'test/*.js'
        ]
    });
};

gulpfile.js

var gulp = require('gulp');
var Server = require('karma').Server;

gulp.task('test', function (done) {
    return new Server({
        configFile: __dirname + '/karma.conf.js',
        singleRun: true
    }, done).start();
});

0 个答案:

没有答案