Skip to content

Commit 35a025f

Browse files
JiaLiPassionmhevery
JiaLiPassion
authored and
mhevery
committed
fix(zone.js): patch shadydom (#31717)
Close #31686 PR Close #31717
1 parent a86850e commit 35a025f

6 files changed

Lines changed: 298 additions & 181 deletions

File tree

‎packages/zone.js/lib/browser/shadydom.ts‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,17 @@ Zone.__load_patch('shadydom', (global: any, Zone: ZoneType, api: _ZonePrivate) =
1010
// in web components, shadydom will patch addEventListener/removeEventListener of
1111
// Node.prototype and WindowPrototype, this will have conflict with zone.js
1212
// so zone.js need to patch them again.
13-
const windowPrototype = Object.getPrototypeOf(window);
14-
if (windowPrototype && windowPrototype.hasOwnProperty('addEventListener')) {
15-
(windowPrototype as any)[Zone.__symbol__('addEventListener')] = null;
16-
(windowPrototype as any)[Zone.__symbol__('removeEventListener')] = null;
17-
api.patchEventTarget(global, [windowPrototype]);
18-
}
19-
if (Node.prototype.hasOwnProperty('addEventListener')) {
20-
(Node.prototype as any)[Zone.__symbol__('addEventListener')] = null;
21-
(Node.prototype as any)[Zone.__symbol__('removeEventListener')] = null;
22-
api.patchEventTarget(global, [Node.prototype]);
23-
}
13+
const HTMLSlotElement = global.HTMLSlotElement;
14+
const prototypes = [
15+
Object.getPrototypeOf(window), Node.prototype, Text.prototype, Element.prototype,
16+
HTMLElement.prototype, HTMLSlotElement && HTMLSlotElement.prototype, DocumentFragment.prototype,
17+
Document.prototype
18+
];
19+
prototypes.forEach(function(proto) {
20+
if (proto && proto.hasOwnProperty('addEventListener')) {
21+
proto[Zone.__symbol__('addEventListener')] = null;
22+
proto[Zone.__symbol__('removeEventListener')] = null;
23+
api.patchEventTarget(global, [proto]);
24+
}
25+
});
2426
});

‎packages/zone.js/test/BUILD.bazel‎

Lines changed: 72 additions & 170 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
load("//tools:defaults.bzl", "jasmine_node_test", "ts_library")
2-
load("@build_bazel_rules_nodejs//:defs.bzl", "rollup_bundle")
3-
load("@npm_bazel_karma//:index.bzl", "karma_web_test_suite")
2+
load("//packages/zone.js/test:karma_test.bzl", "karma_test")
43

54
package(default_visibility = ["//:__pkg__"])
65

@@ -184,187 +183,90 @@ jasmine_node_test(
184183
],
185184
)
186185

187-
ts_library(
188-
name = "test_browser_lib",
189-
testonly = True,
190-
srcs = glob(["browser/*.ts"]) + [
191-
"extra/cordova.spec.ts",
192-
"mocha-patch.spec.ts",
193-
"jasmine-patch.spec.ts",
194-
"common_tests.ts",
195-
"browser_entry_point.ts",
196-
],
197-
deps = [
198-
":common_spec_env",
199-
":common_spec_srcs",
200-
":common_spec_util",
201-
":error_spec_srcs",
202-
"//packages/zone.js/lib",
203-
"@npm//@types/shelljs",
204-
"@npm//@types/systemjs",
205-
"@npm//rxjs",
206-
"@npm//shelljs",
207-
"@npm//systemjs",
208-
],
209-
)
210-
211-
ts_library(
212-
name = "browser_env_setup",
213-
testonly = True,
214-
srcs = [
215-
"browser-env-setup.ts",
216-
"browser_symbol_setup.ts",
217-
],
218-
deps = [
219-
":common_spec_env",
220-
],
221-
)
222-
223-
rollup_bundle(
224-
name = "browser_test_env_setup_rollup",
225-
testonly = True,
226-
entry_point = ":browser-env-setup.ts",
227-
deps = [
228-
":browser_env_setup",
229-
],
230-
)
231-
232-
filegroup(
233-
name = "browser_test_env_setup_rollup.es5",
234-
testonly = True,
235-
srcs = [":browser_test_env_setup_rollup"],
236-
output_group = "umd",
237-
)
238-
239-
rollup_bundle(
240-
name = "browser_test_rollup",
241-
testonly = True,
242-
entry_point = ":browser_entry_point.ts",
243-
globals = {
244-
"electron": "electron",
245-
},
246-
deps = [
247-
":test_browser_lib",
248-
],
249-
)
186+
env_srcs = [
187+
"browser-env-setup.ts",
188+
"browser_symbol_setup.ts",
189+
]
250190

