From 21aa4bb09704b963a65c1231f6e8586680f22b9d Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Tue, 22 Oct 2024 10:34:22 +0000
Subject: [PATCH 1/3] Revert ":bug: Add missing `cancel` event to `` (#29639)"
This reverts commit 0900a5665090b4dc3b4936af5a48591521032bfd.
---
files/en-us/_redirects.txt | 5 ++---
files/en-us/_wikihistory.json | 12 ++++++++++++
.../cancel_event/index.md | 9 ++++-----
files/en-us/web/api/htmldialogelement/index.md | 4 +++-
.../web/api/htmldialogelement/showmodal/index.md | 2 +-
files/en-us/web/html/element/dialog/index.md | 2 +-
files/en-us/web/html/element/input/file/index.md | 5 ++---
7 files changed, 25 insertions(+), 14 deletions(-)
rename files/en-us/web/api/{htmlelement => htmldialogelement}/cancel_event/index.md (81%)
diff --git a/files/en-us/_redirects.txt b/files/en-us/_redirects.txt
index cf6ea6df153ca55..66594af0283dcbd 100644
--- a/files/en-us/_redirects.txt
+++ b/files/en-us/_redirects.txt
@@ -8099,7 +8099,7 @@
/en-US/docs/Web/API/Element/MozMousePixelScroll /en-US/docs/Web/API/Element/MozMousePixelScroll_event
/en-US/docs/Web/API/Element/accessKey /en-US/docs/Web/API/HTMLElement/accessKey
/en-US/docs/Web/API/Element/attachInternals /en-US/docs/Web/API/HTMLElement/attachInternals
-/en-US/docs/Web/API/Element/cancel_event /en-US/docs/Web/API/HTMLElement/cancel_event
+/en-US/docs/Web/API/Element/cancel_event /en-US/docs/Web/API/HTMLDialogElement/cancel_event
/en-US/docs/Web/API/Element/contentvisibilityautostatechanged_event /en-US/docs/Web/API/Element/contentvisibilityautostatechange_event
/en-US/docs/Web/API/Element/createShadowRoot /en-US/docs/Web/API/Element/shadowRoot
/en-US/docs/Web/API/Element/error_event /en-US/docs/Web/API/HTMLElement/error_event
@@ -8417,7 +8417,6 @@
/en-US/docs/Web/API/HTMLContentElement.select /en-US/docs/Web/API/HTMLSlotElement
/en-US/docs/Web/API/HTMLContentElement/getDistributedNodes /en-US/docs/Web/API/HTMLSlotElement
/en-US/docs/Web/API/HTMLContentElement/select /en-US/docs/Web/API/HTMLSlotElement
-/en-US/docs/Web/API/HTMLDialogElement/cancel_event /en-US/docs/Web/API/HTMLElement/cancel_event
/en-US/docs/Web/API/HTMLDialogElement/close() /en-US/docs/Web/API/HTMLDialogElement/close
/en-US/docs/Web/API/HTMLDialogElement/returnValue() /en-US/docs/Web/API/HTMLDialogElement/returnValue
/en-US/docs/Web/API/HTMLDialogElement/show() /en-US/docs/Web/API/HTMLDialogElement/show
@@ -11786,7 +11785,7 @@
/en-US/docs/Web/Events/blur /en-US/docs/Web/API/Element/blur_event
/en-US/docs/Web/Events/boundary /en-US/docs/Web/API/SpeechSynthesisUtterance/boundary_event
/en-US/docs/Web/Events/bufferedamountlow /en-US/docs/Web/API/RTCDataChannel/bufferedamountlow_event
-/en-US/docs/Web/Events/cancel /en-US/docs/Web/API/HTMLElement/cancel_event
+/en-US/docs/Web/Events/cancel /en-US/docs/Web/API/HTMLDialogElement/cancel_event
/en-US/docs/Web/Events/canplay /en-US/docs/Web/API/HTMLMediaElement/canplay_event
/en-US/docs/Web/Events/canplaythrough /en-US/docs/Web/API/HTMLMediaElement/canplaythrough_event
/en-US/docs/Web/Events/change /en-US/docs/Web/API/HTMLElement/change_event
diff --git a/files/en-us/_wikihistory.json b/files/en-us/_wikihistory.json
index 1d7a283be7aa228..23db03af12c139f 100644
--- a/files/en-us/_wikihistory.json
+++ b/files/en-us/_wikihistory.json
@@ -37674,6 +37674,18 @@
"dhodder"
]
},
+ "Web/API/HTMLDialogElement/cancel_event": {
+ "modified": "2020-10-15T21:43:04.572Z",
+ "contributors": [
+ "mfuji09",
+ "fscholz",
+ "mfluehr",
+ "sideshowbarker",
+ "fgwang",
+ "rolfedh",
+ "cvrebert"
+ ]
+ },
"Web/API/HTMLDialogElement/close": {
"modified": "2020-10-15T21:52:17.118Z",
"contributors": ["fscholz", "chrisdavidmills"]
diff --git a/files/en-us/web/api/htmlelement/cancel_event/index.md b/files/en-us/web/api/htmldialogelement/cancel_event/index.md
similarity index 81%
rename from files/en-us/web/api/htmlelement/cancel_event/index.md
rename to files/en-us/web/api/htmldialogelement/cancel_event/index.md
index 407134037bbfdf3..4af35a984023328 100644
--- a/files/en-us/web/api/htmlelement/cancel_event/index.md
+++ b/files/en-us/web/api/htmldialogelement/cancel_event/index.md
@@ -1,14 +1,14 @@
---
-title: "HTMLElement: cancel event"
+title: "HTMLDialogElement: cancel event"
short-title: cancel
-slug: Web/API/HTMLElement/cancel_event
+slug: Web/API/HTMLDialogElement/cancel_event
page-type: web-api-event
-browser-compat: api.HTMLElement.cancel_event
+browser-compat: api.HTMLDialogElement.cancel_event
---
{{APIRef}}
-The **`cancel`** event is fired by {{HTMLElement("input")}} and {{HTMLElement("dialog")}} elements. The event is fired when the user cancels the currently open dialog by closing it with the Esc key. It is also fired by the [file input](/en-US/docs/Web/HTML/Element/input/file) when the user cancels the file picker dialog via the Esc key or the cancel button and when the user re-selects the same files that were previously selected.
+The **`cancel`** event fires on a {{HTMLElement("dialog")}} when the user instructs the browser that they wish to dismiss the current open dialog. The browser fires this event when the user presses the Esc key.
This event does not bubble.
@@ -133,6 +133,5 @@ Open the file selector, then close the selection dialog with the escape key or t
## See also
-- HTML {{HTMLElement("input")}} element
- HTML {{HTMLElement("dialog")}} element
- {{domxref("HTMLDialogElement/close_event", "close")}}
diff --git a/files/en-us/web/api/htmldialogelement/index.md b/files/en-us/web/api/htmldialogelement/index.md
index 5fd18af5566fcda..952a5ba6e05fdce 100644
--- a/files/en-us/web/api/htmldialogelement/index.md
+++ b/files/en-us/web/api/htmldialogelement/index.md
@@ -37,6 +37,8 @@ _Also inherits events from its parent interface, {{DOMxRef("HTMLElement")}}._
Listen to these events using {{DOMxRef("EventTarget.addEventListener", "addEventListener()")}} or by assigning an event listener to the `oneventname` property of this interface.
+- {{domxref("HTMLDialogElement/cancel_event", "cancel")}}
+ - : Fired when the user dismisses the current open dialog with the escape key.
- {{domxref("HTMLDialogElement/close_event", "close")}}
- : Fired when the dialog is closed, whether with the escape key, the `HTMLDialogElement.close()` method, or via submitting a form within the dialog with [`method="dialog"`](/en-US/docs/Web/HTML/Element/form#method).
@@ -44,7 +46,7 @@ Listen to these events using {{DOMxRef("EventTarget.addEventListener", "addEvent
### Opening a modal dialog
-The following example shows a button that, when clicked, opens a modal {{htmlelement("dialog")}} containing a form via the {{domxref("HTMLDialogElement.showModal()")}} function. While open, everything other than the modal dialog's contents is inert. From there you can click the _Cancel_ button to close the dialog (via the {{domxref("HTMLDialogElement.close()")}} function), or submit the form via the submit button. Selecting the cancel button closes the dialog, creating a {{domxref("HTMLDialogElement/close_event", "close")}} event, not a {{domxref("HTMLElement/cancel_event", "cancel")}} event.
+The following example shows a button that, when clicked, opens a modal {{htmlelement("dialog")}} containing a form via the {{domxref("HTMLDialogElement.showModal()")}} function. While open, everything other than the modal dialog's contents is inert. From there you can click the _Cancel_ button to close the dialog (via the {{domxref("HTMLDialogElement.close()")}} function), or submit the form via the submit button. Selecting the cancel button closes the dialog, creating a {{domxref("HTMLDialogElement/close_event", "close")}} event, not a {{domxref("HTMLDialogElement/cancel_event", "cancel")}} event.
#### HTML
diff --git a/files/en-us/web/api/htmldialogelement/showmodal/index.md b/files/en-us/web/api/htmldialogelement/showmodal/index.md
index 2edc8bee8fa6c0e..fa1192568e1edcb 100644
--- a/files/en-us/web/api/htmldialogelement/showmodal/index.md
+++ b/files/en-us/web/api/htmldialogelement/showmodal/index.md
@@ -37,7 +37,7 @@ None ({{jsxref("undefined")}}).
### Opening a modal dialog
-The following example shows a button that, when clicked, opens a modal {{htmlelement("dialog")}} containing a form via the `HTMLDialogElement.showModal()` function. While open, everything other than the modal dialog's contents is inert. From there you can click the _Cancel_ button to close the dialog (via the {{domxref("HTMLDialogElement.close()")}} function), or submit the form via the submit button. Selecting the cancel button closes the dialog, creating a {{domxref("HTMLDialogElement/close_event", "close")}} event, not a {{domxref("HTMLElement/cancel_event", "cancel")}} event.
+The following example shows a button that, when clicked, opens a modal {{htmlelement("dialog")}} containing a form via the `HTMLDialogElement.showModal()` function. While open, everything other than the modal dialog's contents is inert. From there you can click the _Cancel_ button to close the dialog (via the {{domxref("HTMLDialogElement.close()")}} function), or submit the form via the submit button. Selecting the cancel button closes the dialog, creating a {{domxref("HTMLDialogElement/close_event", "close")}} event, not a {{domxref("HTMLDialogElement/cancel_event", "cancel")}} event.
#### HTML
diff --git a/files/en-us/web/html/element/dialog/index.md b/files/en-us/web/html/element/dialog/index.md
index aae15407b9a1f3c..48f84e2f9889c8a 100644
--- a/files/en-us/web/html/element/dialog/index.md
+++ b/files/en-us/web/html/element/dialog/index.md
@@ -572,7 +572,7 @@ The code renders as follows:
- {{domxref("HTMLDialogElement")}} interface
- {{domxref("HTMLDialogElement/close_event", "close")}} event
-- {{domxref("HTMLElement/cancel_event", "cancel")}} event
+- {{domxref("HTMLDialogElement/cancel_event", "cancel")}} event
- {{domxref("HTMLDialogElement/open", "open")}} property of the `HTMLDialogElement` interface
- [`inert`](/en-US/docs/Web/HTML/Global_attributes/inert) global attribute for HTML elements
- {{CSSXref("::backdrop")}} CSS pseudo-element
diff --git a/files/en-us/web/html/element/input/file/index.md b/files/en-us/web/html/element/input/file/index.md
index e684b364b5685bc..e947bb2289abf39 100644
--- a/files/en-us/web/html/element/input/file/index.md
+++ b/files/en-us/web/html/element/input/file/index.md
@@ -434,9 +434,8 @@ The example looks like this; have a play:
Events
- {{domxref("HTMLElement/change_event", "change")}},
- {{domxref("Element/input_event", "input")}} and
- {{domxref("HTMLElement/cancel_event", "cancel")}}
+ {{domxref("HTMLElement/change_event", "change")}} and
+ {{domxref("Element/input_event", "input")}}
From ff541ae596d84028d52666b865468888b93a4545 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Tue, 22 Oct 2024 19:34:57 +0800
Subject: [PATCH 2/3] update & finish docs
---
.../htmldialogelement/cancel_event/index.md | 46 +----------
.../en-us/web/api/htmldialogelement/index.md | 4 +-
.../htmlinputelement/cancel_event/index.md | 82 +++++++++++++++++++
files/en-us/web/api/htmlinputelement/index.md | 12 +--
files/en-us/web/html/element/dialog/index.md | 4 +-
.../web/html/element/input/file/index.md | 10 +--
6 files changed, 99 insertions(+), 59 deletions(-)
create mode 100644 files/en-us/web/api/htmlinputelement/cancel_event/index.md
diff --git a/files/en-us/web/api/htmldialogelement/cancel_event/index.md b/files/en-us/web/api/htmldialogelement/cancel_event/index.md
index 4af35a984023328..3eaafdbd2bc84f8 100644
--- a/files/en-us/web/api/htmldialogelement/cancel_event/index.md
+++ b/files/en-us/web/api/htmldialogelement/cancel_event/index.md
@@ -8,9 +8,9 @@ browser-compat: api.HTMLDialogElement.cancel_event
{{APIRef}}
-The **`cancel`** event fires on a {{HTMLElement("dialog")}} when the user instructs the browser that they wish to dismiss the current open dialog. The browser fires this event when the user presses the Esc key.
+The **`cancel`** event fires on a {{HTMLElement("dialog")}} element when the user instructs the browser that they wish to dismiss the current open dialog. The browser fires this event when the user presses the Esc key.
-This event does not bubble.
+This event is cancelable but can not bubble.
When a `