or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

index.md
tile.json

tessl/npm-babel-plugin-transform-es2015-object-super

Babel plugin that compiles ES2015 object super references to ES5-compatible code

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/babel-plugin-transform-es2015-object-super@6.24.x

To install, run

npx @tessl/cli install tessl/npm-babel-plugin-transform-es2015-object-super@6.24.0

index.mddocs/

babel-plugin-transform-es2015-object-super

A Babel plugin that transforms ES2015 (ES6) object super references to ES5-compatible code. This plugin enables the use of super property access in object literal methods by compiling them down to ES5 syntax that can run in older JavaScript environments.

Package Information

  • Package Name: babel-plugin-transform-es2015-object-super
  • Package Type: npm
  • Language: JavaScript
  • Installation: npm install --save-dev babel-plugin-transform-es2015-object-super

Core Imports

This plugin is not directly imported in code but is used as part of Babel's configuration system:

{
  "plugins": ["transform-es2015-object-super"]
}

Basic Usage

Via .babelrc (Recommended)

{
  "plugins": ["transform-es2015-object-super"]
}

Via CLI

babel --plugins transform-es2015-object-super script.js

Via Node API

require("babel-core").transform("code", {
  plugins: ["transform-es2015-object-super"]
});

Transformation Example

Input (ES2015):

var o = {
  m() {
    return super.x;
  }
};

Output (ES5):

var _obj;

var o = _obj = {
  m: function () {
    return babelHelpers.get(_obj.__proto__ || Object.getPrototypeOf(_obj), "x", this);
  }
};

Architecture

This plugin follows Babel's standard plugin architecture:

  • Plugin Factory Function: The main export that returns a visitor object
  • Visitor Pattern: Uses Babel's visitor pattern to traverse and transform AST nodes
  • Two-Phase Processing: First marks object expressions containing super, then transforms them
  • External Dependencies: Relies on babel-helper-replace-supers for the actual transformation logic

Capabilities

Plugin Factory Function

The main export is a Babel plugin factory function that returns a visitor object.

/**
 * Creates a Babel plugin for transforming ES2015 object super references
 * @param {object} babel - Babel API object containing types
 * @param {object} babel.types - Babel types utility for AST manipulation
 * @returns {object} Babel plugin object with visitor methods
 */
export default function({ types: t }) {
  // Plugin implementation
}

Visitor Object

The plugin returns a visitor object with methods that process specific AST node types.

/**
 * Visitor object returned by the plugin factory
 */
const visitor = {
  /**
   * Visits Super nodes and marks containing ObjectExpression nodes
   * @param {object} path - Babel AST path object for the Super node
   */
  Super(path) {
    const parentObj = path.findParent((path) => path.isObjectExpression());
    if (parentObj) parentObj.node[CONTAINS_SUPER] = true;
  },

  /**
   * Object expression visitor with exit phase handler
   */
  ObjectExpression: {
    /**
     * Exit phase visitor that transforms object expressions containing super references
     * @param {object} path - Babel AST path object for the ObjectExpression
     * @param {object} file - Babel file object containing transformation state
     */
    exit(path, file) {
      if (!path.node[CONTAINS_SUPER]) return;
      
      let objectRef;
      const getObjectRef = () => objectRef = objectRef || path.scope.generateUidIdentifier("obj");

      const propPaths = path.get("properties");
      for (let propPath of propPaths) {
        if (propPath.isObjectProperty()) propPath = propPath.get("value");
        Property(propPath, propPath.node, path.scope, getObjectRef, file);
      }

      if (objectRef) {
        path.scope.push({ id: objectRef });
        path.replaceWith(t.assignmentExpression("=", objectRef, path.node));
      }
    }
  }
};

Internal Helper Functions

/**
 * Internal helper that processes individual object properties with super references
 * @param {object} path - Property path object
 * @param {object} node - Property AST node
 * @param {object} scope - Babel scope object
 * @param {function} getObjectRef - Function to get object reference
 * @param {object} file - Babel file object
 */
function Property(path, node, scope, getObjectRef, file) {
  const replaceSupers = new ReplaceSupers({
    getObjectRef: getObjectRef,
    methodNode: node,
    methodPath: path,
    isStatic: true,
    scope: scope,
    file: file
  });
  
  replaceSupers.replace();
}

/**
 * Internal symbol used to mark object expressions that contain super references
 */
const CONTAINS_SUPER = Symbol();

Dependencies

The plugin imports and uses the following external dependencies:

/**
 * ReplaceSupers helper from babel-helper-replace-supers package
 * Handles the core logic for replacing super references with ES5-compatible calls
 */
import ReplaceSupers from "babel-helper-replace-supers";

Package Dependencies:

  • babel-helper-replace-supers ^6.24.1: Provides the ReplaceSupers class for transforming super references
  • babel-runtime ^6.22.0: Provides runtime utilities needed for the transformed code (like babelHelpers.get)

Transformation Behavior

This plugin specifically targets object literal methods that use super property access. It operates in two phases:

  1. Detection Phase: The Super visitor identifies super nodes and marks their containing object expressions
  2. Transformation Phase: The ObjectExpression.exit visitor transforms marked objects by:
    • Creating a temporary variable to hold the object reference
    • Processing each property that might contain super references
    • Wrapping the object in an assignment expression

Scope of Transformation:

  • ✅ Object literal methods with super property access
  • ❌ Class methods (handled by other Babel plugins)
  • ❌ Super constructor calls
  • ❌ Arrow functions (which don't have super binding)

Runtime Behavior: The transformed code uses babelHelpers.get() to safely access properties from the object's prototype chain, maintaining the same runtime behavior as ES2015 super references.