test(ivy): cleanup todo test app (#23168)

PR Close #23168

packages/core/test/bundling/todo/OUTSTANDING_WORK.md

@@ -1,7 +1,7 @@
 # Outstanding on the `Todo` app
 
 ## `Todo` app
-- [ ] Clicking archive removes todo item.
+- [X] Clicking archive removes todo item.
 - [ ] Update `Todo` app to match http://todomvc.com/
 
 ## Compiler
@@ -9,7 +9,7 @@
 - [ ] Allow compilation of `@angular/common` through ivy.
  
 ## Ivy Runtime
-- [ ] Work on `ViewContainerRef` needs to cause change detection so that `todo` app renders correctly on first render.
+- [X] Work on `ViewContainerRef` needs to cause change detection so that `todo` app renders correctly on first render.
 - [X] The todo input value box is not correctly rendering to checked for completed tasks.
 - [ ] `ViewContainerRef` must separate creation mode from update mode otherwise {{todo.done}} fails for `NgFor` because `todo` is not set during creation mode.
 - [ ] Injector should be optional

packages/core/test/bundling/todo/bundle.golden_symbols.json

@@ -1,16 +1,10 @@
 [
-  {
-    "name": "APP_ROOT"
-  },
   {
     "name": "AnonymousSubject"
   },
   {
     "name": "AppState"
   },
-  {
-    "name": "CIRCULAR$1"
-  },
   {
     "name": "CIRCULAR$2"
   },
@@ -29,9 +23,6 @@
   {
     "name": "EMPTY$2"
   },
-  {
-    "name": "EMPTY_ARRAY$1"
-  },
   {
     "name": "EMPTY_RENDERER_TYPE_ID"
   },
@@ -44,18 +35,6 @@
   {
     "name": "EventEmitter"
   },
-  {
-    "name": "GET_PROPERTY_NAME$1"
-  },
-  {
-    "name": "INJECTOR"
-  },
-  {
-    "name": "Inject"
-  },
-  {
-    "name": "InjectionToken"
-  },
   {
     "name": "IterableChangeRecord_"
   },
@@ -65,15 +44,9 @@
   {
     "name": "NG_PROJECT_AS_ATTR_NAME"
   },
-  {
-    "name": "NOT_YET"
-  },
   {
     "name": "NO_CHANGE"
   },
-  {
-    "name": "NULL_INJECTOR$1"
-  },
   {
     "name": "NgForOf"
   },
@@ -83,9 +56,6 @@
   {
     "name": "NgOnChangesFeature"
   },
-  {
-    "name": "NullInjector"
-  },
   {
     "name": "ObjectUnsubscribedError"
   },
@@ -101,9 +71,6 @@
   {
     "name": "PRIVATE_PREFIX"
   },
-  {
-    "name": "R3Injector"
-  },
   {
     "name": "ROOT_DIRECTIVE_INDICES"
   },
@@ -113,9 +80,6 @@
   {
     "name": "SafeSubscriber"
   },
-  {
-    "name": "Self"
-  },
   {
     "name": "SimpleChange"
   },
@@ -137,9 +101,6 @@
   {
     "name": "Subscription"
   },
-  {
-    "name": "THROW_IF_NOT_FOUND"
-  },
   {
     "name": "TemplateRef$1"
   },
@@ -155,9 +116,6 @@
   {
     "name": "UNDEFINED_RENDERER_TYPE_ID"
   },
-  {
-    "name": "USE_VALUE$1"
-  },
   {
     "name": "UnsubscriptionError"
   },
@@ -176,9 +134,6 @@
   {
     "name": "_ROOT_DIRECTIVE_INDICES"
   },
-  {
-    "name": "_THROW_IF_NOT_FOUND"
-  },
   {
     "name": "__extends"
   },
@@ -218,9 +173,6 @@
   {
     "name": "_c1"
   },
-  {
-    "name": "_currentInjector"
-  },
   {
     "name": "_devMode"
   },
@@ -293,15 +245,9 @@
   {
     "name": "container"
   },
-  {
-    "name": "couldBeInjectableType"
-  },
   {
     "name": "createDirectivesAndLocals"
   },
-  {
-    "name": "createInjector"
-  },
   {
     "name": "createLContainer"
   },
@@ -326,9 +272,6 @@
   {
     "name": "currentView"
   },
-  {
-    "name": "deepForEach"
-  },
   {
     "name": "defaultIterableDiffers"
   },
@@ -422,18 +365,12 @@
   {
     "name": "flattenUnsubscriptionErrors"
   },
-  {
-    "name": "forwardRef"
-  },
   {
     "name": "generateInitialInputs"
   },
   {
     "name": "generatePropertyAliases"
   },
-  {
-    "name": "getClosureSafeProperty$1"
-  },
   {
     "name": "getDirectiveInstance"
   },
@@ -443,9 +380,6 @@
   {
     "name": "getNextOrParentSiblingNode"
   },
-  {
-    "name": "getNullInjector"
-  },
   {
     "name": "getOrCreateContainerRef"
   },
@@ -491,12 +425,6 @@
   {
     "name": "getTypeNameForDebugging$1"
   },
-  {
-    "name": "hasDeps"
-  },
-  {
-    "name": "hasOnDestroy"
-  },
   {
     "name": "hostElement"
   },
@@ -509,21 +437,12 @@
   {
     "name": "initChangeDetectorIfExisting"
   },
-  {
-    "name": "inject"
-  },
-  {
-    "name": "injectArgs"
-  },
   {
     "name": "injectTemplateRef"
   },
   {
     "name": "injectViewContainerRef"
   },
-  {
-    "name": "injectableDefRecord"
-  },
   {
     "name": "insertChild"
   },
@@ -551,12 +470,6 @@
   {
     "name": "isDifferent"
   },
-  {
-    "name": "isExistingProvider"
-  },
-  {
-    "name": "isFactoryProvider"
-  },
   {
     "name": "isFunction"
   },
@@ -584,12 +497,6 @@
   {
     "name": "isTrustedSubscriber"
   },
-  {
-    "name": "isTypeProvider"
-  },
-  {
-    "name": "isValueProvider"
-  },
   {
     "name": "iterateListLike"
   },
@@ -611,12 +518,6 @@
   {
     "name": "makeParamDecorator"
   },
-  {
-    "name": "makeRecord"
-  },
-  {
-    "name": "markDirty"
-  },
   {
     "name": "markDirtyIfOnPush"
   },
@@ -635,9 +536,6 @@
   {
     "name": "pipeFromArray"
   },
-  {
-    "name": "providerToRecord"
-  },
   {
     "name": "queueComponentIndexForCheck"
   },
@@ -689,9 +587,6 @@
   {
     "name": "resolveDirective"
   },
-  {
-    "name": "resolveForwardRef"
-  },
   {
     "name": "resolveRendererType2"
   },
@@ -707,9 +602,6 @@
   {
     "name": "scheduleTick"
   },
-  {
-    "name": "setCurrentInjector"
-  },
   {
     "name": "setHostBindings"
   },

packages/core/test/bundling/todo/index.ts

@@ -7,7 +7,7 @@
  */
 
 import {CommonModule, NgForOf} from '@angular/common';
-import {Component, EventEmitter, InjectFlags, Injectable, Input, IterableDiffers, NgModule, Output, createInjector, defineInjector, inject, ɵComponentDef as ComponentDef, ɵComponentType as ComponentType, ɵDirectiveDef as DirectiveDef, ɵDirectiveType as DirectiveType, ɵNgOnChangesFeature as NgOnChangesFeature, ɵdefaultIterableDiffers as defaultIterableDiffers, ɵdefineDirective as defineDirective, ɵinjectTemplateRef as injectTemplateRef, ɵinjectViewContainerRef as injectViewContainerRef, ɵmarkDirty as markDirty, ɵrenderComponent as renderComponent} from '@angular/core';
+import {ChangeDetectionStrategy, Component, EventEmitter, InjectFlags, Injectable, Input, IterableDiffers, NgModule, Output, createInjector, defineInjector, inject, ɵComponentDef as ComponentDef, ɵComponentType as ComponentType, ɵDirectiveDef as DirectiveDef, ɵDirectiveType as DirectiveType, ɵNgOnChangesFeature as NgOnChangesFeature, ɵdefaultIterableDiffers as defaultIterableDiffers, ɵdefineDirective as defineDirective, ɵinjectTemplateRef as injectTemplateRef, ɵinjectViewContainerRef as injectViewContainerRef, ɵmarkDirty as markDirty, ɵrenderComponent as renderComponent} from '@angular/core';
 
 export interface ToDo {
   text: string;
@@ -37,7 +37,8 @@ export class AppState {
       <span [class.done]="todo && todo.done">{{todo && todo.text}}</span>&ngsp;
       <button (click)="onArchiveClick()">archive</button>
     </div>
-  `
+  `,
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TodoComponent {
   @Input()
@@ -59,7 +60,8 @@ export class TodoComponent {
     <todo *ngFor="let todo of appState.todos" [todo]="todo" (archive)="onArchive($event)"></todo>
   </div>
   <span>count: {{appState.todos.length}}.</span>
-  `
+  `,
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class ToDoAppComponent {
   public appState: AppState;
@@ -72,7 +74,6 @@ export class ToDoAppComponent {
   onArchive(item: ToDo) {
     const todos = this.appState.todos;
     todos.splice(todos.indexOf(item), 1);
-    markDirty(this);
   }
 }
 
@@ -105,7 +106,4 @@ export class ToDoAppComponent {
 export class ToDoAppModule {
 }
 
-renderComponent(ToDoAppComponent, {
-  // TODO(misko): This should run without injector.
-  injector: createInjector(ToDoAppModule)
-});
+renderComponent(ToDoAppComponent);

packages/core/test/bundling/todo/treeshaking_spec.ts

@@ -14,29 +14,17 @@ const UTF8 = {
   encoding: 'utf-8'
 };
 const PACKAGE = 'angular/packages/core/test/bundling/todo';
+const BUNDLES = ['bundle.js', 'bundle.min_debug.js', 'bundle.min.js'];
 
 describe('functional test for todo', () => {
-  it('should render todo when not minified', withBody('<todo-app></todo-app>', () => {
-       require(path.join(PACKAGE, 'bundle.js'));
+  BUNDLES.forEach(bundle => {
+    describe(bundle, () => {
+      it('should render todo', withBody('<todo-app></todo-app>', () => {
+           require(path.join(PACKAGE, bundle));
            expect(document.body.textContent).toContain('ToDo Application');
            expect(document.body.textContent).toContain('count: 5.');
-       // TODO(misko): disabled until `ViewContainerRef` is  fixed
-       // expect(document.body.textContent).toContain('Demonstrate Components');
-     }));
-
-  it('should render todo when debug minified', withBody('<todo-app></todo-app>', () => {
-       require(path.join(PACKAGE, 'bundle.min_debug.js'));
-       expect(document.body.textContent).toContain('ToDo Application');
-       expect(document.body.textContent).toContain('count: 5.');
-       // TODO(misko): disabled until `ViewContainerRef` is  fixed
-       // expect(document.body.textContent).toContain('Demonstrate Components');
-     }));
-
-  it('should render todo when fully minified', withBody('<todo-app></todo-app>', () => {
-       require(path.join(PACKAGE, 'bundle.min.js'));
-       expect(document.body.textContent).toContain('ToDo Application');
-       expect(document.body.textContent).toContain('count: 5.');
-       // TODO(misko): disabled until `ViewContainerRef` is  fixed
-       // expect(document.body.textContent).toContain('Demonstrate Components');
+           expect(document.body.textContent).toContain('Demonstrate Components');
          }));
+    });
+  });
 });