feat: add enableLightningWebSecurityTransforms to rollup-plugin (#3582)

packages/@lwc/compiler/README.md

@@ -54,6 +54,7 @@ const { code } = transformSync(source, filename, options);
     -   `scopedStyles` (type: `boolean`, optional) - True if the CSS file being compiled is a scoped stylesheet. Passed to `@lwc/style-compiler`.
     -   `enableStaticContentOptimization` (type: `boolean`, optional) - True if the static content optimization should be enabled. Passed to `@lwc/template-compiler`.
     -   `customRendererConfig` (type: `object`, optional) - custom renderer config to pass to `@lwc/template-compiler`. See that package's README for details.
+    -   `enableLightningWebSecurityTransforms` (type: `boolean`, default: `false`) - The configuration to enable Lighting Web Security specific transformations.
     -   `enableLwcSpread` (boolean, optional, `true` by default) - Deprecated. Ignored by compiler. `lwc:spread` is always enabled.
     -   `disableSyntheticShadowSupport` (type: `boolean`, default: `false`) - Set to true if synthetic shadow DOM support is not needed, which can result in smaller output.
     -   `instrumentation` (type: `InstrumentationObject`, optional) - instrumentation object to gather metrics and non-error logs for internal use. See the `@lwc/errors` package for details on the interface.

packages/@lwc/rollup-plugin/README.md

@@ -32,5 +32,6 @@ export default {
 -   `experimentalDynamicComponent` (type: `DynamicImportConfig`, default: `null`) - The configuration to pass to `@lwc/compiler`.
 -   `experimentalDynamicDirective` (type: `boolean`, default: `false`) - The configuration to pass to `@lwc/template-compiler` to enable deprecated dynamic components.
 -   `enableDynamicComponents` (type: `boolean`, default: `false`) - The configuration to pass to `@lwc/template-compiler` to enable dynamic components.
+-   `enableLightningWebSecurityTransforms` (type: `boolean`, default: `false`) - The configuration to pass to `@lwc/compiler`.
 -   `enableLwcSpread` (type: `boolean`, default: `false`) - The configuration to pass to the `@lwc/template-compiler`.
 -   `disableSyntheticShadowSupport` (type: `boolean`, default: `false`) - Set to true if synthetic shadow DOM support is not needed, which can result in smaller output.

packages/@lwc/rollup-plugin/src/__tests__/compilerConfig/compilerConfig.spec.ts

@@ -138,3 +138,38 @@ describe('javaScriptConfig', () => {
         expect(output[0].imports).toContain(CUSTOM_LOADER);
     });
 });
+
+describe('lwsConfig', () => {
+    it('should accept enableLightningWebSecurityTransforms config flag', async () => {
+        function stripWhitespace(string: string) {
+            return string.replace(/\s/g, '');
+        }
+
+        const bundle = await rollup({
+            input: path.resolve(
+                __dirname,
+                'fixtures/lightningWebSecurityTransforms/lightningWebSecurityTransforms.js'
+            ),
+            plugins: [
+                lwc({
+                    enableLightningWebSecurityTransforms: true,
+                }),
+            ],
+        });
+
+        const { output } = await bundle.generate({
+            format: 'esm',
+        });
+
+        const { code } = output[0];
+
+        expect(stripWhitespace(code)).toContain(
+            stripWhitespace(
+                '(window === globalThis || window === document ? location : window.location).href'
+            )
+        );
+        expect(code).toContain('_asyncToGenerator');
+        expect(code).toContain('_wrapAsyncGenerator');
+        expect(code).toContain('_asyncIterator');
+    });
+});

packages/@lwc/rollup-plugin/src/__tests__/compilerConfig/fixtures/lightningWebSecurityTransforms/lightningWebSecurityTransforms.html

@@ -0,0 +1,3 @@
+<template>
+    <span>hello world</span>
+</template>

packages/@lwc/rollup-plugin/src/__tests__/compilerConfig/fixtures/lightningWebSecurityTransforms/lightningWebSecurityTransforms.js

@@ -0,0 +1,17 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {
+    test = window.location.href;
+    async foo() {
+        await bar();
+    }
+    async bar() {
+        for await (const num of baz()) {
+            break;
+        }
+    }
+    async * baz() {
+        yield 1;
+        yield 2;
+    }
+}

packages/@lwc/rollup-plugin/src/index.ts

@@ -35,6 +35,8 @@ export interface RollupLwcOptions {
     experimentalDynamicDirective?: boolean;
     /** The configuration to pass to `@lwc/template-compiler`. */
     enableDynamicComponents?: boolean;
+    /** The configuration to pass to `@lwc/compiler`. */
+    enableLightningWebSecurityTransforms?: boolean;
     // TODO [#3370]: remove experimental template expression flag
     /** The configuration to pass to `@lwc/template-compiler`. */
     experimentalComplexExpressions?: boolean;
@@ -148,6 +150,7 @@ export default function lwc(pluginOptions: RollupLwcOptions = {}): Plugin {
         experimentalDynamicComponent,
         experimentalDynamicDirective,
         enableDynamicComponents,
+        enableLightningWebSecurityTransforms,
         // TODO [#3370]: remove experimental template expression flag
         experimentalComplexExpressions,
         disableSyntheticShadowSupport,
@@ -309,6 +312,7 @@ export default function lwc(pluginOptions: RollupLwcOptions = {}): Plugin {
                 experimentalDynamicComponent,
                 experimentalDynamicDirective,
                 enableDynamicComponents,
+                enableLightningWebSecurityTransforms,
                 // TODO [#3370]: remove experimental template expression flag
                 experimentalComplexExpressions,
                 preserveHtmlComments,