stevermeister

export function forwardRef(forwardRefFn: ForwardRefFn): Type<any> {
  (<any>forwardRefFn).__forward_ref__ = forwardRef;
  (<any>forwardRefFn).toString = function() { return stringify(this()); };
  return (<Type<any>><any>forwardRefFn);
}

stevermeister

export const My_ACCESSOR = {
  provide: NG_VALUE_ACCESSOR,
  useExisting: forwardRef(() => MyComponent),
  multi: true
};

export class MyComponent {
 //...
}

stevermeister

export const MY_ACCESSOR = {
  provide: NG_VALUE_ACCESSOR,
  useExisting: forwardRef(() => MyComponent),
  multi: true
};

stevermeister

@Component({
  selector: 'container',
  template: '<div appLogClicks></div>'
})
export class Container {}

stevermeister

import { LogClicksDirective } from './log-clicks.directive';

describe('LogClicksDirective', () => {
  it('should create an instance', () => {
    const directive = new LogClicksDirective();
    expect(directive).toBeTruthy();
  });
});

stevermeister

import { Directive, Output, EventEmitter, HostListener } from '@angular/core';

@Directive({
  selector: '[logClicks]'
})
export class LogClicksDirective {

  public couter = 0;
  @Output() changes = new EventEmitter();

stevermeister

  it('should call UserService', () => {
    component.someMethod();
    expect(spy.calls.any()).toBeTruthy();
  });

  it('should set user', () => {
    component.someMethod();
    expect(component.user.name).toEqual('John');
  });

stevermeister

    mockUser = {
      name: 'John',
      age: 21
    };
    spy = spyOn(userService, 'getOne').and.returnValue(Observable.of(mockUser));

stevermeister

import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { UserCardComponent } from './user-card.component';

describe('UserCardComponent', () => {
  let component: UserCardComponent;
  let fixture: ComponentFixture<UserCardComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({

stevermeister

import { UserService } from '../user.service';
import { Component } from '@angular/core';

@Component({
  selector: 'app-user-card',
  template: '<div>{{user?.name}}</div>',
  providers: [UserService]
})
export class UserCardComponent {