251-
filegroup(
252-
name = "browser_test_rollup.es5",
253-
testonly = True,
254-
srcs = [":browser_test_rollup"],
255-
output_group = "umd",
256-
)
191+
env_deps = [
192+
":common_spec_env",
193+
":common_spec_srcs",
194+
":common_spec_util",
195+
":error_spec_srcs",
196+
"//packages/zone.js/lib",
197+
"@npm//@types/shelljs",
198+
"@npm//@types/systemjs",
199+
"@npm//rxjs",
200+
"@npm//shelljs",
201+
"@npm//systemjs",
202+
]
257203

258-
genrule(
259-
name = "browser_test_trim_map",
260-
testonly = True,
261-
srcs = [
262-
":browser_test_rollup.es5",
263-
],
264-
outs = [
265-
"browser_test_rollup_trim_map.js",
266-
],
267-
cmd = " && ".join([
268-
"cp $(@D)/browser_test_rollup.umd.js $@",
269-
]),
270-
)
204+
env_entry_point = ":browser-env-setup.ts"
271205

272-
genrule(
273-
name = "browser_test_env_setup_trim_map",
274-
testonly = True,
275-
srcs = [
276-
":browser_test_env_setup_rollup.es5",
277-
],
278-
outs = [
279-
"browser_test_env_setup_rollup_trim_map.js",
280-
],
281-
cmd = " && ".join([
282-
"cp $(@D)/browser_test_env_setup_rollup.umd.js $@",
283-
]),
284-
)
206+
test_srcs = glob(
207+
["browser/*.ts"],
208+
exclude = ["browser/shadydom.spec.ts"],
209+
) + [
210+
"extra/cordova.spec.ts",
211+
"mocha-patch.spec.ts",
212+
"jasmine-patch.spec.ts",
213+
"common_tests.ts",
214+
"browser_entry_point.ts",
215+
]
285216

