Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
fix(angular.bootstrap): only allow angular to load once
Browse files Browse the repository at this point in the history
This is hard to test as a unit-test, since it involves the actual loading
of angular, but it turns out that it is easy to test using a protractor
e2e test.

Closes #5863
Closes #5587
  • Loading branch information
siddii authored and vojtajina committed Mar 21, 2014
1 parent ca69dc6 commit 0d60f8d
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 0 deletions.
35 changes: 35 additions & 0 deletions src/Angular.js
Original file line number Diff line number Diff line change
Expand Up @@ -1241,6 +1241,41 @@ function angularInit(element, bootstrap) {
* Note that ngScenario-based end-to-end tests cannot use this function to bootstrap manually.
* They must use {@link ng.directive:ngApp ngApp}.
*
* Angular will detect if it has been loaded into the browser more than once and only allow the
* first loaded script to be bootstrapped and will report a warning to the browser console for
* each of the subsequent scripts. This prevents strange results in applications, where otherwise
* multiple instances of Angular try to work on the DOM.
*
* <example name="multi-bootstrap" module="multi-bootstrap">
* <file name="index.html">
* <script src="../../../angular.js"></script>
* <div ng-controller="BrokenTable">
* <table>
* <tr>
* <th ng-repeat="heading in headings">{{heading}}</th>
* </tr>
* <tr ng-repeat="filling in fillings">
* <td ng-repeat="fill in filling">{{fill}}</td>
* </tr>
* </table>
* </div>
* </file>
* <file name="controller.js">
* var app = angular.module('multi-bootstrap', [])
*
* .controller('BrokenTable', function($scope) {
* $scope.headings = ['One', 'Two', 'Three'];
* $scope.fillings = [[1, 2, 3], ['A', 'B', 'C'], [7, 8, 9]];
* });
* </file>
* <file name="protractor.js" type="protractor">
* it('should only insert one table cell for each item in $scope.fillings', function() {
* expect(element.all(by.css('td')).count())
* .toBe(9);
* });
* </file>
* </example>
*
* @param {Element} element DOM element which is the root of angular application.
* @param {Array<String|Function|Array>=} modules an array of modules to load into the application.
* Each item in the array should be the name of a predefined module or a (DI annotated)
Expand Down
6 changes: 6 additions & 0 deletions src/angular.suffix
Original file line number Diff line number Diff line change
@@ -1,3 +1,9 @@
if (window.angular.bootstrap) {
//AngularJS is already loaded, so we can return here...
console.log('WARNING: Tried to load angular more than once.');
return;
}

//try to bind to jquery now so that one can write angular.element().read()
//but we will rebind on bootstrap again.
bindJQuery();
Expand Down

0 comments on commit 0d60f8d

Please sign in to comment.