docs: Fix syntax errors in rule examples (#17633)

* Fix code examples in rule docs

* Update `id-length`

* Restore example in `id-match` under option `properties`

* Update docs/src/rules/constructor-super.md

Co-authored-by: Nicholas C. Zakas <[email protected]>

* Update docs/src/rules/no-useless-rename.md

Co-authored-by: Milos Djermanovic <[email protected]>

---------

Co-authored-by: Nicholas C. Zakas <[email protected]>
Co-authored-by: Milos Djermanovic <[email protected]>

Author: 3 people

docs/src/rules/arrow-body-style.md

@@ -45,7 +45,7 @@ Examples of **correct** code for this rule with the `"always"` option:
 let foo = () => {
     return 0;
 };
-let foo = (retv, name) => {
+let bar = (retv, name) => {
     retv[name] = true;
     return retv;
 };
@@ -66,7 +66,7 @@ Examples of **incorrect** code for this rule with the default `"as-needed"` opti
 let foo = () => {
     return 0;
 };
-let foo = () => {
+let bar = () => {
     return {
        bar: {
             foo: 1,
@@ -86,24 +86,24 @@ Examples of **correct** code for this rule with the default `"as-needed"` option
 /*eslint arrow-body-style: ["error", "as-needed"]*/
 /*eslint-env es6*/
 
-let foo = () => 0;
-let foo = (retv, name) => {
+let foo1 = () => 0;
+let foo2 = (retv, name) => {
     retv[name] = true;
     return retv;
 };
-let foo = () => ({
+let foo3 = () => ({
     bar: {
         foo: 1,
         bar: 2,
     }
 });
-let foo = () => { bar(); };
-let foo = () => {};
-let foo = () => { /* do nothing */ };
-let foo = () => {
+let foo4 = () => { bar(); };
+let foo5 = () => {};
+let foo6 = () => { /* do nothing */ };
+let foo7 = () => {
     // do nothing.
 };
-let foo = () => ({ bar: 0 });
+let foo8 = () => ({ bar: 0 });
 ```
 
 :::
@@ -120,7 +120,7 @@ Examples of **incorrect** code for this rule with the `{ "requireReturnForObject
 /*eslint arrow-body-style: ["error", "as-needed", { "requireReturnForObjectLiteral": true }]*/
 /*eslint-env es6*/
 let foo = () => ({});
-let foo = () => ({ bar: 0 });
+let bar = () => ({ bar: 0 });
 ```
 
 :::
@@ -134,7 +134,7 @@ Examples of **correct** code for this rule with the `{ "requireReturnForObjectLi
 /*eslint-env es6*/
 
 let foo = () => {};
-let foo = () => { return { bar: 0 }; };
+let bar = () => { return { bar: 0 }; };
 ```
 
 :::
@@ -152,7 +152,7 @@ Examples of **incorrect** code for this rule with the `"never"` option:
 let foo = () => {
     return 0;
 };
-let foo = (retv, name) => {
+let bar = (retv, name) => {
     retv[name] = true;
     return retv;
 };
@@ -169,7 +169,7 @@ Examples of **correct** code for this rule with the `"never"` option:
 /*eslint-env es6*/
 
 let foo = () => 0;
-let foo = () => ({ foo: 0 });
+let bar = () => ({ foo: 0 });
 ```
 
 :::

docs/src/rules/camelcase.md

@@ -49,11 +49,11 @@ function foo({ no_camelcased }) {
     // ...
 };
 
-function foo({ isCamelcased: no_camelcased }) {
+function bar({ isCamelcased: no_camelcased }) {
     // ...
 }
 
-function foo({ no_camelcased = 'default value' }) {
+function baz({ no_camelcased = 'default value' }) {
     // ...
 };
 
@@ -63,7 +63,7 @@ var obj = {
 
 var { category_id = 1 } = query;
 
-var { foo: no_camelcased } = bar;
+var { foo: snake_cased } = bar;
 
 var { foo: bar_baz = 1 } = quz;
 ```
@@ -83,8 +83,8 @@ var myFavoriteColor   = "#112C85";
 var _myFavoriteColor  = "#112C85";
 var myFavoriteColor_  = "#112C85";
 var MY_FAVORITE_COLOR = "#112C85";
-var foo = bar.baz_boom;
-var foo = { qux: bar.baz_boom };
+var foo1 = bar.baz_boom;
+var foo2 = { qux: bar.baz_boom };
 
 obj.do_something();
 do_something();
@@ -96,11 +96,11 @@ function foo({ isCamelCased }) {
     // ...
 };
 
-function foo({ isCamelCased: isAlsoCamelCased }) {
+function bar({ isCamelCased: isAlsoCamelCased }) {
     // ...
 }
 
-function foo({ isCamelCased = 'default value' }) {
+function baz({ isCamelCased = 'default value' }) {
     // ...
 };
 
@@ -143,9 +143,9 @@ Examples of **incorrect** code for this rule with the default `{ "ignoreDestruct
 
 var { category_id } = query;
 
-var { category_id = 1 } = query;
+var { category_name = 1 } = query;
 
-var { category_id: category_id } = query;
+var { category_id: category_title } = query;
 
 var { category_id: category_alias } = query;
 

docs/src/rules/class-methods-use-this.md

@@ -86,13 +86,13 @@ class A {
     }
 }
 
-class A {
+class B {
     constructor() {
         // OK. constructor is exempt
     }
 }
 
-class A {
+class C {
     static foo() {
         // OK. static methods aren't expected to use this.
     }

docs/src/rules/constructor-super.md

@@ -14,6 +14,16 @@ This rule checks whether or not there is a valid `super()` call.
 
 This rule is aimed to flag invalid/missing `super()` calls.
 
+This is a syntax error because there is no `extends` clause in the class:
+
+```js
+class A {
+    constructor() {
+        super();
+    }
+}
+```
+
 Examples of **incorrect** code for this rule:
 
 :::incorrect
@@ -22,24 +32,18 @@ Examples of **incorrect** code for this rule:
 /*eslint constructor-super: "error"*/
 /*eslint-env es6*/
 
-class A {
-    constructor() {
-        super();  // This is a SyntaxError.
-    }
-}
-
 class A extends B {
     constructor() { }  // Would throw a ReferenceError.
 }
 
 // Classes which inherits from a non constructor are always problems.
-class A extends null {
+class C extends null {
     constructor() {
         super();  // Would throw a TypeError.
     }
 }
 
-class A extends null {
+class D extends null {
     constructor() { }  // Would throw a ReferenceError.
 }
 ```
@@ -58,7 +62,7 @@ class A {
     constructor() { }
 }
 
-class A extends B {
+class B extends C {
     constructor() {
         super();
     }

docs/src/rules/id-denylist.md

@@ -46,7 +46,7 @@ Examples of **incorrect** code for this rule with sample `"data", "callback"` re
 ```js
 /*eslint id-denylist: ["error", "data", "callback"] */
 
-var data = {...};
+var data = { ...values };
 
 function callback() {
     // ...
@@ -57,23 +57,23 @@ element.callback = function() {
 };
 
 var itemSet = {
-    data: [...]
+    data: [...values]
 };
 
 class Foo {
     data = [];
 }
 
-class Foo {
+class Bar {
     #data = [];
 }
 
-class Foo {
-    callback( {);
+class Baz {
+    callback() {}
 }
 
-class Foo {
-    #callback( {);
+class Qux {
+    #callback() {}
 }
 ```
 
@@ -86,7 +86,7 @@ Examples of **correct** code for this rule with sample `"data", "callback"` rest
 ```js
 /*eslint id-denylist: ["error", "data", "callback"] */
 
-var encodingOptions = {...};
+var encodingOptions = {...values};
 
 function processFileResult() {
     // ...
@@ -97,7 +97,7 @@ element.successHandler = function() {
 };
 
 var itemSet = {
-    entities: [...]
+    entities: [...values]
 };
 
 callback(); // all function calls are ignored
@@ -110,16 +110,16 @@ class Foo {
     items = [];
 }
 
-class Foo {
+class Bar {
     #items = [];
 }
 
-class Foo {
-    method( {);
+class Baz {
+    method() {}
 }
 
-class Foo {
-    #method( {);
+class Qux {
+    #method() {}
 }
 ```