From 945056b1667a69ecc4d557cc0f03894597250ced Mon Sep 17 00:00:00 2001 From: Igor Minar Date: Fri, 25 Feb 2011 14:03:02 -0800 Subject: linking function should return bound scope angular.compile()() returns {scope:scope, view:view}, this isn't useful at all and only makes tests more verbose. Instead, this change makes the linking function return scope directly and if anyone needs the linked dom there are two ways to do it documented in angular.compile. other changes: - moved angular.compile docs to the compiler so that they are closer to the compiler - fixed some typos and updated angular.compile docs with the new return value --- docs/guide.bootstrap.ngdoc | 2 +- src/Angular.js | 50 +--- src/Compiler.js | 74 +++++- test/AngularSpec.js | 46 ++-- test/BinderSpec.js | 466 ++++++++++++++++++------------------- test/CompilerSpec.js | 12 +- test/ResourceSpec.js | 4 +- test/ScenarioSpec.js | 12 +- test/ValidatorsSpec.js | 8 +- test/directivesSpec.js | 2 +- test/markupSpec.js | 2 +- test/service/invalidWidgetsSpec.js | 2 +- test/service/routeSpec.js | 2 +- test/widgetsSpec.js | 16 +- 14 files changed, 362 insertions(+), 336 deletions(-) diff --git a/docs/guide.bootstrap.ngdoc b/docs/guide.bootstrap.ngdoc index 835fe494..fd35b641 100644 --- a/docs/guide.bootstrap.ngdoc +++ b/docs/guide.bootstrap.ngdoc @@ -50,7 +50,7 @@ equivalent to the code in the previous section. (function(window, previousOnLoad){ window.onload = function(){ try { (previousOnLoad||angular.noop)(); } catch(e) {} - angular.compile(window.document).$init(); + angular.compile(window.document)(); }; })(window, window.onload); diff --git a/src/Angular.js b/src/Angular.js index 05b9989e..e47931ba 100644 --- a/src/Angular.js +++ b/src/Angular.js @@ -774,55 +774,7 @@ function merge(src, dst) { } -/** - * @workInProgress - * @ngdoc function - * @name angular.compile - * @function - * - * @description - * Compiles a piece of HTML string or DOM into a view and produces a linking function, which can - * then be used to link {@link angular.scope scope} and the template together. The compilation - * process walks the DOM tree and tries to match DOM elements to {@link angular.markup markup}, - * {@link angular.attrMarkup attrMarkup}, {@link angular.widget widgets}, and - * {@link angular.directive directives}. For each match it executes coresponding markup, \ - * attrMarkup, widget or directive template function and collects the instance functions into a - * single linking function which is then returned. The linking function can then be used - * many-times-over on clones of compiled DOM structure, (For example when compiling - * {@link angular.widget.@ng:repeat repeater} the resulting linking function is called once for - * each item in the collection. The `ng:repeat` does this by cloning the template DOM once for - * each item in collection and then calling the linking function to link the cloned template - * with the a new scope for each item in the collection.) - * - 
-    var mvc1 = angular.compile(window.document)();
-    mvc1.view; // compiled view elment
-    mvc1.scope; // scope bound to the element
-
-    var mvc2 = angular.compile('
click me
')();
-
- * - * @param {string|DOMElement} element Element or HTML to compile into a template function. - * @returns {function([scope][, cloneAttachFn])} a template function which is used to bind element - * and scope. Where: - * - * * `scope` - {@link angular.scope scope} A scope to bind to. If none specified, then a new - * root scope is created. - * * `cloneAttachFn` - If `cloneAttachFn` is provided, then the link function will clone the - * `template` and call the `cloneAttachFn` allowing the caller to attach the - * clonned elements to the DOM at the approriate place. The `cloneAttachFn` is - * called as:
`cloneAttachFn(clonedElement, scope)`: - * - * * `clonedElement` - is a clone of the originale `element` passed into the compiler. - * * `scope` - is the current scope with which the linking function is working with. - * - * Calling the template function returns object: `{scope:?, view:?}`, where: - * - * * `view` - the DOM element which represents the compiled template. Either same or clone of - * `element` specifed in compile or template function. - * * `scope` - scope to which the element is bound to. Either a root scope or scope specified - * in the template function. - */ +/** @name angular.compile */ function compile(element) { return new Compiler(angularTextMarkup, angularAttrMarkup, angularDirective, angularWidget) .compile(element); diff --git a/src/Compiler.js b/src/Compiler.js index ae7bf83c..4be7e116 100644 --- a/src/Compiler.js +++ b/src/Compiler.js @@ -71,6 +71,76 @@ Template.prototype = { /////////////////////////////////// //Compiler ////////////////////////////////// + +/** + * @workInProgress + * @ngdoc function + * @name angular.compile + * @function + * + * @description + * Compiles a piece of HTML string or DOM into a view and produces a linking function, which can + * then be used to link {@link angular.scope scope} and the template together. The compilation + * process walks the DOM tree and tries to match DOM elements to {@link angular.markup markup}, + * {@link angular.attrMarkup attrMarkup}, {@link angular.widget widgets}, and + * {@link angular.directive directives}. For each match it executes coresponding markup, \ + * attrMarkup, widget or directive template function and collects the instance functions into a + * single linking function which is then returned. The linking function can then be used + * many-times-over on clones of compiled DOM structure, (For example when compiling + * {@link angular.widget.@ng:repeat repeater} the resulting linking function is called once for + * each item in the collection. The `ng:repeat` does this by cloning the template DOM once for + * each item in collection and then calling the linking function to link the cloned template + * with the a new scope for each item in the collection.) + * + 
+    var mvc1 = angular.compile(window.document)();
+    mvc1.view; // compiled view elment
+    mvc1.scope; // scope bound to the element
+
+    var mvc2 = angular.compile('
click me
')();
+
+ * + * @param {string|DOMElement} element Element or HTML to compile into a template function. + * @returns {function([scope][, cloneAttachFn])} a template function which is used to bind element + * and scope. Where: + * + * * `scope` - {@link angular.scope scope} A scope to bind to. If none specified, then a new + * root scope is created. + * * `cloneAttachFn` - If `cloneAttachFn` is provided, then the link function will clone the + * `template` and call the `cloneAttachFn` function allowing the caller to attach the + * cloned elements to the DOM document at the approriate place. The `cloneAttachFn` is + * called as:
`cloneAttachFn(clonedElement, scope)`: + * + * * `clonedElement` - is a clone of the original `element` passed into the compiler. + * * `scope` - is the current scope with which the linking function is working with. + * + * Calling the template function returns the scope to which the element is bound to. It is either + * a new root scope or scope passed into the template function. + * + * If you need access to the compiled view, there are two ways to do it: + * + * - either create the DOM element(s) before you send them to the compiler and keep this reference + * around. This works if you don't need the element to be cloned by the link function. + * 
+ *     var view = angular.element('
{{total}}
'),
+ *         scope = angular.compile(view)();
+ *
+ * - if on the other hand, you need the element to be cloned, the view reference from the original + * example would not point to the clone, but rather to the dom that is cloned. In this case, + * you can access the clone via the cloneAttachFn: + * 
+ *     var original = angular.element('
{{total}}
'),
+ *         scope = someParentScope.$new(),
+ *         clone;
+ *
+ *     angular.compile(original)(scope, function(clonedElement, scope) {
+ *       clone = clonedElement;
+ *       //attach the clone to DOM document at the right place
+ *     });
+ *
+ *     //now we have reference to the cloned DOM via `clone`
+ *
+ */ function Compiler(markup, attrMarkup, directives, widgets){ this.markup = markup; this.attrMarkup = attrMarkup; @@ -97,7 +167,7 @@ Compiler.prototype = { // important!!: we must call our jqLite.clone() since the jQuery one is trying to be smart // and sometimes changes the structure of the DOM. var element = cloneConnectFn - ? JQLitePrototype.clone.call(templateElement) // IMPORTAN!!! + ? JQLitePrototype.clone.call(templateElement) // IMPORTANT!!! : templateElement; scope = scope || createScope(); element.data($$scope, scope); @@ -105,7 +175,7 @@ Compiler.prototype = { (cloneConnectFn||noop)(element, scope); template.attach(element, scope); scope.$eval(); - return {scope:scope, view:element}; + return scope; }; }, diff --git a/test/AngularSpec.js b/test/AngularSpec.js index 5b7e33fd..2352cdf8 100644 --- a/test/AngularSpec.js +++ b/test/AngularSpec.js @@ -369,45 +369,51 @@ describe('angular', function(){ }); describe('compile', function(){ - var mvc; + var scope, template; + afterEach(function(){ - dealoc(mvc.view); + dealoc(scope); }); it('should link to existing node and create scope', function(){ - mvc = angular.compile('
{{greeting = "hello world"}}
')(); - expect(mvc.view.text()).toEqual('hello world'); - expect(mvc.scope.greeting).toEqual('hello world'); + template = angular.element('
{{greeting = "hello world"}}
'); + scope = angular.compile(template)(); + expect(template.text()).toEqual('hello world'); + expect(scope.greeting).toEqual('hello world'); }); it('should link to existing node and given scope', function(){ - var scope = angular.scope(); - mvc = angular.compile('
{{greeting = "hello world"}}
')(scope); - expect(mvc.view.text()).toEqual('hello world'); - expect(mvc.scope).toEqual(scope); + scope = angular.scope(); + template = angular.element('
{{greeting = "hello world"}}
'); + angular.compile(template)(scope); + expect(template.text()).toEqual('hello world'); + expect(scope).toEqual(scope); }); it('should link to new node and given scope', function(){ - var scope = angular.scope(); - var template = jqLite('
{{greeting = "hello world"}}
'); + scope = angular.scope(); + template = jqLite('
{{greeting = "hello world"}}
'); + var templateFn = angular.compile(template); var templateClone = template.clone(); - mvc = templateFn(scope, function(clone){ + + templateFn(scope, function(clone){ templateClone = clone; }); + expect(template.text()).toEqual(''); - expect(mvc.view.text()).toEqual('hello world'); - expect(mvc.view).toEqual(templateClone); - expect(mvc.scope.greeting).toEqual('hello world'); + expect(scope.$element.text()).toEqual('hello world'); + expect(scope.$element).toEqual(templateClone); + expect(scope.greeting).toEqual('hello world'); }); it('should link to cloned node and create scope', function(){ - var scope = angular.scope(); - var template = jqLite('
{{greeting = "hello world"}}
'); - mvc = angular.compile(template)(scope, noop); + scope = angular.scope(); + template = jqLite('
{{greeting = "hello world"}}
'); + angular.compile(template)(scope, noop); expect(template.text()).toEqual(''); - expect(mvc.view.text()).toEqual('hello world'); - expect(mvc.scope.greeting).toEqual('hello world'); + expect(scope.$element.text()).toEqual('hello world'); + expect(scope.greeting).toEqual('hello world'); }); }); }); diff --git a/test/BinderSpec.js b/test/BinderSpec.js index 80a950b0..e78980d7 100644 --- a/test/BinderSpec.js +++ b/test/BinderSpec.js @@ -16,7 +16,7 @@ describe('Binder', function(){ return angular.compile(element)(); }; this.compileToHtml = function (content) { - return sortedHtml(this.compile(content).view); + return sortedHtml(this.compile(content).$element); }; }); @@ -28,69 +28,69 @@ describe('Binder', function(){ it('text-field should default to value attribute', function(){ - var state = this.compile(''); - state.scope.$eval(); - assertEquals('abc', state.scope.model.price); + var scope = this.compile(''); + scope.$eval(); + assertEquals('abc', scope.model.price); }); it('ChangingTextareaUpdatesModel', function(){ - var c = this.compile(''); - c.scope.$eval(); - assertEquals(c.scope.model.note, 'abc'); + var scope = this.compile(''); + scope.$eval(); + assertEquals(scope.model.note, 'abc'); }); it('ChangingRadioUpdatesModel', function(){ - var c = this.compile('' + + var scope = this.compile('' + ''); - c.scope.$eval(); - assertEquals(c.scope.model.price, 'A'); + scope.$eval(); + assertEquals(scope.model.price, 'A'); }); it('ChangingCheckboxUpdatesModel', function(){ - var form = this.compile(''); - assertEquals(true, form.scope.model.price); + var scope = this.compile(''); + assertEquals(true, scope.model.price); }); it('BindUpdate', function(){ - var c = this.compile('
'); - assertEquals(123, c.scope.$get('a')); + var scope = this.compile('
'); + assertEquals(123, scope.$get('a')); }); it('ChangingSelectNonSelectedUpdatesModel', function(){ - var form = this.compile(''); - assertEquals('A', form.scope.model.price); + var scope = this.compile(''); + assertEquals('A', scope.model.price); }); it('ChangingMultiselectUpdatesModel', function(){ - var form = this.compile('' + '' + '' + '' + ''); - assertJsonEquals(["A", "B"], form.scope.$get('Invoice').options); + assertJsonEquals(["A", "B"], scope.$get('Invoice').options); }); it('ChangingSelectSelectedUpdatesModel', function(){ - var form = this.compile(''); - assertEquals(form.scope.model.price, 'b'); + var scope = this.compile(''); + assertEquals(scope.model.price, 'b'); }); it('ExecuteInitialization', function(){ - var c = this.compile('
'); - assertEquals(c.scope.$get('a'), 123); + var scope = this.compile('
'); + assertEquals(scope.$get('a'), 123); }); it('ExecuteInitializationStatements', function(){ - var c = this.compile('
'); - assertEquals(c.scope.$get('a'), 123); - assertEquals(c.scope.$get('b'), 345); + var scope = this.compile('
'); + assertEquals(scope.$get('a'), 123); + assertEquals(scope.$get('b'), 345); }); it('ApplyTextBindings', function(){ - var form = this.compile('
x
'); - form.scope.$set('model', {a:123}); - form.scope.$eval(); - assertEquals('123', form.view.text()); + var scope = this.compile('
x
'); + scope.$set('model', {a:123}); + scope.$eval(); + assertEquals('123', scope.$element.text()); }); it('ReplaceBindingInTextWithSpan', function(){ @@ -112,82 +112,81 @@ describe('Binder', function(){ }); it('BindingOfAttributes', function(){ - var c = this.compile(""); - var attrbinding = c.view.attr("ng:bind-attr"); + var scope = this.compile(""); + var attrbinding = scope.$element.attr("ng:bind-attr"); var bindings = fromJson(attrbinding); assertEquals("http://s/a{{b}}c", decodeURI(bindings.href)); assertTrue(!bindings.foo); }); it('MarkMultipleAttributes', function(){ - var c = this.compile(''); - var attrbinding = c.view.attr("ng:bind-attr"); + var scope = this.compile(''); + var attrbinding = scope.$element.attr("ng:bind-attr"); var bindings = fromJson(attrbinding); assertEquals(bindings.foo, "{{d}}"); assertEquals(decodeURI(bindings.href), "http://s/a{{b}}c"); }); it('AttributesNoneBound', function(){ - var c = this.compile(""); - var a = c.view; + var scope = this.compile(""); + var a = scope.$element; assertEquals(a[0].nodeName, "A"); assertTrue(!a.attr("ng:bind-attr")); }); it('ExistingAttrbindingIsAppended', function(){ - var c = this.compile(""); - var a = c.view; + var scope = this.compile(""); + var a = scope.$element; assertEquals('{"b":"{{def}}","href":"http://s/{{abc}}"}', a.attr('ng:bind-attr')); }); it('AttributesAreEvaluated', function(){ - var c = this.compile(''); - var binder = c.binder, form = c.view; - c.scope.$eval('a=1;b=2'); - c.scope.$eval(); - var a = c.view; + var scope = this.compile(''); + scope.$eval('a=1;b=2'); + scope.$eval(); + var a = scope.$element; assertEquals(a.attr('a'), 'a'); assertEquals(a.attr('b'), 'a+b=3'); }); it('InputTypeButtonActionExecutesInScope', function(){ var savedCalled = false; - var c = this.compile(''); - c.scope.$set("person.save", function(){ + var scope = this.compile(''); + scope.$set("person.save", function(){ savedCalled = true; }); - browserTrigger(c.view, 'click'); + browserTrigger(scope.$element, 'click'); assertTrue(savedCalled); }); it('InputTypeButtonActionExecutesInScope2', function(){ var log = ""; - var c = this.compile(''); - c.scope.$set("action", function(){ + var scope = this.compile(''); + scope.$set("action", function(){ log += 'click;'; }); expect(log).toEqual(''); - browserTrigger(c.view, 'click'); + browserTrigger(scope.$element, 'click'); expect(log).toEqual('click;'); }); it('ButtonElementActionExecutesInScope', function(){ var savedCalled = false; - var c = this.compile(''); - c.scope.$set("person.save", function(){ + var scope = this.compile(''); + scope.$set("person.save", function(){ savedCalled = true; }); - browserTrigger(c.view, 'click'); + browserTrigger(scope.$element, 'click'); assertTrue(savedCalled); }); it('RepeaterUpdateBindings', function(){ - var a = this.compile('
'); - var form = a.view; + var scope = this.compile('
'); + var form = scope.$element; var items = [{a:"A"}, {a:"B"}]; - a.scope.$set('model', {items:items}); + scope.$set('model', {items:items}); - a.scope.$eval(); + scope.$eval(); assertEquals('
    ' + '<#comment>' + '
  • A
    • ' + @@ -195,7 +194,7 @@ describe('Binder', function(){ '
', sortedHtml(form)); items.unshift({a:'C'}); - a.scope.$eval(); + scope.$eval(); assertEquals('
    ' + '<#comment>' + '
  • C
    • ' + @@ -204,7 +203,7 @@ describe('Binder', function(){ '
', sortedHtml(form)); items.shift(); - a.scope.$eval(); + scope.$eval(); assertEquals('
    ' + '<#comment>' + '
  • A
    • ' + @@ -213,17 +212,17 @@ describe('Binder', function(){ items.shift(); items.shift(); - a.scope.$eval(); + scope.$eval(); }); it('RepeaterContentDoesNotBind', function(){ - var a = this.compile('
    '); - a.scope.$set('model', {items:[{a:"A"}]}); - a.scope.$eval(); + var scope = this.compile('
    '); + scope.$set('model', {items:[{a:"A"}]}); + scope.$eval(); assertEquals('
      ' + '<#comment>' + '
    • A
      • ' + - '
    ', sortedHtml(a.view)); + '
', sortedHtml(scope.$element)); }); it('DoNotOverwriteCustomAction', function(){ @@ -232,61 +231,60 @@ describe('Binder', function(){ }); it('RepeaterAdd', function(){ - var c = this.compile('
'); - var doc = c.view; - c.scope.$set('items', [{x:'a'}, {x:'b'}]); - c.scope.$eval(); - var first = childNode(c.view, 1); - var second = childNode(c.view, 2); + var scope = this.compile('
'); + scope.$set('items', [{x:'a'}, {x:'b'}]); + scope.$eval(); + var first = childNode(scope.$element, 1); + var second = childNode(scope.$element, 2); assertEquals('a', first.val()); assertEquals('b', second.val()); first.val('ABC'); browserTrigger(first, 'keydown'); - c.scope.$service('$browser').defer.flush(); - assertEquals(c.scope.items[0].x, 'ABC'); + scope.$service('$browser').defer.flush(); + assertEquals(scope.items[0].x, 'ABC'); }); it('ItShouldRemoveExtraChildrenWhenIteratingOverHash', function(){ - var c = this.compile('
{{i}}
'); + var scope = this.compile('
{{i}}
'); var items = {}; - c.scope.$set("items", items); + scope.$set("items", items); - c.scope.$eval(); - expect(c.view[0].childNodes.length - 1).toEqual(0); + scope.$eval(); + expect(scope.$element[0].childNodes.length - 1).toEqual(0); items.name = "misko"; - c.scope.$eval(); - expect(c.view[0].childNodes.length - 1).toEqual(1); + scope.$eval(); + expect(scope.$element[0].childNodes.length - 1).toEqual(1); delete items.name; - c.scope.$eval(); - expect(c.view[0].childNodes.length - 1).toEqual(0); + scope.$eval(); + expect(scope.$element[0].childNodes.length - 1).toEqual(0); }); it('IfTextBindingThrowsErrorDecorateTheSpan', function(){ - var a = this.compile('
{{error.throw()}}
'); - var doc = a.view; - var errorLogs = a.scope.$service('$log').error.logs; + var scope = this.compile('
{{error.throw()}}
'); + var doc = scope.$element; + var errorLogs = scope.$service('$log').error.logs; - a.scope.$set('error.throw', function(){throw "ErrorMsg1";}); - a.scope.$eval(); + scope.$set('error.throw', function(){throw "ErrorMsg1";}); + scope.$eval(); var span = childNode(doc, 0); assertTrue(span.hasClass('ng-exception')); assertTrue(!!span.text().match(/ErrorMsg1/)); assertTrue(!!span.attr('ng-exception').match(/ErrorMsg1/)); assertEquals(['ErrorMsg1'], errorLogs.shift()); - a.scope.$set('error.throw', function(){throw "MyError";}); - a.scope.$eval(); + scope.$set('error.throw', function(){throw "MyError";}); + scope.$eval(); span = childNode(doc, 0); assertTrue(span.hasClass('ng-exception')); assertTrue(span.text(), span.text().match('MyError') !== null); assertEquals('MyError', span.attr('ng-exception')); assertEquals(['MyError'], errorLogs.shift()); - a.scope.$set('error.throw', function(){return "ok";}); - a.scope.$eval(); + scope.$set('error.throw', function(){return "ok";}); + scope.$eval(); assertFalse(span.hasClass('ng-exception')); assertEquals('ok', span.text()); assertEquals(null, span.attr('ng-exception')); @@ -294,19 +292,19 @@ describe('Binder', function(){ }); it('IfAttrBindingThrowsErrorDecorateTheAttribute', function(){ - var a = this.compile('
'); - var doc = a.view; - var errorLogs = a.scope.$service('$log').error.logs; + var scope = this.compile('
'); + var doc = scope.$element; + var errorLogs = scope.$service('$log').error.logs; - a.scope.$set('error.throw', function(){throw "ErrorMsg";}); - a.scope.$eval(); + scope.$set('error.throw', function(){throw "ErrorMsg";}); + scope.$eval(); assertTrue('ng-exception', doc.hasClass('ng-exception')); assertEquals('"ErrorMsg"', doc.attr('ng-exception')); assertEquals('before "ErrorMsg" after', doc.attr('attr')); assertEquals(['ErrorMsg'], errorLogs.shift()); - a.scope.$set('error.throw', function(){ return 'X';}); - a.scope.$eval(); + scope.$set('error.throw', function(){ return 'X';}); + scope.$eval(); assertFalse('!ng-exception', doc.hasClass('ng-exception')); assertEquals('before X after', doc.attr('attr')); assertEquals(null, doc.attr('ng-exception')); @@ -314,12 +312,12 @@ describe('Binder', function(){ }); it('NestedRepeater', function(){ - var a = this.compile('
' + + var scope = this.compile('
' + '
    ' + '
    '); - a.scope.$set('model', [{name:'a', item:['a1', 'a2']}, {name:'b', item:['b1', 'b2']}]); - a.scope.$eval(); + scope.$set('model', [{name:'a', item:['a1', 'a2']}, {name:'b', item:['b1', 'b2']}]); + scope.$eval(); assertEquals('
    '+ '<#comment>'+ @@ -332,121 +330,121 @@ describe('Binder', function(){ '<#comment>'+ '
      '+ '
        '+ - '
        ', sortedHtml(a.view)); + '
        ', sortedHtml(scope.$element)); }); it('HideBindingExpression', function(){ - var a = this.compile('
        '); + var scope = this.compile('
        '); - a.scope.$set('hidden', 3); - a.scope.$eval(); + scope.$set('hidden', 3); + scope.$eval(); - assertHidden(a.view); + assertHidden(scope.$element); - a.scope.$set('hidden', 2); - a.scope.$eval(); + scope.$set('hidden', 2); + scope.$eval(); - assertVisible(a.view); + assertVisible(scope.$element); }); it('HideBinding', function(){ - var c = this.compile('
        '); + var scope = this.compile('
        '); - c.scope.$set('hidden', 'true'); - c.scope.$eval(); + scope.$set('hidden', 'true'); + scope.$eval(); - assertHidden(c.view); + assertHidden(scope.$element); - c.scope.$set('hidden', 'false'); - c.scope.$eval(); + scope.$set('hidden', 'false'); + scope.$eval(); - assertVisible(c.view); + assertVisible(scope.$element); - c.scope.$set('hidden', ''); - c.scope.$eval(); + scope.$set('hidden', ''); + scope.$eval(); - assertVisible(c.view); + assertVisible(scope.$element); }); it('ShowBinding', function(){ - var c = this.compile('
        '); + var scope = this.compile('
        '); - c.scope.$set('show', 'true'); - c.scope.$eval(); + scope.$set('show', 'true'); + scope.$eval(); - assertVisible(c.view); + assertVisible(scope.$element); - c.scope.$set('show', 'false'); - c.scope.$eval(); + scope.$set('show', 'false'); + scope.$eval(); - assertHidden(c.view); + assertHidden(scope.$element); - c.scope.$set('show', ''); - c.scope.$eval(); + scope.$set('show', ''); + scope.$eval(); - assertHidden(c.view); + assertHidden(scope.$element); }); it('BindClassUndefined', function(){ - var doc = this.compile('
        '); - doc.scope.$eval(); + var scope = this.compile('
        '); + scope.$eval(); assertEquals( '
        ', - sortedHtml(doc.view)); + sortedHtml(scope.$element)); }); it('BindClass', function(){ - var c = this.compile('
        '); + var scope = this.compile('
        '); - c.scope.$set('class', 'testClass'); - c.scope.$eval(); + scope.$set('class', 'testClass'); + scope.$eval(); - assertEquals('
        ', sortedHtml(c.view)); + assertEquals('
        ', sortedHtml(scope.$element)); - c.scope.$set('class', ['a', 'b']); - c.scope.$eval(); + scope.$set('class', ['a', 'b']); + scope.$eval(); - assertEquals('
        ', sortedHtml(c.view)); + assertEquals('
        ', sortedHtml(scope.$element)); }); it('BindClassEvenOdd', function(){ - var x = this.compile('
        '); - x.scope.$eval(); - var d1 = jqLite(x.view[0].childNodes[1]); - var d2 = jqLite(x.view[0].childNodes[2]); + var scope = this.compile('
        '); + scope.$eval(); + var d1 = jqLite(scope.$element[0].childNodes[1]); + var d2 = jqLite(scope.$element[0].childNodes[2]); expect(d1.hasClass('o')).toBeTruthy(); expect(d2.hasClass('e')).toBeTruthy(); assertEquals( '
        <#comment>' + '
        ' + '
        ', - sortedHtml(x.view)); + sortedHtml(scope.$element)); }); it('BindStyle', function(){ - var c = this.compile('
        '); + var scope = this.compile('
        '); - c.scope.$eval('style={color:"red"}'); - c.scope.$eval(); + scope.$eval('style={color:"red"}'); + scope.$eval(); - assertEquals("red", c.view.css('color')); + assertEquals("red", scope.$element.css('color')); - c.scope.$eval('style={}'); - c.scope.$eval(); + scope.$eval('style={}'); + scope.$eval(); }); it('ActionOnAHrefThrowsError', function(){ - var c = this.compile('Add Phone'); - c.scope.action = function(){ + var scope = this.compile('Add Phone'); + scope.action = function(){ throw new Error('MyError'); }; - var input = c.view; + var input = scope.$element; browserTrigger(input, 'click'); var error = input.attr('ng-exception'); assertTrue(!!error.match(/MyError/)); assertTrue("should have an error class", input.hasClass('ng-exception')); - assertTrue(!!c.scope.$service('$log').error.logs.shift()[0].message.match(/MyError/)); + assertTrue(!!scope.$service('$log').error.logs.shift()[0].message.match(/MyError/)); // TODO: I think that exception should never get cleared so this portion of test makes no sense //c.scope.action = noop; @@ -456,48 +454,48 @@ describe('Binder', function(){ }); it('ShoulIgnoreVbNonBindable', function(){ - var c = this.compile("
        {{a}}" + + var scope = this.compile("
        {{a}}" + "
        {{a}}
        " + "
        {{b}}
        " + "
        {{c}}
        "); - c.scope.$set('a', 123); - c.scope.$eval(); - assertEquals('123{{a}}{{b}}{{c}}', c.view.text()); + scope.$set('a', 123); + scope.$eval(); + assertEquals('123{{a}}{{b}}{{c}}', scope.$element.text()); }); it('OptionShouldUpdateParentToGetProperBinding', function(){ - var c = this.compile(''); - c.scope.$set('s', 1); - c.scope.$eval(); - assertEquals(1, c.view[0].selectedIndex); + var scope = this.compile(''); + scope.$set('s', 1); + scope.$eval(); + assertEquals(1, scope.$element[0].selectedIndex); }); it('RepeaterShouldBindInputsDefaults', function () { - var c = this.compile('
        '); - c.scope.$set('items', [{}, {name:'misko'}]); - c.scope.$eval(); + var scope = this.compile('
        '); + scope.$set('items', [{}, {name:'misko'}]); + scope.$eval(); - assertEquals("123", c.scope.$eval('items[0].name')); - assertEquals("misko", c.scope.$eval('items[1].name')); + assertEquals("123", scope.$eval('items[0].name')); + assertEquals("misko", scope.$eval('items[1].name')); }); it('ShouldTemplateBindPreElements', function () { - var c = this.compile('
        Hello {{name}}!
        '); - c.scope.$set("name", "World"); - c.scope.$eval(); + var scope = this.compile('
        Hello {{name}}!
        '); + scope.$set("name", "World"); + scope.$eval(); - assertEquals('
        Hello World!
        ', sortedHtml(c.view)); + assertEquals('
        Hello World!
        ', sortedHtml(scope.$element)); }); it('FillInOptionValueWhenMissing', function(){ - var c = this.compile( + var scope = this.compile( ''); - c.scope.$set('a', 'A'); - c.scope.$set('b', 'B'); - c.scope.$eval(); - var optionA = childNode(c.view, 0); - var optionB = childNode(c.view, 1); - var optionC = childNode(c.view, 2); + scope.$set('a', 'A'); + scope.$set('b', 'B'); + scope.$eval(); + var optionA = childNode(scope.$element, 0); + var optionB = childNode(scope.$element, 1); + var optionC = childNode(scope.$element, 2); expect(optionA.attr('value')).toEqual('A'); expect(optionA.text()).toEqual('A'); @@ -510,54 +508,54 @@ describe('Binder', function(){ }); it('ValidateForm', function(){ - var c = this.compile('
        ' + + var scope = this.compile('
        ' + '
        ', jqLite(document.body)); var items = [{}, {}]; - c.scope.$set("items", items); - c.scope.$eval(); - assertEquals(3, c.scope.$service('$invalidWidgets').length); + scope.$set("items", items); + scope.$eval(); + assertEquals(3, scope.$service('$invalidWidgets').length); - c.scope.$set('name', ''); - c.scope.$eval(); - assertEquals(3, c.scope.$service('$invalidWidgets').length); + scope.$set('name', ''); + scope.$eval(); + assertEquals(3, scope.$service('$invalidWidgets').length); - c.scope.$set('name', ' '); - c.scope.$eval(); - assertEquals(3, c.scope.$service('$invalidWidgets').length); + scope.$set('name', ' '); + scope.$eval(); + assertEquals(3, scope.$service('$invalidWidgets').length); - c.scope.$set('name', 'abc'); - c.scope.$eval(); - assertEquals(2, c.scope.$service('$invalidWidgets').length); + scope.$set('name', 'abc'); + scope.$eval(); + assertEquals(2, scope.$service('$invalidWidgets').length); items[0].name = 'abc'; - c.scope.$eval(); - assertEquals(1, c.scope.$service('$invalidWidgets').length); + scope.$eval(); + assertEquals(1, scope.$service('$invalidWidgets').length); items[1].name = 'abc'; - c.scope.$eval(); - assertEquals(0, c.scope.$service('$invalidWidgets').length); + scope.$eval(); + assertEquals(0, scope.$service('$invalidWidgets').length); }); it('ValidateOnlyVisibleItems', function(){ - var c = this.compile('
        ', jqLite(document.body)); - c.scope.$set("show", true); - c.scope.$eval(); - assertEquals(2, c.scope.$service('$invalidWidgets').length); + var scope = this.compile('
        ', jqLite(document.body)); + scope.$set("show", true); + scope.$eval(); + assertEquals(2, scope.$service('$invalidWidgets').length); - c.scope.$set("show", false); - c.scope.$eval(); - assertEquals(1, c.scope.$service('$invalidWidgets').visible()); + scope.$set("show", false); + scope.$eval(); + assertEquals(1, scope.$service('$invalidWidgets').visible()); }); it('DeleteAttributeIfEvaluatesFalse', function(){ - var c = this.compile('
        ' + + var scope = this.compile('
        ' + '' + '' + '
        '); - c.scope.$eval(); + scope.$eval(); function assertChild(index, disabled) { - var child = childNode(c.view, index); + var child = childNode(scope.$element, index); assertEquals(sortedHtml(child), disabled, !!child.attr('disabled')); } @@ -570,15 +568,15 @@ describe('Binder', function(){ }); it('ItShouldDisplayErrorWhenActionIsSyntacticlyIncorrect', function(){ - var c = this.compile('
        ' + + var scope = this.compile('
        ' + '' + '
        '); - var first = jqLite(c.view[0].childNodes[0]); - var second = jqLite(c.view[0].childNodes[1]); - var errorLogs = c.scope.$service('$log').error.logs; + var first = jqLite(scope.$element[0].childNodes[0]); + var second = jqLite(scope.$element[0].childNodes[1]); + var errorLogs = scope.$service('$log').error.logs; browserTrigger(first, 'click'); - assertEquals("ABC", c.scope.greeting); + assertEquals("ABC", scope.greeting); expect(errorLogs).toEqual([]); browserTrigger(second, 'click'); @@ -587,70 +585,70 @@ describe('Binder', function(){ }); it('ItShouldSelectTheCorrectRadioBox', function(){ - var c = this.compile('
        ' + + var scope = this.compile('
        ' + '' + '
        '); - var female = jqLite(c.view[0].childNodes[0]); - var male = jqLite(c.view[0].childNodes[1]); + var female = jqLite(scope.$element[0].childNodes[0]); + var male = jqLite(scope.$element[0].childNodes[1]); browserTrigger(female); - assertEquals("female", c.scope.sex); + assertEquals("female", scope.sex); assertEquals(true, female[0].checked); assertEquals(false, male[0].checked); assertEquals("female", female.val()); browserTrigger(male); - assertEquals("male", c.scope.sex); + assertEquals("male", scope.sex); assertEquals(false, female[0].checked); assertEquals(true, male[0].checked); assertEquals("male", male.val()); }); it('ItShouldRepeatOnHashes', function(){ - var x = this.compile('
        '); - x.scope.$eval(); + var scope = this.compile('
        '); + scope.$eval(); assertEquals('
          ' + '<#comment>' + '
        • a0
          • ' + '
        • b1
          • ' + '
        ', - sortedHtml(x.view)); + sortedHtml(scope.$element)); }); it('ItShouldFireChangeListenersBeforeUpdate', function(){ - var x = this.compile('
        '); - x.scope.$set("name", ""); - x.scope.$watch("watched", "name=123"); - x.scope.$set("watched", "change"); - x.scope.$eval(); - assertEquals(123, x.scope.$get("name")); + var scope = this.compile('
        '); + scope.$set("name", ""); + scope.$watch("watched", "name=123"); + scope.$set("watched", "change"); + scope.$eval(); + assertEquals(123, scope.$get("name")); assertEquals( '
        123
        ', - sortedHtml(x.view)); + sortedHtml(scope.$element)); }); it('ItShouldHandleMultilineBindings', function(){ - var x = this.compile('
        {{\n 1 \n + \n 2 \n}}
        '); - x.scope.$eval(); - assertEquals("3", x.view.text()); + var scope = this.compile('
        {{\n 1 \n + \n 2 \n}}
        '); + scope.$eval(); + assertEquals("3", scope.$element.text()); }); it('ItBindHiddenInputFields', function(){ - var x = this.compile(''); - x.scope.$eval(); - assertEquals("abc", x.scope.$get("myName")); + var scope = this.compile(''); + scope.$eval(); + assertEquals("abc", scope.$get("myName")); }); it('ItShouldUseFormaterForText', function(){ - var x = this.compile(''); - x.scope.$eval(); - assertEquals(['a','b'], x.scope.$get('a')); - var input = x.view; + var scope = this.compile(''); + scope.$eval(); + assertEquals(['a','b'], scope.$get('a')); + var input = scope.$element; input[0].value = ' x,,yz'; browserTrigger(input, 'change'); - assertEquals(['x','yz'], x.scope.$get('a')); - x.scope.$set('a', [1 ,2, 3]); - x.scope.$eval(); + assertEquals(['x','yz'], scope.$get('a')); + scope.$set('a', [1 ,2, 3]); + scope.$eval(); assertEquals('1, 2, 3', input[0].value); }); diff --git a/test/CompilerSpec.js b/test/CompilerSpec.js index b1a881fb..b9505192 100644 --- a/test/CompilerSpec.js +++ b/test/CompilerSpec.js @@ -1,5 +1,5 @@ describe('compiler', function(){ - var compiler, markup, directives, widgets, compile, log, scope; + var compiler, markup, attrMarkup, directives, widgets, compile, log, scope; beforeEach(function(){ log = ""; @@ -27,7 +27,7 @@ describe('compiler', function(){ compiler = new Compiler(markup, attrMarkup, directives, widgets); compile = function(html){ var e = jqLite("
        " + html + "
        "); - return scope = compiler.compile(e)().scope; + return scope = compiler.compile(e)(); }; }); @@ -47,7 +47,7 @@ describe('compiler', function(){ }; var template = compiler.compile(e); expect(log).toEqual("found"); - scope = template(angular.scope()).scope; + scope = template(angular.scope()); expect(e.hasClass('ng-directive')).toEqual(true); expect(log).toEqual("found:init"); }); @@ -78,13 +78,13 @@ describe('compiler', function(){ it('should allow creation of templates', function(){ directives.duplicate = function(expr, element){ - var parent = element.parent(); element.replaceWith(document.createComment("marker")); element.removeAttr("duplicate"); - var template = this.compile(element); + var linker = this.compile(element); return function(marker) { this.$onEval(function() { - marker.after(template(angular.scope(), noop).view); + var scope = linker(angular.scope(), noop); + marker.after(scope.$element); }); }; }; diff --git a/test/ResourceSpec.js b/test/ResourceSpec.js index c93bdafb..76909968 100644 --- a/test/ResourceSpec.js +++ b/test/ResourceSpec.js @@ -180,7 +180,7 @@ describe("resource", function() { }); it('should excersize full stack', function(){ - var scope = angular.compile('
        ')().scope; + var scope = angular.compile('
        ')(); var $browser = scope.$service('$browser'); var $resource = scope.$service('$resource'); var Person = $resource('/Person/:id'); @@ -192,7 +192,7 @@ describe("resource", function() { }); it('should return the same object when verifying the cache', function(){ - var scope = angular.compile('
        ')().scope; + var scope = angular.compile('
        ')(); var $browser = scope.$service('$browser'); var $resource = scope.$service('$resource'); var Person = $resource('/Person/:id', null, {query: {method:'GET', isArray: true, verifyCache: true}}); diff --git a/test/ScenarioSpec.js b/test/ScenarioSpec.js index ce8ce69c..14ab82ce 100644 --- a/test/ScenarioSpec.js +++ b/test/ScenarioSpec.js @@ -12,25 +12,25 @@ describe("ScenarioSpec: Compilation", function(){ describe('compilation', function(){ it("should compile dom node and return scope", function(){ var node = jqLite('
        {{b=a+1}}
        ')[0]; - scope = angular.compile(node)().scope; + scope = angular.compile(node)(); expect(scope.a).toEqual(1); expect(scope.b).toEqual(2); }); it("should compile jQuery node and return scope", function(){ - scope = compile(jqLite('
        {{a=123}}
        '))().scope; + scope = compile(jqLite('
        {{a=123}}
        '))(); expect(jqLite(scope.$element).text()).toEqual('123'); }); it("should compile text node and return scope", function(){ - scope = angular.compile('
        {{a=123}}
        ')().scope; + scope = angular.compile('
        {{a=123}}
        ')(); expect(jqLite(scope.$element).text()).toEqual('123'); }); }); describe('scope', function(){ it("should have $set, $get, $eval, $updateView methods", function(){ - scope = angular.compile('
        {{a}}
        ')().scope; + scope = angular.compile('
        {{a}}
        ')(); scope.$eval("$invalidWidgets.push({})"); expect(scope.$set("a", 2)).toEqual(2); expect(scope.$get("a")).toEqual(2); @@ -40,7 +40,7 @@ describe("ScenarioSpec: Compilation", function(){ }); it("should have $ objects", function(){ - scope = angular.compile('
        ')(angular.scope({$config: {a:"b"}})).scope; + scope = angular.compile('
        ')(angular.scope({$config: {a:"b"}})); expect(scope.$service('$location')).toBeDefined(); expect(scope.$get('$eval')).toBeDefined(); expect(scope.$get('$config')).toBeDefined(); @@ -51,7 +51,7 @@ describe("ScenarioSpec: Compilation", function(){ describe("configuration", function(){ it("should take location object", function(){ var url = "http://server/#?book=moby"; - scope = angular.compile("
        {{$location}}
        ")().scope; + scope = angular.compile("
        {{$location}}
        ")(); var $location = scope.$service('$location'); var $browser = scope.$service('$browser'); expect($location.hashSearch.book).toBeUndefined(); diff --git a/test/ValidatorsSpec.js b/test/ValidatorsSpec.js index 2d4fca98..773ac7d0 100644 --- a/test/ValidatorsSpec.js +++ b/test/ValidatorsSpec.js @@ -7,7 +7,7 @@ describe('ValidatorTest', function(){ validator.last = last; validator._this = this; }; - var scope = compile('')().scope; + var scope = compile('')(); scope.name = 'misko'; scope.$eval(); assertEquals('misko', validator.first); @@ -95,7 +95,7 @@ describe('ValidatorTest', function(){ beforeEach(function(){ value = null; fn = null; - self = angular.compile('')().scope; + self = angular.compile('')(); jqLite(document.body).append(self.$element); self.$element.data('$validate', noop); self.$root = self; @@ -108,7 +108,7 @@ describe('ValidatorTest', function(){ it('should make a request and show spinner', function(){ var value, fn; var scope = angular.compile( - '')().scope; + '')(); jqLite(document.body).append(scope.$element); var input = scope.$element; scope.asyncFn = function(v,f){ @@ -151,7 +151,7 @@ describe('ValidatorTest', function(){ it("should handle update function", function(){ var scope = angular.compile( - '')().scope; + '')(); scope.asyncFn = jasmine.createSpy(); scope.updateFn = jasmine.createSpy(); scope.name = 'misko'; diff --git a/test/directivesSpec.js b/test/directivesSpec.js index c02eb025..4b2e7055 100644 --- a/test/directivesSpec.js +++ b/test/directivesSpec.js @@ -5,7 +5,7 @@ describe("directive", function(){ beforeEach(function() { compile = function(html) { element = jqLite(html); - return model = angular.compile(element)().scope; + return model = angular.compile(element)(); }; }); diff --git a/test/markupSpec.js b/test/markupSpec.js index a4a1a923..765c3108 100644 --- a/test/markupSpec.js +++ b/test/markupSpec.js @@ -7,7 +7,7 @@ describe("markups", function(){ element = null; compile = function(html) { element = jqLite(html); - scope = angular.compile(element)().scope; + scope = angular.compile(element)(); }; }); diff --git a/test/service/invalidWidgetsSpec.js b/test/service/invalidWidgetsSpec.js index 4a18dcf8..de9ed14b 100644 --- a/test/service/invalidWidgetsSpec.js +++ b/test/service/invalidWidgetsSpec.js @@ -14,7 +14,7 @@ describe('$invalidWidgets', function() { it("should count number of invalid widgets", function(){ var element = jqLite('') jqLite(document.body).append(element); - scope = compile(element)().scope; + scope = compile(element)(); var $invalidWidgets = scope.$service('$invalidWidgets'); expect($invalidWidgets.length).toEqual(1); diff --git a/test/service/routeSpec.js b/test/service/routeSpec.js index 4dfa546c..ccdf19ec 100644 --- a/test/service/routeSpec.js +++ b/test/service/routeSpec.js @@ -18,7 +18,7 @@ describe('$route', function() { function BookChapter() { this.log = ''; } - scope = compile('
        ')().scope; + scope = compile('
        ')(); $location = scope.$service('$location'); $route = scope.$service('$route'); $route.when('/Book/:book/Chapter/:chapter', {controller: BookChapter, template:'Chapter.html'}); diff --git a/test/widgetsSpec.js b/test/widgetsSpec.js index 183fbe6a..dc7ffa77 100644 --- a/test/widgetsSpec.js +++ b/test/widgetsSpec.js @@ -11,7 +11,7 @@ describe("widget", function(){ } else { element = jqLite(html); } - return scope = angular.compile(element)().scope; + return scope = angular.compile(element)(); }; }); @@ -592,7 +592,7 @@ describe("widget", function(){ }); it('should call change on switch', function(){ - var scope = angular.compile('
        {{name}}
        ')().scope; + var scope = angular.compile('
        {{name}}
        ')(); scope.url = 'a'; scope.$eval(); expect(scope.name).toEqual(undefined); @@ -604,7 +604,7 @@ describe("widget", function(){ describe('ng:include', function(){ it('should include on external file', function() { var element = jqLite(''); - var scope = angular.compile(element)().scope; + var scope = angular.compile(element)(); scope.childScope = createScope(); scope.childScope.name = 'misko'; scope.url = 'myUrl'; @@ -617,7 +617,7 @@ describe("widget", function(){ it('should remove previously included text if a falsy value is bound to src', function() { var element = jqLite(''); - var scope = angular.compile(element)().scope; + var scope = angular.compile(element)(); scope.childScope = createScope(); scope.childScope.name = 'igor'; scope.url = 'myUrl'; @@ -636,7 +636,7 @@ describe("widget", function(){ it('should allow this for scope', function(){ var element = jqLite(''); - var scope = angular.compile(element)().scope; + var scope = angular.compile(element)(); scope.url = 'myUrl'; scope.$service('$xhr.cache').data.myUrl = {value:'{{c=c+1}}'}; scope.$eval(); @@ -650,7 +650,7 @@ describe("widget", function(){ it('should evaluate onload expression when a partial is loaded', function() { var element = jqLite(''); - var scope = angular.compile(element)().scope; + var scope = angular.compile(element)(); expect(scope.loaded).not.toBeDefined(); @@ -801,7 +801,7 @@ describe("widget", function(){ var rootScope, rootScope, $route, $location, $browser; beforeEach(function() { - rootScope = angular.compile('')().scope; + rootScope = angular.compile('')(); $route = rootScope.$service('$route'); $location = rootScope.$service('$location'); $browser = rootScope.$service('$browser'); @@ -880,7 +880,7 @@ describe("widget", function(){ rootScope = angular.compile( '
        ' + 'include: ' + - '
        ')(myApp).scope; + '
        ')(myApp); $browser.xhr.expectGET('viewPartial.html').respond('content'); $browser.xhr.flush(); -- cgit v1.2.3