fix: syntax errors in JS example sections (v4)

files/en-us/web/api/htmlinputelement/search_event/index.md

@@ -55,14 +55,16 @@ const input = document.querySelector('input[type="search"]');
 
 input.addEventListener('search', () => {
  console.log("The term searched for was " + input.value);
-})
+});
+```
 
+```js
 // onsearch version
 const input = document.querySelector('input[type="search"]');
 
 input.onsearch = () => {
  console.log("The term searched for was " + input.value);
-})
+};
 ```
 
 ## Specifications

files/en-us/web/api/htmlmediaelement/autoplay/index.md

@@ -56,9 +56,9 @@ interruption.
 ```
 
 ```js
-*** Disable autoplay (recommended) ***
-      false is the default value
-        document.querySelector('#video').autoplay = false;
+// Disable autoplay (recommended)
+// false is the default value
+document.querySelector('#video').autoplay = false;
 ```
 
 ## Specifications

files/en-us/web/api/htmlmediaelement/controller/index.md

@@ -21,7 +21,7 @@ A `MediaController` object or `null` if no media controller is assigned to the e
 
 ## Examples
 
-```js
+```
 ...
 ```
 

files/en-us/web/api/htmlmediaelement/loadedmetadata_event/index.md

@@ -55,8 +55,7 @@ Using `addEventListener()`:
 const video = document.querySelector('video');
 
 video.addEventListener('loadedmetadata', (event) => {
-  console.log('The duration and dimensions ' + '
-      of the media and tracks are now known. ');
+  console.log('The duration and dimensions of the media and tracks are now known.');
 });
 ```
 
@@ -66,8 +65,7 @@ Using the `onloadedmetadata` event handler property:
 const video = document.querySelector('video');
 
 video.onloadedmetadata = (event) => {
-  console.log('The duration and dimensions ' + '
-      of the media and tracks are now known. ');
+  console.log('The duration and dimensions of the media and tracks are now known.');
 };
 ```
 

files/en-us/web/api/htmlmediaelement/mediagroup/index.md

@@ -21,7 +21,7 @@ A string.
 
 ## Examples
 
-```js
+```
 ...
 ```
 

files/en-us/web/api/htmlselectelement/add/index.md

@@ -73,10 +73,8 @@ sel.add(opt2, null);
 The before parameter is optional. So the following is accepted.
 
 ```js
-...
 sel.add(opt1);
 sel.add(opt2);
-...
 ```
 
 ### Append to an Existing Collection
@@ -111,9 +109,7 @@ sel.add(opt, null);
 The before parameter is optional. So the following is accepted.
 
 ```js
-...
 sel.add(opt);
-...
 ```
 
 ### Inserting to an Existing Collection

files/en-us/web/api/htmltrackelement/cuechange_event/index.md

@@ -63,7 +63,7 @@ let textTrackElem = document.getElementById("texttrack");
 
 textTrackElem.oncuechange = event => {
   let cues = event.target.track.activeCues;
-});
+};
 ```
 
 ## Specifications

files/en-us/web/api/htmlvideoelement/enterpictureinpicture_event/index.md

@@ -55,7 +55,7 @@ function onEnterPip() {
 
 video.addEventListener('enterpictureinpicture', onEnterPip, false);
 
-button.onclick = function() => {
+button.onclick = () => {
   video.requestPictureInPicture();
 }
 ```
