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

Commit 369fb7f

Browse files
mgolmgol
committed
feat(jqLite): implement jqLite(f) as alias to jqLite(document).ready(f)
jQuery has supported this form for a long time. As of jQuery 3.0 this form is the preferred one and all others are deprecated so jqLite(f) is now also supported. All internal invocations of jqLite(document).ready(f) (& equivalent) have been replaced by jqLite(f). Tests for these methods have been added as jqLite#ready had no explicit tests so far.
1 parent 4f44e01 commit 369fb7f

File tree

8 files changed

+103
-27
lines changed

8 files changed

+103
-27
lines changed

‎docs/content/guide/bootstrap.ngdoc

+2-2
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ Here is an example of manually initializing Angular:
115115
$scope.greetMe = 'World';
116116
}]);
117117

118-
angular.element(document).ready(function() {
118+
angular.element(function() {
119119
angular.bootstrap(document, ['myApp']);
120120
});
121121
</script>
@@ -167,4 +167,4 @@ until `angular.resumeBootstrap()` is called.
167167

168168
`angular.resumeBootstrap()` takes an optional array of modules that
169169
should be added to the original list of modules that the app was
170-
about to be bootstrapped with.
170+
about to be bootstrapped with.

‎src/angular.bind.js

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
if (window.angular.bootstrap) {
2-
//AngularJS is already loaded, so we can return here...
2+
// AngularJS is already loaded, so we can return here...
33
if (window.console) {
44
console.log('WARNING: Tried to load angular more than once.');
55
}
66
return;
77
}
88

9-
//try to bind to jquery now so that one can write jqLite(document).ready()
10-
//but we will rebind on bootstrap again.
9+
// try to bind to jquery now so that one can write jqLite(fn)
10+
// but we will rebind on bootstrap again.
1111
bindJQuery();
12-

‎src/angular.suffix

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
jqLite(window.document).ready(function() {
1+
jqLite(function() {
22
angularInit(window.document, bootstrap);
33
});
44

‎src/jqLite.js

+26-19
Original file line numberDiff line numberDiff line change
@@ -288,6 +288,8 @@ function JQLite(element) {
288288

289289
if (argIsString) {
290290
jqLiteAddNodes(this, jqLiteParseHTML(element));
291+
} else if (isFunction(element)) {
292+
jqLiteReady(element);
291293
} else {
292294
jqLiteAddNodes(this, element);
293295
}
@@ -519,29 +521,34 @@ function jqLiteDocumentLoaded(action, win) {
519521
}
520522
}
521523

524+
function jqLiteReady(fn) {
525+
var fired = false;
526+
527+
function trigger() {
528+
if (fired) return;
529+
fired = true;
530+
fn();
531+
}
532+
533+
// check if document is already loaded
534+
if (window.document.readyState === 'complete') {
535+
window.setTimeout(fn);
536+
} else {
537+
// We can not use jqLite since we are not done loading and jQuery could be loaded later.
538+
539+
// Works for modern browsers and IE9
540+
window.document.addEventListener('DOMContentLoaded', trigger);
541+
542+
// Fallback to window.onload for others
543+
window.addEventListener('load', trigger);
544+
}
545+
}
546+
522547
//////////////////////////////////////////
523548
// Functions which are declared directly.
524549
//////////////////////////////////////////
525550
var JQLitePrototype = JQLite.prototype = {
526-
ready: function(fn) {
527-
var fired = false;
528-
529-
function trigger() {
530-
if (fired) return;
531-
fired = true;
532-
fn();
533-
}
534-
535-
// check if document is already loaded
536-
if (window.document.readyState === 'complete') {
537-
window.setTimeout(trigger);
538-
} else {
539-
this.on('DOMContentLoaded', trigger); // works for modern browsers and IE9
540-
// we can not use jqLite since we are not done loading and jQuery could be loaded later.
541-
// eslint-disable-next-line new-cap
542-
JQLite(window).on('load', trigger); // fallback to window.onload for others
543-
}
544-
},
551+
ready: jqLiteReady,
545552
toString: function() {
546553
var value = [];
547554
forEach(this, function(e) { value.push('' + e);});

‎src/ngScenario/angular.suffix

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ angular.forEach(script.attributes, function(attr) {
1414
});
1515

1616
if (config.autotest) {
17-
JQLite(window.document).ready(function() {
17+
JQLite(function() {
1818
angular.scenario.setUpAndRun(config);
1919
});
2020
}

‎test/e2e/fixtures/ready/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html ng-app="test" ng-jq>
3+
<body>
4+
<span class="before-ready">{{beforeReady}}</span>
5+
<span class="after-ready">{{afterReady}}</span>
6+
<span class="after-ready-sync">{{afterReadySync}}</span>
7+
<span class="after-ready-method">{{afterReadyMethod}}</span>
8+
<span class="after-ready-method-sync">{{afterReadyMethodSync}}</span>
9+
<script src="angular.js"></script>
10+
<script src="script.js"></script>
11+
<div id="div-after-scripts">This div is loaded after scripts.</div>
12+
</body>
13+
</html>

‎test/e2e/fixtures/ready/script.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
'use strict';
2+
3+
var beforeReady;
4+
(function() {
5+
var divAfterScripts = window.document.getElementById('div-after-scripts');
6+
beforeReady = divAfterScripts && divAfterScripts.textContent;
7+
})();
8+
9+
var afterReady;
10+
angular.element(function() {
11+
var divAfterScripts = window.document.getElementById('div-after-scripts');
12+
afterReady = divAfterScripts && divAfterScripts.textContent;
13+
});
14+
15+
var afterReadyMethod;
16+
angular.element(window.document).ready(function() {
17+
var divAfterScripts = window.document.getElementById('div-after-scripts');
18+
afterReadyMethod = divAfterScripts && divAfterScripts.textContent;
19+
});
20+
21+
var afterReadySync = afterReady;
22+
var afterReadyMethodSync = afterReadyMethod;
23+
24+
angular
25+
.module('test', [])
26+
.run(function($rootScope) {
27+
$rootScope.beforeReady = beforeReady;
28+
$rootScope.afterReady = afterReady;
29+
$rootScope.afterReadySync = afterReadySync;
30+
$rootScope.afterReadyMethod = afterReadyMethod;
31+
$rootScope.afterReadyMethodSync = afterReadyMethodSync;
32+
});

‎test/e2e/tests/ready.spec.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
'use strict';
2+
3+
describe('Firing a callback on ready', function() {
4+
it('should not have the div available immediately', function() {
5+
loadFixture('ready');
6+
expect(element(by.className('before-ready')).getText())
7+
.toBe('');
8+
});
9+
10+
it('should wait for document ready', function() {
11+
loadFixture('ready');
12+
expect(element(by.className('after-ready')).getText())
13+
.toBe('This div is loaded after scripts.');
14+
expect(element(by.className('after-ready-method')).getText())
15+
.toBe('This div is loaded after scripts.');
16+
});
17+
18+
it('should be asynchronous', function() {
19+
loadFixture('ready');
20+
expect(element(by.className('after-ready-sync')).getText())
21+
.toBe('');
22+
expect(element(by.className('after-ready-method-sync')).getText())
23+
.toBe('');
24+
});
25+
});

0 commit comments

Comments
 (0)