title: Why do my tests fail at ngxpagination when my pagination works?
body: <p>I have created pagination for my list of car with ngxpagination. It also works very well. But unfortunately my &quot;npm test&quot; fail with the error message below.</p>
  <p>HTML:</p>
  <pre><code>     &lt;ion-list id=&quot;list&quot;&gt;
            &lt;ion-item id=&quot;list-item&quot; button *ngFor=&quot;let carGroup of carGroups | orderByCarGroupName | filter: searchTerm
            | paginate: {itemsPerPage: 8, currentPage: cp}&quot;  class=&quot;listMargin&quot; (click)=&quot;openCarGroup(carGroup.id)&quot;&gt;
              &lt;ion-label&gt;{{carGroup.id}}&lt;/ion-label&gt;
              &lt;ion-label&gt;{{carGroup.carGroupName}}&lt;/ion-label&gt;
            &lt;/ion-item&gt;
          &lt;/ion-list&gt;
  </code></pre>
  <p>MODULE:</p>
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { FormsModule } from '@angular/forms';
  import { IonicModule } from '@ionic/angular';
  import { ListViewPageRoutingModule } from './list-view-routing.module';
  import { ListViewPage } from './list-view.page';
  import { ComponentsModule } from '../components.module';
  import { NgxPaginationModule } from 'ngx-pagination';
  import { Ng2SearchPipeModule } from 'ng2-search-filter';
  import { ListViewPipe } from './list-view.pipe';
  @NgModule({
    imports: [
      CommonModule,
      FormsModule,
      NgxPaginationModule,
      IonicModule,
      ComponentsModule,
      ListViewPageRoutingModule,
      Ng2SearchPipeModule
    ],
    declarations: [ListViewPage,
      ListViewPipe
    ]
  })
  export class ListViewPageModule {}
  
  </code></pre>
  <p>ERROR:</p>
  <pre><code>ListViewPage should open Details FAILED
          Failed: NG0302: The pipe 'paginate' could not be found!. Find more at https://angular.io/errors/NG0302
          error properties: Object({ code: '302' })
          Error: NG0302: The pipe 'paginate' could not be found!. Find more at https://angular.io/errors/NG0302
              at getPipeDef$1 (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:25786:1)
              at ɵɵpipe (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:25743:1)
              at ListViewPage_Template (ng:///ListViewPage.js:58:9)
              at executeTemplate (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9600:1)
              at renderView (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9404:1)
              at renderComponent (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10684:1)
              at renderChildComponents (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9269:1)
              at renderView (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:9429:1)
              at ComponentFactory$1.create (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:25127:1)
              at initComponent (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1740:1)
  </code></pre>
  <p>Can anyone tell me why my tests are failing?</p>
  <p>UPDATE 1</p>
  <p>This is my Test Class
  I did not change anything in the class because of pagination. I am also not sure how to test pagination properly.</p>
  <pre><code>import { Component, NO_ERRORS_SCHEMA } from '@angular/core';
  import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
  import { Router } from '@angular/router';
  import { RouterTestingModule } from '@angular/router/testing';
  import { IonicModule } from '@ionic/angular';
  import { MockListClientServiceService } from 'src/app/Mock/MockListClientServiceService';
  import { ListClientServiceService } from 'src/app/services/list-client-service.service';
  
  import { ListViewPage } from './list-view.page';
  
  describe('ListViewPage', () =&gt; {
    let component: ListViewPage;
    let fixture: ComponentFixture&lt;ListViewPage&gt;;
    let router: Router;
  
    beforeEach(waitForAsync(() =&gt; {
      TestBed.configureTestingModule({
        declarations: [ ListViewPage, MockHeaderComponent],
        schemas: [NO_ERRORS_SCHEMA],
        imports: [IonicModule.forRoot(), RouterTestingModule],
        providers: [ListClientServiceService]
      }).compileComponents();
  
      // Ersetze den Service mit einen Mock
      TestBed.overrideComponent(
        ListViewPage,
        {
          set: {
            providers: [
              {
                provide: Router, useClass: class {
                  navigate = jasmine.createSpy('detail-view');
                }
              },
              { provide: ListClientServiceService, useClass: MockListClientServiceService }
            ]
          }
        }
      );
  
      fixture = TestBed.createComponent(ListViewPage);
      router = fixture.debugElement.injector.get(Router);
      component = fixture.componentInstance;
      fixture.detectChanges();
    }));
  
    it('should create', () =&gt; {
      expect(component).toBeTruthy();
    });
  
    it('should open Details', async (done)  =&gt; {
      component.openCarGroup(component.carGroups[0].id);
      expect(router.navigate).toHaveBeenCalledWith(['/detail-view', { carGroupId: component.carGroups[0].id }]);
      done();
    });
  });
  @Component({
    selector: 'app-header',
    template: ''
  })
  class MockHeaderComponent {
  }
  </code></pre>
  <p>UPDATE 2:</p>
  <pre><code>ListViewPage should open Details FAILED
          Failed: Unexpected pipe 'ListViewPipe' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation.
          Error: Unexpected pipe 'ListViewPipe' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation.
              at verifySemanticsOfNgModuleImport (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:27114:1)
              at node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:27012:1
              at &lt;Jasmine&gt;
              at verifySemanticsOfNgModuleDef (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:27011:1)
              at Function.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:26975:1)
              at R3TestBedCompiler.applyProviderOverridesToModule (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1074:1)
              at R3TestBedCompiler.compileTestModule (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1319:1)
              at R3TestBedCompiler.finalize (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:928:1)
              at TestBedRender3.get testModuleRef [as testModuleRef] (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1763:1)
              at TestBedRender3.inject (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1686:1)
          Unhandled promise rejection: TypeError: Cannot read properties of undefined (reading 'openStructureGroup')
          TypeError: Cannot read properties of undefined (reading 'openStructureGroup')
              at src/app/components/list-view/list-view.page.spec.ts:55:15
              at &lt;Jasmine&gt;
              at node_modules/tslib/tslib.es6.js:76:1
              at new ZoneAwarePromise (node_modules/zone.js/dist/zone-evergreen.js:960:1)
              at __awaiter (node_modules/tslib/tslib.es6.js:72:1)
              at UserContext.&lt;anonymous&gt; (src/app/components/list-view/list-view.page.spec.ts:54:46)
              at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:364:1)
              at ProxyZoneSpec.push.QpwO.ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/zone-testing.js:292:1)
              at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:363:1)
              at Zone.run (node_modules/zone.js/dist/zone-evergreen.js:123:1)
  </code></pre>