From 3cf318b4985ade44fe909b9ff14cf5fdf4e83c0a Mon Sep 17 00:00:00 2001
From: cexbrayat <cedric@ninja-squad.com>
Date: Fri, 26 Apr 2019 22:29:13 +0200
Subject: [PATCH] refactor(ivy): move exports tests to acceptance (#30157)

PR Close #30157
---
 packages/core/test/acceptance/exports_spec.ts |  82 ++++++
 packages/core/test/render3/exports_spec.ts    | 237 +-----------------
 2 files changed, 88 insertions(+), 231 deletions(-)

diff --git a/packages/core/test/acceptance/exports_spec.ts b/packages/core/test/acceptance/exports_spec.ts
index 690f47194b..41921f2805 100644
--- a/packages/core/test/acceptance/exports_spec.ts
+++ b/packages/core/test/acceptance/exports_spec.ts
@@ -135,6 +135,86 @@ describe('exports', () => {
         fixture.detectChanges();
         expect(fixture.nativeElement.querySelector('span').innerHTML).toBe('First');
       });
+
+  describe('forward refs', () => {
+    it('should work with basic text bindings', () => {
+      const fixture = initWithTemplate(AppComp, '{{ myInput.value}} <input value="one" #myInput>');
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.innerHTML).toEqual('one <input value="one">');
+    });
+
+    it('should work with element properties', () => {
+      const fixture = initWithTemplate(
+          AppComp, '<div [title]="myInput.value"></div> <input value="one" #myInput>');
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.innerHTML).toEqual('<div title="one"></div><input value="one">');
+    });
+
+    it('should work with element attrs', () => {
+      const fixture = initWithTemplate(
+          AppComp, '<div [attr.aria-label]="myInput.value"></div> <input value="one" #myInput>');
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.innerHTML)
+          .toEqual('<div aria-label="one"></div><input value="one">');
+    });
+
+    it('should work with element classes', () => {
+      const fixture = initWithTemplate(
+          AppComp,
+          '<div [class.red]="myInput.checked"></div> <input type="checkbox" checked #myInput>');
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.innerHTML).toContain('<div class="red"></div>');
+    });
+
+    it('should work with component refs', () => {
+      const fixture = initWithTemplate(
+          AppComp, '<div [dirWithInput]="myComp"></div><comp-to-ref #myComp></comp-to-ref>');
+      fixture.detectChanges();
+
+      const dirWithInput = fixture.debugElement.children[0].injector.get(DirWithCompInput);
+      const myComp = fixture.debugElement.children[1].injector.get(ComponentToReference);
+
+      expect(dirWithInput.comp).toEqual(myComp);
+    });
+
+    it('should work with multiple forward refs', () => {
+      const fixture = initWithTemplate(
+          AppComp,
+          '{{ myInput.value }} {{ myComp.name }} <comp-to-ref #myComp></comp-to-ref> <input value="one" #myInput>');
+      fixture.detectChanges();
+
+      expect(fixture.nativeElement.innerHTML)
+          .toEqual('one Nancy <comp-to-ref></comp-to-ref><input value="one">');
+    });
+
+    it('should support local refs in nested dynamic views', () => {
+      const fixture = initWithTemplate(AppComp, `
+        <input value="one" #outerInput>
+        <div *ngIf="outer">
+          {{ outerInput.value }}
+            <input value = "two" #innerInput>
+            <div *ngIf="inner">
+                {{ outerInput.value }} - {{ innerInput.value}}
+            </div>
+        </div>
+      `);
+      fixture.detectChanges();
+      fixture.componentInstance.outer = true;
+      fixture.componentInstance.inner = true;
+      fixture.detectChanges();
+
+      // result should be <input value="one"><div>one <input value="two"><div>one - two</div></div>
+      // but contains bindings comments for ngIf
+      // so we check the outer div
+      expect(fixture.nativeElement.innerHTML).toContain('one <input value="two">');
+      // and the inner div
+      expect(fixture.nativeElement.innerHTML).toContain('one - two');
+    });
+  });
 });
 
 function initWithTemplate(compType: Type<any>, template: string) {
@@ -149,6 +229,8 @@ class ComponentToReference {
 
 @Component({selector: 'app-comp', template: ``})
 class AppComp {
+  outer = false;
+  inner = false;
 }
 
 @Directive({selector: '[dir]', exportAs: 'dir'})
diff --git a/packages/core/test/render3/exports_spec.ts b/packages/core/test/render3/exports_spec.ts
index f669b34bd5..4a1fd89b1d 100644
--- a/packages/core/test/render3/exports_spec.ts
+++ b/packages/core/test/render3/exports_spec.ts
@@ -6,176 +6,20 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {AttributeMarker, ɵɵdefineComponent, ɵɵdefineDirective} from '../../src/render3/index';
-import {ɵɵbind, ɵɵcontainer, ɵɵcontainerRefreshEnd, ɵɵcontainerRefreshStart, ɵɵelement, ɵɵelementAttribute, ɵɵelementClassProp, ɵɵelementEnd, ɵɵelementProperty, ɵɵelementStart, ɵɵelementStyling, ɵɵelementStylingApply, ɵɵembeddedViewEnd, ɵɵembeddedViewStart, ɵɵinterpolation2, ɵɵnextContext, ɵɵreference, ɵɵtemplate, ɵɵtext, ɵɵtextBinding} from '../../src/render3/instructions/all';
+import {ɵɵbind, ɵɵcontainer, ɵɵcontainerRefreshEnd, ɵɵcontainerRefreshStart, ɵɵelement, ɵɵelementEnd, ɵɵelementStart, ɵɵembeddedViewEnd, ɵɵembeddedViewStart, ɵɵreference, ɵɵtext, ɵɵtextBinding} from '../../src/render3/instructions/all';
 import {RenderFlags} from '../../src/render3/interfaces/definition';
 
-import {NgIf} from './common_with_def';
-import {ComponentFixture, createComponent, renderToHtml} from './render_util';
+import {ComponentFixture, createComponent} from './render_util';
 
 describe('exports', () => {
   // For basic use cases, see core/test/acceptance/exports_spec.ts.
 
   describe('forward refs', () => {
-    it('should work with basic text bindings', () => {
-      /** {{ myInput.value}} <input value="one" #myInput> */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵtext(0);
-          ɵɵelement(1, 'input', ['value', 'one'], ['myInput', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp = ɵɵreference(2) as any;
-          ɵɵtextBinding(0, ɵɵbind(tmp.value));
-        }
-      }, 3, 1);
-
-      const fixture = new ComponentFixture(App);
-      expect(fixture.html).toEqual('one<input value="one">');
-    });
-
-
-    it('should work with element properties', () => {
-      /** <div [title]="myInput.value"</div> <input value="one" #myInput> */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelement(0, 'div');
-          ɵɵelement(1, 'input', ['value', 'one'], ['myInput', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp = ɵɵreference(2) as any;
-          ɵɵelementProperty(0, 'title', ɵɵbind(tmp.value));
-        }
-      }, 3, 1);
-
-      const fixture = new ComponentFixture(App);
-      expect(fixture.html).toEqual('<div title="one"></div><input value="one">');
-    });
-
-    it('should work with element attrs', () => {
-      /** <div [attr.aria-label]="myInput.value"</div> <input value="one" #myInput> */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelement(0, 'div');
-          ɵɵelement(1, 'input', ['value', 'one'], ['myInput', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp = ɵɵreference(2) as any;
-          ɵɵelementAttribute(0, 'aria-label', ɵɵbind(tmp.value));
-        }
-      }, 3, 1);
-
-      const fixture = new ComponentFixture(App);
-      expect(fixture.html).toEqual('<div aria-label="one"></div><input value="one">');
-    });
-
-    it('should work with element classes', () => {
-      /** <div [class.red]="myInput.checked"</div> <input type="checkbox" checked #myInput> */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelementStart(0, 'div', [AttributeMarker.Classes, 'red']);
-          ɵɵelementStyling(['red']);
-          ɵɵelementEnd();
-          ɵɵelement(1, 'input', ['type', 'checkbox', 'checked', 'true'], ['myInput', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp = ɵɵreference(2) as any;
-          ɵɵelementClassProp(0, 0, tmp.checked);
-          ɵɵelementStylingApply(0);
-        }
-      }, 3);
-
-      const fixture = new ComponentFixture(App);
-      expect(fixture.html).toEqual('<div class="red"></div><input checked="true" type="checkbox">');
-    });
-
-    it('should work with component refs', () => {
-
-      let myComponent: MyComponent;
-      let myDir: MyDir;
-
-      class MyComponent {
-        constructor() { myComponent = this; }
-
-        static ngComponentDef = ɵɵdefineComponent({
-          type: MyComponent,
-          selectors: [['comp']],
-          consts: 0,
-          vars: 0,
-          template: function(rf: RenderFlags, ctx: MyComponent) {},
-          factory: () => new MyComponent
-        });
-      }
-
-      class MyDir {
-        // TODO(issue/24571): remove '!'.
-        myDir !: MyComponent;
-
-        constructor() { myDir = this; }
-
-        static ngDirectiveDef = ɵɵdefineDirective({
-          type: MyDir,
-          selectors: [['', 'myDir', '']],
-          factory: () => new MyDir,
-          inputs: {myDir: 'myDir'}
-        });
-      }
-
-      /** <div [myDir]="myComp"></div><comp #myComp></comp> */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelement(0, 'div', ['myDir', '']);
-          ɵɵelement(1, 'comp', null, ['myComp', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp = ɵɵreference(2) as any;
-          ɵɵelementProperty(0, 'myDir', ɵɵbind(tmp));
-        }
-      }, 3, 1, [MyComponent, MyDir]);
-
-      const fixture = new ComponentFixture(App);
-      expect(myDir !.myDir).toEqual(myComponent !);
-    });
-
-    it('should work with multiple forward refs', () => {
-      let myComponent: MyComponent;
-
-      class MyComponent {
-        name = 'Nancy';
-
-        constructor() { myComponent = this; }
-
-        static ngComponentDef = ɵɵdefineComponent({
-          type: MyComponent,
-          selectors: [['comp']],
-          consts: 0,
-          vars: 0,
-          template: function() {},
-          factory: () => new MyComponent
-        });
-      }
-
-      /** {{ myInput.value }} {{ myComp.name }} <comp #myComp></comp> <input value="one" #myInput>
-       */
-      const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵtext(0);
-          ɵɵtext(1);
-          ɵɵelement(2, 'comp', null, ['myComp', '']);
-          ɵɵelement(4, 'input', ['value', 'one'], ['myInput', '']);
-        }
-        if (rf & RenderFlags.Update) {
-          const tmp1 = ɵɵreference(3) as any;
-          const tmp2 = ɵɵreference(5) as any;
-          ɵɵtextBinding(0, ɵɵbind(tmp2.value));
-          ɵɵtextBinding(1, ɵɵbind(tmp1.name));
-        }
-      }, 6, 2, [MyComponent]);
-
-      const fixture = new ComponentFixture(App);
-      expect(fixture.html).toEqual('oneNancy<comp></comp><input value="one">');
-    });
 
