test(ivy): move pipe tests into acceptance (#30389)

Moves over the tests from `pipe_spec` into `acceptance`. Note that the two `WrappedValue` tests haven't been moved over, because impure pipes always throw "changed after checked" errors in `TestBed`. This seems to be consistent with ViewEngine.

PR Close #30389

packages/core/test/acceptance/pipe_spec.ts

@@ -6,11 +6,164 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Component, Pipe, PipeTransform} from '@angular/core';
+import {Component, Directive, Inject, Injectable, InjectionToken, Input, NgModule, OnDestroy, Pipe, PipeTransform, ViewChild} from '@angular/core';
 import {TestBed} from '@angular/core/testing';
 import {expect} from '@angular/platform-browser/testing/src/matchers';
 
 describe('pipe', () => {
+  @Pipe({name: 'countingPipe'})
+  class CountingPipe implements PipeTransform {
+    state: number = 0;
+    transform(value: any) { return `${value} state:${this.state++}`; }
+  }
+
+  @Pipe({name: 'multiArgPipe'})
+  class MultiArgPipe implements PipeTransform {
+    transform(value: any, arg1: any, arg2: any, arg3 = 'default') {
+      return `${value} ${arg1} ${arg2} ${arg3}`;
+    }
+  }
+
+  it('should support interpolation', () => {
+    @Component({
+      template: '{{person.name | countingPipe}}',
+    })
+    class App {
+      person = {name: 'bob'};
+    }
+
+    TestBed.configureTestingModule({declarations: [App, CountingPipe]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.textContent).toBe('bob state:0');
+  });
+
+  it('should throw if pipe is not found', () => {
+    @Component({
+      template: '{{1 | randomPipeName}}',
+    })
+    class App {
+    }
+
+    TestBed.configureTestingModule({declarations: [App]});
+
+    expect(() => {
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+    }).toThrowError(/The pipe 'randomPipeName' could not be found/);
+  });
+
+  it('should support bindings', () => {
+    @Directive({selector: '[my-dir]'})
+    class Dir {
+      @Input()
+      dirProp: string = '';
+    }
+
+    @Pipe({name: 'double'})
+    class DoublePipe implements PipeTransform {
+      transform(value: any) { return `${value}${value}`; }
+    }
+
+    @Component({
+      template: `<div my-dir [dirProp]="'a'|double"></div>`,
+    })
+    class App {
+      @ViewChild(Dir) directive !: Dir;
+    }
+
+    TestBed.configureTestingModule({declarations: [App, DoublePipe, Dir]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(fixture.componentInstance.directive.dirProp).toBe('aa');
+  });
+
+  it('should support arguments in pipes', () => {
+    @Component({
+      template: `{{person.name | multiArgPipe:'one':person.address.city}}`,
+    })
+    class App {
+      person = {name: 'value', address: {city: 'two'}};
+    }
+
+    TestBed.configureTestingModule({declarations: [App, MultiArgPipe]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.textContent).toBe('value one two default');
+  });
+
+  it('should support calling pipes with different number of arguments', () => {
+    @Component({
+      template: `{{person.name | multiArgPipe:'a':'b'}} {{0 | multiArgPipe:1:2:3}}`,
+    })
+    class App {
+      person = {name: 'value'};
+    }
+
+    TestBed.configureTestingModule({declarations: [App, MultiArgPipe]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.textContent).toEqual('value a b default 0 1 2 3');
+  });
+
+  it('should do nothing when no change', () => {
+    let calls: any[] = [];
+
+    @Pipe({name: 'identityPipe'})
+    class IdentityPipe implements PipeTransform {
+      transform(value: any) {
+        calls.push(value);
+        return value;
+      }
+    }
+
+    @Component({
+      template: `{{person.name | identityPipe}}`,
+    })
+    class App {
+      person = {name: 'Megatron'};
+    }
+
+    TestBed.configureTestingModule({declarations: [App, IdentityPipe]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(calls).toEqual(['Megatron']);
+
+    fixture.detectChanges();
+
+    expect(calls).toEqual(['Megatron']);
+  });
+
+  it('should support duplicates by using the later entry', () => {
+    @Pipe({name: 'duplicatePipe'})
+    class DuplicatePipe1 implements PipeTransform {
+      transform(value: any) { return `${value} from duplicate 1`; }
+    }
+
+    @Pipe({name: 'duplicatePipe'})
+    class DuplicatePipe2 implements PipeTransform {
+      transform(value: any) { return `${value} from duplicate 2`; }
+    }
+
+    @Component({
+      template: '{{person.name | duplicatePipe}}',
+    })
+    class App {
+      person = {name: 'bob'};
+    }
+
+    TestBed.configureTestingModule({declarations: [App, DuplicatePipe1, DuplicatePipe2]});
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.textContent).toEqual('bob from duplicate 2');
+  });
+
   it('should support pipe in context of ternary operator', () => {
     @Pipe({name: 'pipe'})
     class MyPipe implements PipeTransform {
@@ -18,15 +171,14 @@ describe('pipe', () => {
     }
 
     @Component({
-      selector: 'my-app',
       template: `{{ condition ? 'a' : 'b' | pipe }}`,
     })
-    class MyApp {
+    class App {
       condition = false;
     }
 
-    TestBed.configureTestingModule({declarations: [MyApp, MyPipe]});
+    TestBed.configureTestingModule({declarations: [App, MyPipe]});
-    const fixture = TestBed.createComponent(MyApp);
+    const fixture = TestBed.createComponent(App);
     fixture.detectChanges();
 
     expect(fixture.nativeElement).toHaveText('b');
@@ -35,4 +187,217 @@ describe('pipe', () => {
     fixture.detectChanges();
     expect(fixture.nativeElement).toHaveText('a');
   });
+
+  describe('pure', () => {
+    it('should call pure pipes only if the arguments change', () => {
+      @Component({
+        template: '{{person.name | countingPipe}}',
+      })
+      class App {
+        person = {name: null as string | null};
+      }
+
+      TestBed.configureTestingModule({declarations: [App, CountingPipe]});
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+
+      // change from undefined -> null
+      fixture.componentInstance.person.name = null;
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('null state:0');
+
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('null state:0');
+
+      // change from null -> some value
+      fixture.componentInstance.person.name = 'bob';
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('bob state:1');
+
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('bob state:1');
+
+      // change from some value -> some other value
+      fixture.componentInstance.person.name = 'bart';
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('bart state:2');
+
+      fixture.detectChanges();
+      expect(fixture.nativeElement.textContent).toEqual('bart state:2');
+    });
+  });
+
+  describe('impure', () => {
+    let impurePipeInstances: CountingImpurePipe[] = [];
+
+    @Pipe({name: 'countingImpurePipe', pure: false})
+    class CountingImpurePipe implements PipeTransform {
+      state: number = 0;
+      transform(value: any) { return `${value} state:${this.state++}`; }
+      constructor() { impurePipeInstances.push(this); }
+    }
+
+    beforeEach(() => impurePipeInstances = []);
+    afterEach(() => impurePipeInstances = []);
+
+    it('should call impure pipes on each change detection run', () => {
+      @Component({
+        template: '{{person.name | countingImpurePipe}}',
+      })
+      class App {
+        person = {name: 'bob'};
+      }
+
+      TestBed.configureTestingModule({declarations: [App, CountingImpurePipe]});
+      const fixture = TestBed.createComponent(App);
+      const pipe = impurePipeInstances[0];
+
+      spyOn(pipe, 'transform').and.returnValue('');
+      expect(pipe.transform).not.toHaveBeenCalled();
+
+      fixture.detectChanges();
+      expect(pipe.transform).toHaveBeenCalledTimes(2);
+
+      fixture.detectChanges();
+      expect(pipe.transform).toHaveBeenCalledTimes(4);
+    });
+
+    it('should not cache impure pipes', () => {
+      @Component({
+        template: `
+          <div [id]="0 | countingImpurePipe">{{1 | countingImpurePipe}}</div>
+          <div [id]="2 | countingImpurePipe">{{3 | countingImpurePipe}}</div>
+        `,
+      })
+      class App {
+      }
+
+      TestBed.configureTestingModule({declarations: [App, CountingImpurePipe]});
+      TestBed.createComponent(App);
+
+      expect(impurePipeInstances.length).toEqual(4);
+      expect(impurePipeInstances[0]).toBeAnInstanceOf(CountingImpurePipe);
+      expect(impurePipeInstances[1]).toBeAnInstanceOf(CountingImpurePipe);
+      expect(impurePipeInstances[1]).not.toBe(impurePipeInstances[0]);
+      expect(impurePipeInstances[2]).toBeAnInstanceOf(CountingImpurePipe);
+      expect(impurePipeInstances[2]).not.toBe(impurePipeInstances[0]);
+      expect(impurePipeInstances[3]).toBeAnInstanceOf(CountingImpurePipe);
+      expect(impurePipeInstances[3]).not.toBe(impurePipeInstances[0]);
+    });
+  });
+
+  describe('lifecycles', () => {
+    it('should call ngOnDestroy on pipes', () => {
+      let destroyCalls = 0;
+
+      @Pipe({name: 'pipeWithOnDestroy'})
+      class PipeWithOnDestroy implements PipeTransform, OnDestroy {
+        ngOnDestroy() { destroyCalls++; }
+        transform(value: any): any { return null; }
+      }
+
+      @Component({
+        template: '{{1 | pipeWithOnDestroy}}',
+      })
+      class App {
+      }
+
+      TestBed.configureTestingModule({declarations: [App, PipeWithOnDestroy]});
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+      fixture.destroy();
+
+      expect(destroyCalls).toBe(1);
+    });
+  });
+
+  describe('injection mechanism', () => {
+    it('should be able to handle Service injection', () => {
+      @Injectable()
+      class Service {
+        title = 'Service Title';
+      }
+
+      @Pipe({name: 'myConcatPipe'})
+      class ConcatPipe implements PipeTransform {
+        constructor(public service: Service) {}
+        transform(value: string): string { return `${value} - ${this.service.title}`; }
+      }
+
+      @Component({
+        template: '{{title | myConcatPipe}}',
+      })
+      class App {
+        title = 'MyComponent Title';
+      }
+
+      TestBed.configureTestingModule({declarations: [App, ConcatPipe], providers: [Service]});
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.textContent).toBe('MyComponent Title - Service Title');
+    });
+
+    it('should be able to handle Token injections', () => {
+      class Service {
+        title = 'Service Title';
+      }
+
+      const token = new InjectionToken<Service>('service token');
+
+      @Pipe({name: 'myConcatPipe'})
+      class ConcatPipe implements PipeTransform {
+        constructor(@Inject(token) public service: Service) {}
+        transform(value: string): string { return `${value} - ${this.service.title}`; }
+      }
+
+      @Component({
+        template: '{{title | myConcatPipe}}',
+      })
+      class App {
+        title = 'MyComponent Title';
+      }
+
+      TestBed.configureTestingModule({
+        declarations: [App, ConcatPipe],
+        providers: [{provide: token, useValue: new Service()}]
+      });
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.textContent).toBe('MyComponent Title - Service Title');
+    });
+
+    it('should be able to handle Module injection', () => {
+      @Injectable()
+      class Service {
+        title = 'Service Title';
+      }
+
+      @NgModule({providers: [Service]})
+      class SomeModule {
+      }
+
+      @Pipe({name: 'myConcatPipe'})
+      class ConcatPipe implements PipeTransform {
+        constructor(public service: Service) {}
+        transform(value: string): string { return `${value} - ${this.service.title}`; }
+      }
+
+      @Component({
+        template: '{{title | myConcatPipe}}',
+      })
+      class App {
+        title = 'MyComponent Title';
+      }
+
+      TestBed.configureTestingModule({declarations: [App, ConcatPipe], imports: [SomeModule]});
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.textContent).toBe('MyComponent Title - Service Title');
+    });
+
+  });
+
 });

packages/core/test/render3/pipe_spec.ts

@@ -6,435 +6,24 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Directive as _Directive, InjectionToken, OnChanges, OnDestroy, Pipe as _Pipe, PipeTransform, WrappedValue, ɵNgModuleDef as NgModuleDef, ɵɵdefineComponent as defineComponent, ɵɵdefineInjectable, ɵɵdefineInjector, ɵɵdirectiveInject as directiveInject} from '@angular/core';
+import {Directive as _Directive, Pipe as _Pipe, PipeTransform, WrappedValue, ɵɵdefinePipe} from '@angular/core';
 import {expect} from '@angular/platform-browser/testing/src/matchers';
 
-import {createInjector} from '../../src/di/r3_injector';
+import {ɵɵinterpolation1, ɵɵtext, ɵɵtextBinding} from '../../src/render3/instructions/all';
-import {ɵɵdefineDirective, ɵɵdefinePipe} from '../../src/render3/definition';
+import {ɵɵpipe, ɵɵpipeBind1} from '../../src/render3/pipe';
-import {ɵɵbind, ɵɵcontainer, ɵɵcontainerRefreshEnd, ɵɵcontainerRefreshStart, ɵɵelementEnd, ɵɵelementProperty, ɵɵelementStart, ɵɵembeddedViewEnd, ɵɵembeddedViewStart, ɵɵinterpolation1, ɵɵload, ɵɵtext, ɵɵtextBinding} from '../../src/render3/instructions/all';
-import {RenderFlags} from '../../src/render3/interfaces/definition';
-import {ɵɵpipe, ɵɵpipeBind1, ɵɵpipeBind3, ɵɵpipeBind4, ɵɵpipeBindV} from '../../src/render3/pipe';
 
-import {RenderLog, getRendererFactory2, patchLoggingRenderer2} from './imported_renderer2';
+import {TemplateFixture} from './render_util';
-import {ComponentFixture, TemplateFixture, createComponent, getDirectiveOnNode, renderToHtml} from './render_util';
 
-const Directive: typeof _Directive = function(...args: any[]): any {
-  // In test we use @Directive for documentation only so it's safe to mock out the implementation.
-  return () => undefined;
-} as any;
 const Pipe: typeof _Pipe = function(...args: any[]): any {
   // In test we use @Pipe for documentation only so it's safe to mock out the implementation.
   return () => undefined;
 } as any;
 
-let log: string[] = [];
-let person: Person;
-let renderLog: RenderLog = new RenderLog();
-const rendererFactory2 = getRendererFactory2(document);
-patchLoggingRenderer2(rendererFactory2, renderLog);
 
+// TODO: hasn't been moved over into acceptance, because the `WrappedValue` tests need to
+// use an impure pipe which always throws "changed after checked errors" with `TestBed`
+// both in Ivy and ViewEngine.
 describe('pipe', () => {
-  beforeEach(() => {
-    log = [];
-    renderLog.clear();
-    person = new Person();
-  });
-
-  const pipes =
-      () => [CountingPipe, MultiArgPipe, CountingImpurePipe, DuplicatePipe1, DuplicatePipe2];
-
-  it('should support interpolation', () => {
-    function Template(rf: RenderFlags, person: Person) {
-      if (rf & RenderFlags.Create) {
-        ɵɵtext(0);
-        ɵɵpipe(1, 'countingPipe');
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, person.name), ''));
-      }
-    }
-
-    person.init('bob', null);
-    expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob state:0');
-  });
-
-  it('should throw if pipe is not found', () => {
-    const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-      if (rf & RenderFlags.Create) {
-        ɵɵtext(0);
-        ɵɵpipe(1, 'randomPipeName');
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, ctx.value), ''));
-      }
-    }, 2, 3, [], pipes);
-
-    expect(() => {
-      const fixture = new ComponentFixture(App);
-    }).toThrowError(/The pipe 'randomPipeName' could not be found!/);
-  });
-
-  it('should support bindings', () => {
-    let directive: any = null;
-
-    @Directive({selector: '[my-dir]', inputs: ['dirProp: elprop'], exportAs: 'mydir'})
-    class MyDir {
-      dirProp: string;
-
-      constructor() { this.dirProp = ''; }
-
-      static ngDirectiveDef = ɵɵdefineDirective({
-        type: MyDir,
-        selectors: [['', 'myDir', '']],
-        factory: () => new MyDir(),
-        inputs: {dirProp: 'elprop'}
-      });
-    }
-
-    @Pipe({name: 'double'})
-    class DoublePipe implements PipeTransform {
-      transform(value: any) { return `${value}${value}`; }
-
-      static ngPipeDef = ɵɵdefinePipe({
-        name: 'double',
-        type: DoublePipe,
-        factory: function DoublePipe_Factory() { return new DoublePipe(); },
-      });
-    }
-
-    function Template(rf: RenderFlags, ctx: string) {
-      if (rf & RenderFlags.Create) {
-        ɵɵelementStart(0, 'div', ['myDir', '']);
-        ɵɵpipe(1, 'double');
-        ɵɵelementEnd();
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵelementProperty(0, 'elprop', ɵɵbind(ɵɵpipeBind1(1, 1, ctx)));
-        directive = getDirectiveOnNode(0);
-      }
-    }
-    renderToHtml(Template, 'a', 2, 3, [MyDir], [DoublePipe]);
-    expect(directive !.dirProp).toEqual('aa');
-  });
-
-  it('should support arguments in pipes', () => {
-    function Template(rf: RenderFlags, person: Person) {
-      if (rf & RenderFlags.Create) {
-        ɵɵtext(0);
-        ɵɵpipe(1, 'multiArgPipe');
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵtextBinding(
-            0,
-            ɵɵinterpolation1('', ɵɵpipeBind3(1, 1, person.name, 'one', person.address !.city), ''));
-      }
-    }
-
-    person.init('value', new Address('two'));
-    expect(renderToHtml(Template, person, 2, 5, null, pipes)).toEqual('value one two default');
-  });
-
-  it('should support calling pipes with different number of arguments', () => {
-    function Template(rf: RenderFlags, person: Person) {
-      if (rf & RenderFlags.Create) {
-        ɵɵtext(0);
-        ɵɵpipe(1, 'multiArgPipe');
-        ɵɵpipe(2, 'multiArgPipe');
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵtextBinding(
-            0, ɵɵinterpolation1(
-                   '', ɵɵpipeBind4(2, 5, ɵɵpipeBindV(1, 1, [person.name, 'a', 'b']), 0, 1, 2), ''));
-      }
-    }
-
-    person.init('value', null);
-    expect(renderToHtml(Template, person, 3, 10, null, pipes)).toEqual('value a b default 0 1 2');
-  });
-
-  it('should do nothing when no change', () => {
-    @Pipe({name: 'identityPipe'})
-    class IdentityPipe implements PipeTransform {
-      transform(value: any) { return value; }
-
-      static ngPipeDef = ɵɵdefinePipe({
-        name: 'identityPipe',
-        type: IdentityPipe,
-        factory: function IdentityPipe_Factory() { return new IdentityPipe(); },
-      });
-    }
-
-    function Template(rf: RenderFlags, person: Person) {
-      if (rf & RenderFlags.Create) {
-        ɵɵelementStart(0, 'div');
-        ɵɵpipe(1, 'identityPipe');
-        ɵɵelementEnd();
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵelementProperty(0, 'id', ɵɵbind(ɵɵpipeBind1(1, 1, 'Megatron')));
-      }
-    }
-
-    renderToHtml(Template, person, 2, 3, null, [IdentityPipe], rendererFactory2);
-    expect(renderLog.log).toEqual(['id=Megatron']);
-
-    renderLog.clear();
-    renderToHtml(Template, person, 2, 3, null, pipes, rendererFactory2);
-    expect(renderLog.log).toEqual([]);
-  });
-
-  it('should support duplicates by using the later entry', () => {
-    function Template(rf: RenderFlags, person: Person) {
-      if (rf & RenderFlags.Create) {
-        ɵɵtext(0);
-        ɵɵpipe(1, 'duplicatePipe');
-      }
-      if (rf & RenderFlags.Update) {
-        ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, person.name), ''));
-      }
-    }
-
-    person.init('bob', null);
-    expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob from duplicate 2');
-  });
-
-  describe('pure', () => {
-    it('should call pure pipes only if the arguments change', () => {
-      function Template(rf: RenderFlags, person: Person) {
-        if (rf & RenderFlags.Create) {
-          ɵɵtext(0);
-          ɵɵpipe(1, 'countingPipe');
-        }
-        if (rf & RenderFlags.Update) {
-          ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, person.name), ''));
-        }
-      }
-
-      // change from undefined -> null
-      person.name = null;
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('null state:0');
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('null state:0');
-
-      // change from null -> some value
-      person.name = 'bob';
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob state:1');
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob state:1');
-
-      // change from some value -> some other value
-      person.name = 'bart';
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bart state:2');
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bart state:2');
-    });
-  });
-
-  describe('impure', () => {
-    it('should call impure pipes on each change detection run', () => {
-      function Template(rf: RenderFlags, person: Person) {
-        if (rf & RenderFlags.Create) {
-          ɵɵtext(0);
-          ɵɵpipe(1, 'countingImpurePipe');
-        }
-        if (rf & RenderFlags.Update) {
-          ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, person.name), ''));
-        }
-      }
-
-      person.name = 'bob';
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob state:0');
-      expect(renderToHtml(Template, person, 2, 3, null, pipes)).toEqual('bob state:1');
-    });
-
-    it('should not cache impure pipes', () => {
-      function Template(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelementStart(0, 'div');
-          ɵɵpipe(1, 'countingImpurePipe');
-          ɵɵelementEnd();
-          ɵɵelementStart(2, 'div');
-          ɵɵpipe(3, 'countingImpurePipe');
-          ɵɵelementEnd();
-          ɵɵcontainer(4);
-        }
-        if (rf & RenderFlags.Update) {
-          ɵɵelementProperty(0, 'id', ɵɵbind(ɵɵpipeBind1(1, 2, true)));
-          ɵɵelementProperty(2, 'id', ɵɵbind(ɵɵpipeBind1(3, 4, true)));
-          pipeInstances.push(ɵɵload<CountingImpurePipe>(1), ɵɵload(3));
-          ɵɵcontainerRefreshStart(4);
-          {
-            for (let i of [1, 2]) {
-              let rf1 = ɵɵembeddedViewStart(1, 2, 3);
-              {
-                if (rf1 & RenderFlags.Create) {
-                  ɵɵelementStart(0, 'div');
-                  ɵɵpipe(1, 'countingImpurePipe');
-                  ɵɵelementEnd();
-                }
-                if (rf1 & RenderFlags.Update) {
-                  ɵɵelementProperty(0, 'id', ɵɵbind(ɵɵpipeBind1(1, 1, true)));
-                  pipeInstances.push(ɵɵload<CountingImpurePipe>(1));
-                }
-              }
-              ɵɵembeddedViewEnd();
-            }
-          }
-          ɵɵcontainerRefreshEnd();
-        }
-      }
-
-      const pipeInstances: CountingImpurePipe[] = [];
-      renderToHtml(Template, {}, 5, 6, null, pipes, rendererFactory2);
-      expect(pipeInstances.length).toEqual(4);
-      expect(pipeInstances[0]).toBeAnInstanceOf(CountingImpurePipe);
-      expect(pipeInstances[1]).toBeAnInstanceOf(CountingImpurePipe);
-      expect(pipeInstances[1]).not.toBe(pipeInstances[0]);
-      expect(pipeInstances[2]).toBeAnInstanceOf(CountingImpurePipe);
-      expect(pipeInstances[2]).not.toBe(pipeInstances[0]);
-      expect(pipeInstances[3]).toBeAnInstanceOf(CountingImpurePipe);
-      expect(pipeInstances[3]).not.toBe(pipeInstances[0]);
-    });
-  });
-
-  describe('lifecycles', () => {
-    @Pipe({name: 'pipeWithOnDestroy'})
-    class PipeWithOnDestroy implements PipeTransform, OnDestroy {
-      ngOnDestroy() { log.push('pipeWithOnDestroy - ngOnDestroy'); }
-
-      transform(value: any): any { return null; }
-
-      static ngPipeDef = ɵɵdefinePipe({
-        name: 'pipeWithOnDestroy',
-        type: PipeWithOnDestroy,
-        factory: function PipeWithOnDestroy_Factory() { return new PipeWithOnDestroy(); },
-      });
-    }
-
-    it('should call ngOnDestroy on pipes', () => {
-      function Template(rf: RenderFlags, person: Person) {
-        if (rf & RenderFlags.Create) {
-          ɵɵcontainer(0);
-        }
-        if (rf & RenderFlags.Update) {
-          ɵɵcontainerRefreshStart(0);
-          {
-            if (person.age > 20) {
-              let rf1 = ɵɵembeddedViewStart(1, 2, 3);
-              {
-                if (rf1 & RenderFlags.Create) {
-                  ɵɵtext(0);
-                  ɵɵpipe(1, 'pipeWithOnDestroy');
-                }
-                if (rf & RenderFlags.Update) {
-                  ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, person.age), ''));
-                }
-              }
-              ɵɵembeddedViewEnd();
-            }
-          }
-          ɵɵcontainerRefreshEnd();
-        }
-      }
-      const pipes = [PipeWithOnDestroy];
-
-      person.age = 25;
-      renderToHtml(Template, person, 1, 0, null, pipes);
-
-      person.age = 15;
-      renderToHtml(Template, person, 1, 0, null, pipes);
-      expect(log).toEqual(['pipeWithOnDestroy - ngOnDestroy']);
-
-      log = [];
-      person.age = 30;
-      renderToHtml(Template, person, 1, 0, null, pipes);
-      expect(log).toEqual([]);
-
-      log = [];
-      person.age = 10;
-      renderToHtml(Template, person, 1, 0, null, pipes);
-      expect(log).toEqual(['pipeWithOnDestroy - ngOnDestroy']);
-    });
-  });
-
-  describe('injection mechanism', () => {
-    class ServiceA {
-      title = 'ServiceA Title';
-    }
-
-    class ServiceB {
-      title = 'ServiceB Title';
-
-      static ngInjectableDef =
-          ɵɵdefineInjectable({providedIn: 'root', factory: () => new ServiceB()});
-    }
-
-    class ModuleA {
-      static ngInjectorDef =
-          ɵɵdefineInjector({factory: () => new ModuleA(), providers: [ServiceA]});
-      static ngModuleDef: NgModuleDef<any> = { bootstrap: [] } as any;
-    }
-
-    const generatePipe = (InjectionType: any) => {
-      return class MyConcatPipe implements PipeTransform {
-        constructor(public obj: any) {}
-
-        transform(value: string): string { return `${value} - ${this.obj.title}`; }
-
-        static ngPipeDef = ɵɵdefinePipe({
-          name: 'myConcatPipe',
-          type: MyConcatPipe,
-          factory: () => new MyConcatPipe(directiveInject(InjectionType)),
-          pure: false
-        });
-      };
-    };
-
-    const generateComponent = (overrides: any) => {
-      return class MyComponent {
-        title = 'MyComponent Title';
-
-        static ngComponentDef = defineComponent({
-          type: MyComponent,
-          selectors: [['my-app']],
-          factory: function MyComponent_Factory() { return new MyComponent(); },
-          consts: 2,
-          vars: 3,
-          // '{{ title | myConcatPipe }}'
-          template: (rf: RenderFlags, ctx: MyComponent) => {
-            if (rf & 1) {
-              ɵɵtext(0);
-              ɵɵpipe(1, 'myConcatPipe');
-            }
-            if (rf & 2) {
-              ɵɵtextBinding(0, ɵɵinterpolation1('', ɵɵpipeBind1(1, 1, ctx.title), ''));
-            }
-          },
-          ...overrides
-        });
-      };
-    };
-
-    it('should be able to handle Service injection', () => {
-      const Comp = generateComponent({providers: [ServiceB], pipes: [generatePipe(ServiceB)]});
-      const fixture = new ComponentFixture(Comp);
-      expect(fixture.html).toEqual('MyComponent Title - ServiceB Title');
-    });
-
-    it('should be able to handle Token injections', () => {
-      const provider = new InjectionToken<ServiceA>(
-          'token', {providedIn: 'root', factory: () => new ServiceB()});
-      const Comp = generateComponent({providers: [provider], pipes: [generatePipe(provider)]});
-      const fixture = new ComponentFixture(Comp);
-      expect(fixture.html).toEqual('MyComponent Title - ServiceB Title');
-    });
-
-    it('should be able to handle Module injection', () => {
-      const injector = createInjector(ModuleA);
-      const Comp = generateComponent({providers: [], pipes: [generatePipe(ServiceA)]});
-      const fixture = new ComponentFixture(Comp, {injector});
-      expect(fixture.html).toEqual('MyComponent Title - ServiceA Title');
-    });
-
-  });
-
   describe('WrappedValue', () => {
     @Pipe({name: 'wrappingPipe'})
     class WrappingPipe implements PipeTransform {
@@ -477,113 +66,3 @@ describe('pipe', () => {
   });
 
 });
-
-@Pipe({name: 'countingPipe'})
-class CountingPipe implements PipeTransform {
-  state: number = 0;
-
-  transform(value: any) { return `${value} state:${this.state++}`; }
-
-  static ngPipeDef = ɵɵdefinePipe({
-    name: 'countingPipe',
-    type: CountingPipe,
-    factory: function CountingPipe_Factory() { return new CountingPipe(); },
-  });
-}
-
-@Pipe({name: 'countingImpurePipe', pure: false})
-class CountingImpurePipe implements PipeTransform {
-  state: number = 0;
-
-  transform(value: any) { return `${value} state:${this.state++}`; }
-
-  static ngPipeDef = ɵɵdefinePipe({
-    name: 'countingImpurePipe',
-    type: CountingImpurePipe,
-    factory: function CountingImpurePipe_Factory() { return new CountingImpurePipe(); },
-    pure: false,
-  });
-}
-
-@Pipe({name: 'multiArgPipe'})
-class MultiArgPipe implements PipeTransform {
-  transform(value: any, arg1: any, arg2: any, arg3 = 'default') {
-    return `${value} ${arg1} ${arg2} ${arg3}`;
-  }
-
-  static ngPipeDef = ɵɵdefinePipe({
-    name: 'multiArgPipe',
-    type: MultiArgPipe,
-    factory: function MultiArgPipe_Factory() { return new MultiArgPipe(); },
-  });
-}
-
-@Pipe({name: 'duplicatePipe'})
-class DuplicatePipe1 implements PipeTransform {
-  transform(value: any) { return `${value} from duplicate 1`; }
-
-  static ngPipeDef = ɵɵdefinePipe({
-    name: 'duplicatePipe',
-    type: DuplicatePipe1,
-    factory: function DuplicatePipe1_Factory() { return new DuplicatePipe1(); },
-  });
-}
-
-@Pipe({name: 'duplicatePipe'})
-class DuplicatePipe2 implements PipeTransform {
-  transform(value: any) { return `${value} from duplicate 2`; }
-
-  static ngPipeDef = ɵɵdefinePipe({
-    name: 'duplicatePipe',
-    type: DuplicatePipe2,
-    factory: function DuplicatePipe2_Factory() { return new DuplicatePipe2(); },
-  });
-}
-
-class Person {
-  // TODO(issue/24571): remove '!'.
-  age !: number;
-  // TODO(issue/24571): remove '!'.
-  name !: string | null;
-  address: Address|null = null;
-  // TODO(issue/24571): remove '!'.
-  phones !: number[];
-
-  init(name: string|null, address: Address|null = null) {
-    this.name = name;
-    this.address = address;
-  }
-
-  sayHi(m: any): string { return `Hi, ${m}`; }
-
-  passThrough(val: any): any { return val; }
-
-  toString(): string {
-    const address = this.address == null ? '' : ' address=' + this.address.toString();
-
-    return 'name=' + this.name + address;
-  }
-}
-
-class Address {
-  cityGetterCalls: number = 0;
-  zipCodeGetterCalls: number = 0;
-
-  constructor(public _city: string, public _zipcode: any = null) {}
-
-  get city() {
-    this.cityGetterCalls++;
-    return this._city;
-  }
-
-  get zipcode() {
-    this.zipCodeGetterCalls++;
-    return this._zipcode;
-  }
-
-  set city(v) { this._city = v; }
-
-  set zipcode(v) { this._zipcode = v; }
-
-  toString(): string { return this.city || '-'; }
-}