286-
_karma_test_required_dist_files = [
287-
"//packages/zone.js/dist:task-tracking-dist-dev-test",
288-
"//packages/zone.js/dist:wtf-dist-dev-test",
289-
"//packages/zone.js/dist:webapis-notification-dist-dev-test",
290-
"//packages/zone.js/dist:webapis-media-query-dist-dev-test",
291-
"//packages/zone.js/dist:zone-patch-canvas-dist-dev-test",
292-
"//packages/zone.js/dist:zone-patch-fetch-dist-dev-test",
293-
"//packages/zone.js/dist:zone-patch-resize-observer-dist-dev-test",
294-
"//packages/zone.js/dist:zone-patch-user-media-dist-dev-test",
295-
":browser_test_trim_map",
217+
test_deps = [
218+
":common_spec_env",
219+
":common_spec_srcs",
220+
":common_spec_util",
221+
":error_spec_srcs",
222+
"//packages/zone.js/lib",
223+
"@npm//@types/shelljs",
224+
"@npm//@types/systemjs",
225+
"@npm//rxjs",
226+
"@npm//shelljs",
227+
"@npm//systemjs",
296228
]
297229

298-
karma_web_test_suite(
299-
name = "karma_jasmine_test",
300-
srcs = [
301-
"fake_entry.js",
302-
],
303-
bootstrap = [
304-
":browser_test_env_setup_trim_map",
305-
"//packages/zone.js/dist:zone-testing-bundle-dist-dev-test",
306-
] + _karma_test_required_dist_files,
307-
static_files = [
308-
":assets/sample.json",
309-
":assets/worker.js",
310-
":assets/import.html",
311-
],
312-
tags = ["zone_karma_test"],
313-
runtime_deps = [
314-
"@npm//karma-browserstack-launcher",
315-
],
316-
)
230+
test_entry_point = ":browser_entry_point.ts"
317231

318-
karma_web_test_suite(
319-
name = "karma_jasmine_evergreen_test",
320-
srcs = [
321-
"fake_entry.js",
322-
],
323-
bootstrap = [
324-
":browser_test_env_setup_trim_map",
232+
karma_tests = {
233+
"browser_test": ["//packages/zone.js/dist:zone-testing-bundle-dist-dev-test"],
234+
"browser_green_test": [
325235
"//packages/zone.js/dist:zone-evergreen-dist-dev-test",
326236
"//packages/zone.js/dist:zone-testing-dist-dev-test",
327-
] + _karma_test_required_dist_files,
328-
data = [
329-
"//:browser-providers.conf.js",
330-
"//tools:jasmine-seed-generator.js",
331-
],
332-
static_files = [
333-
":assets/sample.json",
334-
":assets/worker.js",
335-
":assets/import.html",
336-
],
337-
tags = ["zone_karma_test"],
338-
runtime_deps = [
339-
"@npm//karma-browserstack-launcher",
340237
],
238+
}
239+
240+
karma_test(
241+
name = "browser_test",
242+
bootstraps = karma_tests,
243+
ci = True,
244+
env_deps = env_deps,
245+
env_entry_point = env_entry_point,
246+
env_srcs = env_srcs,
247+
test_deps = test_deps,
248+
test_entry_point = test_entry_point,
249+
test_srcs = test_srcs,
341250
)
342251

343-
karma_web_test_suite(
344-
name = "karma_jasmine_test_ci",
345-
srcs = [
346-
"fake_entry.js",
347-
],
348-
bootstrap = [
349-
":saucelabs.js",
350-
":browser_test_env_setup_trim_map",
351-
"//packages/zone.js/dist:zone-testing-bundle-dist-test",
352-
] + _karma_test_required_dist_files,
353-
config_file = "//:karma-js.conf.js",
354-
configuration_env_vars = ["KARMA_WEB_TEST_MODE"],
355-
data = [
356-
"//:browser-providers.conf.js",
357-
"//tools:jasmine-seed-generator.js",
252+
karma_test(
253+
name = "browser_shadydom",
254+
bootstraps = {"browser_shadydom": [
255+
"//packages/zone.js/dist:zone-testing-bundle-dist-dev-test",
256+
"//packages/zone.js/dist:webapis-shadydom-dist-dev-test",
257+
]},
258+
ci = False,
259+
env_deps = [
260+
"//packages/zone.js/lib",
358261
],
359-
static_files = [
360-
":assets/sample.json",
361-
":assets/worker.js",
362-
":assets/import.html",
262+
env_entry_point = ":browser_shadydom_setup.ts",
263+
env_srcs = ["browser_shadydom_setup.ts"],
264+
test_deps = [
265+
"//packages/zone.js/lib",
363266
],
364-
tags = ["zone_karma_test"],
365-
# Visible to //:test_web_all target
366-
visibility = ["//:__pkg__"],
367-
runtime_deps = [
368-
"@npm//karma-browserstack-launcher",
267+
test_entry_point = ":browser_shadydom_entry_point.ts",
268+
test_srcs = [
269+
"browser/shadydom.spec.ts",
270+
"browser_shadydom_entry_point.ts",
369271
],
370272
)

‎packages/zone.js/test/browser/shadydom.spec.ts‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/**
2+
* @license
3+
* Copyright Google Inc. All Rights Reserved.
4+
*
5+
* Use of this source code is governed by an MIT-style license that can be
6+
* found in the LICENSE file at https://angular.io/license
7+
*/
8+
9+
describe('shadydom', () => {
10+
const div = document.createElement('div');
11+
const text = document.createTextNode('text');
12+
const span = document.createElement('span');
13+
const fragment = document.createDocumentFragment();
14+
document.body.appendChild(div);
15+
document.body.appendChild(text);
16+
document.body.appendChild(span);
17+
document.body.appendChild(fragment);
18+
const targets = [
19+
{name: 'window', target: window}, {name: 'div', target: div}, {name: 'text', target: text},
20+
{name: 'span', target: span}, {name: 'document', target: document},
21+
{name: 'fragment', target: fragment}
22+
];
23+
targets.forEach((t: any) => {
24+
it(`test for prototype ${t.name}`, () => {
25+
const target = t.target;
26+
const zone = Zone.current.fork({name: 'zone'});
27+
const logs: string[] = [];
28+
zone.run(
29+
() => { target.addEventListener('click', () => { logs.push(Zone.current.name); }); });
30+
const event = document.createEvent('MouseEvent');
31+
event.initEvent('click', true, true);
32+
target.dispatchEvent(event);
33+
expect(logs).toEqual(['zone']);
34+
});
35+
});
36+
});

‎packages/zone.js/test/browser_shadydom_entry_point.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/**
2+
* @license
3+
* Copyright Google Inc. All Rights Reserved.
4+
*
5+
* Use of this source code is governed by an MIT-style license that can be
6+
* found in the LICENSE file at https://angular.io/license
7+
*/
8+
import './browser/shadydom.spec';

‎packages/zone.js/test/browser_shadydom_setup.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/**
2+
* @license
3+
* Copyright Google Inc. All Rights Reserved.
4+
*
5+
* Use of this source code is governed by an MIT-style license that can be
6+
* found in the LICENSE file at https://angular.io/license
7+
*/
8+
function initAddEventListeners() {
9+
const HTMLSlotElement = (window as any).HTMLSlotElement;
10+
const prototypes = [
11+
Object.getPrototypeOf(window), Node.prototype, Text.prototype, Element.prototype,
12+
Object.getPrototypeOf(window), HTMLElement.prototype,
13+
HTMLSlotElement && HTMLSlotElement.prototype, DocumentFragment.prototype, Document.prototype
14+
];
15+
prototypes.forEach(proto => {
16+
proto.addEventListener = function(eventName: string, callback: any) {
17+
this.callback = callback;
18+
};
19+
proto.dispatchEvent = function(event: any) {
20+
this.callback && this.callback.call(this, event);
21+
};
22+
});
23+
}
24+
25+
initAddEventListeners();

0 commit comments

Comments
 (0)