在角度6中运行ng测试期间'appendchild'为null的错误

Question

我有一个带有typescript 2.8.0和节点版本11的角度6项目。我有一个功能开发应用程序并尝试使用jasmine karma设置单元测试环境，由于对这些框架的了解有限我无法调试以下错误。

ERROR: TypeError: Cannot read property 'appendChild' of null
TypeError: Cannot read property 'appendChild' of null
    at HtmlReporter.specDone (http://localhost:9876/base/node_modules/karma-jasmine-html-reporter/src/lib/html.jasmine.reporter.js?a380599bba71e79ed6dc82aa9a857815d894cfda:150:15)
    at dispatch (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?0b1eaf7a13cae32191eadea482cfc96ae41fc22b:4560:28)
    at ReportDispatcher.specDone (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?0b1eaf7a13cae32191eadea482cfc96ae41fc22b:4531:11)
    at Spec.specResultCallback [as resultCallback] (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?0b1eaf7a13cae32191eadea482cfc96ae41fc22b:1249:18)
    at complete (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?0b1eaf7a13cae32191eadea482cfc96ae41fc22b:567:12)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:421:1)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:188:1)
    at drainMicroTaskQueue (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:595:1)

我已经评论了所有spec文件中的每个规范，但仍然导致以下错误。但我唯一担心的是错误是由于karma.conf.ts中的一些错误配置造成的

以下是我的karme.config.ts文件，请建议我对环境的修正做好准备。

// Karma配置文件，有关更多信息，请参阅链接// https://karma-runner.github.io/1.0/config/configuration-file.html

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular-devkit/build-angular/plugins/karma')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    angularCli: {
      environment: 'dev'
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

编辑：以下是我的一个spec文件，它只有一个注释的规范。因此没有正在运行的规范方法。

从'@ angular / core / testing'导入{async，ComponentFixture，TestBed};

从'./passback.component'导入{PassbackComponent};

describe('PassbackComponent', () => {
  let component: PassbackComponent;
  let fixture: ComponentFixture<PassbackComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ PassbackComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(PassbackComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  // it('should create', () => {
  //   expect(component).toBeTruthy();
  // });
});

StackOverflow中有很多类似的问题，但没有一个问题解决，因为其他的规格不正确但我的可能还有其他原因

非常感谢你提前。

Answer 1

我遇到了同样的问题，并将其与工作项目进行了比较。我通过回滚我的业力版本来修复它。在我的package.json中，我改变了

"karma": "^3.1.3",

至

"karma": "~3.0.0",

我相信Karma的更新已经打破了别的东西 - 如果我能找到它周围的对话，我会发布它以获取更多信息。

Answer 2

建立

• Angular 7. *（CLI）
• 业力4. *

固定

• 从记者那里删除“kjhtml”

karma.config.js

...
reporters: ['progress', 'kjhtml']
...