chore: save

rax-it · rax-it · commit a3519b86d7ac · 2025-08-15T17:38:20.000-07:00
diff --git a/packages/@lwc/babel-plugin-component/src/decorators/index.ts b/packages/@lwc/babel-plugin-component/src/decorators/index.ts
@@ -12,11 +12,12 @@ import { generateError, isClassMethod, isGetterClassMethod, isSetterClassMethod
 import api from './api';
 import wire from './wire';
 import track from './track';
+import privateDecorator from './private';
 import type { BabelAPI, BabelTypes, LwcBabelPluginPass } from '../types';
 import type { Node, types, Visitor, NodePath } from '@babel/core';
 import type { ClassBodyItem, ImportSpecifier, LwcDecoratorName } from './types';
 
-const DECORATOR_TRANSFORMS = [api, wire, track];
+const DECORATOR_TRANSFORMS = [api, wire, track, privateDecorator];
 const AVAILABLE_DECORATORS = DECORATOR_TRANSFORMS.map((transform) => transform.name).join(', ');
 
 export type DecoratorType = (typeof DECORATOR_TYPES)[keyof typeof DECORATOR_TYPES];
@@ -244,6 +245,7 @@ function getMetadataObjectPropertyList(
         ...api.transform(t, decoratorMetas, classBodyItems),
         ...track.transform(t, decoratorMetas),
         ...wire.transform(t, decoratorMetas),
+        ...privateDecorator.transform(t, decoratorMetas, classBodyItems),
     ];
 
     const fieldNames = classBodyItems
@@ -316,6 +318,71 @@ function decorators({ types: t }: BabelAPI): Visitor<LwcBabelPluginPass> {
 
             decoratorPaths.forEach((path) => path.remove());
 
+            // Lower instance class fields into constructor assignments BEFORE registerDecorators replacement
+            const fieldProps = classBodyItems
+                .filter((f) => f.isClassProperty({ static: false, computed: false }))
+                .filter((f) => !(f.node as types.ClassProperty).decorators);
+
+            const assigns: types.Statement[] = [];
+            for (const fp of fieldProps) {
+                const id = (fp.node.key as types.Identifier).name;
+                const init = fp.node.value ?? t.identifier('undefined');
+                assigns.push(
+                    t.expressionStatement(
+                        t.assignmentExpression(
+                            '=',
+                            t.memberExpression(t.thisExpression(), t.identifier(id)),
+                            init
+                        )
+                    )
+                );
+                fp.remove(); // remove native class field
+            }
+
+            // Find or create constructor
+            const ctorPath = classBodyItems.find((p) =>
+                p.isClassMethod({ kind: 'constructor' })
+            ) as NodePath<types.ClassMethod> | undefined;
+            if (assigns.length) {
+                if (ctorPath) {
+                    // insert after super(...)
+                    const body = ctorPath.get('body.body') as NodePath<types.Statement>[];
+                    const superIndex = body.findIndex(
+                        (b) =>
+                            b.isExpressionStatement() &&
+                            b.node.expression.type === 'CallExpression' &&
+                            (b.node.expression.callee as any).type === 'Super'
+                    );
+                    const insertIndex = superIndex >= 0 ? superIndex + 1 : 0;
+                    if (body[insertIndex]) {
+                        body[insertIndex].insertBefore(assigns);
+                    } else {
+                        ctorPath.get('body').pushContainer('body', assigns);
+                    }
+                } else {
+                    const needsSuper = node.superClass !== null;
+                    const ctorBodyStmts: types.Statement[] = needsSuper
+                        ? [
+                              t.expressionStatement(
+                                  t.callExpression(t.super(), [
+                                      t.spreadElement(t.identifier('args')),
+                                  ])
+                              ),
+                              ...assigns,
+                          ]
+                        : assigns;
+                    const params = needsSuper ? [t.restElement(t.identifier('args'))] : [];
+                    const ctor = t.classMethod(
+                        'constructor',
+                        t.identifier('constructor'),
+                        params,
+                        t.blockStatement(ctorBodyStmts)
+                    );
+                    path.get('body').pushContainer('body', ctor);
+                }
+            }
+
+            // Now perform registerDecorators transform
             const isAnonymousClassDeclaration =
                 path.isClassDeclaration() && !path.get('id').isIdentifier();
             const shouldTransformAsClassExpression =
diff --git a/packages/@lwc/babel-plugin-component/src/decorators/private/index.ts b/packages/@lwc/babel-plugin-component/src/decorators/private/index.ts
@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) 2024, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+import { LWC_PACKAGE_EXPORTS } from '../../constants';
+
+import validate from './validate';
+import transform from './transform';
+
+const { PRIVATE_DECORATOR } = LWC_PACKAGE_EXPORTS;
+
+export default {
+    name: PRIVATE_DECORATOR,
+    validate,
+    transform,
+};
diff --git a/packages/@lwc/babel-plugin-component/src/decorators/private/transform.ts b/packages/@lwc/babel-plugin-component/src/decorators/private/transform.ts
@@ -0,0 +1,66 @@
+/*
+ * Copyright (c) 2024, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+import type { BabelTypes } from '../../types';
+import type { DecoratorMeta } from '../index';
+
+function isPrivateDecorator(decorator: DecoratorMeta) {
+    return decorator.name === 'privateField';
+}
+
+export default function transform(
+    t: BabelTypes,
+    decoratorMetas: DecoratorMeta[],
+    classBodyItems: any[]
+) {
+    const privateDecoratorMetas = decoratorMetas.filter(isPrivateDecorator);
+
+    if (privateDecoratorMetas.length === 0) {
+        return [];
+    }
+
+    // Transform each @privateField decorated member to temporary naming convention
+    privateDecoratorMetas.forEach(({ path, propertyName, decoratedNodeType }) => {
+        // Find the class member that this decorator was attached to
+        const classMember = path.parentPath;
+        if (!classMember) return;
+
+        // Transform the property name to temporary private naming convention
+        if (decoratedNodeType === 'property' || decoratedNodeType === 'method') {
+            const key = classMember.get('key');
+            if (key && !Array.isArray(key) && key.isIdentifier()) {
+                // Transform the identifier to use temporary private naming convention
+                const tempPrivateName = t.identifier(`__private_${propertyName}`);
+                key.replaceWith(tempPrivateName);
+            }
+        }
+    });
+
+    // Transform access patterns within the class to use temporary naming convention
+    classBodyItems.forEach((item) => {
+        if (item.isClassMethod() || item.isClassProperty()) {
+            const privateFieldNames = privateDecoratorMetas.map((d) => d.propertyName);
+
+            item.traverse({
+                MemberExpression(memberPath: any) {
+                    const { object, property } = memberPath.node;
+                    if (
+                        t.isThisExpression(object) &&
+                        t.isIdentifier(property) &&
+                        privateFieldNames.includes(property.name)
+                    ) {
+                        // Transform this.propertyName to this.__private_propertyName
+                        const tempPrivateName = t.identifier(`__private_${property.name}`);
+                        memberPath.replaceWith(t.memberExpression(object, tempPrivateName, false));
+                    }
+                },
+            });
+        }
+    });
+
+    // Return empty array since we don't need any metadata for private fields
+    return [];
+}
diff --git a/packages/@lwc/babel-plugin-component/src/decorators/private/validate.ts b/packages/@lwc/babel-plugin-component/src/decorators/private/validate.ts
@@ -0,0 +1,32 @@
+/*
+ * Copyright (c) 2024, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+import { DecoratorErrors } from '@lwc/errors';
+import { generateError } from '../../utils';
+import type { LwcBabelPluginPass } from '../../types';
+import type { DecoratorMeta } from '../index';
+
+function isPrivateDecorator(decorator: DecoratorMeta) {
+    return decorator.name === 'privateField';
+}
+
+function validate(decorators: DecoratorMeta[], state: LwcBabelPluginPass) {
+    decorators.filter(isPrivateDecorator).forEach(({ path, decoratedNodeType }) => {
+        // @privateField can only be used on class properties and methods
+        if (decoratedNodeType !== 'property' && decoratedNodeType !== 'method') {
+            throw generateError(
+                path,
+                {
+                    errorInfo: DecoratorErrors.INVALID_DECORATOR,
+                    messageArgs: ['@privateField', 'class properties and methods'],
+                },
+                state
+            );
+        }
+    });
+}
+
+export default validate;
diff --git a/packages/@lwc/compiler/package.json b/packages/@lwc/compiler/package.json
@@ -51,6 +51,7 @@
         "@babel/plugin-transform-async-to-generator": "7.27.1",
         "@babel/plugin-transform-class-properties": "7.27.1",
         "@babel/plugin-transform-object-rest-spread": "7.28.0",
+        "@babel/plugin-transform-private-methods": "7.27.1",
         "@locker/babel-plugin-transform-unforgeables": "0.22.0",
         "@lwc/babel-plugin-component": "8.20.2",
         "@lwc/errors": "8.20.2",
diff --git a/packages/@lwc/compiler/src/transformers/javascript.ts b/packages/@lwc/compiler/src/transformers/javascript.ts
@@ -7,7 +7,6 @@
 import * as babel from '@babel/core';
 import babelAsyncGeneratorFunctionsPlugin from '@babel/plugin-transform-async-generator-functions';
 import babelAsyncToGenPlugin from '@babel/plugin-transform-async-to-generator';
-import babelClassPropertiesPlugin from '@babel/plugin-transform-class-properties';
 import babelObjectRestSpreadPlugin from '@babel/plugin-transform-object-rest-spread';
 import lockerBabelPluginTransformUnforgeables from '@locker/babel-plugin-transform-unforgeables';
 import lwcClassTransformPlugin, { type LwcBabelPluginOptions } from '@lwc/babel-plugin-component';
@@ -54,7 +53,8 @@ export default function scriptTransform(
 
     const plugins: babel.PluginItem[] = [
         [lwcClassTransformPlugin, lwcBabelPluginOptions],
-        [babelClassPropertiesPlugin, { loose: true }],
+        // [babelClassPropertiesPlugin, { loose: true }],
+        // [babelPrivateMethodPlugin, { loose: true }]
     ];
 
     if (!isAPIFeatureEnabled(APIFeature.DISABLE_OBJECT_REST_SPREAD_TRANSFORMATION, apiVersion)) {
diff --git a/packages/@lwc/compiler/src/typings/babel.d.ts b/packages/@lwc/compiler/src/typings/babel.d.ts
@@ -20,3 +20,8 @@ declare module '@babel/plugin-transform-async-to-generator' {
     const props: any;
     export = props;
 }
+
+declare module '@babel/plugin-transform-private-methods' {
+    const props: any;
+    export = props;
+}
diff --git a/playground/src/modules/x/counter/counter.js b/playground/src/modules/x/counter/counter.js
@@ -10,5 +10,10 @@ export default class extends LightningElement {
     }
     decrement() {
         this.counter--;
+        this.#something();
+    }
+    #something() {
+        // eslint-disable-next-line no-console
+        console.log(`Private`);
     }
 }
diff --git a/yarn.lock b/yarn.lock
@@ -853,6 +853,14 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.27.1"
 
+"@babel/plugin-transform-private-methods@7.27.1":
+  version "7.27.1"
+  resolved "https://nexus-proxy.repo.local.sfdc.net/nexus/content/groups/npm-all/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.27.1.tgz#fdacbab1c5ed81ec70dfdbb8b213d65da148b6af"
+  integrity sha512-10FVt+X55AjRAYI9BrdISN9/AQWHqldOeZDUoLyif1Kn05a56xVBXb8ZouL8pZ9jem8QpXaOt8TS7RHUIS+GPA==
+  dependencies:
+    "@babel/helper-create-class-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+
 "@babel/plugin-transform-private-methods@^7.25.9":
   version "7.25.9"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.25.9.tgz#847f4139263577526455d7d3223cd8bda51e3b57"
@@ -2244,9 +2252,11 @@
 
 "@lwc/eslint-plugin-lwc-internal@link:./scripts/eslint-plugin":
   version "0.0.0"
+  uid ""
 
 "@lwc/test-utils-lwc-internals@link:./scripts/test-utils":
   version "0.0.0"
+  uid ""
 
 "@napi-rs/wasm-runtime@0.2.4":
   version "0.2.4"
@@ -8617,7 +8627,7 @@ http-assert@^1.3.0:
 
 http-cache-semantics@3.8.1, http-cache-semantics@4.1.1, http-cache-semantics@^4.0.0, http-cache-semantics@^4.1.0, http-cache-semantics@^4.1.1:
   version "4.1.1"
-  resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz#abe02fcb2985460bf0323be664436ec3476a6d5a"
+  resolved "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz#abe02fcb2985460bf0323be664436ec3476a6d5a"
   integrity sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==
 
 http-errors@2.0.0, http-errors@^2.0.0:
@@ -12714,7 +12724,7 @@ semver-truncate@^1.1.2:
 
 semver@7.6.0, semver@^5.3.0, semver@^5.5.0, semver@^5.6.0, semver@^6.3.0, semver@^6.3.1, semver@^7.1.1, semver@^7.3.2, semver@^7.3.5, semver@^7.5.3, semver@^7.5.4, semver@^7.6.0, semver@^7.6.3, semver@^7.7.2:
   version "7.6.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.6.0.tgz#1a46a4db4bffcccd97b743b5005c8325f23d4e2d"
+  resolved "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz#1a46a4db4bffcccd97b743b5005c8325f23d4e2d"
   integrity sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==
   dependencies:
     lru-cache "^6.0.0"

Original file line number	Diff line number	Diff line change
`@@ -20,3 +20,8 @@ declare module '@babel/plugin-transform-async-to-generator' {`
`20`	`20`	`const props: any;`
`21`	`21`	`export = props;`
`22`	`22`	`}`
	`23`	`+`
	`24`	`+declare module '@babel/plugin-transform-private-methods' {`
	`25`	`+ const props: any;`
	`26`	`+ export = props;`
	`27`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -10,5 +10,10 @@ export default class extends LightningElement {`
`10`	`10`	`}`
`11`	`11`	`decrement() {`
`12`	`12`	`this.counter--;`
	`13`	`+ this.#something();`
	`14`	`+ }`
	`15`	`+ #something() {`
	`16`	`+ // eslint-disable-next-line no-console`
	`17`	+ console.log(`Private`);
`13`	`18`	`}`
`14`	`19`	`}`