esupgrade 2025.2.1 → 2025.3.0

package/AGENTS.md

@@ -1,3 +1,5 @@
-When writing code, you MUST ALWAYS follow the [naming-things](https://raw.githubusercontent.com/codingjoe/naming-things/refs/heads/main/README.md) guidlines.
+When writing code, you MUST ALWAYS follow the [naming-things](https://raw.githubusercontent.com/codingjoe/naming-things/refs/heads/main/README.md) guidelines.
 
 All code must be fully tested with a 100% coverage. Unreachable code must be removed.
+
+All transformers must be documented in the README.md.

package/README.md

@@ -142,6 +142,17 @@ Supports:
 > Transformations limited to inline arrow or function expressions with block statement bodies.
 > Callbacks with index parameters or expression bodies are not transformed.
 
+#### `for...of Object.keys()` → [`for...in` loops][mdn-for-in]
+
+```diff
+-for (const key of Object.keys(obj)) {
+-  console.log(key);
+-}
++for (const key in obj) {
++  console.log(key);
++}
+```
+
 #### `Array.from()` → [Array spread [...]][mdn-spread]
 
 ```diff
@@ -165,7 +176,7 @@ Supports:
 +const copy = { ...original };
 ```
 
-#### `.concat()` → [Array spread [...]][mdn-spread]
+#### `Array.concat()` → [Array spread [...]][mdn-spread]
 
 ```diff
 -const combined = arr1.concat(arr2, arr3);
@@ -222,6 +233,7 @@ Supports:
 [mdn-arrow-functions]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
 [mdn-const]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const
 [mdn-exponentiation]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation
+[mdn-for-in]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
 [mdn-for-of]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of
 [mdn-let]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let
 [mdn-promise-try]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/try

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "esupgrade",
-  "version": "2025.2.1",
+  "version": "2025.3.0",
   "description": "Auto-upgrade your JavaScript syntax",
   "type": "module",
   "main": "src/index.js",

package/src/widelyAvailable.js

@@ -796,3 +796,363 @@ export function iterableForEachToForOf(j, root) {
 
   return { modified, changes }
 }
+
+/**
+ * Transform anonymous function expressions to arrow functions
+ * Does not transform if the function:
+ * - is a named function expression (useful for stack traces and recursion)
+ * - uses 'this' (arrow functions don't have their own 'this')
+ * - uses 'arguments' (arrow functions don't have 'arguments' object)
+ * - uses 'super' (defensive check, though this would be a syntax error in function expressions)
+ * - is a generator function (arrow functions cannot be generators)
+ * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
+ */
+export function anonymousFunctionToArrow(j, root) {
+  let modified = false
+  const changes = []
+
+  // Helper to check if a node or its descendants use 'this'
+  const usesThis = (node) => {
+    let found = false
+
+    const checkNode = (astNode) => {
+      if (!astNode || typeof astNode !== "object" || found) return
+
+      // Found 'this' identifier
+      if (astNode.type === "ThisExpression") {
+        found = true
+        return
+      }
+
+      // Don't traverse into nested function declarations or expressions
+      // as they have their own 'this' context
+      if (
+        astNode.type === "FunctionDeclaration" ||
+        astNode.type === "FunctionExpression" ||
+        astNode.type === "ArrowFunctionExpression"
+      ) {
+        return
+      }
+
+      // Traverse all properties
+      for (const key in astNode) {
+        if (
+          key === "loc" ||
+          key === "start" ||
+          key === "end" ||
+          key === "tokens" ||
+          key === "comments"
+        )
+          continue
+        const value = astNode[key]
+        if (Array.isArray(value)) {
+          value.forEach(checkNode)
+        } else if (value && typeof value === "object") {
+          checkNode(value)
+        }
+      }
+    }
+
+    checkNode(node)
+    return found
+  }
+
+  // Helper to check if a node or its descendants use 'arguments'
+  const usesArguments = (node) => {
+    let found = false
+
+    const visit = (n) => {
+      if (!n || typeof n !== "object" || found) return
+
+      // If we encounter a nested function, don't traverse into it
+      // as it has its own 'arguments' binding
+      if (n.type === "FunctionExpression" || n.type === "FunctionDeclaration") {
+        return
+      }
+
+      // Check if this is an 'arguments' identifier
+      if (n.type === "Identifier" && n.name === "arguments") {
+        found = true
+        return
+      }
+
+      // Traverse all child nodes
+      for (const key in n) {
+        if (
+          key === "loc" ||
+          key === "start" ||
+          key === "end" ||
+          key === "tokens" ||
+          key === "comments" ||
+          key === "type"
+        ) {
+          continue
+        }
+        const value = n[key]
+        if (Array.isArray(value)) {
+          for (const item of value) {
+            visit(item)
+            if (found) return
+          }
+        } else if (value && typeof value === "object") {
+          visit(value)
+        }
+      }
+    }
+
+    // Start visiting from the function body's child nodes
+    // Don't check the body node itself, check its contents
+    // Note: FunctionExpression.body is always a BlockStatement
+    if (node.type === "BlockStatement" && node.body) {
+      for (const statement of node.body) {
+        visit(statement)
+        if (found) break
+      }
+    }
+
+    return found
+  }
+
+  // Helper to check if a node or its descendants use 'super'
+  const usesSuper = (node) => {
+    let found = false
+
+    const visit = (n) => {
+      if (!n || typeof n !== "object" || found) return
+
+      // If we encounter a nested function, don't traverse into it
+      // as it has its own 'super' binding context
+      if (n.type === "FunctionExpression" || n.type === "FunctionDeclaration") {
+        return
+      }
+
+      // Check if this is a 'super' node
+      if (n.type === "Super") {
+        found = true
+        return
+      }
+
+      // Traverse all child nodes
+      for (const key in n) {
+        if (
+          key === "loc" ||
+          key === "start" ||
+          key === "end" ||
+          key === "tokens" ||
+          key === "comments" ||
+          key === "type"
+        ) {
+          continue
+        }
+        const value = n[key]
+        if (Array.isArray(value)) {
+          for (const item of value) {
+            visit(item)
+            if (found) return
+          }
+        } else if (value && typeof value === "object") {
+          visit(value)
+        }
+      }
+    }
+
+    // Start visiting from the function body's child nodes
+    // Don't check the body node itself, check its contents
+    // Note: FunctionExpression.body is always a BlockStatement
+    if (node.type === "BlockStatement" && node.body) {
+      for (const statement of node.body) {
+        visit(statement)
+        if (found) break
+      }
+    }
+
+    return found
+  }
+
+  root
+    .find(j.FunctionExpression)
+    .filter((path) => {
+      const node = path.node
+
+      // Skip if it's a named function expression
+      // Named functions are useful for stack traces and recursion
+      if (node.id) {
+        return false
+      }
+
+      // Skip if it's a generator function
+      if (node.generator) {
+        return false
+      }
+
+      // Skip if it uses 'this'
+      if (usesThis(node.body)) {
+        return false
+      }
+
+      // Skip if it uses 'arguments'
+      const hasArguments = usesArguments(node.body)
+      if (hasArguments) {
+        return false
+      }
+
+      // Skip if it uses 'super'
+      if (usesSuper(node.body)) {
+        return false
+      }
+
+      return true
+    })
+    .forEach((path) => {
+      const node = path.node
+
+      // Create arrow function with same params and body
+      const arrowFunction = j.arrowFunctionExpression(node.params, node.body, false)
+
+      // Preserve async property
+      if (node.async) {
+        arrowFunction.async = true
+      }
+
+      j(path).replaceWith(arrowFunction)
+
+      modified = true
+      if (node.loc) {
+        changes.push({
+          type: "anonymousFunctionToArrow",
+          line: node.loc.start.line,
+        })
+      }
+    })
+
+  return { modified, changes }
+}
+
+/**
+ * Transform Array.concat() to array spread syntax
+ * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
+ */
+export function arrayConcatToSpread(j, root) {
+  let modified = false
+  const changes = []
+
+  // Helper to check if an expression is statically verifiable as an array
+  const isVerifiableArray = (node) => {
+    // Array literal: [1, 2, 3]
+    if (j.ArrayExpression.check(node)) {
+      return true
+    }
+
+    // Array.from(), Array.of(), etc.
+    if (
+      j.CallExpression.check(node) &&
+      j.MemberExpression.check(node.callee) &&
+      j.Identifier.check(node.callee.object) &&
+      node.callee.object.name === "Array"
+    ) {
+      return true
+    }
+
+    // new Array()
+    if (
+      j.NewExpression.check(node) &&
+      j.Identifier.check(node.callee) &&
+      node.callee.name === "Array"
+    ) {
+      return true
+    }
+
+    const STRING_METHODS_RETURNING_ARRAY = [
+      "matchAll",
+      "split",
+      "slice",
+      "substr",
+      "substring",
+      "toLowerCase",
+      "toUpperCase",
+      "trim",
+      "trimStart",
+      "trimEnd",
+    ]
+
+    // .split() on strings returns arrays
+    if (
+      j.CallExpression.check(node) &&
+      j.MemberExpression.check(node.callee) &&
+      j.Identifier.check(node.callee.property) &&
+      j.StringLiteral.check(node.callee.object) &&
+      STRING_METHODS_RETURNING_ARRAY.includes(node.callee.property.name)
+    ) {
+      return true
+    }
+
+    return false
+  }
+
+  root
+    .find(j.CallExpression)
+    .filter((path) => {
+      const node = path.node
+
+      // Check if this is a .concat() call
+      if (
+        !j.MemberExpression.check(node.callee) ||
+        !j.Identifier.check(node.callee.property) ||
+        node.callee.property.name !== "concat"
+      ) {
+        return false
+      }
+
+      // Must have at least one argument
+      if (node.arguments.length === 0) {
+        return false
+      }
+
+      // Only transform if we can verify the object is an array
+      const object = node.callee.object
+      if (!isVerifiableArray(object)) {
+        return false
+      }
+
+      return true
+    })
+    .forEach((path) => {
+      const node = path.node
+      const baseArray = node.callee.object
+      const concatArgs = node.arguments
+
+      // Build array elements: start with spread of base array
+      const elements = [j.spreadElement(baseArray)]
+
+      // Add each concat argument
+      concatArgs.forEach((arg) => {
+        // If the argument is an array literal, spread it
+        // Otherwise, check if it's likely an array (could be iterable)
+        if (j.ArrayExpression.check(arg)) {
+          // Spread array literals
+          elements.push(j.spreadElement(arg))
+        } else {
+          // For non-array arguments, we need to determine if they should be spread
+          // In concat(), arrays are flattened one level, primitives are added as-is
+          // Since we can't statically determine types, we spread everything
+          // This matches concat's behavior for arrays and iterables
+          elements.push(j.spreadElement(arg))
+        }
+      })
+
+      // Create new array expression with spread elements
+      const spreadArray = j.arrayExpression(elements)
+
+      j(path).replaceWith(spreadArray)
+
+      modified = true
+      if (node.loc) {
+        changes.push({
+          type: "arrayConcatToSpread",
+          line: node.loc.start.line,
+        })
+      }
+    })
+
+  return { modified, changes }
+}

package/tests/widelyAvailable.test.js

@@ -43,7 +43,7 @@ describe("widely-available", () => {
     })
 
     test("forEach should NOT transform plain identifiers with function expression", () => {
-      const input = `numbers.forEach(function(n) { console.log(n); });`
+      const input = `numbers.forEach((n) => { console.log(n); });`
 
       const result = transform(input)
 
@@ -1585,7 +1585,7 @@ document.querySelectorAll('.item').forEach(item => {
 
     test("should NOT transform when caller object is neither identifier nor member/call expression", () => {
       const input = `
-    (function() { return document; })().querySelectorAll('.item').forEach(item => {
+    (() => { return document; })().querySelectorAll('.item').forEach(item => {
       console.log(item);
     });
   `
@@ -1670,4 +1670,420 @@ document.querySelectorAll('.item').forEach(item => {
       assert.match(result.code, /for \(const div of document\.body\.querySelectorAll/)
     })
   })
+
+  describe("arrow functions", () => {
+    test("should transform simple anonymous function to arrow function", () => {
+      const input = `
+    const greet = function(name) {
+      return "Hello " + name;
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameter arrow functions don't need parentheses
+      assert.match(result.code, /const greet = name =>/)
+      assert.match(result.code, /return/)
+    })
+
+    test("should transform anonymous function with multiple parameters", () => {
+      const input = `
+    const add = function(a, b) {
+      return a + b;
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /const add = \(a, b\) =>/)
+    })
+
+    test("should transform anonymous function with no parameters", () => {
+      const input = `
+    const getValue = function() {
+      return 42;
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /const getValue = \(\) =>/)
+    })
+
+    test("should transform callback function", () => {
+      const input = `[1, 2, 3].map(function(x) { return x * 2; });`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /\[1, 2, 3\]\.map\(x =>/)
+    })
+
+    test("should NOT transform function using 'this'", () => {
+      const input = `
+    const obj = {
+      method: function() {
+        return this.value;
+      }
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /method: function\(\)/)
+    })
+
+    test("should NOT transform function using 'this' in nested code", () => {
+      const input = `
+    const handler = function() {
+      if (true) {
+        console.log(this.name);
+      }
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /const handler = function\(\)/)
+    })
+
+    test("should NOT transform function using 'arguments'", () => {
+      const input = `
+    const sum = function() {
+      return Array.from(arguments).reduce((a, b) => a + b, 0);
+    };
+  `
+
+      const result = transform(input)
+
+      // The function itself should NOT be transformed to an arrow function
+      // (other transformations like Array.from -> spread may still happen)
+      assert.match(result.code, /const sum = function\(\)/)
+      // Ensure it's not an arrow function
+      assert.doesNotMatch(result.code, /const sum = \(\) =>/)
+      assert.doesNotMatch(result.code, /const sum = =>/)
+    })
+
+    test("should NOT transform generator function", () => {
+      const input = `
+    const gen = function*() {
+      yield 1;
+      yield 2;
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /const gen = function\*\(\)/)
+    })
+
+    test("should transform nested function that doesn't use 'this'", () => {
+      const input = `
+    const outer = function(x) {
+      return function(y) {
+        return x + y;
+      };
+    };
+  `
+
+      const result = transform(input)
+
+      // Both functions should be transformed
+      assert.strictEqual(result.modified, true)
+      // Single parameters don't need parentheses
+      assert.match(result.code, /const outer = x =>/)
+      // The inner function should also be transformed
+      assert.match(result.code, /return y =>/)
+    })
+
+    test("should NOT transform outer function but transform inner when outer uses 'this'", () => {
+      const input = `
+    const outer = function() {
+      this.value = 10;
+      return function(x) {
+        return x * 2;
+      };
+    };
+  `
+
+      const result = transform(input)
+
+      // Only inner function should be transformed
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /const outer = function\(\)/)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /return x =>/)
+    })
+
+    test("should transform async function", () => {
+      const input = `
+    const fetchData = async function(url) {
+      const response = await fetch(url);
+      return response.json();
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /const fetchData = async url =>/)
+    })
+
+    test("should transform function with complex body", () => {
+      const input = `
+    const process = function(data) {
+      const result = [];
+      for (const item of data) {
+        result.push(item * 2);
+      }
+      return result;
+    };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /const process = data =>/)
+    })
+
+    test("should handle multiple transformations in same code", () => {
+      const input = `
+    const fn1 = function(x) { return x + 1; };
+    const fn2 = function(y) { return y * 2; };
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameters don't need parentheses
+      assert.match(result.code, /const fn1 = x =>/)
+      assert.match(result.code, /const fn2 = y =>/)
+    })
+
+    test("should NOT transform when 'this' is in nested function scope", () => {
+      const input = `
+    const outer = function(x) {
+      return function() {
+        return this.value + x;
+      };
+    };
+  `
+
+      const result = transform(input)
+
+      // Outer should transform, inner should not
+      assert.strictEqual(result.modified, true)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /const outer = x =>/)
+      assert.match(result.code, /return function\(\)/)
+    })
+
+    test("should transform event handlers without 'this'", () => {
+      const input = `
+    button.addEventListener('click', function(event) {
+      console.log('Clicked', event.target);
+    });
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Single parameter doesn't need parentheses
+      assert.match(result.code, /button\.addEventListener\('click', event =>/)
+    })
+
+    test("should transform IIFE without 'this'", () => {
+      const input = `
+    (function() {
+      console.log('IIFE executed');
+    })();
+  `
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\(\(\) =>/)
+    })
+
+    test("should NOT transform named function expression", () => {
+      // Named function expressions should be kept as-is for stack traces and recursion
+      const input = `
+    const factorial = function fact(n) {
+      return n <= 1 ? 1 : n * fact(n - 1);
+    };
+  `
+
+      const result = transform(input)
+
+      // Named function expressions should not be transformed
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /function fact\(n\)/)
+    })
+  })
+
+  describe("Array.concat() to spread", () => {
+    test("[].concat(other) to [...[], ...other]", () => {
+      const input = `const result = [1, 2].concat(other);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[1, 2\], \.\.\.other\]/)
+    })
+
+    test("[].concat([1, 2, 3]) with array literal", () => {
+      const input = `const result = [].concat([1, 2, 3]);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[\], \.\.\.\[1, 2, 3\]\]/)
+    })
+
+    test("[].concat(item1, item2, item3) with multiple arguments", () => {
+      const input = `const result = [].concat(other1, other2, other3);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(
+        result.code,
+        /\[\.\..\[\], \.\.\.other1, \.\.\.other2, \.\.\.other3\]/,
+      )
+    })
+
+    test("concat in expression", () => {
+      const input = `const length = [].concat(other).length;`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[\], \.\.\.other\]\.length/)
+    })
+
+    test("concat with method call result", () => {
+      const input = `const result = [].concat(getItems());`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[\], \.\.\.getItems\(\)\]/)
+    })
+
+    test("should NOT transform concat with no arguments", () => {
+      const input = `const copy = arr.concat();`
+
+      const result = transform(input)
+
+      // concat() with no args is just a shallow copy, but we don't transform it
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /arr\.concat\(\)/)
+    })
+
+    test("concat tracks line numbers", () => {
+      const input = `// Line 1
+const result = [1, 2].concat(other);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.strictEqual(result.changes.length, 1)
+      assert.strictEqual(result.changes[0].type, "arrayConcatToSpread")
+      assert.strictEqual(result.changes[0].line, 2)
+    })
+
+    test("concat in arrow function", () => {
+      const input = `const fn = (arr, other) => [1, 2].concat(other);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[1, 2\], \.\.\.other\]/)
+    })
+
+    test("nested array with concat", () => {
+      const input = `const result = [[1, 2]].concat([[3, 4]]);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[\[1, 2\]\], \.\.\.\[\[3, 4\]\]\]/)
+    })
+
+    test("should NOT transform string.concat()", () => {
+      const input = `const result = str.concat("hello");`
+
+      const result = transform(input)
+
+      // Should not transform - str is not verifiably an array
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /str\.concat/)
+    })
+
+    test("should NOT transform concat on unknown identifier", () => {
+      const input = `const result = arr.concat(other);`
+
+      const result = transform(input)
+
+      // Should not transform - arr is just an identifier, not verifiably an array
+      assert.strictEqual(result.modified, false)
+      assert.match(result.code, /arr\.concat/)
+    })
+
+    test("should transform concat on array literal", () => {
+      const input = `const result = [1, 2, 3].concat([4, 5, 6]);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\..\[1, 2, 3\], \.\.\.\[4, 5, 6\]\]/)
+    })
+
+    test("should transform concat on Array.from()", () => {
+      const input = `const result = Array.from(items).concat(more);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      // Both arrayFromToSpread and arrayConcatToSpread run
+      // Array.from(items) -> [...items], then [...items].concat(more) -> [...[...items], ...more]
+      assert.match(result.code, /\[\.\..\[\.\.\.items\], \.\.\.more\]/)
+    })
+
+    test("should transform concat on String.slice() result", () => {
+      const input = `const result = "lorem ipsum".slice(0, 10).concat(more);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\.\."lorem ipsum"\.slice\(0, 10\), \.\.\.more\]/)
+    })
+
+    test("should transform concat on String.split() result", () => {
+      const input = `const result = "foo,bar".split(',').concat(more);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\.\."foo,bar"\.split\(','\), \.\.\.more\]/)
+    })
+
+    test("should transform concat on new Array()", () => {
+      const input = `const result = new Array(5).concat(more);`
+
+      const result = transform(input)
+
+      assert.strictEqual(result.modified, true)
+      assert.match(result.code, /\[\.\.\.new Array\(5\), \.\.\.more\]/)
+    })
+  })
 })