1
1
# Zone.js's support for non standard apis
2
2
3
3
Zone.js patched most standard APIs such as DOM event listeners, XMLHttpRequest in Browser, EventEmitter and fs API in Node.js so they can be in zone.
4
-
5
- But there are still a lot of non standard APIs that are not patched by default, such as MediaQuery, Notification,
6
- WebAudio and so on. We are adding support to those APIs, and our progress is updated here.
7
-
8
- ## Currently supported non standard Web APIs
4
+
5
+ But there are still a lot of non standard APIs that are not patched by default, such as MediaQuery, Notification,
6
+ WebAudio and so on. We are adding support to those APIs, and our progress is updated here.
7
+
8
+ ## Currently supported non standard Web APIs
9
9
10
10
* MediaQuery
11
- * Notification
11
+ * Notification
12
12
13
13
## Currently supported polyfills
14
14
28
28
29
29
* bluebird promise
30
30
31
- Browser Usage:
31
+ Browser Usage:
32
32
33
33
```
34
34
<script src="zone.js"></script>
@@ -75,11 +75,11 @@ remove the comment of the following line
75
75
76
76
## Others
77
77
78
- * Cordova
78
+ * Cordova
79
79
80
80
patch ` cordova.exec ` API
81
81
82
- ` cordova.exec(success, error, service, action, args); `
82
+ ` cordova.exec(success, error, service, action, args); `
83
83
84
84
` success ` and ` error ` will be patched with ` Zone.wrap ` .
85
85
@@ -96,12 +96,12 @@ to load the patch, you should load in the following order.
96
96
By default, those APIs' support will not be loaded in zone.js or zone-node.js,
97
97
so if you want to load those API's support, you should load those files by yourself.
98
98
99
- For example, if you want to add MediaQuery patch, you should do like this:
99
+ For example, if you want to add MediaQuery patch, you should do like this:
100
100
101
101
```
102
- <script src="path/zone.js"></script>
103
- <script src="path/webapis-media-query.js"></script>
104
- ```
102
+ <script src="path/zone.js"></script>
103
+ <script src="path/webapis-media-query.js"></script>
104
+ ```
105
105
106
106
* rxjs
107
107
@@ -127,28 +127,28 @@ constructorZone.run(() => {
127
127
128
128
subscriptionZone.run(() => {
129
129
observable.subscribe(() => {
130
- console.log('current zone when subscription next', Zone.current.name); // will output subscription.
130
+ console.log('current zone when subscription next', Zone.current.name); // will output subscription.
131
131
}, () => {
132
- console.log('current zone when subscription error', Zone.current.name); // will output subscription.
132
+ console.log('current zone when subscription error', Zone.current.name); // will output subscription.
133
133
}, () => {
134
- console.log('current zone when subscription complete', Zone.current.name); // will output subscription.
134
+ console.log('current zone when subscription complete', Zone.current.name); // will output subscription.
135
135
});
136
136
});
137
137
138
138
operatorZone.run(() => {
139
139
observable.map(() => {
140
- console.log('current zone when map operator', Zone.current.name); // will output operator.
140
+ console.log('current zone when map operator', Zone.current.name); // will output operator.
141
141
});
142
142
});
143
143
```
144
144
145
145
Currently basically everything the ` rxjs ` API includes
146
146
147
- - Observable
148
- - Subscription
149
- - Subscriber
150
- - Operators
151
- - Scheduler
147
+ * Observable
148
+ * Subscription
149
+ * Subscriber
150
+ * Operators
151
+ * Scheduler
152
152
153
153
is patched, so each asynchronous call will run in the correct zone.
154
154
@@ -194,7 +194,7 @@ user need to patch `io` themselves just like following code.
194
194
< / script>
195
195
```
196
196
197
- please reference the sample repo [ zone-socketio] ( https://github.com/JiaLiPassion/zone-socketio ) about
197
+ please reference the sample repo [ zone-socketio] ( https://github.com/JiaLiPassion/zone-socketio ) about
198
198
detail usage.
199
199
200
200
* jsonp
@@ -208,14 +208,15 @@ there is a sampel repo [zone-jsonp](https://github.com/JiaLiPassion/test-zone-js
208
208
sample usage is:
209
209
210
210
``` javascript
211
- import ' zone.js/dist/zone-patch-jsonp' ;
212
- Zone[' __zone_symbol__jsonp' ]({
211
+ import " zone.js/dist/zone-patch-jsonp" ;
212
+ Zone[" __zone_symbol__jsonp" ]({
213
213
jsonp: getJSONP,
214
- sendFuncName: ' send' ,
215
- successFuncName: ' jsonpSuccessCallback' ,
216
- failedFuncName: ' jsonpFailedCallback'
214
+ sendFuncName: " send" ,
215
+ successFuncName: " jsonpSuccessCallback" ,
216
+ failedFuncName: " jsonpFailedCallback"
217
217
});
218
218
```
219
+
219
220
* ResizeObserver
220
221
221
222
Currently only ` Chrome 64 ` native support this feature.
@@ -227,3 +228,28 @@ import 'zone.js/dist/zone-patch-resize-observer';
227
228
```
228
229
229
230
there is a sample repo [ zone-resize-observer] ( https://github.com/JiaLiPassion/zone-resize-observer ) here
231
+
232
+ * customize root zone
233
+
234
+ In some application, especially for performance test or async tracing, user may want a predefined root zone.
235
+ For example,i when you include ` google map ` into ` index.html ` by adding ` script tag ` such as
236
+ ` <script src="https://maps.googleapis.com/maps/api/js?key=KEY"></script> ` , ` google map js ` will add some event
237
+ listeners or do some async operations during loading the js file, all those operations happens in ` root zone ` ,
238
+ if we want to intercept those async operations, we need to modify root zone.
239
+
240
+ You can do like this:
241
+
242
+ ``` javascript
243
+ < script src= " folder/zone.js" / >
244
+ < script>
245
+ var customizeRootZone = Zone .current .fork ({
246
+ name: ' myRoot'
247
+ });
248
+ window .__zone_symbol__customizeRootZone = customizeRootZone;
249
+ < / script>
250
+ < script src= " folder/zone-customize-root-zone.js" / >
251
+ ```
252
+
253
+ ** Remind, this is not a public api or formal feature of zone.js, it will not be included in future tc39 proposal,
254
+ and it is not by design, it is just a helper method to let you customize rootZone for some test and suppose to change
255
+ in the future, please use it on your own risk**
0 commit comments