Replace non-standard event.path with event.composedPath
event.path is a non-standard property supported by Chrome but not
supported by Firefox/edge.
https://caniuse.com/?search=composedPath shows support on all major
browsers.
Issue: Bug 13745
Change-Id: Id49a528b52c554093f071c4d538fa97610c66410
diff --git a/polygerrit-ui/app/elements/plugins/gr-event-helper/gr-event-helper.ts b/polygerrit-ui/app/elements/plugins/gr-event-helper/gr-event-helper.ts
index 02fcdec..5a4d2ae 100644
--- a/polygerrit-ui/app/elements/plugins/gr-event-helper/gr-event-helper.ts
+++ b/polygerrit-ui/app/elements/plugins/gr-event-helper/gr-event-helper.ts
@@ -72,8 +72,9 @@
const capture = options?.capture;
const event = options?.event || 'click';
const handler = (e: Event) => {
- if (!e.path) return;
- if (e.path.indexOf(this.element) !== -1) {
+ const path = e.composedPath();
+ if (!path) return;
+ if (path.indexOf(this.element) !== -1) {
let mayContinue = true;
try {
mayContinue = callback(e);
diff --git a/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.ts b/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.ts
index 668ea1b..45f30f5 100644
--- a/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.ts
+++ b/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.ts
@@ -450,7 +450,7 @@
}
_handleBodyClick(e: Event) {
- const eventPath = e.path;
+ const eventPath = e.composedPath();
if (!eventPath) return;
for (let i = 0; i < eventPath.length; i++) {
if (eventPath[i] === this) {
diff --git a/polygerrit-ui/app/utils/dom-util.ts b/polygerrit-ui/app/utils/dom-util.ts
index 8d02119..ca5de4d 100644
--- a/polygerrit-ui/app/utils/dom-util.ts
+++ b/polygerrit-ui/app/utils/dom-util.ts
@@ -167,7 +167,7 @@
export function getEventPath<T extends PolymerEvent>(e?: T) {
if (!e) return '';
- let path = e.path;
+ let path = e.composedPath();
if (!path || !path.length) {
path = [];
let el = e.target;
diff --git a/polygerrit-ui/app/utils/dom-util_test.js b/polygerrit-ui/app/utils/dom-util_test.js
index e2d61ed..bcb4505 100644
--- a/polygerrit-ui/app/utils/dom-util_test.js
+++ b/polygerrit-ui/app/utils/dom-util_test.js
@@ -55,13 +55,13 @@
assert.equal(getEventPath(), '');
assert.equal(getEventPath(null), '');
assert.equal(getEventPath(undefined), '');
- assert.equal(getEventPath({}), '');
+ assert.equal(getEventPath({composedPath: () => []}), '');
});
test('event with fake path', () => {
- assert.equal(getEventPath({path: []}), '');
+ assert.equal(getEventPath({composedPath: () => []}), '');
const dd = document.createElement('dd');
- assert.equal(getEventPath({path: [dd]}), 'dd');
+ assert.equal(getEventPath({composedPath: () => [dd]}), 'dd');
});
test('event with fake complicated path', () => {
@@ -72,7 +72,7 @@
divNode.id = 'test2';
divNode.className = 'a b c';
assert.equal(getEventPath(
- {path: [dd, divNode]}),
+ {composedPath: () => [dd, divNode]}),
'div#test2.a.b.c>dd#test.a.b'
);
});
@@ -88,7 +88,7 @@
const fakeTarget = document.createElement('SPAN');
fakeTargetParent1.appendChild(fakeTarget);
assert.equal(
- getEventPath({target: fakeTarget}),
+ getEventPath({composedPath: () => {}, target: fakeTarget}),
'div#test2.a.b.c>dd#test.a.b>span'
);
});
