fix: 🐛 setInput should run host dc

✅ Closes: #539

projects/spectator/src/lib/base/dom-spectator.ts

@@ -97,7 +97,11 @@ export abstract class DomSpectator<I> extends BaseSpectator {
   public setInput<K extends keyof I>(input: K, inputValue: I[K]): void;
   public setInput(input: any, value?: any): void {
     setProps(this.instance, input, value, false);
+    // Force cd on the tested component
     this.debugElement.injector.get(ChangeDetectorRef).detectChanges();
+
+    // Force cd on the host component for cases such as: https://github.com/ngneat/spectator/issues/539
+    this.detectChanges();
   }
 
   public output<T, K extends keyof I = keyof I>(output: K): Observable<T> {

projects/spectator/test/async/async.component.spec.ts

@@ -1,33 +1,31 @@
-import { of } from 'rxjs';
-import { createHostFactory, SpectatorHost } from '@ngneat/spectator';
+import { Component, Input } from '@angular/core';
+import { createComponentFactory, Spectator } from '@ngneat/spectator';
 
-import { QueryService } from '../query.service';
+@Component({
+  selector: 'app-foo',
+  template: '',
+  host: {
+    '[class.bar]': 'bar',
+  },
+})
+class FooComponent {
+  @Input() bar!: boolean;
+}
 
-import { AsyncComponent } from './async.component';
-
-describe('ZippyComponent', () => {
-  let host: SpectatorHost<AsyncComponent>;
-
-  const createHost = createHostFactory({
-    component: AsyncComponent,
-    mocks: [QueryService]
+describe('FooComponenent', () => {
+  const createComponent = createComponentFactory({
+    component: FooComponent,
   });
 
-  it('should work', () => {
-    const { component } = createHost(`<app-async></app-async>`);
-    expect(component).toBeDefined();
-  });
+  let spectator: Spectator<FooComponent>;
 
-  it('should be falsy', () => {
-    host = createHost(`<app-async></app-async>`);
-    expect(host.query('p')).not.toExist();
+  beforeEach(() => {
+    spectator = createComponent();
   });
 
-  it('should be truthy', () => {
-    host = createHost(`<app-async></app-async>`, { detectChanges: false });
-    const queryService = host.inject(QueryService);
-    queryService.select.and.returnValue(of(true));
-    host.detectChanges();
-    expect(host.query('p')).toExist();
+  it('should set the class name "bar"', () => {
+    spectator.setInput({ bar: true });
+
+    expect(spectator.element).toHaveClass('bar');
   });
 });