Merge pull request #3006 from modernweb-dev/fx/revert-transform-input-html

fix(rollup-plugin-html): revert suport transform on input html

Author: bashmish

.changeset/tall-experts-wait.md

@@ -0,0 +1,5 @@
+---
+'@web/rollup-plugin-html': patch
+---
+
+revert support transform on input html

packages/rollup-plugin-html/src/output/createHTMLOutput.ts

@@ -15,8 +15,7 @@ export interface CreateHTMLAssetParams {
   input: InputData;
   emittedAssets: EmittedAssets;
   generatedBundles: GeneratedBundle[];
-  inputExternalTransformHtmlFns: TransformHtmlFunction[];
-  outputExternalTransformHtmlFns: TransformHtmlFunction[];
+  externalTransformHtmlFns: TransformHtmlFunction[];
   pluginOptions: RollupPluginHTMLOptions;
   defaultInjectDisabled: boolean;
   serviceWorkerPath: string;
@@ -31,8 +30,7 @@ export async function createHTMLAsset(params: CreateHTMLAssetParams): Promise<Em
     input,
     emittedAssets,
     generatedBundles,
-    inputExternalTransformHtmlFns,
-    outputExternalTransformHtmlFns,
+    externalTransformHtmlFns,
     pluginOptions,
     defaultInjectDisabled,
     serviceWorkerPath,
@@ -59,8 +57,7 @@ export async function createHTMLAsset(params: CreateHTMLAssetParams): Promise<Em
     input,
     outputDir,
     emittedAssets,
-    inputExternalTransformHtmlFns,
-    outputExternalTransformHtmlFns,
+    externalTransformHtmlFns,
     defaultInjectDisabled,
     serviceWorkerPath,
     injectServiceWorker,
@@ -76,8 +73,7 @@ export interface CreateHTMLAssetsParams {
   inputs: InputData[];
   emittedAssets: EmittedAssets;
   generatedBundles: GeneratedBundle[];
-  inputExternalTransformHtmlFns: TransformHtmlFunction[];
-  outputExternalTransformHtmlFns: TransformHtmlFunction[];
+  externalTransformHtmlFns: TransformHtmlFunction[];
   pluginOptions: RollupPluginHTMLOptions;
   defaultInjectDisabled: boolean;
   serviceWorkerPath: string;

packages/rollup-plugin-html/src/output/getOutputHTML.ts

@@ -19,8 +19,7 @@ export interface GetOutputHTMLParams {
   emittedAssets: EmittedAssets;
   pluginOptions: RollupPluginHTMLOptions;
   entrypointBundles: Record<string, EntrypointBundle>;
-  inputExternalTransformHtmlFns?: TransformHtmlFunction[];
-  outputExternalTransformHtmlFns?: TransformHtmlFunction[];
+  externalTransformHtmlFns?: TransformHtmlFunction[];
   defaultInjectDisabled: boolean;
   serviceWorkerPath: string;
   injectServiceWorker: boolean;
@@ -32,8 +31,7 @@ export async function getOutputHTML(params: GetOutputHTMLParams) {
   const {
     pluginOptions,
     entrypointBundles,
-    inputExternalTransformHtmlFns,
-    outputExternalTransformHtmlFns,
+    externalTransformHtmlFns,
     input,
     outputDir,
     emittedAssets,
@@ -46,20 +44,8 @@ export async function getOutputHTML(params: GetOutputHTMLParams) {
   const { default: defaultBundle, ...multiBundles } = entrypointBundles;
   const { absoluteSocialMediaUrls = true, rootDir = process.cwd() } = pluginOptions;
 
-  let inputHtml = input.html;
-
-  // run transform functions on input HTML
-  const inputTransforms = [...(inputExternalTransformHtmlFns ?? [])];
-  for (const transform of inputTransforms) {
-    inputHtml = await transform(inputHtml, {
-      bundle: defaultBundle,
-      bundles: multiBundles,
-      htmlFileName: input.name,
-    });
-  }
-
   // inject rollup output into HTML
-  let document = parse(inputHtml);
+  let document = parse(input.html);
   if (pluginOptions.extractAssets !== false) {
     injectedUpdatedAssetPaths({
       document,
@@ -89,17 +75,17 @@ export async function getOutputHTML(params: GetOutputHTMLParams) {
 
   let outputHtml = serialize(document);
 
-  const outputTransforms = [...(outputExternalTransformHtmlFns ?? [])];
+  const transforms = [...(externalTransformHtmlFns ?? [])];
   if (pluginOptions.transformHtml) {
     if (Array.isArray(pluginOptions.transformHtml)) {
-      outputTransforms.push(...pluginOptions.transformHtml);
+      transforms.push(...pluginOptions.transformHtml);
     } else {
-      outputTransforms.push(pluginOptions.transformHtml);
+      transforms.push(pluginOptions.transformHtml);
     }
   }
 
   // run transform functions on output HTML
-  for (const transform of outputTransforms) {
+  for (const transform of transforms) {
     outputHtml = await transform(outputHtml, {
       bundle: defaultBundle,
       bundles: multiBundles,

packages/rollup-plugin-html/src/rollupPluginHTML.ts

@@ -18,10 +18,7 @@ import { emitAssets } from './output/emitAssets.js';
 export interface RollupPluginHtml extends Plugin {
   api: {
     getInputs(): InputData[];
-    addHtmlTransformer(
-      transformHtmlFunction: TransformHtmlFunction,
-      transformStage?: 'input' | 'output',
-    ): void;
+    addHtmlTransformer(transformHtmlFunction: TransformHtmlFunction): void;
     disableDefaultInject(): void;
     addOutput(name: string): Plugin;
   };
@@ -31,8 +28,7 @@ export function rollupPluginHTML(pluginOptions: RollupPluginHTMLOptions = {}): R
   const multiOutputNames: string[] = [];
   let inputs: InputData[] = [];
   let generatedBundles: GeneratedBundle[] = [];
-  let inputExternalTransformHtmlFns: TransformHtmlFunction[] = [];
-  let outputExternalTransformHtmlFns: TransformHtmlFunction[] = [];
+  let externalTransformHtmlFns: TransformHtmlFunction[] = [];
   let defaultInjectDisabled = false;
   let serviceWorkerPath = '';
   let injectServiceWorker = false;
@@ -42,8 +38,7 @@ export function rollupPluginHTML(pluginOptions: RollupPluginHTMLOptions = {}): R
   function reset() {
     inputs = [];
     generatedBundles = [];
-    inputExternalTransformHtmlFns = [];
-    outputExternalTransformHtmlFns = [];
+    externalTransformHtmlFns = [];
   }
 
   return {
@@ -151,8 +146,7 @@ export function rollupPluginHTML(pluginOptions: RollupPluginHTMLOptions = {}): R
         inputs,
         emittedAssets,
         generatedBundles,
-        inputExternalTransformHtmlFns,
-        outputExternalTransformHtmlFns,
+        externalTransformHtmlFns,
         pluginOptions,
         defaultInjectDisabled,
         serviceWorkerPath,
@@ -171,15 +165,8 @@ export function rollupPluginHTML(pluginOptions: RollupPluginHTMLOptions = {}): R
         return inputs;
       },
 
-      addHtmlTransformer(
-        transformHtmlFunction: TransformHtmlFunction,
-        transformStage: 'input' | 'output' = 'output',
-      ) {
-        if (transformStage === 'input') {
-          inputExternalTransformHtmlFns.push(transformHtmlFunction);
-        } else {
-          outputExternalTransformHtmlFns.push(transformHtmlFunction);
-        }
+      addHtmlTransformer(transformHtmlFunction: TransformHtmlFunction) {
+        externalTransformHtmlFns.push(transformHtmlFunction);
       },
 
       disableDefaultInject() {
@@ -218,8 +205,7 @@ export function rollupPluginHTML(pluginOptions: RollupPluginHTMLOptions = {}): R
                 inputs,
                 emittedAssets,
                 generatedBundles,
-                inputExternalTransformHtmlFns,
-                outputExternalTransformHtmlFns,
+                externalTransformHtmlFns,
                 pluginOptions,
                 defaultInjectDisabled,
                 serviceWorkerPath,

packages/rollup-plugin-html/test/rollup-plugin-html.test.ts

@@ -626,16 +626,7 @@ describe('rollup-plugin-html', () => {
               return false;
             });
             plugin!.api.addHtmlTransformer((html: string) =>
-              html.replace('</body>', '<!-- injected to output --></body>'),
-            );
-            plugin!.api.addHtmlTransformer(
-              (html: string) =>
-                html.replace('<!-- injected to output -->', '<!-- injected to output 2 -->'),
-              'output',
-            );
-            plugin!.api.addHtmlTransformer(
-              (html: string) => html.replace('</body>', '<!-- injected to input --></body>'),
-              'input',
+              html.replace('</body>', '<!-- injected --></body>'),
             );
           },
         } as Plugin,
@@ -650,10 +641,9 @@ describe('rollup-plugin-html', () => {
     expect(entryB).to.include("console.log('entrypoint-b.js');");
     expect(stripNewlines(getAsset(output, 'index.html').source)).to.equal(
       '<html><head></head><body><h1>hello world</h1>' +
-        '<!-- injected to input -->' +
         '<script type="module" src="./entrypoint-a.js"></script>' +
         '<script type="module" src="./entrypoint-b.js"></script>' +
-        '<!-- injected to output 2 --></body></html>',
+        '<!-- injected --></body></html>',
     );
   });
 

packages/rollup-plugin-html/test/src/output/getOutputHTML.test.ts

@@ -105,14 +105,14 @@ describe('getOutputHTML()', () => {
     );
   });
 
-  it('can combine external and regular output transform functions', async () => {
+  it('can combine external and regular transform functions', async () => {
     const output = await getOutputHTML({
       ...defaultOptions,
       pluginOptions: {
         ...defaultOptions.pluginOptions,
         transformHtml: html => html.replace('Input HTML', 'Transformed Input HTML'),
       },
-      outputExternalTransformHtmlFns: [html => html.replace(/h1/g, 'h2')],
+      externalTransformHtmlFns: [html => html.replace(/h1/g, 'h2')],
     });
 
     expect(output).to.equal(