From 90764c6e3aba6e8e5b76cb1ce55b4b6809835a5f Mon Sep 17 00:00:00 2001 From: Sam Thorogood Date: Mon, 11 Jan 2021 11:28:49 +1100 Subject: [PATCH 1/2] fix possible .submitter being null --- dist/dialog-polyfill.esm.js | 16 +++++++++------- dist/dialog-polyfill.js | 16 +++++++++------- index.js | 16 +++++++++------- package.json | 2 +- 4 files changed, 28 insertions(+), 22 deletions(-) diff --git a/dist/dialog-polyfill.esm.js b/dist/dialog-polyfill.esm.js index 073d953..16cd085 100644 --- a/dist/dialog-polyfill.esm.js +++ b/dist/dialog-polyfill.esm.js @@ -153,7 +153,7 @@ function findFocusableElementWithin(hostElement) { /** * Determines if an element is attached to the DOM. * @param {Element} element to check - * @return {Boolean} whether the element is in DOM + * @return {boolean} whether the element is in DOM */ function isConnected(element) { return element.isConnected || document.body.contains(element); @@ -161,6 +161,7 @@ function isConnected(element) { /** * @param {!Event} event + * @return {?Element} */ function findFormSubmitter(event) { if (event.submitter) { @@ -173,7 +174,7 @@ function findFormSubmitter(event) { } var submitter = dialogPolyfill.formSubmitter; - if (!submitter) { + if (!submitter || submitter.form !== form) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; @@ -195,7 +196,7 @@ function maybeHandleSubmit(event) { var form = /** @type {!HTMLFormElement} */ (event.target); // We'd have a value if we clicked on an imagemap. - var value = dialogPolyfill.useValue; + var value = dialogPolyfill.imagemapUseValue; var submitter = findFormSubmitter(event); if (value === null && submitter) { value = submitter.value; @@ -215,7 +216,8 @@ function maybeHandleSubmit(event) { } event.preventDefault(); - if (submitter) { + if (value != null) { + // nb. we explicitly check against null/undefined dialog.close(value); } else { dialog.close(); @@ -751,7 +753,7 @@ dialogPolyfill.DialogManager.prototype.removeDialog = function(dpi) { dialogPolyfill.dm = new dialogPolyfill.DialogManager(); dialogPolyfill.formSubmitter = null; -dialogPolyfill.useValue = null; +dialogPolyfill.imagemapUseValue = null; /** * Installs global handlers, such as click listers and native method overrides. These are needed @@ -796,7 +798,7 @@ if (window.HTMLDialogElement === undefined) { */ document.addEventListener('click', function(ev) { dialogPolyfill.formSubmitter = null; - dialogPolyfill.useValue = null; + dialogPolyfill.imagemapUseValue = null; if (ev.defaultPrevented) { return; } // e.g. a submit which prevents default submission var target = /** @type {Element} */ (ev.target); @@ -810,7 +812,7 @@ if (window.HTMLDialogElement === undefined) { if (!valid) { if (!(target.localName === 'input' && target.type === 'image')) { return; } // this is a , which can submit forms - dialogPolyfill.useValue = ev.offsetX + ',' + ev.offsetY; + dialogPolyfill.imagemapUseValue = ev.offsetX + ',' + ev.offsetY; } var dialog = findNearestDialog(target); diff --git a/dist/dialog-polyfill.js b/dist/dialog-polyfill.js index 8dfd245..8a5ca03 100644 --- a/dist/dialog-polyfill.js +++ b/dist/dialog-polyfill.js @@ -159,7 +159,7 @@ /** * Determines if an element is attached to the DOM. * @param {Element} element to check - * @return {Boolean} whether the element is in DOM + * @return {boolean} whether the element is in DOM */ function isConnected(element) { return element.isConnected || document.body.contains(element); @@ -167,6 +167,7 @@ /** * @param {!Event} event + * @return {?Element} */ function findFormSubmitter(event) { if (event.submitter) { @@ -179,7 +180,7 @@ } var submitter = dialogPolyfill.formSubmitter; - if (!submitter) { + if (!submitter || submitter.form !== form) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; @@ -201,7 +202,7 @@ var form = /** @type {!HTMLFormElement} */ (event.target); // We'd have a value if we clicked on an imagemap. - var value = dialogPolyfill.useValue; + var value = dialogPolyfill.imagemapUseValue; var submitter = findFormSubmitter(event); if (value === null && submitter) { value = submitter.value; @@ -221,7 +222,8 @@ } event.preventDefault(); - if (submitter) { + if (value != null) { + // nb. we explicitly check against null/undefined dialog.close(value); } else { dialog.close(); @@ -757,7 +759,7 @@ dialogPolyfill.dm = new dialogPolyfill.DialogManager(); dialogPolyfill.formSubmitter = null; - dialogPolyfill.useValue = null; + dialogPolyfill.imagemapUseValue = null; /** * Installs global handlers, such as click listers and native method overrides. These are needed @@ -802,7 +804,7 @@ */ document.addEventListener('click', function(ev) { dialogPolyfill.formSubmitter = null; - dialogPolyfill.useValue = null; + dialogPolyfill.imagemapUseValue = null; if (ev.defaultPrevented) { return; } // e.g. a submit which prevents default submission var target = /** @type {Element} */ (ev.target); @@ -816,7 +818,7 @@ if (!valid) { if (!(target.localName === 'input' && target.type === 'image')) { return; } // this is a , which can submit forms - dialogPolyfill.useValue = ev.offsetX + ',' + ev.offsetY; + dialogPolyfill.imagemapUseValue = ev.offsetX + ',' + ev.offsetY; } var dialog = findNearestDialog(target); diff --git a/index.js b/index.js index ecddcdd..e857fdc 100644 --- a/index.js +++ b/index.js @@ -154,7 +154,7 @@ function findFocusableElementWithin(hostElement) { /** * Determines if an element is attached to the DOM. * @param {Element} element to check - * @return {Boolean} whether the element is in DOM + * @return {boolean} whether the element is in DOM */ function isConnected(element) { return element.isConnected || document.body.contains(element); @@ -162,6 +162,7 @@ function isConnected(element) { /** * @param {!Event} event + * @return {?Element} */ function findFormSubmitter(event) { if (event.submitter) { @@ -174,7 +175,7 @@ function findFormSubmitter(event) { } var submitter = dialogPolyfill.formSubmitter; - if (!submitter) { + if (!submitter || submitter.form !== form) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; @@ -196,7 +197,7 @@ function maybeHandleSubmit(event) { var form = /** @type {!HTMLFormElement} */ (event.target); // We'd have a value if we clicked on an imagemap. - var value = dialogPolyfill.useValue; + var value = dialogPolyfill.imagemapUseValue; var submitter = findFormSubmitter(event); if (value === null && submitter) { value = submitter.value; @@ -216,7 +217,8 @@ function maybeHandleSubmit(event) { } event.preventDefault(); - if (submitter) { + if (value != null) { + // nb. we explicitly check against null/undefined dialog.close(value); } else { dialog.close(); @@ -754,7 +756,7 @@ dialogPolyfill.DialogManager.prototype.removeDialog = function(dpi) { dialogPolyfill.dm = new dialogPolyfill.DialogManager(); dialogPolyfill.formSubmitter = null; -dialogPolyfill.useValue = null; +dialogPolyfill.imagemapUseValue = null; /** * Installs global handlers, such as click listers and native method overrides. These are needed @@ -799,7 +801,7 @@ if (window.HTMLDialogElement === undefined) { */ document.addEventListener('click', function(ev) { dialogPolyfill.formSubmitter = null; - dialogPolyfill.useValue = null; + dialogPolyfill.imagemapUseValue = null; if (ev.defaultPrevented) { return; } // e.g. a submit which prevents default submission var target = /** @type {Element} */ (ev.target); @@ -813,7 +815,7 @@ if (window.HTMLDialogElement === undefined) { if (!valid) { if (!(target.localName === 'input' && target.type === 'image')) { return; } // this is a , which can submit forms - dialogPolyfill.useValue = ev.offsetX + ',' + ev.offsetY; + dialogPolyfill.imagemapUseValue = ev.offsetX + ',' + ev.offsetY; } var dialog = findNearestDialog(target); diff --git a/package.json b/package.json index 6ce9315..54c6db1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dialog-polyfill", - "version": "0.5.5", + "version": "0.5.6", "description": "Polyfill for the dialog element", "main": "dist/dialog-polyfill.js", "module": "dist/dialog-polyfill.esm.js", From 840c5e5f688554fc5ae7f3612753e1a374426c22 Mon Sep 17 00:00:00 2001 From: Sam Thorogood Date: Mon, 11 Jan 2021 11:32:29 +1100 Subject: [PATCH 2/2] fix bad patch --- dist/dialog-polyfill.esm.js | 4 ++-- dist/dialog-polyfill.js | 4 ++-- index.js | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/dist/dialog-polyfill.esm.js b/dist/dialog-polyfill.esm.js index 16cd085..da774bc 100644 --- a/dist/dialog-polyfill.esm.js +++ b/dist/dialog-polyfill.esm.js @@ -174,13 +174,13 @@ function findFormSubmitter(event) { } var submitter = dialogPolyfill.formSubmitter; - if (!submitter || submitter.form !== form) { + if (!submitter) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; } - if (submitter.form !== form) { + if (!submitter || submitter.form !== form) { return null; } return submitter; diff --git a/dist/dialog-polyfill.js b/dist/dialog-polyfill.js index 8a5ca03..aee7d96 100644 --- a/dist/dialog-polyfill.js +++ b/dist/dialog-polyfill.js @@ -180,13 +180,13 @@ } var submitter = dialogPolyfill.formSubmitter; - if (!submitter || submitter.form !== form) { + if (!submitter) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; } - if (submitter.form !== form) { + if (!submitter || submitter.form !== form) { return null; } return submitter; diff --git a/index.js b/index.js index e857fdc..8adc5ad 100644 --- a/index.js +++ b/index.js @@ -175,13 +175,13 @@ function findFormSubmitter(event) { } var submitter = dialogPolyfill.formSubmitter; - if (!submitter || submitter.form !== form) { + if (!submitter) { var target = event.target; var root = ('getRootNode' in target && target.getRootNode() || document); submitter = root.activeElement; } - if (submitter.form !== form) { + if (!submitter || submitter.form !== form) { return null; } return submitter;