jeudi 9 juillet 2020

how to test mat-pagniator for dynamic data tables

I need to test the nextPage() event for mat-paginator. But I keep getting "cannot get nextPage from undefined".

Here is HTML

 <mat-paginator
    #pagination
    [length]="resultsLength"
    [pageSize]="pageSize"
    (page)="onPaginationChange($event)"
    class="saqr-matching-tweets-paginator"
    [pageSizeOptions]="[20, 50, 100]"
    showFirstLastButtons
  >
  </mat-paginator>

and here is .ts

@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator;

And here is test code

    TestBed.configureTestingModule({
      // imports: [MatTableModule],
      declarations: [
        TweetsComponent,
      ],
      providers: [
        { provide: Store, useValue: store },
      ],
      schemas: [NO_ERRORS_SCHEMA],
      imports: [NoopAnimationsModule, MatTableModule, MatSortModule, MatPaginatorModule],
    }).compileComponents();


    beforeEach(() => {
      component.pageSize = 2;
    });

    test('pagniator', fakeAsync(() => {
      const id = 'a';
      store.next({
          tweets: {
            pageNumber: 2,
            pageSize: 2,
            searches: { id: { totalCount: 5, results: { 1: tweets } } },
        },
      });
      fixture.detectChanges();
      // component.paginator.nextPage();  // here I got paginator is undefined
    }));

Aucun commentaire:

Enregistrer un commentaire