From d7ba5bc83ba9a8937384ea677331c5156ed6772d Mon Sep 17 00:00:00 2001 From: Igor Minar Date: Tue, 25 Oct 2011 08:47:02 -0700 Subject: feat(bootstrap): drop angular.js file name restrictions for autobind The last script element in the dom is always us if the script that contains angular is loaded synchronously. For async loading manual bootstrap needs to be performed. Close #621 --- .../guide/dev_guide.bootstrap.auto_bootstrap.ngdoc | 33 +++-- src/Angular.js | 40 +++-- src/angular-bootstrap.js | 4 +- src/angular.suffix | 4 +- test/AngularSpec.js | 164 +++++---------------- 5 files changed, 78 insertions(+), 167 deletions(-) diff --git a/docs/content/guide/dev_guide.bootstrap.auto_bootstrap.ngdoc b/docs/content/guide/dev_guide.bootstrap.auto_bootstrap.ngdoc index 10466d5e..438b3d38 100644 --- a/docs/content/guide/dev_guide.bootstrap.auto_bootstrap.ngdoc +++ b/docs/content/guide/dev_guide.bootstrap.auto_bootstrap.ngdoc @@ -53,8 +53,7 @@ appending `#autobind` to the ` +
@@ -67,22 +66,24 @@ appending `#autobind` to the ` + + +
+ Hello {{'world'}}! +
+ + + -Optionally, any of the filename formats above can be prepended with a relative or absolute URL that -ends with `/`. ## Global Angular Object diff --git a/src/Angular.js b/src/Angular.js index c5a35e4e..ab031049 100644 --- a/src/Angular.js +++ b/src/Angular.js @@ -116,7 +116,6 @@ var _undefined = undefined, angularService = extensionMap(angular, 'service'), angularCallbacks = extensionMap(angular, 'callbacks'), nodeName_, - rngScript = /^(|.*\/)angular(-.*?)?(\.min)?.js(\?[^#]*)?(#(.*))?$/, uid = ['0', '0', '0'], DATE_ISOSTRING_LN = 24; @@ -953,35 +952,30 @@ function angularInit(config, document){ var autobind = config.autobind; if (autobind) { - var element = isString(autobind) ? document.getElementById(autobind) : document, - scope = compile(element)(createScope()), - $browser = scope.$service('$browser'); - - if (config.css) - $browser.addCss(config.base_url + config.css); - scope.$apply(); + var element = isString(autobind) ? document.getElementById(autobind) : document; + compile(element)().$apply(); } } function angularJsConfig(document) { bindJQuery(); - var scripts = document.getElementsByTagName("script"), + var scripts = document.getElementsByTagName('script'), + script = scripts[scripts.length-1], + scriptSrc = script.src, config = {}, - match; - for(var j = 0; j < scripts.length; j++) { - match = (scripts[j].src || "").match(rngScript); - if (match) { - config.base_url = match[1]; - extend(config, parseKeyValue(match[6])); - eachAttribute(jqLite(scripts[j]), function(value, name){ - if (/^ng:/.exec(name)) { - name = name.substring(3).replace(/-/g, '_'); - value = value || true; - config[name] = value; - } - }); + hashPos; + + hashPos = scriptSrc.indexOf('#'); + if (hashPos != -1) extend(config, parseKeyValue(scriptSrc.substr(hashPos+1))); + + eachAttribute(jqLite(script), function(value, name){ + if (/^ng:/.exec(name)) { + name = name.substring(3).replace(/-/g, '_'); + value = value || true; + config[name] = value; } - } + }); + return config; } diff --git a/src/angular-bootstrap.js b/src/angular-bootstrap.js index 7a1752d2..fb2acbeb 100644 --- a/src/angular-bootstrap.js +++ b/src/angular-bootstrap.js @@ -99,9 +99,7 @@ // empty the cache to prevent mem leaks globalVars = {}; - var config = angularJsConfig(document); - - angularInit(config, document); + angularInit({autobind:true}, document); } if (window.addEventListener) { diff --git a/src/angular.suffix b/src/angular.suffix index e8bb83b7..d38d3130 100644 --- a/src/angular.suffix +++ b/src/angular.suffix @@ -1,6 +1,8 @@ + var config = angularJsConfig(document); + jqLiteWrap(document).ready(function() { - angularInit(angularJsConfig(document), document); + angularInit(config, document); }); })(window, document); diff --git a/test/AngularSpec.js b/test/AngularSpec.js index 5b0a3466..7831539d 100644 --- a/test/AngularSpec.js +++ b/test/AngularSpec.js @@ -228,181 +228,97 @@ describe('angular', function() { }); - describe ('rngScript', function() { - it('should match angular.js', function() { - expect('angular.js'.match(rngScript)).not.toBeNull(); - expect('../angular.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular.js'.match(rngScript)).not.toBeNull(); - - expect('foo.js'.match(rngScript)).toBeNull(); - expect('foo/foo.js'.match(rngScript)).toBeNull(); - expect('my-angular-app.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular.min.js', function() { - expect('angular.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular.min.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular.min.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app.min.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app.min.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-bootstrap.js', function() { - expect('angular-bootstrap.js'.match(rngScript)).not.toBeNull(); - expect('../angular-bootstrap.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-bootstrap.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app-bootstrap.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app-bootstrap.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-0.9.0.js', function() { - expect('angular-0.9.0.js'.match(rngScript)).not.toBeNull(); - expect('../angular-0.9.0.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-0.9.0.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app-0.9.0.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app-0.9.0.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-0.9.0.min.js', function() { - expect('angular-0.9.0.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular-0.9.0.min.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-0.9.0.min.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app-0.9.0.min.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app-0.9.0.min.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-0.9.0-de0a8612.js', function() { - expect('angular-0.9.0-de0a8612.js'.match(rngScript)).not.toBeNull(); - expect('../angular-0.9.0-de0a8612.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-0.9.0-de0a8612.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app-0.9.0-de0a8612.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app-0.9.0-de0a8612.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-0.9.0-de0a8612.min.js', function() { - expect('angular-0.9.0-de0a8612.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular-0.9.0-de0a8612.min.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-0.9.0-de0a8612.min.js'.match(rngScript)).not.toBeNull(); - - expect('my-angular-app-0.9.0-de0a8612.min.js'.match(rngScript)).toBeNull(); - expect('foo/../my-angular-app-0.9.0-de0a8612.min.js'.match(rngScript)).toBeNull(); - }); - - it('should match angular-scenario.js', function() { - expect('angular-scenario.js'.match(rngScript)).not.toBeNull(); - expect('angular-scenario.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular-scenario.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-scenario.min.js'.match(rngScript)).not.toBeNull(); - }); - - it('should match angular-scenario-0.9.0(.min).js', function() { - expect('angular-scenario-0.9.0.js'.match(rngScript)).not.toBeNull(); - expect('angular-scenario-0.9.0.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular-scenario-0.9.0.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-scenario-0.9.0.min.js'.match(rngScript)).not.toBeNull(); - }); - - it('should match angular-scenario-0.9.0-de0a8612(.min).js', function() { - expect('angular-scenario-0.9.0-de0a8612.js'.match(rngScript)).not.toBeNull(); - expect('angular-scenario-0.9.0-de0a8612.min.js'.match(rngScript)).not.toBeNull(); - expect('../angular-scenario-0.9.0-de0a8612.js'.match(rngScript)).not.toBeNull(); - expect('foo/angular-scenario-0.9.0-de0a8612.min.js'.match(rngScript)).not.toBeNull(); - }); - }); + describe('angularJsConfig', function() { + it('should always consider angular.js script tag to be the last script tag', function() { + var doc = { + getElementsByTagName: function(tagName) { + expect(tagName).toEqual('script'); + return [{nodeName: 'SCRIPT', src: 'random.js', + attributes: [{name: 'ng:autobind', value: 'wrong'}]}, + {nodeName: 'SCRIPT', src: 'angular.js', + attributes: [{name: 'ng:autobind', value: 'correct'}]}]; + } + }; + expect(angularJsConfig(doc)).toEqual({autobind: 'correct'}); - describe('angularJsConfig', function() { - it('should find angular.js script tag and config', function() { - var doc = { getElementsByTagName: function(tagName) { - expect(tagName).toEqual('script'); - return [{nodeName: 'SCRIPT', src: 'random.js'}, - {nodeName: 'SCRIPT', src: 'angular.js'}, - {nodeName: 'SCRIPT', src: 'my-angular-app.js'}]; - } + doc = { + getElementsByTagName: function(tagName) { + expect(tagName).toEqual('script'); + return [{nodeName: 'SCRIPT', src: 'angular.js', + attributes: [{name: 'ng:autobind', value: 'wrong'}]}, + {nodeName: 'SCRIPT', src: 'concatinatedAndObfuscadedScriptWithOurScript.js', + attributes: [{name: 'ng:autobind', value: 'correct'}]}]; + } }; - expect(angularJsConfig(doc)).toEqual({base_url: ''}); + expect(angularJsConfig(doc)).toEqual({autobind: 'correct'}); }); - it('should extract angular config from the ng: attributes', - function() { + it('should extract angular config from the ng: attributes', function() { var doc = { getElementsByTagName: function(tagName) { expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', + return [{ + nodeName: 'SCRIPT', src: 'angularjs/angular.js', attributes: [{name: 'ng:autobind', value:'elementIdToCompile'}, {name: 'ng:css', value: 'css/my_custom_angular.css'}] }]; }}; - expect(angularJsConfig(doc)).toEqual({base_url: 'angularjs/', + expect(angularJsConfig(doc)).toEqual({ autobind: 'elementIdToCompile', - css: 'css/my_custom_angular.css'}); + css: 'css/my_custom_angular.css' + }); }); it('should extract angular config and default autobind value to true if present', function() { var doc = { getElementsByTagName: function(tagName) { expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', + return [{ + nodeName: 'SCRIPT', src: 'angularjs/angular.js', attributes: [{name: 'ng:autobind', value:undefined}]}]; }}; - expect(angularJsConfig(doc)).toEqual({autobind: true, - base_url: 'angularjs/'}); + expect(angularJsConfig(doc)).toEqual({autobind: true}); }); it('should extract angular autobind config from the script hashpath attributes', function() { var doc = { getElementsByTagName: function(tagName) { expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', + return [{ + nodeName: 'SCRIPT', src: 'angularjs/angular.js#autobind'}]; }}; - expect(angularJsConfig(doc)).toEqual({base_url: 'angularjs/', - autobind: true}); + expect(angularJsConfig(doc)).toEqual({autobind: true}); }); it('should extract autobind config with element id from the script hashpath', function() { var doc = { getElementsByTagName: function(tagName) { expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', + return [{ + nodeName: 'SCRIPT', src: 'angularjs/angular.js#autobind=foo'}]; }}; - expect(angularJsConfig(doc)).toEqual({base_url: 'angularjs/', - autobind: 'foo'}); + expect(angularJsConfig(doc)).toEqual({autobind: 'foo'}); }); - it("should default to versioned ie-compat file if angular file is versioned", function() { + it('should default to versioned ie-compat file if angular file is versioned', function() { var doc = { getElementsByTagName: function(tagName) { expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', + return [{ + nodeName: 'SCRIPT', src: 'js/angular-0.9.0.js'}]; }}; - expect(angularJsConfig(doc)).toEqual({base_url: 'js/'}); - }); - - - it("should default to versioned ie-compat file if angular file is versioned and minified", function() { - var doc = { getElementsByTagName: function(tagName) { - expect(lowercase(tagName)).toEqual('script'); - return [{nodeName: 'SCRIPT', - src: 'js/angular-0.9.0-cba23f00.min.js'}]; - }}; - - expect(angularJsConfig(doc)).toEqual({base_url: 'js/'}); + expect(angularJsConfig(doc)).toEqual({}); }); }); -- cgit v1.2.3