CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-babel-plugin-transform-es2015-computed-properties

Babel plugin that compiles ES2015 computed properties to ES5-compatible code

88

1.07x
Overview
Eval results
Files

task.mdevals/scenario-7/

Dynamic Method Builder

A utility that transforms modern JavaScript objects with computed method properties into ES5-compatible code for legacy environments.

Problem Statement

You need to build a transpiler tool that accepts JavaScript source code containing objects with computed method properties and converts them to ES5-compatible syntax. The tool should handle dynamic method names and produce code that works in older JavaScript environments.

Requirements

Your solution must:

  1. Accept JavaScript source code as a string input
  2. Transform objects that have methods with computed property names (e.g., [methodName]() { ... })
  3. Return the transpiled ES5-compatible code as a string
  4. Handle both simple expressions and complex computed keys
  5. Preserve the functionality of the original code

Implementation

@generates

API

/**
 * Transforms JavaScript code with computed method properties to ES5-compatible code
 * @param {string} code - The JavaScript source code to transform
 * @param {object} options - Optional configuration for the transformation
 * @param {boolean} options.loose - Whether to use loose mode (simpler output)
 * @returns {string} The transpiled ES5-compatible code
 */
function transpile(code, options = {}) {
  // IMPLEMENTATION HERE
}

module.exports = { transpile };

Test Cases

Basic Computed Method

  • Given code var obj = { [name]() { return 42; } };, the transpile function produces valid ES5 code that creates an object with a dynamically named method @test

Multiple Computed Methods

  • Given code with two computed methods var obj = { [method1]() { return 1; }, [method2]() { return 2; } };, the transpile function produces ES5 code that correctly defines both methods @test

Computed Method with Expression

  • Given code var obj = { ["get" + suffix]() { return value; } };, the transpile function produces ES5 code that evaluates the expression for the method name @test

Loose Mode

  • Given code with a computed method and options { loose: true }, the transpile function produces simpler ES5 code using direct property assignment @test

Dependencies { .dependencies }

@babel/plugin-transform-computed-properties { .dependency }

Provides the transformation logic for computed properties including methods.

@satisfied-by

@babel/core { .dependency }

Provides the core Babel transformation engine for parsing and transforming JavaScript code.

@satisfied-by

Install with Tessl CLI

npx tessl i tessl/npm-babel-plugin-transform-es2015-computed-properties

tile.json