From 52880f08ee92f194b9a2235dc2f763e7d035a416 Mon Sep 17 00:00:00 2001
From: Isabelle Viktoria Maciohsek <maciv@hotmail.gr>
Date: Tue, 20 Oct 2020 11:46:23 +0300
Subject: [PATCH] Update document, window

---
 snippets/arrayToHTMLList.md            | 2 +-
 snippets/copyToClipboard.md            | 2 +-
 snippets/counter.md                    | 2 +-
 snippets/currentURL.md                 | 2 +-
 snippets/elementIsVisibleInViewport.md | 2 +-
 snippets/getProtocol.md                | 2 +-
 snippets/injectCSS.md                  | 4 ++--
 snippets/prefersDarkColorScheme.md     | 2 +-
 snippets/prefersLightColorScheme.md    | 2 +-
 snippets/prefix.md                     | 2 +-
 snippets/recordAnimationFrames.md      | 2 +-
 snippets/redirect.md                   | 2 +-
 snippets/scrollToTop.md                | 4 ++--
 snippets/serializeForm.md              | 2 +-
 14 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/snippets/arrayToHTMLList.md b/snippets/arrayToHTMLList.md
index 9dedaafa5..9a07d585e 100644
--- a/snippets/arrayToHTMLList.md
+++ b/snippets/arrayToHTMLList.md
@@ -5,7 +5,7 @@ tags: browser,array,intermediate
 
 Converts the given array elements into `<li>` tags and appends them to the list of the given id.
 
-- Use `Array.prototype.map()` and `document.querySelector()` to create a list of html tags.
+- Use `Array.prototype.map()` and `Document.querySelector()` to create a list of html tags.
 
 ```js
 const arrayToHTMLList = (arr, listID) => 
diff --git a/snippets/copyToClipboard.md b/snippets/copyToClipboard.md
index f63abf5e5..d9f93ff55 100644
--- a/snippets/copyToClipboard.md
+++ b/snippets/copyToClipboard.md
@@ -8,7 +8,7 @@ Only works as a result of user action (i.e. inside a `click` event listener).
 
 - Create a new `<textarea>` element, fill it with the supplied data and add it to the HTML document.
 - Use `Selection.getRangeAt()`to store the selected range (if any).
-- Use `document.execCommand('copy')` to copy to the clipboard.
+- Use `Document.execCommand('copy')` to copy to the clipboard.
 - Remove the `<textarea>` element from the HTML document.
 - Finally, use `Selection().addRange()` to recover the original selected range (if any).
 - ⚠️ **NOTICE:** The same functionality can be easily implemented by using the new asynchronous Clipboard API, which is still experimental but should be used in the future instead of this snippet. Find out more about it [here](https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc#writing-to-the-clipboard).
diff --git a/snippets/counter.md b/snippets/counter.md
index 275a8a221..5dfc2dbff 100644
--- a/snippets/counter.md
+++ b/snippets/counter.md
@@ -7,7 +7,7 @@ Creates a counter with the specified range, step and duration for the specified
 
 - Check if `step` has the proper sign and change it accordingly.
 - Use `setInterval()` in combination with `Math.abs()` and `Math.floor()` to calculate the time between each new text draw.
-- Use `document.querySelector().innerHTML` to update the value of the selected element.
+- Use `Document.querySelector()`, `Element.innerHTML` to update the value of the selected element.
 - Omit the fourth parameter, `step`, to use a default step of `1`.
 - Omit the fifth parameter, `duration`, to use a default duration of `2000`ms.
 
diff --git a/snippets/currentURL.md b/snippets/currentURL.md
index 723c010a0..a17b81ff0 100644
--- a/snippets/currentURL.md
+++ b/snippets/currentURL.md
@@ -5,7 +5,7 @@ tags: browser,beginner
 
 Returns the current URL.
 
-- Use `window.location.href` to get the current URL.
+- Use `Window.location.href` to get the current URL.
 
 ```js
 const currentURL = () => window.location.href;
diff --git a/snippets/elementIsVisibleInViewport.md b/snippets/elementIsVisibleInViewport.md
index d01b56bc9..db3fae005 100644
--- a/snippets/elementIsVisibleInViewport.md
+++ b/snippets/elementIsVisibleInViewport.md
@@ -5,7 +5,7 @@ tags: browser,intermediate
 
 Checks if the element specified is visible in the viewport.
 
-- Use `Element.getBoundingClientRect()` and the `window.inner(Width|Height)` values to determine if a given element is visible in the viewport.
+- Use `Element.getBoundingClientRect()` and the `Window.inner(Width|Height)` values to determine if a given element is visible in the viewport.
 - Omit the second argument to determine if the element is entirely visible, or specify `true` to determine if it is partially visible.
 
 ```js
diff --git a/snippets/getProtocol.md b/snippets/getProtocol.md
index 36dae5297..507aeeae8 100644
--- a/snippets/getProtocol.md
+++ b/snippets/getProtocol.md
@@ -5,7 +5,7 @@ tags: browser,beginner
 
 Gets the protocol being used on the current page.
 
-- Use `window.location.protocol` to get the protocol (`http:` or `https:`) of the current page.
+- Use `Window.location.protocol` to get the protocol (`http:` or `https:`) of the current page.
 
 ```js
 const getProtocol = () => window.location.protocol;
diff --git a/snippets/injectCSS.md b/snippets/injectCSS.md
index 953d90fc4..c4514206b 100644
--- a/snippets/injectCSS.md
+++ b/snippets/injectCSS.md
@@ -5,8 +5,8 @@ tags: browser,css,intermediate
 
 Injects the given css code into the current document
 
