docs: use fine-grained overrides in examples (#372)

* docs: use fine-grained overrides in examples

* test: add a spec for componentOutput

Author: lacolaco

apps/example-app/src/app/examples/02-input-output.spec.ts

@@ -6,8 +6,10 @@ test('is possible to set input and listen for output', async () => {
   const sendValue = jest.fn();
 
   await render(InputOutputComponent, {
-    componentProperties: {
+    componentInputs: {
       value: 47,
+    },
+    componentOutputs: {
       sendValue: {
         emit: sendValue,
       } as any,

projects/testing-library/src/lib/models.ts

@@ -221,9 +221,12 @@ export interface RenderComponentOptions<ComponentType, Q extends Queries = typeo
    * {}
    *
    * @example
+   * const sendValue = (value) => { ... }
    * const component = await render(AppComponent, {
    *  componentOutputs: {
-   *    send: (value) => { ... }
+   *    send: {
+   *      emit: sendValue
+   *    }
    *  }
    * })
    */

projects/testing-library/tests/render.spec.ts

@@ -8,6 +8,8 @@ import {
   APP_INITIALIZER,
   ApplicationInitStatus,
   Injectable,
+  EventEmitter,
+  Output,
 } from '@angular/core';
 import { NoopAnimationsModule, BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { TestBed } from '@angular/core/testing';
@@ -155,6 +157,28 @@ describe('removeAngularAttributes', () => {
   });
 });
 
+describe('componentOutputs', () => {
+  it('should set passed event emitter to the component', async () => {
+    @Component({ template: `` })
+    class TestFixtureComponent {
+      @Output() event = new EventEmitter<void>();
+      emitEvent() {
+        this.event.emit();
+      }
+    }
+
+    const mockEmitter = new EventEmitter<void>();
+    const spy = jest.spyOn(mockEmitter, 'emit');
+    const { fixture } = await render(TestFixtureComponent, {
+      componentOutputs: { event: mockEmitter },
+    });
+
+    fixture.componentInstance.emitEvent();
+
+    expect(spy).toHaveBeenCalled();
+  });
+});
+
 describe('animationModule', () => {
   @NgModule({
     declarations: [FixtureComponent],