Add test for custom global error state

fboeller · Mar 7, 2021 · d785053 · d785053
1 parent 5ca41e5
commit d785053
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 1 deletion.
diff --git a/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.fixtures.ts b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.fixtures.ts
@@ -1,4 +1,4 @@
-import { Component, NgModule } from '@angular/core';
+import { Component, Input, NgModule } from '@angular/core';
 import { loading } from '../../loadable.constructors';
 
 @Component({
@@ -14,3 +14,18 @@ export class TestLoadingSpinnerComponent {
   entryComponents: [TestLoadingSpinnerComponent],
 })
 export class TestLoadingSpinnerModule {}
+
+@Component({
+  selector: 'ld-test-error',
+  template: `<span>Error {{ error }}</span>`,
+})
+export class TestErrorFixtureComponent {
+  @Input() error: any;
+  loadable = loading;
+}
+
+@NgModule({
+  declarations: [TestErrorFixtureComponent],
+  entryComponents: [TestErrorFixtureComponent],
+})
+export class TestErrorModule {}
diff --git a/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.spec.ts b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.spec.ts
@@ -4,6 +4,8 @@ import { By } from '@angular/platform-browser';
 import { errored, idle, loaded, loading } from '../../loadable.constructors';
 import { LoadableModule } from '../loadable.module';
 import {
+  TestErrorFixtureComponent,
+  TestErrorModule,
   TestLoadingSpinnerComponent,
   TestLoadingSpinnerModule,
 } from './loadable.component.fixtures';
@@ -140,3 +142,40 @@ it('renders the custom global loading state if loading', fakeAsync(() => {
   ).toBeTruthy();
   expect(fixture.debugElement.query(By.css('p'))).toBeFalsy();
 }));
+
+@Component({
+  selector: 'ld-test-default-loading',
+  template: `
+    <ld-loadable [loadable]="loadable">
+      <p>{{ loadable | loadedValue }}</p>
+    </ld-loadable>
+  `,
+})
+class TestDefaultErrorComponent {
+  loadable = errored('error');
+}
+
+it('renders the custom global error state if errored', fakeAsync(() => {
+  TestBed.configureTestingModule({
+    declarations: [TestDefaultErrorComponent],
+    imports: [
+      TestErrorModule,
+      LoadableModule.forRoot({
+        defaultComponents: {
+          error: TestErrorFixtureComponent,
+        },
+      }),
+    ],
+  });
+  const fixture = TestBed.createComponent(TestDefaultErrorComponent);
+  fixture.detectChanges();
+  tick(1);
+  fixture.detectChanges();
+  expect(fixture.debugElement.query(By.css('ld-loadable-error'))).toBeFalsy();
+  expect(fixture.debugElement.query(By.css('ld-test-error'))).toBeTruthy();
+  expect(
+    fixture.debugElement.query(By.css('ld-test-error span')).nativeElement
+      .textContent
+  ).toEqual('Error error');
+  expect(fixture.debugElement.query(By.css('p'))).toBeFalsy();
+}));