在Angular 7（Karma 2.0.4）中成功完成的Karma测试在Angular 8（Karma 4.1.0）升级后失败

Question

我们有一套约1100个单元在ng测试中运行，目前在Angular 7.2.5中运行到4分钟内完成，没有故障，在Angular 8.0.0中运行到4分钟前完成，随机故障，减速和断开。

测试在Angular 7中成功运行，无论是在镀铬还是镀铬。

已尝试：

1. 为了消除已知的样式元素内存泄漏，我们在此处实现了“样式清理”：

通过在1100个测试中的每个描述块中运行cleStylesFromDOM。

在《角度8》中，我们试图将业力从4.1.0回归到3.0.0，将茉莉花核从3.4.0回归到2.99.1，但没有成功。

我试过8.1。1与业力4.1。0和jasmine core 3.4。没有成功。

增加业力超时：

browserNoActivityTimeout:120000，captureTimeout:60000，ReportsLower:2000，browserDisconnectTolerance:2，browserDisconnectTimeout:20000，browserSocketTimeout:20000，processKillTimeout:20000

增加了节点的内存。js to——最大旧空间大小=8192

关闭“ng测试”源映射生成和监视

在因果报应中关掉茉莉花。conf.js:jasmine:{


对于每个“描述”块中的每个“it”，在每个“描述”块后面调用fixture。摧毁

尝试更改之前每个TestBed设置到之前所有建议在这里：

包裹json

{
  "name": "myapp",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.0.0",
    "@angular/common": "~8.0.0",
    "@angular/compiler": "~8.0.0",
    "@angular/core": "~8.0.0",
    "@angular/forms": "~8.0.0",
    "@angular/platform-browser": "~8.0.0",
    "@angular/platform-browser-dynamic": "~8.0.0",
    "@angular/router": "~8.0.0",
    "@ng-bootstrap/ng-bootstrap": "^4.0.0",
    "@ng-select/ng-select": "^2.20.0",
    "@ngrx/effects": "^8.0.1",
    "@ngrx/entity": "^8.0.1",
    "@ngrx/router-store": "^8.0.1",
    "@ngrx/store": "^8.0.1",
    "@ngrx/store-devtools": "^8.0.1",
    "@ngx-translate/core": "^11.0.1",
    "angular-resizable-element": "^3.2.4",
    "angular-split": "^3.0.1",
    "bootstrap": "^4.1.3",
    "core-js": "^2.6.9",
    "jquery": "^3.3.1",
    "jquery-ui": "^1.12.1",
    "jquery-ui-bundle": "^1.11.4",
    "jquery.fancytree": "^2.26.0",
    "lodash": "^4.17.11",
    "moment": "^2.17.1",
    "ngx-infinite-scroll": "^7.2.0",
    "ngx-nvd3": "^1.0.9",
    "ngx-restangular": "^5.0.0-rc1",
    "popper.js": "^1.15.0",
    "rxjs": "~6.4.0",
    "tslib": "^1.9.0",
    "ui-contextmenu": "^1.18.1",
    "urijs": "^1.18.6",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.800.0",
    "@angular/cli": "~8.0.2",
    "@angular/compiler-cli": "~8.0.0",
    "@angular/language-service": "~8.0.0",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/jquery": "^3.3.29",
    "@types/jquery.fancytree": "^2.7.32",
    "@types/node": "^8.9.5",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-marbles": "^0.6.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-mockito": "^2.3.1",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.4.3",
    "webpack": "^4.37.0"
  }
}

因果报应。conf.js

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    browsers: ['ChromeHeadless'],
    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/webr3'),
      reports: ['html', 'lcovonly', 'text-summary'],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    singleRun: false,
    restartOnFileChange: true
  });
};

测试示例：

describe('PageNotFoundComponent', () => {
  let component: PageNotFoundComponent;
  let fixture: ComponentFixture<PageNotFoundComponent>;
  let selectedTextElement: HTMLElement;
  let router;
  let location;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        TranslateModule.forRoot({
          loader: {
            provide: TranslateLoader,
            useClass: WebpackTranslateLoader
          }
        }),
        RouterTestingModule.withRoutes(
          [
            {
              path: 'basepath',
              redirectTo: 'nwi'
            },
            {
              path: '**',
              component: PageNotFoundComponent
            }
          ]
        ),
      ],
      declarations: [ PageNotFoundComponent ]
    })
    .compileComponents();
  }));

  afterAll(() => {
    cleanStylesFromDOM();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(PageNotFoundComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
    router = TestBed.get(Router);
    location = TestBed.get(Location);
  });

  it('should show 404 text', fakeAsync(() => {
    const navigationExtras: NavigationExtras = {
      queryParams: {}
    };
    router.navigate([`/unknown`], navigationExtras);
    tick();
    expect(decodeURI(location.path())).toBe(`/unknown`);
    const textElement: HTMLElement = fixture.nativeElement;
    selectedTextElement = textElement.querySelector('p');
    expect(selectedTextElement.innerText).toEqual('404');
  }));
});

我们预计~1100个测试将在Angular 8中运行到完成，不会像Angular 7中那样出现故障。

以下是不应发生的故障：

铬75.0。3770（Mac OS X 10.13.6）VMComponent应验证VU抑制获取正确呈现失败的类型错误：无法在UserContext读取null的属性“className”。(http://localhost:9876/_karma_webpack_/webpack:/src/app/components/vm-禁用的风险半径/vm禁用的风险半径。组成部分规范ts:72:18）在特区。援引(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-常青树。js:359:1）在Proxyzonepe。奥尼沃克(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-测试。js:308:1）在ZoneDelegate。援引(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-常青树。js:358:1）在区域。跑(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-常青树。js:124:1）在runInTestZone(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-测试。js:561:1）在UserContext。(http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-测试。js:576:1）在

...还有20个随机故障，最后断开连接：

24 07 2019 12:30:11.055： WARN[Chrome75.0.3770（Mac OS X 10.13.6）]：断开（0次）重新连接失败之前超时2Chrome 75.0.3770（Mac OS X 10.13.6）错误断开重新连接失败之前超时2000ms（传输错误）Chrome75.0.3770（Mac OS X 10.13.6）：执行582/1134（20失败）（跳过3）断开连接（4分钟7.005秒/3分钟53.442秒）




Answer 1

不确定您提到的CleStylesFromDOM做了什么，但是最近我在1800测试大型套件中遇到了类似的问题。症状相似：

• 运行结束时的测试超时：

FAILED
Error: Timeout - Async function did not complete within 5000ms (set by jasmine.DEFAULT_TIMEOUT_INTERVAL)
at <Jasmine>

• 在资源受限的环境（即CI）中持续不稳定的运行

性能分析表明，每次测试后，

getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
  platformBrowserDynamicTesting(),
  {teardown: {destroyAfterEach: true}}
);

{teardown:{destroyAfterEach:true}}是感兴趣的行。不幸的是，文档中没有太多关于destroyAfterEach。对我来说，打开设置最终会带来稳定、始终绿色的跑步：

1. 它揭示了测试中的bug，这些bug在单独的测试中被资源重用所掩盖。我能够在本地复制和修复许多不稳定测试的实例