@@ -72,7 +72,7 @@ function onEnterPip() {
 
 video.onenterpictureinpicture = onEnterPip;
 
-button.onclick = function() => {
+button.onclick = () => {
   video.requestPictureInPicture();
 }
 ```

files/en-us/web/api/htmlvideoelement/leavepictureinpicture_event/index.md

@@ -55,7 +55,7 @@ function onExitPip() {
 
 video.addEventListener("leavepictureinpicture", onExitPip, false);
 
-button.onclick = function() => {
+button.onclick = () => {
   if (document.pictureInPictureElement) {
     document.exitPictureInPicture();
   }
@@ -74,7 +74,7 @@ function onExitPip() {
 
 video.onleavepictureinpicture = onExitPip;
 
-button.onclick = function() => {
+button.onclick = () => {
   if (document.pictureInPictureElement) {
     document.exitPictureInPicture();
   }

files/en-us/web/api/htmlvideoelement/mssetvideorectangle/index.md

@@ -38,7 +38,12 @@ This method does not return a value.
 ## Example
 
 ```js
-HTMLVideoElement.msSetVideoRectangle(left: 2, top: 0, right: 4, bottom: 4);
+HTMLVideoElement.msSetVideoRectangle(
+  2, // left
+  0, // top
+  4, // right
+  4, // bottom
+);
 ```
 
 ## See also

files/en-us/web/api/idbdatabase/transaction/index.md

@@ -124,7 +124,7 @@ transaction on the database. For a complete example, see our
 [To-do Notifications](https://github.com/mdn/to-do-notifications/) app ([view example live](https://mdn.github.io/to-do-notifications/).)
 
 ```js
-const db;
+let db;
 
 // Let us open our database
 const DBOpenRequest = window.indexedDB.open("toDoList", 4);

files/en-us/web/api/idbkeyrange/includes/index.md

@@ -46,10 +46,10 @@ A boolean value.
 ```js
 const keyRangeValue = IDBKeyRange.bound('A', 'K', false, false);
 
-const myResult = keyRangeValue.includes('F');
+keyRangeValue.includes('F');
 // Returns true
 
-const myResult = keyRangeValue.includes('W');
+keyRangeValue.includes('W');
 // Returns false
 ```
 

files/en-us/web/api/idbtransaction/commit/index.md

@@ -53,7 +53,7 @@ transaction.oncomplete = event => {
   note.innerHTML += '<li>Transaction completed: database modification finished.</li>';
 };
 
-transaction.onerror = event {
+transaction.onerror = event => {
   note.innerHTML += '<li>Transaction not opened due to error. Duplicate items not allowed.</li>';
 };
 

files/en-us/web/api/idbtransaction/objectstore/index.md

@@ -101,6 +101,7 @@ function addData() {
     // has been stored successfully in the DB - for that you need transaction.onsuccess)
     note.innerHTML += '<li>Request successful.</li>';
   };
+}
 ```
 
 ## Specifications

files/en-us/web/api/iirfilternode/getfrequencyresponse/index.md

@@ -95,7 +95,7 @@ const feedbackCoefficients = [0.5, 0.4, 0.3, 0.2, 0.1];
 
 const iirFilter = audioCtx.createIIRFilter(feedforwardCoefficients, feedbackCoefficients);
 
-  ...
+// ...
 
 function calcFrequencyResponse() {
   iirFilter.getFrequencyResponse(myFrequencyArray, magResponseOutput, phaseResponseOutput);

files/en-us/web/api/keyboardevent/altkey/index.md

@@ -23,7 +23,7 @@ A boolean value
 
 ## Examples
 
-```js
+```html
 <html>
 <head>
 <title>altKey example</title>

files/en-us/web/api/keyboardevent/ctrlkey/index.md

@@ -23,7 +23,7 @@ A boolean value
 
 ## Examples
 
-```js
+```html
 <html>
 <head>
 <title>ctrlKey example</title>

files/en-us/web/api/keyboardevent/getmodifierstate/index.md

@@ -218,67 +218,69 @@ user settings. For example, Firefox users can customize this with a pref,
 ## Examples
 
 ```js
-// Ignore if following modifier is active.
-if (event.getModifierState("Fn") ||
-    event.getModifierState("Hyper") ||
-    event.getModifierState("OS") ||
-    event.getModifierState("Super") ||
-    event.getModifierState("Win") /* hack for IE */) {
-  return;
-}
+function handleKeyboardEvent(event) {
+  // Ignore if following modifier is active.
+  if (event.getModifierState("Fn") ||
+      event.getModifierState("Hyper") ||
+      event.getModifierState("OS") ||
+      event.getModifierState("Super") ||
+      event.getModifierState("Win") /* hack for IE */) {
+    return;
+  }
 
-// Also ignore if two or more modifiers except Shift are active.
-if (event.getModifierState("Control") +
-    event.getModifierState("Alt") +
-    event.getModifierState("Meta") > 1) {
-  return;
-}
+  // Also ignore if two or more modifiers except Shift are active.
+  if (event.getModifierState("Control") +
+      event.getModifierState("Alt") +
+      event.getModifierState("Meta") > 1) {
+    return;
+  }
 
-// Handle shortcut key with standard modifier
-if (event.getModifierState("Accel")) {
-  switch (event.key.toLowerCase()) {
-    case "c":
-      if (event.getModifierState("Shift")) {
-        // Handle Accel + Shift + C
-        event.preventDefault(); // consume the key event
-      }
-      break;
-    case "k":
-      if (!event.getModifierState("Shift")) {
-        // Handle Accel + K
-        event.preventDefault(); // consume the key event
-      }
-      break;
+  // Handle shortcut key with standard modifier
+  if (event.getModifierState("Accel")) {
+    switch (event.key.toLowerCase()) {
+      case "c":
+        if (event.getModifierState("Shift")) {
+          // Handle Accel + Shift + C
+          event.preventDefault(); // consume the key event
+        }
+        break;
+      case "k":
+        if (!event.getModifierState("Shift")) {
+          // Handle Accel + K
+          event.preventDefault(); // consume the key event
+        }
+        break;
+    }
+    return;
   }
-  return;
-}
 
-// Do something different for arrow keys if ScrollLock is locked.
-if ((event.getModifierState("ScrollLock") ||
-       event.getModifierState("Scroll") /* hack for IE */) &&
-    !event.getModifierState("Control") &&
-    !event.getModifierState("Alt") &&
-    !event.getModifierState("Meta")) {
-  switch (event.key) {
-    case "ArrowDown":
-    case "Down": // hack for IE and old Gecko
-      event.preventDefault(); // consume the key event
-      break;
-    case "ArrowLeft":
-    case "Left": // hack for IE and old Gecko
-      // Do something different if ScrollLock is locked.
-      event.preventDefault(); // consume the key event
-      break;
-    case "ArrowRight":
-    case "Right": // hack for IE and old Gecko
-      // Do something different if ScrollLock is locked.
-      event.preventDefault(); // consume the key event
-      break;
-    case "ArrowUp":
-    case "Up": // hack for IE and old Gecko
-      // Do something different if ScrollLock is locked.
-      event.preventDefault(); // consume the key event
-      break;
+  // Do something different for arrow keys if ScrollLock is locked.
+  if ((event.getModifierState("ScrollLock") ||
+        event.getModifierState("Scroll") /* hack for IE */) &&
+      !event.getModifierState("Control") &&
+      !event.getModifierState("Alt") &&
+      !event.getModifierState("Meta")) {
+    switch (event.key) {
+      case "ArrowDown":
+      case "Down": // hack for IE and old Gecko
+        event.preventDefault(); // consume the key event
+        break;
+      case "ArrowLeft":
+      case "Left": // hack for IE and old Gecko
+        // Do something different if ScrollLock is locked.
+        event.preventDefault(); // consume the key event
+        break;
+      case "ArrowRight":
+      case "Right": // hack for IE and old Gecko
+        // Do something different if ScrollLock is locked.
+        event.preventDefault(); // consume the key event
+        break;
+      case "ArrowUp":
+      case "Up": // hack for IE and old Gecko
+        // Do something different if ScrollLock is locked.
+        event.preventDefault(); // consume the key event
+        break;
+    }
   }
 }
 ```

files/en-us/web/api/keyboardevent/index.md

@@ -277,12 +277,6 @@ Before Gecko 5.0 {{geckoRelease('5.0')}}, keyboard handling was less consistent
 ## Example
 
 ```js
-<!DOCTYPE html>
-<html>
-<head>
-<script>
-'use strict';
-
 document.addEventListener('keydown', (event) => {
   const keyName = event.key;
 
@@ -309,13 +303,6 @@ document.addEventListener('keyup', (event) => {
     alert('Control key was released');
   }
 }, false);
-
-</script>
-</head>
-
-<body>
-</body>
-</html>
 ```
 
 ## Specifications

files/en-us/web/api/keyboardevent/shiftkey/index.md

@@ -23,7 +23,7 @@ A boolean value
 
 ## Examples
 
-```js
+```html
 <html>
 <head>
 <title>shiftKey example</title>

files/en-us/web/api/lockmanager/request/index.md

@@ -124,7 +124,7 @@ The `do_write()` function use the same lock but in `'exclusive'` mode which will
 This applies across event handlers, tabs, or workers.
 
 ```js
-function do_write() {
+async function do_write() {
   await navigator.locks.request('my_resource', {mode: 'exclusive'}, async lock => {
     // Write code here.
   });

files/en-us/web/api/media_streams_api/constraints/index.md

@@ -91,7 +91,7 @@ if (!supports["width"] || !supports["height"] || !supports["frameRate"] || !supp
     facingMode: { exact: "user" }
   };
 
-  myTrack.applyConstraints(constraints).then(function() => {
+  myTrack.applyConstraints(constraints).then(() => {
     /* do stuff if constraints applied successfully */
   }).catch(function(reason) {
     /* failed to apply constraints; reason is why */