+    /**
+     * This test needs to be moved to acceptance/exports_spec.ts
+     * when Ivy compiler supports inline views.
+     */
     it('should work inside a view container', () => {
       const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
         if (rf & RenderFlags.Create) {
@@ -214,74 +58,5 @@ describe('exports', () => {
       fixture.update();
       expect(fixture.html).toEqual('<div></div>');
     });
-
-    it('should support local refs in nested dynamic views', () => {
-      /**
-       * <input value="one" #outerInput>
-       * <div *ngIf="outer">
-       *     {{ outerInput.value }}
-       *
-       *     <input value = "two" #innerInput>
-       *
-       *     <div *ngIf="inner">
-       *         {{ outerInput.value }} - {{ innerInput.value}}
-       *     </div>
-       * </div>
-       */
-      const App = createComponent('app', function(rf: RenderFlags, app: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelementStart(0, 'input', ['value', 'one'], ['outerInput', '']);
-          ɵɵelementEnd();
-          ɵɵtemplate(2, outerTemplate, 5, 2, 'div', [AttributeMarker.Template, 'ngIf']);
-        }
-        if (rf & RenderFlags.Update) {
-          ɵɵelementProperty(2, 'ngIf', ɵɵbind(app.outer));
-        }
-      }, 3, 1, [NgIf]);
-
-      function outerTemplate(rf: RenderFlags, outer: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelementStart(0, 'div');
-          {
-            ɵɵtext(1);
-            ɵɵelementStart(2, 'input', ['value', 'two'], ['innerInput', '']);
-            ɵɵelementEnd();
-            ɵɵtemplate(4, innerTemplate, 2, 2, 'div', [AttributeMarker.Template, 'ngIf']);
-          }
-          ɵɵelementEnd();
-        }
-
-        if (rf & RenderFlags.Update) {
-          const app = ɵɵnextContext();
-          const outerInput = ɵɵreference(1) as any;
-          ɵɵtextBinding(1, ɵɵbind(outerInput.value));
-          ɵɵelementProperty(4, 'ngIf', ɵɵbind(app.inner));
-        }
-      }
-
-      function innerTemplate(rf: RenderFlags, inner: any) {
-        if (rf & RenderFlags.Create) {
-          ɵɵelementStart(0, 'div');
-          { ɵɵtext(1); }
-          ɵɵelementEnd();
-        }
-
-        if (rf & RenderFlags.Update) {
-          ɵɵnextContext();
-          const innerInput = ɵɵreference(3) as any;
-          ɵɵnextContext();
-          const outerInput = ɵɵreference(1) as any;
-          ɵɵtextBinding(1, ɵɵinterpolation2('', outerInput.value, ' - ', innerInput.value, ''));
-        }
-      }
-
-      const fixture = new ComponentFixture(App);
-      fixture.component.outer = true;
-      fixture.component.inner = true;
-      fixture.update();
-      expect(fixture.html)
-          .toEqual(`<input value="one"><div>one<input value="two"><div>one - two</div></div>`);
-    });
-
   });
 });