From ceaa14d83844019900f7483ae6a1799547a4a69c Mon Sep 17 00:00:00 2001
From: "Queen Vinyl Da.i'gyu-Kazotetsu" <vinyldarkscratch@gmail.com>
Date: Fri, 11 Feb 2022 07:34:55 -0800
Subject: [PATCH] Adapt `CookieStore` change event to new structure

---
 files/en-us/_redirects.txt                    |  1 +
 .../web/api/cookiestore/change_event/index.md | 51 +++++++++++++++++++
 files/en-us/web/api/cookiestore/index.md      | 12 ++---
 .../web/api/cookiestore/onchange/index.md     | 47 -----------------
 4 files changed, 57 insertions(+), 54 deletions(-)
 create mode 100644 files/en-us/web/api/cookiestore/change_event/index.md
 delete mode 100644 files/en-us/web/api/cookiestore/onchange/index.md

diff --git a/files/en-us/_redirects.txt b/files/en-us/_redirects.txt
index 3656c88f179af2f..dcca9ebc523a495 100644
--- a/files/en-us/_redirects.txt
+++ b/files/en-us/_redirects.txt
@@ -7486,6 +7486,7 @@
 /en-US/docs/Web/API/Constraint_validation/invalid_event	/en-US/docs/Web/API/HTMLInputElement/invalid_event
 /en-US/docs/Web/API/ConvolverNode.buffer	/en-US/docs/Web/API/ConvolverNode/buffer
 /en-US/docs/Web/API/ConvolverNode.normalize	/en-US/docs/Web/API/ConvolverNode/normalize
+/en-US/docs/Web/API/CookieStore/onchange	/en-US/docs/Web/API/CookieStore/change_event
 /en-US/docs/Web/API/Coordinates	/en-US/docs/Web/API/GeolocationCoordinates
 /en-US/docs/Web/API/Coordinates.accuracy	/en-US/docs/Web/API/GeolocationCoordinates/accuracy
 /en-US/docs/Web/API/Coordinates.altitude	/en-US/docs/Web/API/GeolocationCoordinates/altitude
diff --git a/files/en-us/web/api/cookiestore/change_event/index.md b/files/en-us/web/api/cookiestore/change_event/index.md
new file mode 100644
index 000000000000000..dea0a21d28fe5b5
--- /dev/null
+++ b/files/en-us/web/api/cookiestore/change_event/index.md
@@ -0,0 +1,51 @@
+---
+title: 'CookieStore: change event'
+slug: Web/API/CookieStore/change_event
+tags:
+  - API
+  - Reference
+  - Event
+  - change
+  - onchange
+  - CookieStore
+browser-compat: api.CookieStore.change_event
+---
+{{securecontext_header}}{{DefaultAPISidebar("Cookie Store API")}}
+
+A `change` event is fired at a {{domxref("CookieStore")}} object when a change is made to any cookie.
+
+## Syntax
+
+Use the event name in methods like {{domxref("EventTarget.addEventListener", "addEventListener()")}}, or set an event handler property.
+
+```js
+cookieStore.addEventListener('change', event => { })
+
+cookieStore.onchange = event => { }
+```
+
+## Examples
+
+To be informed when a cookie has changed, you can add a handler to the `cookieStore` instance using {{domxref("EventTarget.addEventListener", "addEventListener()")}}, like this:
+
+```js
+cookieStore.addEventListener('change', function(event) {
+  console.log('1 change event');
+});
+```
+
+Alternatively, you can use the `CookieStore.onchange` event handler property to establish a handler for the `change` event:
+
+```js
+cookieStore.onchange = function(event) {
+    console.log('1 change event');
+};
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
diff --git a/files/en-us/web/api/cookiestore/index.md b/files/en-us/web/api/cookiestore/index.md
index 5e9fadcf47b0be0..50826f476fe72a0 100644
--- a/files/en-us/web/api/cookiestore/index.md
+++ b/files/en-us/web/api/cookiestore/index.md
@@ -16,13 +16,6 @@ The `CookieStore` is accessed via attributes in the global scope in a {{domxref(
 
 {{InheritanceDiagram}}
 
-## Properties
-
-### Event handlers
-
-- {{domxref("CookieStore.onChange")}}
-  - : The `onchange` EventHandler is called whenever a cookie is changed.
-
 ## Methods
 
 - {{domxref("CookieStore.delete()")}}
@@ -34,6 +27,11 @@ The `CookieStore` is accessed via attributes in the global scope in a {{domxref(
 - {{domxref("CookieStore.set()")}}
   - : The `set()` method sets a cookie with the given name and value or options object, it returns a {{jsxref("Promise")}} that resolves when the cookie is set.
 
+## Events
+
+- {{domxref("CookieStore.change_event")}}
+  - : The `change` event fires when a change is made to any cookie.
+
 ## Examples
 
 In this example we set a cookie and write to the console feedback as to whether the operation succeeded or failed.
diff --git a/files/en-us/web/api/cookiestore/onchange/index.md b/files/en-us/web/api/cookiestore/onchange/index.md
deleted file mode 100644
index 0e692a384f6a406..000000000000000
--- a/files/en-us/web/api/cookiestore/onchange/index.md
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: CookieStore.onchange
-slug: Web/API/CookieStore/onchange
-tags:
-  - API
-  - Property
-  - Reference
-  - onchange
-  - CookieStore
-browser-compat: api.CookieStore.onchange
----
-{{securecontext_header}}{{DefaultAPISidebar("Cookie Store API")}}
-
-The **`onchange`** EventHandler of the {{domxref("CookieStore")}} interface fires when a change is made to any cookie.
-
-## Syntax
-
-```js
-CookieStore.onchange = function() { /* ... */ }
-CookieStore.addEventListener('change', function() { /* ... */ })
-```
-
-## Examples
-
-In this example we listen for changes using the `onchange` event handler.
-
-```js
-cookieStore.onchange = function() {
-    console.log('1 change event');
-};
-```
-
-In this example we listen for changes using {{domxref("EventTarget.addEventListener","addEventListener()")}}.
-
-```js
-cookieStore.addEventListener('change', (event) => {
-  console.log('1 change event');
-});
-```
-
-## Specifications
-
-{{Specifications}}
-
-## Browser compatibility
-
-{{Compat}}