-- Use `document.createElement()` to create a new `style` element and set its type to `text/css`.
-- Use `Element.innerText` to set the value to the given css string, `document.head` and `Element.appendChild()` to append the new element to the document head.
+- Use `Document.createElement()` to create a new `style` element and set its type to `text/css`.
+- Use `Element.innerText` to set the value to the given css string, `Document.head` and `Element.appendChild()` to append the new element to the document head.
 - Return the newly created `style` element.
 
 ```js
diff --git a/snippets/prefersDarkColorScheme.md b/snippets/prefersDarkColorScheme.md
index 0c97be339..0483c6e47 100644
--- a/snippets/prefersDarkColorScheme.md
+++ b/snippets/prefersDarkColorScheme.md
@@ -5,7 +5,7 @@ tags: browser,intermediate
 
 Returns `true` if the user color scheme preference is `dark`, `false` otherwise.
 
-- Use `window.matchMedia()` with the appropriate media query to check the user color scheme preference.
+- Use `Window.matchMedia()` with the appropriate media query to check the user color scheme preference.
 
 ```js
 const prefersDarkColorScheme = () =>
diff --git a/snippets/prefersLightColorScheme.md b/snippets/prefersLightColorScheme.md
index 36e3079d6..13752b088 100644
--- a/snippets/prefersLightColorScheme.md
+++ b/snippets/prefersLightColorScheme.md
@@ -5,7 +5,7 @@ tags: browser,intermediate
 
 Returns `true` if the user color scheme preference is `light`, `false` otherwise.
 
-- Use `window.matchMedia()` with the appropriate media query to check the user color scheme preference.
+- Use `Window.matchMedia()` with the appropriate media query to check the user color scheme preference.
 
 ```js
 const prefersLightColorScheme = () =>
diff --git a/snippets/prefix.md b/snippets/prefix.md
index 67d54d1de..da611b477 100644
--- a/snippets/prefix.md
+++ b/snippets/prefix.md
@@ -5,7 +5,7 @@ tags: browser,intermediate
 
 Returns the prefixed version (if necessary) of a CSS property that the browser supports.
 
-- Use `Array.prototype.findIndex()` on an array of vendor prefix strings to test if `document.body` has one of them defined in its `CSSStyleDeclaration` object, otherwise return `null`.
+- Use `Array.prototype.findIndex()` on an array of vendor prefix strings to test if `Document.body` has one of them defined in its `CSSStyleDeclaration` object, otherwise return `null`.
 - Use `String.prototype.charAt()` and `String.prototype.toUpperCase()` to capitalize the property, which will be appended to the vendor prefix string.
 
 ```js
diff --git a/snippets/recordAnimationFrames.md b/snippets/recordAnimationFrames.md
index a840ba474..f0eb004cb 100644
--- a/snippets/recordAnimationFrames.md
+++ b/snippets/recordAnimationFrames.md
@@ -6,7 +6,7 @@ tags: browser,intermediate
 Invokes the provided callback on each animation frame.
 
 - Use recursion.
-- Provided that `running` is `true`, continue invoking `window.requestAnimationFrame()` which invokes the provided callback.
+- Provided that `running` is `true`, continue invoking `Window.requestAnimationFrame()` which invokes the provided callback.
 - Return an object with two methods `start` and `stop` to allow manual control of the recording.
 - Omit the second argument, `autoStart`, to implicitly call `start` when the function is invoked.
 
diff --git a/snippets/redirect.md b/snippets/redirect.md
index 726d8176e..493cc5c08 100644
--- a/snippets/redirect.md
+++ b/snippets/redirect.md
@@ -5,7 +5,7 @@ tags: browser,beginner
 
 Redirects to a specified URL.
 
-- Use `window.location.href` or `window.location.replace()` to redirect to `url`.
+- Use `Window.location.href` or `Window.location.replace()` to redirect to `url`.
 - Pass a second argument to simulate a link click (`true` - default) or an HTTP redirect (`false`).
 
 ```js
diff --git a/snippets/scrollToTop.md b/snippets/scrollToTop.md
index bd1c4ba5e..a7fe6eeea 100644
--- a/snippets/scrollToTop.md
+++ b/snippets/scrollToTop.md
@@ -5,9 +5,9 @@ tags: browser,intermediate
 
 Smooth-scrolls to the top of the page.
 
-- Get distance from top using `document.documentElement.scrollTop` or `document.body.scrollTop`.
+- Get distance from top using `Document.documentElement` or `Document.body` and `Element.scrollTop`.
 - Scroll by a fraction of the distance from the top.
-- Use `window.requestAnimationFrame()` to animate the scrolling.
+- Use `Window.requestAnimationFrame()` to animate the scrolling.
 
 ```js
 const scrollToTop = () => {
diff --git a/snippets/serializeForm.md b/snippets/serializeForm.md
index 6a029170a..d03b297b8 100644
--- a/snippets/serializeForm.md
+++ b/snippets/serializeForm.md
@@ -6,7 +6,7 @@ tags: browser,string,intermediate
 Encode a set of form elements as a query string.
 
 - Use the `FormData` constructor to convert the HTML `form` to `FormData`, `Array.from()` to convert to an array, passing a map function as the second argument.
-- Use `Array.prototype.map()` and `window.encodeURIComponent()` to encode each field's value.
+- Use `Array.prototype.map()` and `encodeURIComponent()` to encode each field's value.
 - Use `Array.prototype.join()` with appropriate argumens to produce an appropriate query string.
 
 ```js