From f2d1f2e9e64d18fe5407f67555eb1c30110bd419 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Wed, 21 May 2014 13:54:36 -0700 Subject: [PATCH 1/7] feat(testability): implement the testability for ProtractorDart See https://pub.dartlang.org/packages/protractor --- lib/angular.dart | 3 +- lib/application.dart | 2 +- lib/core_dom/element_binder.dart | 10 +- lib/core_dom/mustache.dart | 6 +- lib/core_dom/view_factory.dart | 2 + lib/directive/ng_bind.dart | 7 +- lib/directive/ng_model.dart | 5 +- lib/introspection.dart | 229 ++++++++++++++++++++++++++++-- lib/introspection_js.dart | 62 -------- package.json | 1 + test/directive/ng_model_spec.dart | 10 +- test/introspection_spec.dart | 123 +++++++++++++--- test_e2e/pubspec.lock | 15 ++ 13 files changed, 368 insertions(+), 107 deletions(-) delete mode 100644 lib/introspection_js.dart create mode 100644 test_e2e/pubspec.lock diff --git a/lib/angular.dart b/lib/angular.dart index 8919c4262..e17923a50 100644 --- a/lib/angular.dart +++ b/lib/angular.dart @@ -5,7 +5,8 @@ export 'package:angular/application.dart'; export 'package:angular/core/module.dart'; export 'package:angular/directive/module.dart'; export 'package:angular/core/annotation.dart'; -export 'package:angular/introspection.dart'; +export 'package:angular/introspection.dart' hide + elementExpando, publishToJavaScript; export 'package:angular/formatter/module.dart'; export 'package:angular/routing/module.dart'; export 'package:di/di.dart' hide lastKeyId; diff --git a/lib/application.dart b/lib/application.dart index 14a0d354a..7474ba7da 100644 --- a/lib/application.dart +++ b/lib/application.dart @@ -81,7 +81,7 @@ import 'package:angular/core_dom/module_internal.dart'; import 'package:angular/directive/module.dart'; import 'package:angular/formatter/module_internal.dart'; import 'package:angular/routing/module.dart'; -import 'package:angular/introspection_js.dart'; +import 'package:angular/introspection.dart'; import 'package:angular/core_dom/static_keys.dart'; diff --git a/lib/core_dom/element_binder.dart b/lib/core_dom/element_binder.dart index 2f3420127..b87cdac64 100644 --- a/lib/core_dom/element_binder.dart +++ b/lib/core_dom/element_binder.dart @@ -237,9 +237,8 @@ class ElementBinder { void _createDirectiveFactories(DirectiveRef ref, nodeModule, node, nodesAttrsDirectives, nodeAttrs, visibility) { if (ref.type == TextMustache) { - nodeModule.bind(TextMustache, toFactory: (Injector injector) { - return new TextMustache(node, ref.valueAST, injector.getByKey(SCOPE_KEY)); - }); + nodeModule.bind(TextMustache, toFactory: (Injector injector) => new TextMustache( + node, ref.valueAST, injector.getByKey(SCOPE_KEY))); } else if (ref.type == AttrMustache) { if (nodesAttrsDirectives.isEmpty) { nodeModule.bind(AttrMustache, toFactory: (Injector injector) { @@ -310,6 +309,11 @@ class ElementBinder { probe = _expando[node] = new ElementProbe(parentInjector.getByKey(ELEMENT_PROBE_KEY), node, nodeInjector, scope); + directiveRefs.forEach((DirectiveRef ref) { + if (ref.valueAST != null) { + probe.bindingExpressions.add(ref.valueAST.expression); + } + }); scope.on(ScopeEvent.DESTROY).listen((_) { _expando[node] = null; }); diff --git a/lib/core_dom/mustache.dart b/lib/core_dom/mustache.dart index b478e0205..920cbdea1 100644 --- a/lib/core_dom/mustache.dart +++ b/lib/core_dom/mustache.dart @@ -26,9 +26,9 @@ class AttrMustache { // This Directive is special and does not go through injection. AttrMustache(this._attrs, - String this._attrName, - AST valueAST, - Scope scope) { + String this._attrName, + AST valueAST, + Scope scope) { _updateMarkup('', 'INITIAL-VALUE'); _attrs.listenObserverChanges(_attrName, (hasObservers) { diff --git a/lib/core_dom/view_factory.dart b/lib/core_dom/view_factory.dart index 2d5e382d6..23b3d9696 100644 --- a/lib/core_dom/view_factory.dart +++ b/lib/core_dom/view_factory.dart @@ -193,6 +193,8 @@ class ElementProbe { final Injector injector; final Scope scope; final directives = []; + final bindingExpressions = []; + final modelExpressions = []; ElementProbe(this.parent, this.element, this.injector, this.scope); } diff --git a/lib/directive/ng_bind.dart b/lib/directive/ng_bind.dart index 65cb194f2..7d49c1755 100644 --- a/lib/directive/ng_bind.dart +++ b/lib/directive/ng_bind.dart @@ -20,7 +20,12 @@ part of angular.directive; class NgBind { final dom.Element element; - NgBind(this.element); + NgBind(this.element, ElementProbe probe) { + // TODO(chirayu): Generalize this. + if (probe != null) { + probe.bindingExpressions.add(element.attributes['ng-bind']); + } + } set value(value) => element.text = value == null ? '' : value.toString(); } diff --git a/lib/directive/ng_model.dart b/lib/directive/ng_model.dart index 2ce09b0e8..7a04f4e42 100644 --- a/lib/directive/ng_model.dart +++ b/lib/directive/ng_model.dart @@ -45,10 +45,13 @@ class NgModel extends NgControl implements AttachAware { bool _watchCollection; NgModel(this._scope, NgElement element, Injector injector, NodeAttrs attrs, - Animate animate) + Animate animate, ElementProbe probe) : super(element, injector, animate) { _expression = attrs["ng-model"]; + if (probe != null) { + probe.modelExpressions.add(_expression); + } watchCollection = false; //Since the user will never be editing the value of a select element then diff --git a/lib/introspection.dart b/lib/introspection.dart index 7293dd45d..7c5f96f2a 100644 --- a/lib/introspection.dart +++ b/lib/introspection.dart @@ -3,11 +3,60 @@ */ library angular.introspection; +import 'dart:async' as async; import 'dart:html' as dom; +import 'dart:js' as js; import 'package:di/di.dart'; -import 'package:angular/introspection_js.dart'; +import 'package:angular/animate/module.dart'; import 'package:angular/core/module_internal.dart'; import 'package:angular/core_dom/module_internal.dart'; +import 'package:angular/core/static_keys.dart'; + + +/** + * A global write only variable which keeps track of objects attached to the + * elements. This is useful for debugging AngularDart application from the + * browser's REPL. + */ +var elementExpando = new Expando('element'); + + +ElementProbe _findProbeWalkingUp(dom.Node node, [dom.Node ascendUntil]) { + while (node != null && node != ascendUntil) { + var probe = elementExpando[node]; + if (probe != null) return probe; + node = node.parent; + } + return null; +} + + +_walkProbesInTree(dom.Node node, Function walker) { + var probe = elementExpando[node]; + if (probe == null || walker(probe) != true) { + for (var child in node.childNodes) { + _walkProbesInTree(child, walker); + } + } +} + + +ElementProbe _findProbeInTree(dom.Node node, [dom.Node ascendUntil]) { + var probe; + _walkProbesInTree(node, (_probe) { + probe = _probe; + return true; + }); + return (probe != null) ? probe : _findProbeWalkingUp(node, ascendUntil); +} + + +List _findAllProbesInTree(dom.Node node) { + List probes = []; + _walkProbesInTree(node, probes.add); + return probes; +} + /** * Return the [ElementProbe] object for the closest [Element] in the hierarchy. @@ -21,25 +70,21 @@ import 'package:angular/core_dom/module_internal.dart'; * function is not intended to be called from Angular application. */ ElementProbe ngProbe(nodeOrSelector) { - var errorMsg; - var node; if (nodeOrSelector == null) throw "ngProbe called without node"; + var node = nodeOrSelector; if (nodeOrSelector is String) { var nodes = ngQuery(dom.document, nodeOrSelector); - if (nodes.isNotEmpty) node = nodes.first; - errorMsg = "Could not find a probe for the selector '$nodeOrSelector' nor its parents"; - } else { - node = nodeOrSelector; - errorMsg = "Could not find a probe for the node '$node' nor its parents"; + node = (nodes.isNotEmpty) ? nodes.first : null; } - while (node != null) { - var probe = elementExpando[node]; - if (probe != null) return probe; - node = node.parent; + var probe = _findProbeWalkingUp(node); + if (probe != null) { + return probe; } - throw errorMsg; + var forWhat = (nodeOrSelector is String) ? "selector" : "node"; + throw "Could not find a probe for the $forWhat '$nodeOrSelector' nor its parents"; } + /** * Return the [Injector] associated with a current [Element]. * @@ -79,6 +124,7 @@ List ngQuery(dom.Node element, String selector, return list; } + /** * Return a List of directives associated with a current [Element]. * @@ -88,3 +134,160 @@ List ngQuery(dom.Node element, String selector, */ List ngDirectives(nodeOrSelector) => ngProbe(nodeOrSelector).directives; + + +js.JsObject _jsProbe(ElementProbe probe) { + return new js.JsObject.jsify({ + "element": probe.element, + "injector": _jsInjector(probe.injector), + "scope": _jsScopeFromProbe(probe), + "directives": probe.directives.map((directive) => _jsDirective(directive)), + "bindings": probe.bindingExpressions, + "models": probe.modelExpressions + })..['_dart_'] = probe; +} + + +js.JsObject _jsInjector(Injector injector) => + new js.JsObject.jsify({"get": injector.get})..['_dart_'] = injector; + + +js.JsObject _jsScopeFromProbe(ElementProbe probe) => + _jsScope(probe.scope, probe.injector.getByKey(SCOPE_STATS_CONFIG_KEY)); + + +js.JsObject _jsScope(Scope scope, ScopeStatsConfig config) { + return new js.JsObject.jsify({ + "apply": scope.apply, + "broadcast": scope.broadcast, + "context": scope.context, + "destroy": scope.destroy, + "digest": scope.rootScope.digest, + "emit": scope.emit, + "flush": scope.rootScope.flush, + "get": (name) => scope.context[name], + "isAttached": scope.isAttached, + "isDestroyed": scope.isDestroyed, + "set": (name, value) => scope.context[name] = value, + "scopeStatsEnable": () => config.emit = true, + "scopeStatsDisable": () => config.emit = false, + r"$eval": (expr) => _jsify(scope.eval(expr)), + })..['_dart_'] = scope; +} + + +// Helper function to JSify the result of a scope.eval() for simple cases. +_jsify(var obj) { + if (obj is js.JsObject) { + return obj; + } else if (obj is Iterable) { + return new js.JsObject.jsify(obj)..['_dart_'] = obj; + } else { + return obj; + } +} + + +_jsDirective(directive) => directive; + + +abstract class _JsObjectProxyable { + js.JsObject _toJsObject(); +} + + +typedef List _GetExpressionsFromProbe(ElementProbe probe); + + +/** + * Returns the "$testability service" object for JS / Protractor use. + * + * JS code expects to get a hold of this object in the following way: + * + * // Prereq: There is an "angular" object on window accessible via JS. + * var testability = angular.element(document).injector().get('$testability'); + */ +class _Testability implements _JsObjectProxyable { + final dom.Node node; + final ElementProbe probe; + + _Testability(this.node, this.probe); + _Testability.fromNode(dom.Node node): this(node, _findProbeInTree(node)); + + notifyWhenNoOutstandingRequests(callback) { + probe.injector.get(VmTurnZone).run( + () => new async.Timer(Duration.ZERO, callback)); + } + + /** + * Returns a list of all nodes in the selected tree that have an `ng-model` + * binding specified by the [modelString]. If the optional [exactMatch] + * parameter is provided and true, it restricts the searches to bindings that + * are exact matches for [modelString]. + */ + List findModels(String modelString, [bool exactMatch]) => _findByExpression( + modelString, exactMatch, (ElementProbe probe) => probe.modelExpressions); + + /** + * Returns a list of all nodes in the selected tree that have `ng-bind` or + * mustache bindings specified by the [bindingString]. If the optional + * [exactMatch] parameter is provided and true, it restricts the searches to + * bindings that are exact matches for [bindingString]. + */ + List findBindings(String bindingString, [bool exactMatch]) => _findByExpression( + bindingString, exactMatch, (ElementProbe probe) => probe.bindingExpressions); + + List _findByExpression(String query, bool exactMatch, _GetExpressionsFromProbe getExpressions) { + List probes = _findAllProbesInTree(node); + if (probes.length == 0) { + probes.add(_findProbeWalkingUp(node)); + } + List results = []; + for (ElementProbe probe in probes) { + for (String expression in getExpressions(probe)) { + if(exactMatch == true ? expression == query : expression.indexOf(query) >= 0) { + results.add(probe.element); + } + } + } + return results; + } + + allowAnimations(bool allowed) { + Animate animate = probe.injector.get(Animate); + bool previous = animate.animationsAllowed; + animate.animationsAllowed = (allowed == true); + return previous; + } + + js.JsObject _toJsObject() { + return new js.JsObject.jsify({ + 'allowAnimations': allowAnimations, + 'findBindings': (bindingString, [exactMatch]) => + findBindings(bindingString, exactMatch), + 'findModels': (modelExpressions, [exactMatch]) => + findModels(modelExpressions, exactMatch), + 'notifyWhenNoOutstandingRequests': (callback) => + notifyWhenNoOutstandingRequests(() => callback.apply([])), + 'probe': () => _jsProbe(probe), + 'scope': () => _jsScopeFromProbe(probe), + 'eval': (expr) => probe.scope.eval(expr), + 'query': (String selector, [String containsText]) => + ngQuery(node, selector, containsText), + })..['_dart_'] = this; + } +} + + +void publishToJavaScript() { + var C = js.context; + C['ngProbe'] = (nodeOrSelector) => _jsProbe(ngProbe(nodeOrSelector)); + C['ngInjector'] = (nodeOrSelector) => _jsInjector(ngInjector(nodeOrSelector)); + C['ngScope'] = (nodeOrSelector) => _jsScopeFromProbe(ngProbe(nodeOrSelector)); + C['ngQuery'] = (dom.Node node, String selector, [String containsText]) => + new js.JsArray.from(ngQuery(node, selector, containsText)); + C['angular'] = new js.JsObject.jsify({ + 'resumeBootstrap': ([arg]) {}, + 'getTestability': (node) => new _Testability.fromNode(node)._toJsObject(), + }); +} diff --git a/lib/introspection_js.dart b/lib/introspection_js.dart deleted file mode 100644 index b3b99f867..000000000 --- a/lib/introspection_js.dart +++ /dev/null @@ -1,62 +0,0 @@ -library angular.introspection_expando; - -import 'dart:html' as dom; -import 'dart:js' as js; - -import 'package:di/di.dart'; -import 'package:angular/introspection.dart'; -import 'package:angular/core/module_internal.dart'; -import 'package:angular/core/static_keys.dart'; -import 'package:angular/core_dom/module_internal.dart'; - -/** - * A global write only variable which keeps track of objects attached to the - * elements. This is useful for debugging AngularDart application from the - * browser's REPL. - */ -var elementExpando = new Expando('element'); - -void publishToJavaScript() { - js.context - ..['ngProbe'] = new js.JsFunction.withThis((_, nodeOrSelector) => - _jsProbe(ngProbe(nodeOrSelector))) - ..['ngInjector'] = new js.JsFunction.withThis((_, nodeOrSelector) => - _jsInjector(ngInjector(nodeOrSelector))) - ..['ngScope'] = new js.JsFunction.withThis((_, nodeOrSelector) => - _jsScope(ngScope(nodeOrSelector), - ngProbe(nodeOrSelector).injector.getByKey(SCOPE_STATS_CONFIG_KEY))) - ..['ngQuery'] = new js.JsFunction.withThis((_, dom.Node node, String selector, - [String containsText]) => new js.JsArray.from(ngQuery(node, selector, containsText))); -} - -js.JsObject _jsProbe(ElementProbe probe) { - return new js.JsObject.jsify({ - "element": probe.element, - "injector": _jsInjector(probe.injector), - "scope": _jsScope(probe.scope, probe.injector.getByKey(SCOPE_STATS_CONFIG_KEY)), - "directives": probe.directives.map((directive) => _jsDirective(directive)) - })..['_dart_'] = probe; -} - -js.JsObject _jsInjector(Injector injector) => - new js.JsObject.jsify({"get": injector.get})..['_dart_'] = injector; - -js.JsObject _jsScope(Scope scope, ScopeStatsConfig config) { - return new js.JsObject.jsify({ - "apply": scope.apply, - "broadcast": scope.broadcast, - "context": scope.context, - "destroy": scope.destroy, - "digest": scope.rootScope.digest, - "emit": scope.emit, - "flush": scope.rootScope.flush, - "get": (name) => scope.context[name], - "isAttached": scope.isAttached, - "isDestroyed": scope.isDestroyed, - "set": (name, value) => scope.context[name] = value, - "scopeStatsEnable": () => config.emit = true, - "scopeStatsDisable": () => config.emit = false - })..['_dart_'] = scope; -} - -_jsDirective(directive) => directive; diff --git a/package.json b/package.json index bb0bee49f..314d7677f 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "karma-junit-reporter": "~0.2.1", "jasmine-node": "*", "jasmine-reporters": "~0.4.1", + "protractor-dart": "0.0.3", "qq": "*" }, "licenses": [ diff --git a/test/directive/ng_model_spec.dart b/test/directive/ng_model_spec.dart index 20b87665b..6a5952fd8 100644 --- a/test/directive/ng_model_spec.dart +++ b/test/directive/ng_model_spec.dart @@ -95,7 +95,7 @@ void main() { nodeAttrs['ng-model'] = 'model'; var model = new NgModel(scope, ngElement, i.createChild([new Module()]), - nodeAttrs, new Animate()); + nodeAttrs, new Animate(), null); dom.querySelector('body').append(element); var input = new InputTextLike(element, model, scope, ngModelOptions); @@ -375,7 +375,7 @@ void main() { nodeAttrs['ng-model'] = 'model'; var model = new NgModel(scope, ngElement, i.createChild([new Module()]), - nodeAttrs, new Animate()); + nodeAttrs, new Animate(), null); dom.querySelector('body').append(element); var input = new InputTextLike(element, model, scope, ngModelOptions); @@ -467,7 +467,7 @@ void main() { nodeAttrs['ng-model'] = 'model'; var model = new NgModel(scope, ngElement, i.createChild([new Module()]), - nodeAttrs, new Animate()); + nodeAttrs, new Animate(), null); dom.querySelector('body').append(element); var input = new InputTextLike(element, model, scope, ngModelOptions); @@ -567,7 +567,7 @@ void main() { nodeAttrs['ng-model'] = 'model'; var model = new NgModel(scope, ngElement, i.createChild([new Module()]), - nodeAttrs, new Animate()); + nodeAttrs, new Animate(), null); dom.querySelector('body').append(element); var input = new InputTextLike(element, model, scope, ngModelOptions); @@ -778,7 +778,7 @@ void main() { nodeAttrs['ng-model'] = 'model'; var model = new NgModel(scope, ngElement, i.createChild([new Module()]), - nodeAttrs, new Animate()); + nodeAttrs, new Animate(), null); dom.querySelector('body').append(element); var input = new InputTextLike(element, model, scope, ngModelOptions); diff --git a/test/introspection_spec.dart b/test/introspection_spec.dart index d8ff35c74..246ce16c7 100644 --- a/test/introspection_spec.dart +++ b/test/introspection_spec.dart @@ -53,23 +53,112 @@ void main() { expect(toHtml(ngQuery(div, 'li'))).toEqual('
  • stash
  • secret
    • '); }); - // Does not work in dart2js. deboer is investigating. - it('should be available from Javascript', () { - // The probe only works if there is a directive. - var elt = e('
    '); - // Make it possible to find the element from JS - document.body.append(elt); - (applicationFactory()..element = elt).run(); - - expect(js.context['ngProbe']).toBeDefined(); - expect(js.context['ngScope']).toBeDefined(); - expect(js.context['ngInjector']).toBeDefined(); - expect(js.context['ngQuery']).toBeDefined(); - - - // Polymer does not support accessing named elements directly (e.g. window.ngtop) - // so we need to use getElementById to support Polymer's shadow DOM polyfill. - expect(js.context['ngProbe'].apply([document.getElementById('ngtop')])).toBeDefined(); + describe('JavaScript bindings', () { + var elt, angular, ngtop; + + beforeEach(() { + elt = e('
    ' + '
    ' + '
    ' + '
    {{textMustache}}
    ' + '
    '); + // Make it possible to find the element from JS + document.body.append(elt); + (applicationFactory()..element = elt).run(); + angular = js.context['angular']; + // Polymer does not support accessing named elements directly (e.g. window.ngtop) + // so we need to use getElementById to support Polymer's shadow DOM polyfill. + ngtop = document.getElementById('ngtop'); + }); + + afterEach(() { + elt.remove(); + elt = angular = ngtop = null; + }); + + // Does not work in dart2js. deboer is investigating. + it('should be available from Javascript', () { + expect(js.context['ngProbe']).toBeDefined(); + expect(js.context['ngInjector']).toBeDefined(); + expect(js.context['ngScope']).toBeDefined(); + expect(js.context['ngQuery']).toBeDefined(); + expect(angular).toBeDefined(); + expect(angular['resumeBootstrap']).toBeDefined(); + expect(angular['getTestability']).toBeDefined(); + + expect(js.context['ngProbe'].apply([ngtop])).toBeDefined(); + }); + + describe(r'testability', () { + var testability; + + beforeEach(() { + testability = angular['getTestability'].apply([ngtop]); + }); + + it('should be available from Javascript', () { + expect(testability).toBeDefined(); + }); + + it('should expose allowAnimations', () { + allowAnimations(allowed) => testability['allowAnimations'].apply([allowed]); + expect(allowAnimations(false)).toEqual(true); + expect(allowAnimations(false)).toEqual(false); + expect(allowAnimations(true)).toEqual(false); + expect(allowAnimations(true)).toEqual(true); + }); + + describe('bindings', () { + it('should find exact bindings', () { + // exactMatch should fail. + var bindingNodes = testability['findBindings'].apply(['introspection', true]); + expect(bindingNodes.length).toEqual(0); + + // substring search (default) should succeed. + // exactMatch should default to false. + bindingNodes = testability['findBindings'].apply(['introspection']); + expect(bindingNodes.length).toEqual(1); + bindingNodes = testability['findBindings'].apply(['introspection', false]); + expect(bindingNodes.length).toEqual(1); + + // and so should exact search with the correct query. + bindingNodes = testability['findBindings'].apply(["'introspection FTW'", true]); + expect(bindingNodes.length).toEqual(1); + }); + + _assertBinding(String query) { + var bindingNodes = testability['findBindings'].apply([query]); + expect(bindingNodes.length).toEqual(1); + var node = bindingNodes[0]; + var probe = js.context['ngProbe'].apply([node]); + expect(probe).toBeDefined(); + var bindings = probe['bindings']; + expect(bindings['length']).toEqual(1); + expect(bindings[0].contains(query)).toBe(true); + } + + it('should find ng-bind bindings', () => _assertBinding('introspection FTW')); + it('should find attribute mustache bindings', () => _assertBinding('attrMustache')); + it('should find text mustache bindings', () => _assertBinding('textMustache')); + }); + + it('should find models', () { + // exactMatch should fail. + var modelNodes = testability['findModels'].apply(['my', true]); + expect(modelNodes.length).toEqual(0); + + // substring search (default) should succeed. + modelNodes = testability['findModels'].apply(['my']); + expect(modelNodes.length).toEqual(1); + var divElement = modelNodes[0]; + expect(divElement is DivElement).toEqual(true); + var probe = js.context['ngProbe'].apply([divElement]); + expect(probe).toBeDefined(); + var models = probe['models']; + expect(models['length']).toEqual(1); + expect(models[0]).toEqual('myModel'); + }); + }); }); }); } diff --git a/test_e2e/pubspec.lock b/test_e2e/pubspec.lock new file mode 100644 index 000000000..3379722c7 --- /dev/null +++ b/test_e2e/pubspec.lock @@ -0,0 +1,15 @@ +# Generated by pub +# See http://pub.dartlang.org/doc/glossary.html#lockfile +packages: + browser: + description: browser + source: hosted + version: "0.10.0+2" + js: + description: js + source: hosted + version: "0.2.2" + protractor: + description: protractor + source: hosted + version: "0.0.4" From 384039a1c07ee66ac2a886e58b3eb3c12bcba04d Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Thu, 29 May 2014 15:44:50 -0700 Subject: [PATCH 2/7] fix(introspection): work around http://dartbug.com/17752 --- lib/introspection.dart | 109 ++++++++++++++++++++++++++++++++--------- 1 file changed, 85 insertions(+), 24 deletions(-) diff --git a/lib/introspection.dart b/lib/introspection.dart index 7c5f96f2a..468398389 100644 --- a/lib/introspection.dart +++ b/lib/introspection.dart @@ -137,7 +137,7 @@ List ngDirectives(nodeOrSelector) => ngProbe(nodeOrSelector).directives; js.JsObject _jsProbe(ElementProbe probe) { - return new js.JsObject.jsify({ + return _jsify({ "element": probe.element, "injector": _jsInjector(probe.injector), "scope": _jsScopeFromProbe(probe), @@ -149,15 +149,84 @@ js.JsObject _jsProbe(ElementProbe probe) { js.JsObject _jsInjector(Injector injector) => - new js.JsObject.jsify({"get": injector.get})..['_dart_'] = injector; + _jsify({"get": injector.get})..['_dart_'] = injector; js.JsObject _jsScopeFromProbe(ElementProbe probe) => _jsScope(probe.scope, probe.injector.getByKey(SCOPE_STATS_CONFIG_KEY)); + +// Work around http://dartbug.com/17752 +// Proxies a Dart function that accepts up to 10 parameters. +js.JsFunction _jsFunction(Function fn) { + const Object X = __varargSentinel; + Function fnCopy = fn; // workaround a bug. + return new js.JsFunction.withThis( + (thisArg, [o1=X, o2=X, o3=X, o4=X, o5=X, o6=X, o7=X, o8=X, o9=X, o10=X]) { + // Work around a bug in dart 1.4.0 where the closurized variable, fn, + // gets mysteriously replaced with our own closure function leading to a + // stack overflow. + fn = fnCopy; + if (o10 == null && identical(o9, X)) { + // Work around another bug in dart 1.4.0. This bug is not present in + // dart 1.5.0-dev.2.0. + // In dart 1.4.0, when running in Dartium (not dart2js), if you invoke + // a JsFunction from Dart code (either by calling .apply([args]) on it + // or by calling .callMethod(jsFuncName, [args]) on a JsObject + // containing the JsFunction, regardless of whether you specified the + // thisArg keyword parameter, the Dart function is called with the + // first argument in the thisArg param causing all the arguments to be + // shifted by one. We can detect this by the fact that o10 is null + // but o9 is X (should only happen when o9 got a default value) and + // work around it by using thisArg as the first parameter. + return __invokeFn(fn, thisArg, o1, o2, o3, o4, o5, o6, o7, o8, o9); + } else { + return __invokeFn(fn, o1, o2, o3, o4, o5, o6, o7, o8, o9, o10); + } + } + ); +} + + +const Object __varargSentinel = const Object(); + + +__invokeFn(fn, o1, o2, o3, o4, o5, o6, o7, o8, o9, o10) { + var args = [o1, o2, o3, o4, o5, o6, o7, o8, o9, o10]; + while (args.length > 0 && identical(args.last, __varargSentinel)) { + args.removeLast(); + } + return _jsify(Function.apply(fn, args)); +} + + +// Helper function to JSify a Dart object. While this is *required* to JSify +// the result of a scope.eval(), other uses are not required and are used to +// work around http://dartbug.com/17752 in a convenient way (that bug affects +// dart2js in checked mode.) +_jsify(var obj) { + if (obj == null || obj is js.JsObject) { + return obj; + } + if (obj is Function) { + return _jsFunction(obj); + } + if ((obj is Map) || (obj is Iterable)) { + var mappedObj = (obj is Map) ? + new Map.fromIterables(obj.keys, obj.values.map(_jsify)) : obj.map(_jsify); + if (obj is List) { + return new js.JsArray.from(mappedObj); + } else { + return new js.JsObject.jsify(mappedObj); + } + } + return obj; +} + + js.JsObject _jsScope(Scope scope, ScopeStatsConfig config) { - return new js.JsObject.jsify({ + return _jsify({ "apply": scope.apply, "broadcast": scope.broadcast, "context": scope.context, @@ -176,18 +245,6 @@ js.JsObject _jsScope(Scope scope, ScopeStatsConfig config) { } -// Helper function to JSify the result of a scope.eval() for simple cases. -_jsify(var obj) { - if (obj is js.JsObject) { - return obj; - } else if (obj is Iterable) { - return new js.JsObject.jsify(obj)..['_dart_'] = obj; - } else { - return obj; - } -} - - _jsDirective(directive) => directive; @@ -261,7 +318,7 @@ class _Testability implements _JsObjectProxyable { } js.JsObject _toJsObject() { - return new js.JsObject.jsify({ + return _jsify({ 'allowAnimations': allowAnimations, 'findBindings': (bindingString, [exactMatch]) => findBindings(bindingString, exactMatch), @@ -280,14 +337,18 @@ class _Testability implements _JsObjectProxyable { void publishToJavaScript() { - var C = js.context; - C['ngProbe'] = (nodeOrSelector) => _jsProbe(ngProbe(nodeOrSelector)); - C['ngInjector'] = (nodeOrSelector) => _jsInjector(ngInjector(nodeOrSelector)); - C['ngScope'] = (nodeOrSelector) => _jsScopeFromProbe(ngProbe(nodeOrSelector)); - C['ngQuery'] = (dom.Node node, String selector, [String containsText]) => - new js.JsArray.from(ngQuery(node, selector, containsText)); - C['angular'] = new js.JsObject.jsify({ + var D = {}; + D['ngProbe'] = (nodeOrSelector) => _jsProbe(ngProbe(nodeOrSelector)); + D['ngInjector'] = (nodeOrSelector) => _jsInjector(ngInjector(nodeOrSelector)); + D['ngScope'] = (nodeOrSelector) => _jsScopeFromProbe(ngProbe(nodeOrSelector)); + D['ngQuery'] = (dom.Node node, String selector, [String containsText]) => + ngQuery(node, selector, containsText); + D['angular'] = { 'resumeBootstrap': ([arg]) {}, 'getTestability': (node) => new _Testability.fromNode(node)._toJsObject(), - }); + }; + js.JsObject J = _jsify(D); + for (String key in D.keys) { + js.context[key] = J[key]; + } } From 6705183decd2c04fdfe1316be5cb84c798831656 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Tue, 27 May 2014 16:31:38 -0700 Subject: [PATCH 3/7] test(e2e): add end-to-end tests using ProtractorDart https://pub.dartlang.org/packages/protractor --- pubspec.lock | 8 ++ pubspec.yaml | 5 +- scripts/run-e2e-test.sh | 80 +++++++++++++ scripts/run-test.sh | 2 + scripts/travis/build.sh | 7 ++ test_e2e/animation_ng_repeat_spec.dart | 90 ++++++++++++++ test_e2e/animation_spec.dart | 33 ++++++ test_e2e/animation_visibility_spec.dart | 46 ++++++++ test_e2e/configQuery.js | 72 ++++++++++++ test_e2e/examplesConf.js | 57 +++++++++ test_e2e/hello_world_spec.dart | 25 ++++ test_e2e/pubspec.yaml | 10 ++ test_e2e/todo_spec.dart | 150 ++++++++++++++++++++++++ 13 files changed, 583 insertions(+), 2 deletions(-) create mode 100755 scripts/run-e2e-test.sh create mode 100644 test_e2e/animation_ng_repeat_spec.dart create mode 100644 test_e2e/animation_spec.dart create mode 100644 test_e2e/animation_visibility_spec.dart create mode 100644 test_e2e/configQuery.js create mode 100644 test_e2e/examplesConf.js create mode 100644 test_e2e/hello_world_spec.dart create mode 100644 test_e2e/pubspec.yaml create mode 100644 test_e2e/todo_spec.dart diff --git a/pubspec.lock b/pubspec.lock index 3cdc8c6dd..991e2aa6e 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -45,6 +45,10 @@ packages: description: intl source: hosted version: "0.9.9" + js: + description: js + source: hosted + version: "0.2.2" logging: description: logging source: hosted @@ -65,6 +69,10 @@ packages: description: perf_api source: hosted version: "0.0.8" + protractor: + description: protractor + source: hosted + version: "0.0.2" route_hierarchical: description: route_hierarchical source: hosted diff --git a/pubspec.yaml b/pubspec.yaml index fe4f30bc1..8b791b425 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -27,6 +27,7 @@ dependencies: web_components: '>=0.3.3 <0.4.0' dev_dependencies: benchmark_harness: '>=1.0.0' - unittest: '>=0.10.1 <0.12.0' - mock: '>=0.10.0 <0.12.0' guinness: '>=0.1.3 <0.2.0' + mock: '>=0.10.0 <0.12.0' + protractor: '0.0.2' + unittest: '>=0.10.1 <0.12.0' diff --git a/scripts/run-e2e-test.sh b/scripts/run-e2e-test.sh new file mode 100755 index 000000000..9c2d1608f --- /dev/null +++ b/scripts/run-e2e-test.sh @@ -0,0 +1,80 @@ +#!/bin/bash + +# Run E2E / Protractor tests. + +set -e + +. $(dirname $0)/env.sh + +SIGNALS=(ERR HUP INT QUIT PIPE TERM) + +_onSignal() { + EXIT_CODE=$? + # Kill all child processes (running servers.) + kill 0 + # Need to explicitly kill ourselves to let the caller know we died from a + # signal. Ref: http://www.cons.org/cracauer/sigint.html + sig=$1 + trap - "${SIGNALS[@]}" # disable signals so we don't capture them again. + if [[ "$sig" == "ERR" ]]; then + exit $EXIT_CODE + else + kill -$sig $$ + fi +} + +for s in "${SIGNALS[@]}" ; do + trap "_onSignal $s" $s +done + + +install_deps() {( + SELENIUM_VER="2.42" + SELENIUM_ZIP="selenium-server-standalone-$SELENIUM_VER.0.jar" + CHROMEDRIVER_VER="2.10" + # chromedriver + case "$(uname -s)" in + (Darwin) CHROMEDRIVER_ZIP="chromedriver_mac32.zip" ;; + (Linux) CHROMEDRIVER_ZIP="chromedriver_linux64.zip" ;; + (*) echo Unsupported OS >&2; exit 2 ;; + esac + mkdir -p e2e_bin && cd e2e_bin + if [[ ! -e "$SELENIUM_ZIP" ]]; then + curl -O "http://selenium-release.storage.googleapis.com/$SELENIUM_VER/$SELENIUM_ZIP" + fi + if [[ ! -e "$CHROMEDRIVER_ZIP" ]]; then + curl -O "http://chromedriver.storage.googleapis.com/$CHROMEDRIVER_VER/$CHROMEDRIVER_ZIP" + unzip "$CHROMEDRIVER_ZIP" + fi +)} + + +start_servers() { + # Run examples. + ( + cd example + pub install + pub build + rsync -rl --exclude packages web/ build/web/ + rm -rf build/web/packages + ln -s $PWD/packages build/web/packages + ) + PORT=28000 + (cd example/build/web && python -m SimpleHTTPServer $PORT) >/dev/null 2>&1 & + export NGDART_EXAMPLE_BASEURL=http://127.0.0.1:$PORT + + # Allow chromedriver to be found on the system path. + export PATH=$PATH:$PWD/e2e_bin + + # Start selenium. Kill all output - selenium is extremely noisy. + java -jar ./e2e_bin/selenium-server-standalone-2.42.0.jar >/dev/null 2>&1 & + + sleep 4 # wait for selenium startup +} + + +# Main +install_deps +start_servers +(cd test_e2e && pub install) +./node_modules/.bin/protractor_dart test_e2e/examplesConf.js diff --git a/scripts/run-test.sh b/scripts/run-test.sh index f60e1a613..71c1d307a 100755 --- a/scripts/run-test.sh +++ b/scripts/run-test.sh @@ -33,3 +33,5 @@ $NGDART_SCRIPT_DIR/analyze.sh && --reporters=junit,dots --port=8765 --runner-port=8766 \ --browsers=Dartium,Chrome,Firefox --single-run --no-colors +# Run E2E tests +$NGDART_BASE_DIR/scripts/run-e2e-test.sh diff --git a/scripts/travis/build.sh b/scripts/travis/build.sh index 6876de057..467c2d35d 100755 --- a/scripts/travis/build.sh +++ b/scripts/travis/build.sh @@ -102,6 +102,13 @@ node "node_modules/karma/bin/karma" start karma.conf \ --reporters=junit,dots --port=8765 --runner-port=8766 \ --browsers=$BROWSERS --single-run --no-colors + +echo '---------------------------' +echo '-- E2E TEST: AngularDart --' +echo '---------------------------' +$NGDART_BASE_DIR/scripts/run-e2e-test.sh + + echo '-------------------------' echo '-- DOCS: Generate Docs --' echo '-------------------------' diff --git a/test_e2e/animation_ng_repeat_spec.dart b/test_e2e/animation_ng_repeat_spec.dart new file mode 100644 index 000000000..07b53fb4f --- /dev/null +++ b/test_e2e/animation_ng_repeat_spec.dart @@ -0,0 +1,90 @@ +part of angular.example.animation_spec; + +class NgRepeatAppState extends AppState { + var addBtn = element(by.buttonText("Add Thing")); + var removeBtn = element(by.buttonText("Remove Thing")); + var rows = element.all(by.repeater("outer in ctrl.items")); + var thingId = 0; // monotonically increasing. + var things = []; + + addThing() { + things.add(thingId++); + addBtn.click(); + } + + removeThing() { + if (things.length > 0) { + things.removeLast(); + } + removeBtn.click(); + } + + cell(x, y) => rows.get(x).findElements(by.tagName("li")) + .then((e) => toDartArray(e)[y].getText()); + + assertState() { + expect(rows.count()).toBe(things.length); + for (int y = 0; y < things.length; y++) { + for (int x = 0; x < things.length; x++) { + expect(cell(x, y)).toEqual("Thing ${things[y]}"); + } + } + } +} + +animation_ng_repeat_spec() { + describe('ng-repeat', () { + var S; + + beforeEach(() { + S = new NgRepeatAppState(); + S.ngRepeatBtn.click(); + }); + + it('should switch to the ng-repeat example', () { + expect(S.heading.getText()).toEqual("ng-repeat Demo"); + S.assertState(); + }); + + it('should add row', () { + S.addThing(); + S.assertState(); + S.addThing(); + S.assertState(); + S.removeThing(); + S.addThing(); + S.assertState(); + }); + + it('should remove rows', () { + S.addThing(); + S.addThing(); + S.assertState(); + + S.removeThing(); + S.assertState(); + + S.removeThing(); + S.assertState(); + }); + + it('should not remove rows that do not exist', () { + S.removeThing(); + S.assertState(); + + S.addThing(); + S.removeThing(); + S.removeThing(); + S.assertState(); + }); + + it('should add things with monotonically increasing numbers', () { + S.addThing(); + S.addThing(); S.removeThing(); S.addThing(); + S.addThing(); S.removeThing(); S.addThing(); + S.addThing(); + expect(S.things).toEqual([0, 2, 4, 5]); + S.assertState(); + }); + }); +} diff --git a/test_e2e/animation_spec.dart b/test_e2e/animation_spec.dart new file mode 100644 index 000000000..db81e65f1 --- /dev/null +++ b/test_e2e/animation_spec.dart @@ -0,0 +1,33 @@ +library angular.example.animation_spec; + +import 'dart:html'; +import 'package:js/js.dart'; +import 'package:protractor/protractor_api.dart'; + +part 'animation_ng_repeat_spec.dart'; +part 'animation_visibility_spec.dart'; + +class AppState { + var ngRepeatBtn = element(by.buttonText("ng-repeat")); + var visibilityBtn = element(by.buttonText("Visibility")); + + var heading = element(by.css(".demo h2")); +} + + +main() { + describe('animation example', () { + beforeEach(() { + protractor.getInstance().get('animation.html'); + element(by.tagName("body")).allowAnimations(false); + }); + + it('should start in about page', () { + var S = new AppState(); + expect(S.heading.getText()).toEqual("About"); + }); + + animation_ng_repeat_spec(); + animation_visibility_spec(); + }); +} diff --git a/test_e2e/animation_visibility_spec.dart b/test_e2e/animation_visibility_spec.dart new file mode 100644 index 000000000..7baef14fc --- /dev/null +++ b/test_e2e/animation_visibility_spec.dart @@ -0,0 +1,46 @@ +part of angular.example.animation_spec; + +class VisibilityAppState extends AppState { + var toggleBtn = element(by.buttonText("Toggle Visibility")); + var visibleIf = element(by.css(".visible-if")); + var visibleHide = element(by.css(".visible-hide")); + + hasClass(var element, String expectedClass) { + return element.getAttribute("class").then((_class) => + "$_class".split(" ").contains(expectedClass)); + } + + assertState({bool toggled: false}) { + expect(hasClass(visibleHide, "ng-hide")).toEqual(toggled); + expect(visibleIf.isPresent()).toEqual(toggled); + } +} + +animation_visibility_spec() { + var S; + + describe('visibility', () { + beforeEach(() { + S = new VisibilityAppState(); + S.visibilityBtn.click(); + }); + + it('should switch to the visibility example in initial state', () { + expect(S.heading.getText()).toEqual("Visibility Demo"); + expect(S.visibleHide.getText()).toEqual( + "Hello World. ng-hide will add and remove the .ng-hide class " + "from me to show and hide this view of text."); + S.assertState(toggled: false); + }); + + it('should toggle ng-hide and ng-if', () { + S.toggleBtn.click(); + S.assertState(toggled: true); + S.toggleBtn.click(); + S.assertState(toggled: false); + S.toggleBtn.click(); + S.assertState(toggled: true); + }); + + }); +} diff --git a/test_e2e/configQuery.js b/test_e2e/configQuery.js new file mode 100644 index 000000000..980e232f8 --- /dev/null +++ b/test_e2e/configQuery.js @@ -0,0 +1,72 @@ +var env = process.env, + fs = require('fs'), + path = require('path'); + + +var runningOnTravis = (env.TRAVIS !== undefined); + + +function getBaseUrl() { + if (env.NGDART_EXAMPLE_BASEURL) { + return env.NGDART_EXAMPLE_BASEURL; + } else if (env.USER == 'chirayu') { + return 'http://example.ngdart.localhost'; + } else { + // Default host:port when you run "pub serve" from the example + // subdirectory of the AngularDart repo. + return 'http://localhost:8080'; + } +} + + +function getDartiumBinary() { + var ensure = function(condition) { + if (!condition) throw "Unable to locate Dartium. Please set the DARTIUM environment variable."; + }; + + if (env.DARTIUM) { + return env.DARTIUM; + } + var platform = require('os').platform(); + var DART_SDK = env.DART_SDK; + if (DART_SDK) { + // Locate the chromium directory as a sibling of the DART_SDK + // directory. (It's there if you unpacked the full Dart distribution.) + var chromiumRoot = path.join(DART_SDK, "../chromium"); + ensure(fs.existsSync(chromiumRoot)); + var binary = path.join(chromiumRoot, + (platform == 'darwin') ? 'Chromium.app/Contents/MacOS/Chromium' : 'chrome'); + ensure(fs.existsSync(binary)); + return binary; + } + // Last resort: Try the standard location on Macs for the AngularDart team. + var binary = '/Applications/dart/chromium/Chromium.app/Contents/MacOS/Chromium'; + ensure(platform == 'darwin' && fs.existsSync(binary)); + return binary; +} + + +function getChromeOptions() { + if (!runningOnTravis) { + return {'binary': getDartiumBinary()}; + } + // In Travis, the list of browsers to test is specified as a CSV in the + // BROWSERS environment variable. + // TODO(chirayu): Parse the BROWSERS csv so we also test on Firefox. + if (env.TESTS == "vm") { + return {'binary': env.DARTIUM_BIN}; + } + if (env.TESTS == "dart2js") { + return { + 'binary': env.CHROME_BIN, + // Ref: https://github.com/travis-ci/travis-ci/issues/938 + // https://sites.google.com/a/chromium.org/chromedriver/help/chrome-doesn-t-start + 'args': ['no-sandbox=true'] + }; + } + throw new Error("Unknown Travis configuration specified by TESTS variable"); +} + + +exports.getBaseUrl = getBaseUrl; +exports.getChromeOptions = getChromeOptions; diff --git a/test_e2e/examplesConf.js b/test_e2e/examplesConf.js new file mode 100644 index 000000000..6580fdc5a --- /dev/null +++ b/test_e2e/examplesConf.js @@ -0,0 +1,57 @@ +/** + * Environment Variables affecting this config. + * -------------------------------------------- + * + * DARTIUM: The full path to the Dartium binary. + * + * NGDART_EXAMPLE_BASEURL: Overrides the default baseUrl to one of your + * choosing. (The default is http://localhost:8080 which is the + * correct if you simply run "pub serve" inside the example folder + * of the AngularDart repo.) + */ + +var configQuery = require('./configQuery.js'); + +var config = { + seleniumAddress: 'http://127.0.0.1:4444/wd/hub', + + specs: [ + 'animation_spec.dart', + 'hello_world_spec.dart', + 'todo_spec.dart' + ], + + splitTestsBetweenCapabilities: true, + + multiCapabilities: [{ + 'browserName': 'chrome', + 'chromeOptions': configQuery.getChromeOptions(), + count: 4 + }], + + baseUrl: configQuery.getBaseUrl(), + + jasmineNodeOpts: { + isVerbose: true, // display spec names. + showColors: true, // print colors to the terminal. + includeStackTrace: true, // include stack traces in failures. + defaultTimeoutInterval: 40000 // wait time in ms before failing a test. + }, +}; + +// Saucelabs case. +if (process.env.SAUCE_USERNAME != null) { + config.sauceUser = process.env.SAUCE_USERNAME; + config.sauceKey = process.env.SAUCE_ACCESS_KEY; + config.seleniumAddress = null; + + config.multiCapabilities.forEach(function(capability) { + capability['tunnel-identifier'] = process.env.TRAVIS_JOB_NUMBER; + capability['build'] = process.env.TRAVIS_BUILD_NUMBER; + capability['name'] = 'AngularDart E2E Suite'; + // Double the timeout for Sauce. + capability['defaultTimeoutInterval'] *= 2; + }); +} + +exports.config = config; diff --git a/test_e2e/hello_world_spec.dart b/test_e2e/hello_world_spec.dart new file mode 100644 index 000000000..d27f51191 --- /dev/null +++ b/test_e2e/hello_world_spec.dart @@ -0,0 +1,25 @@ +import 'dart:html'; +import 'package:js/js.dart'; +import 'package:protractor/protractor_api.dart'; + +main() { + describe('hello_world example', () { + var nameByModel, nameByBinding; + + beforeEach(() { + protractor.getInstance().get('hello_world.html'); + nameByModel = element(by.model('ctrl.name')); + nameByBinding = element(by.binding('ctrl.name')); + }); + + it('should set initial value for input element', () { + expect(nameByModel.getAttribute('value')).toEqual('world'); + }); + + it('should set mustache value to initial value of model', () { + nameByBinding = element(by.binding('ctrl.name')); + expect(nameByBinding.getText()).toEqual('Hello world!'); + }); + + }); +} diff --git a/test_e2e/pubspec.yaml b/test_e2e/pubspec.yaml new file mode 100644 index 000000000..152dc75ea --- /dev/null +++ b/test_e2e/pubspec.yaml @@ -0,0 +1,10 @@ +name: angulardart-specs +version: 0.0.1 +authors: +- Chirayu Krishnappa +description: Specs for AngularDart examples. +environment: + sdk: '>=1.3.0' +dependencies: + js: '>=0.2.0 <0.3.0' + protractor: '0.0.2' diff --git a/test_e2e/todo_spec.dart b/test_e2e/todo_spec.dart new file mode 100644 index 000000000..7f54f9d6e --- /dev/null +++ b/test_e2e/todo_spec.dart @@ -0,0 +1,150 @@ +import 'dart:html'; +import 'package:js/js.dart'; +import 'package:protractor/protractor_api.dart'; + + +class AppState { + var items = element.all(by.repeater('item in todo.items')); + var remaining = element(by.binding('todo.remaining')); + var total = element(by.binding('todo.items.length')); + + var markAllDoneBtn = element(by.buttonText("mark all done")); + var archiveDoneBtn = element(by.buttonText("archive done")); + var addBtn = element(by.buttonText("add")); + var clearBtn = element(by.buttonText("clear")); + + var newItemInput = element(by.model("todo.newItem.text")); + get newItemText => newItemInput.getAttribute('value'); + + todo(i) => items.get(i).getText(); + input(i) => items.get(i).findElement(by.tagName("input")); + + // Initial state. + var todos = ['Write Angular in Dart', + 'Write Dart in Angular', + 'Do something useful']; + var checks = [true, false, false]; + + get numTodos => todos.length; + get numChecked => checks.where((i) => i).length; + + assertTodos() { + expect(remaining.getText()).toEqual('${numTodos - numChecked}'); + expect(total.getText()).toEqual('${numTodos}'); + expect(items.count()).toBe(numTodos); + for (int i = 0; i < todos.length; i++) { + expect(todo(i)).toEqual(todos[i]); + expect(input(i).isSelected()).toEqual(checks[i]); + } + } + + assertNewItem([String text]) { + text = (text == null) ? '' : text; + expect(addBtn.isEnabled()).toEqual(text.length > 0); + expect(clearBtn.isEnabled()).toEqual(text.length > 0); + // input field and model value should contain the typed text. + expect(newItemText).toEqual(text); + expect(newItemInput.evaluate('todo.newItem.text')).toEqual(text); + } +} + + +main() { + describe('todo example', () { + var S; + + beforeEach(() { + protractor.getInstance().get('todo.html'); + S = new AppState(); + }); + + it('should set initial values for elements', () { + S.assertTodos(); + }); + + it('should update model when checkbox is toggled', () { + S.input(0).click(); + S.checks[0] = false; + S.assertTodos(); + + S.input(1).click(); + S.checks[1] = true; + S.assertTodos(); + }); + + it('should mark all done with a button', () { + S.markAllDoneBtn.click(); + S.checks = new List.filled(S.todos.length, true); + S.assertTodos(); + }); + + it('should archive done items', () { + S.archiveDoneBtn.click(); + // the first todo should disappear. + S.todos.removeAt(0); + S.checks = new List.filled(S.todos.length, false); + S.assertTodos(); + }); + + it('should enable/disable add and clear buttons when input is empty/has text', () { + S.assertNewItem(''); + + // type a character + S.newItemInput.sendKeys('a'); + S.assertNewItem('a'); + + // backspace + S.newItemInput.sendKeys('\x08'); // backspace + S.assertNewItem(''); + + // type a character again + S.newItemInput.sendKeys('a'); + S.assertNewItem('a'); + }); + + it('should reflect new item text changes in model', () { + expect(S.newItemText).toEqual(''); + var text = 'Typing something ...'; + S.newItemInput.sendKeys(text); + // input field and model value should contain the typed text. + expect(S.newItemText).toEqual(text); + expect(S.newItemInput.evaluate('todo.newItem.text')).toEqual(text); + S.assertTodos(); + }); + + it('should clear input with clear button', () { + S.newItemInput.sendKeys('Typing something ...'); + S.clearBtn.click(); + // input field should be clear. + expect(S.newItemText).toEqual(''); + S.assertTodos(); + }); + + it('should add a new item and clear the input field', () { + var text = 'Test using Protractor'; + S.newItemInput.sendKeys(text); + S.addBtn.click(); + S.assertNewItem(''); + S.todos.add(text); + S.checks.add(false); + S.assertTodos(); + + // This time, use the key instead of clicking the add + // button. + text = 'Pressed enter in the input field'; + S.newItemInput.sendKeys(text + '\n'); + S.addBtn.click(); + S.assertNewItem(''); + S.todos.add(text); + S.checks.add(false); + S.assertTodos(); + }); + + it('should have empty list when all items are done', () { + S.markAllDoneBtn.click(); + S.archiveDoneBtn.click(); + S.todos = S.checks = []; + S.assertTodos(); + }); + }); +} From 2f1e36d359cd7680326c8fc1d1d52623c4417307 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Wed, 28 May 2014 14:59:59 -0700 Subject: [PATCH 4/7] chore(scripts): fix detection of DART_SDK/DART/DARTIUM Sets the stage to get rid of obsolete DARTSDK. --- scripts/env.sh | 90 ++++++++++++++++++++----------- scripts/generate-documentation.sh | 2 +- scripts/travis/install.sh | 3 +- 3 files changed, 61 insertions(+), 34 deletions(-) diff --git a/scripts/env.sh b/scripts/env.sh index 750e2b577..cd66f418c 100755 --- a/scripts/env.sh +++ b/scripts/env.sh @@ -4,51 +4,79 @@ set -e if [[ -z $ENV_SET ]]; then export ENV_SET=1 - if [ -n "$DART_SDK" ]; then - DARTSDK=$DART_SDK + # Map DART_SDK and DARTSDK to each other if only one is specified. + # + # TODO(chirayu): Remove this legacy DARTSDK variable support. Check with Misko + # to see if he's using it on this Mac. + if [[ -z "$DART_SDK" ]]; then + : "${DARTSDK:=$DART_SDK}" else - echo "sdk=== $DARTSDK" - DART=`which dart|cat` # pipe to cat to ignore the exit code - DARTSDK=`which dart | sed -e 's/\/dart\-sdk\/.*$/\/dart-sdk/'` - - if [ "$DARTSDK" = "/Applications/dart/dart-sdk" ]; then - # Assume we are a mac machine with standard dart setup - export DARTIUM="/Applications/dart/chromium/Chromium.app/Contents/MacOS/Chromium" - else - DARTSDK="`pwd`/dart-sdk" - case $( uname -s ) in - Darwin) - export DARTIUM=${DARTIUM:-./dartium/Chromium.app/Contents/MacOS/Chromium} - ;; - Linux) - export DARTIUM=${DARTIUM:-./dartium/chrome} - ;; - esac - fi + : "${DART_SDK:=$DARTSDK}" fi - case $( uname -s ) in - Darwin) + unset DART + PLATFORM="$(uname -s)" + + case "$PLATFORM" in + (Darwin) path=$(readlink ${BASH_SOURCE[0]}||echo './scripts/env.sh') export NGDART_SCRIPT_DIR=$(dirname $path) ;; - Linux) + (Linux) export NGDART_SCRIPT_DIR=$(dirname $(readlink -f ${BASH_SOURCE[0]})) ;; + (*) + echo Unsupported platform $PLATFORM. Exiting ... >&2 + exit 3 + ;; esac + export NGDART_BASE_DIR=$(dirname $NGDART_SCRIPT_DIR) - export DART_SDK="$DARTSDK" + # Try to find the SDK alongside the dart command first. + if [[ -z "$DART_SDK" ]]; then + DART=$(which dart) || true + if [[ -x "$DART" ]]; then + DART_SDK="${DART/dart-sdk\/*/dart-sdk}" + if [[ ! -e "$DART_SDK" ]]; then + unset DART DART_SDK + fi + fi + fi + # Fallback: Assume it's alongside the current directory (e.g. Travis). + if [[ -z "$DART_SDK" ]]; then + DART_SDK="$(pwd)/dart-sdk" + fi + + : "${DART:=$DART_SDK/bin/dart}" + + if [[ ! -x "$DART" ]]; then + echo Unable to locate the dart binary / SDK. Exiting >&2 + exit 3 + fi + + if [[ -z "$DARTIUM" ]]; then + dartiumRoot="$DART_SDK/../chromium" + if [[ -e "$dartiumRoot" ]]; then + case "$PLATFORM" in + (Linux) export DARTIUM="$dartiumRoot/chrome" ;; + (Darwin) export DARTIUM="$dartiumRoot/Chromium.app/Contents/MacOS/Chromium" ;; + (*) echo Unsupported platform $PLATFORM. Exiting ... >&2 ; exit 3 ;; + esac + fi + fi + + export DART_SDK export DARTSDK - export DART=${DART:-"$DARTSDK/bin/dart"} - export PUB=${PUB:-"$DARTSDK/bin/pub"} - export DARTANALYZER=${DARTANALYZER:-"$DARTSDK/bin/dartanalyzer"} - export DARTDOC=${DARTDOC:-"$DARTSDK/bin/dartdoc"} - export DART_DOCGEN=${DART_DOCGEN:-"$DARTSDK/bin/docgen"} + export DART + export PUB=${PUB:-"$DART_SDK/bin/pub"} + export DARTANALYZER=${DARTANALYZER:-"$DART_SDK/bin/dartanalyzer"} + export DARTDOC=${DARTDOC:-"$DART_SDK/bin/dartdoc"} + export DART_DOCGEN=${DART_DOCGEN:-"$DART_SDK/bin/docgen"} export DART_VM_OPTIONS="--old_gen_heap_size=2048" export DARTIUM_BIN=${DARTIUM_BIN:-"$DARTIUM"} export CHROME_BIN=${CHROME_BIN:-"google-chrome"} - export PATH=$PATH:$DARTSDK/bin + export PATH=$PATH:$DART_SDK/bin echo '*********' echo '** ENV **' @@ -66,4 +94,4 @@ if [[ -z $ENV_SET ]]; then echo NGDART_SCRIPT_DIR=$NGDART_SCRIPT_DIR $DART --version 2>&1 -fi \ No newline at end of file +fi diff --git a/scripts/generate-documentation.sh b/scripts/generate-documentation.sh index ffcee0301..63d161486 100755 --- a/scripts/generate-documentation.sh +++ b/scripts/generate-documentation.sh @@ -54,7 +54,7 @@ fi; # Create a version file from the current build version doc_version=`head CHANGELOG.md | awk 'NR==2' | sed 's/^# //'` -dartsdk_version=`cat $DARTSDK/version` +dartsdk_version=`cat $DART_SDK/version` head_sha=`git rev-parse --short HEAD` echo $doc_version at $head_sha \(with Dart SDK $dartsdk_version\) > docs/VERSION diff --git a/scripts/travis/install.sh b/scripts/travis/install.sh index 70817d405..9a12f3e83 100755 --- a/scripts/travis/install.sh +++ b/scripts/travis/install.sh @@ -16,6 +16,5 @@ if [[ $BROWSERS =~ "dartium" ]]; then unzip dartium.zip > /dev/null rm -rf dartium rm dartium.zip - mv dartium-* dartium + mv dartium-* chromium fi - From 0ba335d4b5cd9cb7008f9ff1b0f1028db65adadc Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Mon, 30 Jun 2014 15:40:31 -0700 Subject: [PATCH 5/7] chore(pubspec): require newer protractor to support dart 1.6.0-dev.0.0 --- example/pubspec.lock | 6 +++--- pubspec.lock | 2 +- pubspec.yaml | 2 +- test_e2e/pubspec.yaml | 2 +- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/example/pubspec.lock b/example/pubspec.lock index 0f7d672c3..0e0236b9e 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -34,7 +34,7 @@ packages: di: description: di source: hosted - version: "0.0.40" + version: "1.1.0" html5lib: description: html5lib source: hosted @@ -58,7 +58,7 @@ packages: path: description: path source: hosted - version: "1.1.0" + version: "1.2.1" perf_api: description: perf_api source: hosted @@ -66,7 +66,7 @@ packages: route_hierarchical: description: route_hierarchical source: hosted - version: "0.4.20" + version: "0.4.21" source_maps: description: source_maps source: hosted diff --git a/pubspec.lock b/pubspec.lock index 991e2aa6e..23a34ef8d 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -72,7 +72,7 @@ packages: protractor: description: protractor source: hosted - version: "0.0.2" + version: "0.0.3" route_hierarchical: description: route_hierarchical source: hosted diff --git a/pubspec.yaml b/pubspec.yaml index 8b791b425..c5ad78009 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -29,5 +29,5 @@ dev_dependencies: benchmark_harness: '>=1.0.0' guinness: '>=0.1.3 <0.2.0' mock: '>=0.10.0 <0.12.0' - protractor: '0.0.2' + protractor: '0.0.4' unittest: '>=0.10.1 <0.12.0' diff --git a/test_e2e/pubspec.yaml b/test_e2e/pubspec.yaml index 152dc75ea..9d2f98f4c 100644 --- a/test_e2e/pubspec.yaml +++ b/test_e2e/pubspec.yaml @@ -7,4 +7,4 @@ environment: sdk: '>=1.3.0' dependencies: js: '>=0.2.0 <0.3.0' - protractor: '0.0.2' + protractor: '0.0.4' From 0cc75be89adc04f53378b1ec85d399489aa0cba6 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Wed, 9 Jul 2014 23:22:33 -0700 Subject: [PATCH 6/7] test(introspection): work around issue 1219 Ref: #1219 --- test/introspection_spec.dart | 125 ++++++++++++++++++----------------- 1 file changed, 64 insertions(+), 61 deletions(-) diff --git a/test/introspection_spec.dart b/test/introspection_spec.dart index 246ce16c7..67dcaf27c 100644 --- a/test/introspection_spec.dart +++ b/test/introspection_spec.dart @@ -89,76 +89,79 @@ void main() { expect(js.context['ngProbe'].apply([ngtop])).toBeDefined(); }); - describe(r'testability', () { - var testability; + // Issue #1219 + if (identical(1, 1.0) || !js.context['DART_VERSION'].toString().contains("version: 1.5.")) { + describe(r'testability', () { + var testability; - beforeEach(() { - testability = angular['getTestability'].apply([ngtop]); - }); + beforeEach(() { + testability = angular['getTestability'].apply([ngtop]); + }); - it('should be available from Javascript', () { - expect(testability).toBeDefined(); - }); + it('should be available from Javascript', () { + expect(testability).toBeDefined(); + }); - it('should expose allowAnimations', () { - allowAnimations(allowed) => testability['allowAnimations'].apply([allowed]); - expect(allowAnimations(false)).toEqual(true); - expect(allowAnimations(false)).toEqual(false); - expect(allowAnimations(true)).toEqual(false); - expect(allowAnimations(true)).toEqual(true); - }); + it('should expose allowAnimations', () { + allowAnimations(allowed) => testability['allowAnimations'].apply([allowed]); + expect(allowAnimations(false)).toEqual(true); + expect(allowAnimations(false)).toEqual(false); + expect(allowAnimations(true)).toEqual(false); + expect(allowAnimations(true)).toEqual(true); + }); + + describe('bindings', () { + it('should find exact bindings', () { + // exactMatch should fail. + var bindingNodes = testability['findBindings'].apply(['introspection', true]); + expect(bindingNodes.length).toEqual(0); + + // substring search (default) should succeed. + // exactMatch should default to false. + bindingNodes = testability['findBindings'].apply(['introspection']); + expect(bindingNodes.length).toEqual(1); + bindingNodes = testability['findBindings'].apply(['introspection', false]); + expect(bindingNodes.length).toEqual(1); + + // and so should exact search with the correct query. + bindingNodes = testability['findBindings'].apply(["'introspection FTW'", true]); + expect(bindingNodes.length).toEqual(1); + }); + + _assertBinding(String query) { + var bindingNodes = testability['findBindings'].apply([query]); + expect(bindingNodes.length).toEqual(1); + var node = bindingNodes[0]; + var probe = js.context['ngProbe'].apply([node]); + expect(probe).toBeDefined(); + var bindings = probe['bindings']; + expect(bindings['length']).toEqual(1); + expect(bindings[0].contains(query)).toBe(true); + } + + it('should find ng-bind bindings', () => _assertBinding('introspection FTW')); + it('should find attribute mustache bindings', () => _assertBinding('attrMustache')); + it('should find text mustache bindings', () => _assertBinding('textMustache')); + }); - describe('bindings', () { - it('should find exact bindings', () { + it('should find models', () { // exactMatch should fail. - var bindingNodes = testability['findBindings'].apply(['introspection', true]); - expect(bindingNodes.length).toEqual(0); + var modelNodes = testability['findModels'].apply(['my', true]); + expect(modelNodes.length).toEqual(0); // substring search (default) should succeed. - // exactMatch should default to false. - bindingNodes = testability['findBindings'].apply(['introspection']); - expect(bindingNodes.length).toEqual(1); - bindingNodes = testability['findBindings'].apply(['introspection', false]); - expect(bindingNodes.length).toEqual(1); - - // and so should exact search with the correct query. - bindingNodes = testability['findBindings'].apply(["'introspection FTW'", true]); - expect(bindingNodes.length).toEqual(1); - }); - - _assertBinding(String query) { - var bindingNodes = testability['findBindings'].apply([query]); - expect(bindingNodes.length).toEqual(1); - var node = bindingNodes[0]; - var probe = js.context['ngProbe'].apply([node]); + modelNodes = testability['findModels'].apply(['my']); + expect(modelNodes.length).toEqual(1); + var divElement = modelNodes[0]; + expect(divElement is DivElement).toEqual(true); + var probe = js.context['ngProbe'].apply([divElement]); expect(probe).toBeDefined(); - var bindings = probe['bindings']; - expect(bindings['length']).toEqual(1); - expect(bindings[0].contains(query)).toBe(true); - } - - it('should find ng-bind bindings', () => _assertBinding('introspection FTW')); - it('should find attribute mustache bindings', () => _assertBinding('attrMustache')); - it('should find text mustache bindings', () => _assertBinding('textMustache')); - }); - - it('should find models', () { - // exactMatch should fail. - var modelNodes = testability['findModels'].apply(['my', true]); - expect(modelNodes.length).toEqual(0); - - // substring search (default) should succeed. - modelNodes = testability['findModels'].apply(['my']); - expect(modelNodes.length).toEqual(1); - var divElement = modelNodes[0]; - expect(divElement is DivElement).toEqual(true); - var probe = js.context['ngProbe'].apply([divElement]); - expect(probe).toBeDefined(); - var models = probe['models']; - expect(models['length']).toEqual(1); - expect(models[0]).toEqual('myModel'); + var models = probe['models']; + expect(models['length']).toEqual(1); + expect(models[0]).toEqual('myModel'); + }); }); - }); + } }); }); } From d22cd05e156fac520c03cef312aafe38ebfb8ec6 Mon Sep 17 00:00:00 2001 From: Chirayu Krishnappa Date: Thu, 10 Jul 2014 01:07:43 -0700 Subject: [PATCH 7/7] chore(e2e): disable slow tests - Increase timeout for tests. - Disable 2 slow tests that typically time out on Travis with Sauce. --- test_e2e/animation_ng_repeat_spec.dart | 3 ++- test_e2e/examplesConf.js | 4 +--- test_e2e/todo_spec.dart | 3 ++- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/test_e2e/animation_ng_repeat_spec.dart b/test_e2e/animation_ng_repeat_spec.dart index 07b53fb4f..51064160b 100644 --- a/test_e2e/animation_ng_repeat_spec.dart +++ b/test_e2e/animation_ng_repeat_spec.dart @@ -78,7 +78,8 @@ animation_ng_repeat_spec() { S.assertState(); }); - it('should add things with monotonically increasing numbers', () { + // TODO(chirayu): Disabled because this times out on Travis + SauceLabs. + xit('should add things with monotonically increasing numbers', () { S.addThing(); S.addThing(); S.removeThing(); S.addThing(); S.addThing(); S.removeThing(); S.addThing(); diff --git a/test_e2e/examplesConf.js b/test_e2e/examplesConf.js index 6580fdc5a..b295e0b51 100644 --- a/test_e2e/examplesConf.js +++ b/test_e2e/examplesConf.js @@ -35,7 +35,7 @@ var config = { isVerbose: true, // display spec names. showColors: true, // print colors to the terminal. includeStackTrace: true, // include stack traces in failures. - defaultTimeoutInterval: 40000 // wait time in ms before failing a test. + defaultTimeoutInterval: 80000 // wait time in ms before failing a test. }, }; @@ -49,8 +49,6 @@ if (process.env.SAUCE_USERNAME != null) { capability['tunnel-identifier'] = process.env.TRAVIS_JOB_NUMBER; capability['build'] = process.env.TRAVIS_BUILD_NUMBER; capability['name'] = 'AngularDart E2E Suite'; - // Double the timeout for Sauce. - capability['defaultTimeoutInterval'] *= 2; }); } diff --git a/test_e2e/todo_spec.dart b/test_e2e/todo_spec.dart index 7f54f9d6e..583fabcd6 100644 --- a/test_e2e/todo_spec.dart +++ b/test_e2e/todo_spec.dart @@ -120,7 +120,8 @@ main() { S.assertTodos(); }); - it('should add a new item and clear the input field', () { + // TODO(chirayu): Disabled because this times out on Travis + SauceLabs. + xit('should add a new item and clear the input field', () { var text = 'Test using Protractor'; S.newItemInput.sendKeys(text); S.addBtn.click();