From 0d2a51824b6609cc69aed3017a330439621c6d0a Mon Sep 17 00:00:00 2001 From: Andrew Scott Date: Fri, 13 Mar 2020 07:31:11 -0700 Subject: [PATCH 1/3] test(core): Update transplanted views benchpress test to support VE Remove uses of render3 internal `detectChanges` calls to allow test to be run against VE code as well as Ivy. --- .../change_detection.e2e-spec.ts | 5 ++- .../transplanted_views/BUILD.bazel | 34 ++++++-------- .../transplanted_views/index.ts | 16 +++++++ .../transplanted_views/index_aot.ts | 24 +++------- .../transplanted_views/init.ts | 44 +++++++++++++++++++ .../transplanted_views/transplanted_views.ts | 29 +++++------- 6 files changed, 93 insertions(+), 59 deletions(-) create mode 100644 modules/benchmarks/src/change_detection/transplanted_views/index.ts create mode 100644 modules/benchmarks/src/change_detection/transplanted_views/init.ts diff --git a/modules/benchmarks/src/change_detection/change_detection.e2e-spec.ts b/modules/benchmarks/src/change_detection/change_detection.e2e-spec.ts index bbbf8afed9bcb..4872bfee5352a 100644 --- a/modules/benchmarks/src/change_detection/change_detection.e2e-spec.ts +++ b/modules/benchmarks/src/change_detection/change_detection.e2e-spec.ts @@ -19,11 +19,12 @@ describe('change detection benchmark', () => { ignoreBrowserSynchronization: true, params: [{name: 'viewCount', value: 1}], }); + await $('#destroyDom').click(); + expect(await $('#root').getText()).toEqual(''); + await $('#createDom').click(); expect($('#root').getText()).toContain('1'); await $('#detectChanges').click(); expect($('#root').getText()).toContain('2'); - await $('#detectChanges').click(); - expect($('#root').getText()).toContain('3'); await $('#destroyDom').click(); expect(await $('#root').getText()).toEqual(''); }); diff --git a/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel b/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel index 0ee15f5b9654e..2874cb30214a5 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel +++ b/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel @@ -1,55 +1,49 @@ -package(default_visibility = ["//visibility:public"]) - load("//tools:defaults.bzl", "ng_module", "ng_rollup_bundle", "ts_devserver") load("//modules/benchmarks:benchmark_test.bzl", "benchmark_test") load("//modules/benchmarks:e2e_test.bzl", "e2e_test") +package(default_visibility = ["//modules/benchmarks:__subpackages__"]) + ng_module( - name = "transplanted_views_lib", - srcs = [ - "index_aot.ts", - "transplanted_views.ts", - ], - tags = ["ivy-only"], + name = "ng2", + srcs = glob(["*.ts"]), + generate_ve_shims = True, + tsconfig = "//modules/benchmarks:tsconfig-build.json", deps = [ "//modules/benchmarks/src:util_lib", "//modules/benchmarks/src/change_detection:util_lib", - "//packages:types", "//packages/common", "//packages/core", + "//packages/platform-browser", + "//packages/platform-browser-dynamic", ], ) ng_rollup_bundle( name = "bundle", entry_point = ":index_aot.ts", - tags = ["ivy-only"], deps = [ - ":transplanted_views_lib", + ":ng2", "@npm//rxjs", ], ) ts_devserver( - name = "devserver", + name = "prodserver", + bootstrap = ["//packages/zone.js/dist:zone.js"], port = 4200, static_files = ["index.html"], - tags = ["ivy-only"], - deps = [ - ":bundle.min_debug.js", - ], + deps = [":bundle.min_debug.es2015.js"], ) benchmark_test( name = "perf", - server = ":devserver", - tags = ["ivy-only"], + server = ":prodserver", deps = ["//modules/benchmarks/src/change_detection:perf_tests_lib"], ) e2e_test( name = "e2e", - server = ":devserver", - tags = ["ivy-only"], + server = ":prodserver", deps = ["//modules/benchmarks/src/change_detection:e2e_tests_lib"], ) diff --git a/modules/benchmarks/src/change_detection/transplanted_views/index.ts b/modules/benchmarks/src/change_detection/transplanted_views/index.ts new file mode 100644 index 0000000000000..a2d3333adafdc --- /dev/null +++ b/modules/benchmarks/src/change_detection/transplanted_views/index.ts @@ -0,0 +1,16 @@ +/** + * @license + * Copyright Google Inc. All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + */ + +import {enableProdMode} from '@angular/core'; +import {platformBrowserDynamic} from '@angular/platform-browser-dynamic'; + +import {init} from './init'; +import {TransplantedViewsModule} from './transplanted_views'; + +enableProdMode(); +platformBrowserDynamic().bootstrapModule(TransplantedViewsModule).then(init); diff --git a/modules/benchmarks/src/change_detection/transplanted_views/index_aot.ts b/modules/benchmarks/src/change_detection/transplanted_views/index_aot.ts index 60c4de5e7e251..f59c382834b85 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/index_aot.ts +++ b/modules/benchmarks/src/change_detection/transplanted_views/index_aot.ts @@ -5,24 +5,12 @@ * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ -import {ɵrenderComponent as renderComponent} from '@angular/core'; -import {bindAction, profile} from '../../util'; +import {enableProdMode} from '@angular/core'; +import {platformBrowser} from '@angular/platform-browser'; -import {DeclarationComponent, createDom, destroyDom, detectChanges} from './transplanted_views'; +import {init} from './init'; +import {TransplantedViewsModuleNgFactory} from './transplanted_views.ngfactory'; -function noop() {} - -export function main() { - let component: DeclarationComponent; - if (typeof window !== 'undefined') { - component = renderComponent(DeclarationComponent); - bindAction('#destroyDom', () => destroyDom(component)); - bindAction('#createDom', () => createDom(component)); - bindAction('#detectChanges', () => detectChanges(component)); - bindAction( - '#detectChangesProfile', profile(() => detectChanges(component), noop, 'detect_changes')); - } -} - -main(); +enableProdMode(); +platformBrowser().bootstrapModuleFactory(TransplantedViewsModuleNgFactory).then(init); diff --git a/modules/benchmarks/src/change_detection/transplanted_views/init.ts b/modules/benchmarks/src/change_detection/transplanted_views/init.ts new file mode 100644 index 0000000000000..e49a1bb7fcb94 --- /dev/null +++ b/modules/benchmarks/src/change_detection/transplanted_views/init.ts @@ -0,0 +1,44 @@ +/** + * @license + * Copyright Google Inc. All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + */ + +import {ApplicationRef, NgModuleRef} from '@angular/core'; + +import {bindAction, profile} from '../../util'; +import {numViews} from '../util'; + +import {DeclarationComponent, TransplantedViewsModule} from './transplanted_views'; + +export function init(moduleRef: NgModuleRef) { + let declaration: DeclarationComponent; + let appRef: ApplicationRef; + + function destroyDom() { + declaration.viewCount = 0; + appRef.tick(); + declaration.templateRefreshCount = 0; + appRef.tick(); + } + + function createDom() { + declaration.viewCount = numViews; + appRef.tick(); + } + + function detectChanges() { appRef.tick(); } + + function noop() {} + + const injector = moduleRef.injector; + appRef = injector.get(ApplicationRef); + + declaration = appRef.components[0].instance; + bindAction('#destroyDom', destroyDom); + bindAction('#createDom', createDom); + bindAction('#detectChanges', detectChanges); + bindAction('#detectChangesProfile', profile(detectChanges, noop, 'detectChanges')); +} diff --git a/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts b/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts index c02809f4ee425..043a2a0160ba6 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts +++ b/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts @@ -7,8 +7,10 @@ */ import {CommonModule} from '@angular/common'; -import {ChangeDetectionStrategy, Component, Input, NgModule, TemplateRef, ɵdetectChanges} from '@angular/core'; -import {newArray, numViews} from '../util'; +import {ChangeDetectionStrategy, Component, Input, NgModule, TemplateRef} from '@angular/core'; +import {BrowserModule} from '@angular/platform-browser'; + +import {newArray} from '../util'; @Component({ selector: 'declaration-component', @@ -45,21 +47,10 @@ export class InsertionComponent { trackByIndex(index: number, item: any) { return index; } } -@NgModule({declarations: [DeclarationComponent, InsertionComponent], imports: [CommonModule]}) -export class TransplantedViewModule { -} - -export function destroyDom(component: DeclarationComponent) { - component.templateRefreshCount = 0; - component.viewCount = 0; - ɵdetectChanges(component); -} - -export function createDom(component: DeclarationComponent) { - component.viewCount = numViews; - ɵdetectChanges(component); -} - -export function detectChanges(component: DeclarationComponent) { - ɵdetectChanges(component); +@NgModule({ + declarations: [DeclarationComponent, InsertionComponent], + bootstrap: [DeclarationComponent], + imports: [CommonModule, BrowserModule] +}) +export class TransplantedViewsModule { } From 2481b0869cd116475d3182238e2121b922abf9fb Mon Sep 17 00:00:00 2001 From: Andrew Scott Date: Fri, 13 Mar 2020 09:11:48 -0700 Subject: [PATCH 2/3] fixup! test(core): Update transplanted views benchpress test to support VE --- .../change_detection/transplanted_views/BUILD.bazel | 5 ++--- .../src/change_detection/transplanted_views/init.ts | 10 ++++++---- .../transplanted_views/transplanted_views.ts | 3 +-- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel b/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel index 2874cb30214a5..2ddcf1639203c 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel +++ b/modules/benchmarks/src/change_detection/transplanted_views/BUILD.bazel @@ -5,14 +5,13 @@ load("//modules/benchmarks:e2e_test.bzl", "e2e_test") package(default_visibility = ["//modules/benchmarks:__subpackages__"]) ng_module( - name = "ng2", + name = "transplanted_views_lib", srcs = glob(["*.ts"]), generate_ve_shims = True, tsconfig = "//modules/benchmarks:tsconfig-build.json", deps = [ "//modules/benchmarks/src:util_lib", "//modules/benchmarks/src/change_detection:util_lib", - "//packages/common", "//packages/core", "//packages/platform-browser", "//packages/platform-browser-dynamic", @@ -23,7 +22,7 @@ ng_rollup_bundle( name = "bundle", entry_point = ":index_aot.ts", deps = [ - ":ng2", + ":transplanted_views_lib", "@npm//rxjs", ], ) diff --git a/modules/benchmarks/src/change_detection/transplanted_views/init.ts b/modules/benchmarks/src/change_detection/transplanted_views/init.ts index e49a1bb7fcb94..d6cc7ef212eb2 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/init.ts +++ b/modules/benchmarks/src/change_detection/transplanted_views/init.ts @@ -17,6 +17,12 @@ export function init(moduleRef: NgModuleRef) { let declaration: DeclarationComponent; let appRef: ApplicationRef; + bindAction('#destroyDom', destroyDom); + bindAction('#createDom', createDom); + bindAction('#detectChanges', detectChanges); + bindAction('#detectChangesProfile', profile(detectChanges, noop, 'detectChanges')); + + // helpers function destroyDom() { declaration.viewCount = 0; appRef.tick(); @@ -37,8 +43,4 @@ export function init(moduleRef: NgModuleRef) { appRef = injector.get(ApplicationRef); declaration = appRef.components[0].instance; - bindAction('#destroyDom', destroyDom); - bindAction('#createDom', createDom); - bindAction('#detectChanges', detectChanges); - bindAction('#detectChangesProfile', profile(detectChanges, noop, 'detectChanges')); } diff --git a/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts b/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts index 043a2a0160ba6..b74e47b8c7089 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts +++ b/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts @@ -6,7 +6,6 @@ * found in the LICENSE file at https://angular.io/license */ -import {CommonModule} from '@angular/common'; import {ChangeDetectionStrategy, Component, Input, NgModule, TemplateRef} from '@angular/core'; import {BrowserModule} from '@angular/platform-browser'; @@ -50,7 +49,7 @@ export class InsertionComponent { @NgModule({ declarations: [DeclarationComponent, InsertionComponent], bootstrap: [DeclarationComponent], - imports: [CommonModule, BrowserModule] + imports: [BrowserModule] }) export class TransplantedViewsModule { } From e00af75168972e5ed749f3a56bc19db5173d8f18 Mon Sep 17 00:00:00 2001 From: Andrew Scott Date: Fri, 13 Mar 2020 09:27:10 -0700 Subject: [PATCH 3/3] fixup! test(core): Update transplanted views benchpress test to support VE --- .../src/change_detection/transplanted_views/init.ts | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/modules/benchmarks/src/change_detection/transplanted_views/init.ts b/modules/benchmarks/src/change_detection/transplanted_views/init.ts index d6cc7ef212eb2..600d862438194 100644 --- a/modules/benchmarks/src/change_detection/transplanted_views/init.ts +++ b/modules/benchmarks/src/change_detection/transplanted_views/init.ts @@ -14,8 +14,8 @@ import {numViews} from '../util'; import {DeclarationComponent, TransplantedViewsModule} from './transplanted_views'; export function init(moduleRef: NgModuleRef) { - let declaration: DeclarationComponent; - let appRef: ApplicationRef; + const appRef: ApplicationRef = moduleRef.injector.get(ApplicationRef); + const declaration: DeclarationComponent = appRef.components[0].instance; bindAction('#destroyDom', destroyDom); bindAction('#createDom', createDom); @@ -38,9 +38,4 @@ export function init(moduleRef: NgModuleRef) { function detectChanges() { appRef.tick(); } function noop() {} - - const injector = moduleRef.injector; - appRef = injector.get(ApplicationRef); - - declaration = appRef.components[0].instance; }