From e38b2b502c93b5c80ae28306d1fa620d9d3d21b3 Mon Sep 17 00:00:00 2001 From: Greg Magolan Date: Fri, 6 Jul 2018 15:42:07 -0700 Subject: [PATCH] build(bazel): //modules/benchmarks/src/largetable/render3:perf bazel protractor test (#24788) PR Close #24788 --- BUILD.bazel | 1 + modules/benchmarks/BUILD.bazel | 8 +++ modules/benchmarks/src/BUILD.bazel | 11 ++++ modules/benchmarks/src/README.md | 7 ++ modules/benchmarks/src/largetable/BUILD.bazel | 12 ++++ .../src/largetable/largetable_perf.spec.ts | 66 +++++++++++++++++++ .../src/largetable/render3/BUILD.bazel | 49 +++++++++++++- .../src/largetable/render3/index.html | 12 ++-- .../src/largetable/render3/index.ts | 2 + .../render3/protractor.on-prepare.js | 21 ++++++ .../src/largetable/render3/tsconfig.json | 5 ++ modules/e2e_util/BUILD.bazel | 13 ++++ modules/e2e_util/e2e_util.ts | 6 +- packages/benchpress/BUILD.bazel | 18 +++++ protractor-perf.conf.js | 31 ++++++--- 15 files changed, 243 insertions(+), 19 deletions(-) create mode 100644 modules/benchmarks/BUILD.bazel create mode 100644 modules/benchmarks/src/README.md create mode 100644 modules/benchmarks/src/largetable/largetable_perf.spec.ts create mode 100644 modules/benchmarks/src/largetable/render3/protractor.on-prepare.js create mode 100644 modules/benchmarks/src/largetable/render3/tsconfig.json create mode 100644 modules/e2e_util/BUILD.bazel create mode 100644 packages/benchpress/BUILD.bazel diff --git a/BUILD.bazel b/BUILD.bazel index b255a31acd..768c6c2ebc 100644 --- a/BUILD.bazel +++ b/BUILD.bazel @@ -5,6 +5,7 @@ load("@build_bazel_rules_nodejs//:defs.bzl", "node_modules_filegroup") exports_files([ "tsconfig.json", "LICENSE", + "protractor-perf.conf.js", ]) # Developers should always run `bazel run :install` diff --git a/modules/benchmarks/BUILD.bazel b/modules/benchmarks/BUILD.bazel new file mode 100644 index 0000000000..8ef1f366db --- /dev/null +++ b/modules/benchmarks/BUILD.bazel @@ -0,0 +1,8 @@ +package(default_visibility = ["//visibility:public"]) + +filegroup( + name = "favicon", + srcs = [ + "favicon.ico", + ], +) diff --git a/modules/benchmarks/src/BUILD.bazel b/modules/benchmarks/src/BUILD.bazel index 5391f3c59d..45901bd2fa 100644 --- a/modules/benchmarks/src/BUILD.bazel +++ b/modules/benchmarks/src/BUILD.bazel @@ -12,3 +12,14 @@ ts_library( "//packages/core", ], ) + +ts_library( + name = "bootstrap", + srcs = [ + "bootstrap_ng2.ts", + "bootstrap_plain.ts", + ], + deps = [ + "//packages:types", + ], +) diff --git a/modules/benchmarks/src/README.md b/modules/benchmarks/src/README.md new file mode 100644 index 0000000000..9bd77a618f --- /dev/null +++ b/modules/benchmarks/src/README.md @@ -0,0 +1,7 @@ +# Benchmark Directory Layout + +## Bazel + +Under bazel the rules for laying out test files are slightly different. Use `largetable/render3` as an example. + +Put the perf file in current subdirectory (ie `largetable`) such that the same perf file can be used for each of the sub-subdirectories. (ie `largetable/*` should all be testable with the same perf file `largetable/largetable_perf.spec.ts`). Under bazel, typescript protractor spec files must end with `.spec.ts` or `.test.ts`. diff --git a/modules/benchmarks/src/largetable/BUILD.bazel b/modules/benchmarks/src/largetable/BUILD.bazel index 77f2cb24bd..8a6e269adb 100644 --- a/modules/benchmarks/src/largetable/BUILD.bazel +++ b/modules/benchmarks/src/largetable/BUILD.bazel @@ -13,3 +13,15 @@ ts_library( "//packages/core", ], ) + +ts_library( + name = "perf_lib", + testonly = 1, + srcs = [ + "largetable_perf.spec.ts", + ], + deps = [ + "//modules/e2e_util:lib", + "//packages:types", + ], +) diff --git a/modules/benchmarks/src/largetable/largetable_perf.spec.ts b/modules/benchmarks/src/largetable/largetable_perf.spec.ts new file mode 100644 index 0000000000..90d08cc24f --- /dev/null +++ b/modules/benchmarks/src/largetable/largetable_perf.spec.ts @@ -0,0 +1,66 @@ +/** + * @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 {$} from 'protractor'; + +import {runBenchmark, verifyNoBrowserErrors} from '../../../e2e_util/perf_util'; + +interface Worker { + id: string; + prepare?(): void; + work(): void; +} + +const CreateOnlyWorker: Worker = { + id: 'createOnly', + prepare: () => $('#destroyDom').click(), + work: () => $('#createDom').click() +}; + +const CreateAndDestroyWorker: Worker = { + id: 'createDestroy', + work: () => { + $('#createDom').click(); + $('#destroyDom').click(); + } +}; + +const UpdateWorker: Worker = { + id: 'update', + work: () => $('#createDom').click() +}; + +describe('largetable benchmark perf', () => { + + afterEach(verifyNoBrowserErrors); + + [CreateOnlyWorker, CreateAndDestroyWorker, UpdateWorker].forEach((worker) => { + describe(worker.id, () => { + it('should run for render3', (done) => { + runTableBenchmark({ + id: `largeTable.render3.${worker.id}`, + url: 'index.html', + ignoreBrowserSynchronization: true, + worker: worker + }).then(done, done.fail); + }); + }); + }); + + function runTableBenchmark( + config: {id: string, url: string, ignoreBrowserSynchronization?: boolean, worker: Worker}) { + return runBenchmark({ + id: config.id, + url: config.url, + ignoreBrowserSynchronization: config.ignoreBrowserSynchronization, + params: [{name: 'cols', value: 40}, {name: 'rows', value: 200}], + prepare: config.worker.prepare, + work: config.worker.work + }); + } +}); diff --git a/modules/benchmarks/src/largetable/render3/BUILD.bazel b/modules/benchmarks/src/largetable/render3/BUILD.bazel index 959c5afe35..4e5caf6770 100644 --- a/modules/benchmarks/src/largetable/render3/BUILD.bazel +++ b/modules/benchmarks/src/largetable/render3/BUILD.bazel @@ -1,18 +1,63 @@ package(default_visibility = ["//visibility:public"]) -load("//tools:defaults.bzl", "ng_module") +load("//tools:defaults.bzl", "ts_library") +load("//packages/bazel/src:ng_rollup_bundle.bzl", "ng_rollup_bundle") +load("//packages/bazel:index.bzl", "protractor_web_test") +load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver") -ng_module( +ts_library( name = "largetable_lib", srcs = glob( [ "**/*.ts", ], + exclude = ["protractor.on-prepare.ts"], ), deps = [ + "//modules/benchmarks/src:util_lib", "//modules/benchmarks/src/largetable:util_lib", "//packages:types", "//packages/core", "@rxjs", ], ) + +ng_rollup_bundle( + name = "bundle", + entry_point = "modules/benchmarks/src/largetable/render3/index.js", + deps = [ + ":largetable_lib", + ], +) + +genrule( + name = "favicon", + srcs = ["//modules/benchmarks:favicon"], + outs = ["favicon.ico"], + cmd = "cp $< $@", +) + +ts_devserver( + name = "devserver", + static_files = [ + ":bundle.min_debug.js", + ":bundle.min.js", + "index.html", + ":favicon", + ], +) + +protractor_web_test( + name = "perf", + configuration = "//:protractor-perf.conf.js", + data = [ + "//packages/bazel/src/protractor/utils", + "//packages/benchpress", + ], + on_prepare = ":protractor.on-prepare.js", + server = ":devserver", + tags = ["manual"], + deps = [ + "//modules/benchmarks/src/largetable:perf_lib", + ], +) diff --git a/modules/benchmarks/src/largetable/render3/index.html b/modules/benchmarks/src/largetable/render3/index.html index 75a5db817e..cd7538e7d0 100644 --- a/modules/benchmarks/src/largetable/render3/index.html +++ b/modules/benchmarks/src/largetable/render3/index.html @@ -1,13 +1,13 @@ +

Params

Cols: -
- Rows: +
Rows:
@@ -28,9 +28,9 @@ - + + \ No newline at end of file diff --git a/modules/benchmarks/src/largetable/render3/index.ts b/modules/benchmarks/src/largetable/render3/index.ts index e8eb07fceb..8b42c36d96 100644 --- a/modules/benchmarks/src/largetable/render3/index.ts +++ b/modules/benchmarks/src/largetable/render3/index.ts @@ -26,3 +26,5 @@ export function main() { profile(() => createDom(component), () => destroyDom(component), 'create')); } } + +main(); diff --git a/modules/benchmarks/src/largetable/render3/protractor.on-prepare.js b/modules/benchmarks/src/largetable/render3/protractor.on-prepare.js new file mode 100644 index 0000000000..6671d2d233 --- /dev/null +++ b/modules/benchmarks/src/largetable/render3/protractor.on-prepare.js @@ -0,0 +1,21 @@ +/** + * @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 + */ + +const protractorUtils = require('@angular/bazel/protractor-utils'); +const protractor = require('protractor'); + +module.exports = function(config) { + return protractorUtils.runServer(config.workspace, config.server, '-port', []) + .then(serverSpec => { + const serverUrl = `http://localhost:${serverSpec.port}`; + // Since the browser restarts in this benchmark we need to set both the browser.baseUrl + // for the first test and the protractor config.baseUrl for the subsequent tests + protractor.browser.baseUrl = serverUrl; + return protractor.browser.getProcessedConfig().then((config) => config.baseUrl = serverUrl); + }); +}; diff --git a/modules/benchmarks/src/largetable/render3/tsconfig.json b/modules/benchmarks/src/largetable/render3/tsconfig.json new file mode 100644 index 0000000000..8f3c656796 --- /dev/null +++ b/modules/benchmarks/src/largetable/render3/tsconfig.json @@ -0,0 +1,5 @@ +{ + "compilerOptions": { + "lib": ["es2015"] + } +} diff --git a/modules/e2e_util/BUILD.bazel b/modules/e2e_util/BUILD.bazel new file mode 100644 index 0000000000..a70647c870 --- /dev/null +++ b/modules/e2e_util/BUILD.bazel @@ -0,0 +1,13 @@ +package(default_visibility = ["//visibility:public"]) + +load("//tools:defaults.bzl", "ts_library") + +ts_library( + name = "lib", + testonly = 1, + srcs = glob(["*.ts"]), + deps = [ + "//packages:types", + "//packages/benchpress", + ], +) diff --git a/modules/e2e_util/e2e_util.ts b/modules/e2e_util/e2e_util.ts index 1defd9b5df..d0e9c1e8fd 100644 --- a/modules/e2e_util/e2e_util.ts +++ b/modules/e2e_util/e2e_util.ts @@ -20,8 +20,10 @@ export function readCommandLine(extraOptions?: {[key: string]: any}) { const options: {[key: string]: any} = { 'bundles': {describe: 'Whether to use the angular bundles or not.', default: false} }; - for (const key in extraOptions) { - options[key] = extraOptions[key]; + if (extraOptions) { + for (const key in extraOptions) { + options[key] = extraOptions[key]; + } } cmdArgs = yargs.usage('Angular e2e test options.').options(options).help('ng-help').wrap(40).argv; diff --git a/packages/benchpress/BUILD.bazel b/packages/benchpress/BUILD.bazel new file mode 100644 index 0000000000..243f8db349 --- /dev/null +++ b/packages/benchpress/BUILD.bazel @@ -0,0 +1,18 @@ +package(default_visibility = ["//visibility:public"]) + +load("//tools:defaults.bzl", "ts_library") + +ts_library( + name = "benchpress", + srcs = glob( + [ + "*.ts", + "src/**/*.ts", + ], + ), + module_name = "@angular/benchpress", + deps = [ + "//packages:types", + "//packages/core", + ], +) diff --git a/protractor-perf.conf.js b/protractor-perf.conf.js index a2a618be42..d5e937bb09 100644 --- a/protractor-perf.conf.js +++ b/protractor-perf.conf.js @@ -6,9 +6,13 @@ * found in the LICENSE file at https://angular.io/license */ +// Determine if we run under bazel +const isBazel = !!process.env.RUNFILES; + // Make sure that the command line is read as the first thing // as this could exit node if the help script should be printed. -require('./dist/all/e2e_util/perf_util').readCommandLine(); +const BASE = isBazel ? 'angular/modules' : 'dist/all'; +require(`./${BASE}/e2e_util/perf_util`).readCommandLine(); var CHROME_OPTIONS = { 'args': ['--js-flags=--expose-gc', '--no-sandbox'], @@ -38,14 +42,19 @@ var BROWSER_CAPS = { } }; -exports.config = { +function mergeInto(src, target) { + for (var prop in src) { + target[prop] = src[prop]; + } + return target; +} + +const config = { onPrepare: function() { beforeEach(function() { browser.ignoreSynchronization = false; }); }, restartBrowserBetweenTests: true, allScriptsTimeout: 11000, - specs: ['dist/all/**/e2e_test/**/*_perf.js'], capabilities: process.env.TRAVIS ? BROWSER_CAPS.ChromeOnTravis : BROWSER_CAPS.LocalChrome, directConnect: true, - baseUrl: 'http://localhost:8000/', framework: 'jasmine2', jasmineNodeOpts: { showColors: true, @@ -55,9 +64,13 @@ exports.config = { useAllAngular2AppRoots: true }; -function mergeInto(src, target) { - for (var prop in src) { - target[prop] = src[prop]; - } - return target; +// Bazel has different strategy for how specs and baseUrl are specified +if (!isBazel) { + config.baseUrl = 'http://localhost:8000/'; + config.specs = [ + 'dist/all/**/e2e_test/**/*_perf.spec.js', + 'dist/all/**/e2e_test/**/*_perf.js', + ] } + +exports.config = config;