无法为自定义垫对话框编写业力茉莉花测试用例。 TypeError:无法读取null的属性'textContent'

时间:2019-05-20 08:59:23

标签: angular unit-testing dialog angular-material karma-jasmine

我正在下面的链接中测试自定义对话框。 http://angular-tips.com/blog/2018/02/testing-angular-material-dialog-templates/ 在我的对话框模板中,我使用了另一个自定义组件“ DialogFileImportComponent”,如下面的代码

<div class="header-row">
<span class="dialog-title">Edit File</span>
<mat-icon class="cursor-pointer clear" (click)="close()">clear</mat-icon>
</div>
<file-form (fileSubmit)="processImport($event)" (fileString)="validateFile($event)" 
[isFromEdit]="true" [feedID]="data.fileFeedId" [feedDescription]="data.fileFeedName" [comments]="data.comments" 
[tempUrl]="data.tempUrl" [descList]="data.descList" [fileName]="data.fileName" [fileSubmitionStatus]="data.fileSubmissionStatus" 
[fileUploadError]="data.fileUploadError" ></file-form> 

我已经完成了他们提到的所有事情,如下所述。另外,我在导入部分添加了ImportFileFormModule'

@Component({
  template: ''
})
class NoopComponent { }

const TEST_DIRECTIVES = [
  DialogFileImportComponent,
  NoopComponent
];

@NgModule({
  imports: [MatIconModule, MatDialogModule, NoopAnimationsModule,ImportFileFormModule],
  exports: TEST_DIRECTIVES,
  declarations: TEST_DIRECTIVES,

  entryComponents: [
    DialogFileImportComponent
  ],
})
class DialogTestModule { }

并按如下所示创建测试床

beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [DialogTestModule,ImportFileFormModule],
      schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA],
      providers: [
        {
          provide: OverlayContainer, useFactory: () => {
            overlayContainerElement = document.createElement('div');
            return { getContainerElement: () => overlayContainerElement };
          }
        }
      ]

    });
    dialog = TestBed.get(MatDialog);
    fixture = TestBed.createComponent(NoopComponent);
  });

并如下添加测试套件

it('shows information with alert  details', () => {
    const config = {
      data: {
        type: 'alert',
        flag: 'saveasset',
        title: 'Confirmation',
        content: `Optional information has not been entered for 
        assets. Do you wish to wish to continue without entering these information ?`,
        buttonBlock: {
          saveButtonText: 'Ok',
          closeButtonText: 'Cancel'
        },
        tempUrl: 'sample',
        descList: ['aaa','bbbb'],
        fileName: null,
        fileSubmissionStatus: null,
        fileUploadError: null,
        fileFeedId:'',
        comments:'asasas'
      }
    };

    dialog.open(DialogFileImportComponent, config);

    fixture.detectChanges(); // Updates the dialog in the overlay

    const h2 = overlayContainerElement.querySelector('#mat-dialog-title-0');
    const button = overlayContainerElement.querySelector('button');

    expect(h2.textContent).toBe('Confirmation');
    expect(button.textContent).toBe('Ok');
  });

在运行测试用例时出现错误:  TypeError:无法读取null的属性'textContent'

0 个答案:

没有答案