fix(benchmarks): fix scrolling benchmark; add more tests

Author: yjbanov

modules/benchmarks/e2e_test/naive_infinite_scroll_spec.es6

@@ -2,12 +2,57 @@ var testUtil = require('angular2/e2e_test/test_util');
 
 describe('ng2 naive infinite scroll benchmark', function () {
 
- var URL = 'benchmarks/src/naive_infinite_scroll/index.html';
+ var URL = 'benchmarks/src/naive_infinite_scroll/index.html?appSize=3';
 
  afterEach(testUtil.verifyNoBrowserErrors);
 
  it('should not throw errors', function() {
  browser.get(URL);
+ var expectedRowCount = 18;
+ var expectedCellsPerRow = 11;
+ var allScrollItems = 'scroll-app /deep/ #testArea /deep/ scroll-item';
+ var cells = `${ allScrollItems } /deep/ .row *`;
+ var stageButtons =
+ `${ allScrollItems } /deep/ .row stage-buttons /deep/ button`;
+
+ var count = function(selector) {
+ return browser.executeScript(
+ `return document.querySelectorAll("${ selector }").length;`
+ );
+ }
+
+ var clickFirstOf = function(selector) {
+ return browser.executeScript(
+ `document.querySelector("${ selector }").click();`
+ );
+ }
+
+ var firstTextOf = function(selector) {
+ return browser.executeScript(
+ `return document.querySelector("${ selector }").innerText;`
+ );
+ }
+
+ // Make sure rows are rendered
+ count(allScrollItems).then(function(c) {
+ expect(c).toBe(expectedRowCount);
+ });
+
+ // Make sure cells are rendered
+ count(cells).then(function(c) {
+ expect(c).toBe(expectedRowCount * expectedCellsPerRow);
+ });
+
+ // Click on first enabled button and verify stage changes
+ firstTextOf(`${ stageButtons }:enabled`).then(function(text) {
+ expect(text).toBe('Pitched');
+ clickFirstOf(`${ stageButtons }:enabled`).then(function() {
+ firstTextOf(`${ stageButtons }:enabled`).then(function(text) {
+ expect(text).toBe('Won');
+ })
+ });
+ })
+
  browser.executeScript(
  'document.querySelector("scroll-app /deep/ #reset-btn").click()');
  browser.executeScript(

modules/benchmarks/src/naive_infinite_scroll/index.js

@@ -4,8 +4,9 @@ import {MapWrapper} from 'angular2/src/facade/collection';
 
 import {Parser, Lexer, ChangeDetector, ChangeDetection}
  from 'angular2/change_detection';
-import {bootstrap, Component, Viewport, Template, ViewContainer, Compiler}
- from 'angular2/angular2';
+import {
+ bootstrap, Component, Viewport, Template, ViewContainer, Compiler, onChange
+} from 'angular2/angular2';
 import {reflector} from 'angular2/src/reflection/reflection';
 import {CompilerCache} from 'angular2/src/core/compiler/compiler';
 import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
@@ -166,6 +167,7 @@ export function setupReflectorForAngular() {
  'parameters': [[ViewContainer]],
  'annotations' : [new Viewport({
  selector: '[foreach]',
+ lifecycle: [onChange],
  bind: {
  'in': 'iterable[]'
  }

modules/benchmarks/src/naive_infinite_scroll/scroll_item.js

@@ -65,7 +65,7 @@ export function setupReflectorForScrollItem() {
  FormattedCellComponent
  ],
  inline: `
- <div [style]="itemStyle">
+ <div class="row" [style]="itemStyle">
  <company-name [company]="offering.company"
  [cell-width]="companyNameWidth">
  </company-name>