Question

我已经加入了一个基于Angular8的项目。

每次运行测试时，我在本地计算机上都会得到不同的结果。当我推动分支时，在Gitlab运行程序中，我也会得到不同的结果。

这是我们运行测试的方式：

ng test --no-watch --no-progress --browsers=ChromeHeadlessCI

这些是我们使用的版本：

"devDependencies": {
    "@angular-builders/custom-webpack": "^8.2.0",
    "@angular-devkit/build-angular": "^0.803.20",
    "@angular/cli": "^8.3.4",
    "@angular/compiler-cli": "^8.2.14",
    "@angular/language-service": "^8.2.6",
    "@types/jasmine": "^2.8.16",
    "@types/node": "^10.14.18",
    "@typescript-eslint/eslint-plugin": "^2.10.0",
    "@typescript-eslint/parser": "^2.10.0",
    "codelyzer": "^5.0.1",
    "eslint": "^6.7.2",
    "eslint-config-google": "^0.14.0",
    "jasmine-core": "^3.4.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "^3.1.4",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "^1.0.1",
    "karma-coverage-istanbul-reporter": "^2.1.0",
    "karma-htmlfile-reporter": "~0.3",
    "karma-jasmine": "^2.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "karma-junit-reporter": "^1.2.0",
    "protractor": "^5.4.2",
    "rxjs-tslint": "^0.1.7",
    "ts-node": "~7.0.1",
    "tslint": "^5.20.0",
    "typescript": "3.5.3",
    "webpack": "^4.41.2"
  }

有时候我了解测试错误，例如：

TheComponent should create FAILED
    Uncaught [object Object] thrown

我以这种方式解决了：

if (eOneObject && eOneObject.length > 0) {

我将if (eOneObject添加到条件中，因此测试已修复。

但是，然后，我的同事已经通过了测试的其他组件中有一些错误，例如：

MessageComponent should create FAILED
    Uncaught [object Object] thrown

@Component({
  selector: 'message-component',
  templateUrl: './message.component.html',
  styleUrls: ['./message.component.css'],
  host: { '(window:resize)': 'onResize($event)' }
})
export class MessageComponent implements OnInit {

  constructor(public dialogRef: MatDialogRef<MessageComponent>,
    public sanitizer: DomSanitizer,
    @Inject(MAT_DIALOG_DATA) public data: DialogData) { }

  ngOnInit() {
  }
}

此MessageComponent在代码中没有任何内容。它通过了我的同事的测试。

我不明白：

为什么在本地测试和Gitlab运行程序（版本相同时）中得到不同的结果
为什么我的分支机构（在Gitlab运行程序上）在我的同事测试中可以通过的测试组件中引发错误
ng test是否在随机检查组件？我的意思是。是不是每次运行都测试所有内容？

很抱歉，但我找不到所有这些问题的答案。提前致谢。

测试：

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ BrowserAnimationsModule, ReactiveFormsModule, FormsModule, MaterialWrapperModule, BrowserDynamicTestingModule ],
      declarations: [ MessageComponent ],
      providers: [
        { provide: MatDialogRef, useCase: {} },
        { provide: MAT_DIALOG_DATA, useCase: {} }
      ]
    })
    .compileComponents();
  }));

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

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

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ ReactiveFormsModule, BrowserAnimationsModule, MaterialWrapperModule, FormsModule, HttpClientModule],
      declarations: [TheComponent],
      providers: [ErService, PrService, VtService, TService]
    })
      .compileComponents();
  }));

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

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

Answer 1

MessageComponent失败的原因之一是host: { '(window:resize)': 'onResize($event)' }在这里无效，这样的组件没有onResize方法+未定义$event（正确的IDE应该具有突出显示这样的内容。

第二个原因：useCase: {}（应为useValue）无效；检查references

下一个错误：providers: [ErService, PrService, VtService, TService]，没有被嘲笑，可以做一些不需要的事情。请检查the documentation，以了解如何对服务进行模拟，并且一般性的指南将有助于您了解更多有关如何测试应用程序不同部分的信息

最后一个：选中此Karma Start Fails - HeadlessChrome - ERROR Uncaught [object Object]

TheComponent可以这样做（没有提供代码），但是在服务上寻找-我认为可能是这样

希望这会有所帮助：）

Angular8每次运行都测试不同的结果

1 个答案: