@ecopages/core 0.2.0-alpha.22 → 0.2.0-alpha.24

package/src/services/assets/asset-processing-service/processors/base/base-script-processor.ts

@@ -0,0 +1,174 @@
+import { appLogger } from '../../../../../global/app-logger.ts';
+import type { EcoPagesAppConfig } from '../../../../../types/internal-types.ts';
+import { getAppBrowserBuildPlugins } from '../../../../../build/build-adapter.ts';
+import type { EcoBuildPlugin } from '../../../../../build/build-types.ts';
+import { fileSystem } from '@ecopages/file-system';
+import path from 'node:path';
+import type { ScriptAsset } from '../../assets.types.ts';
+import { BaseProcessor } from './base-processor.ts';
+import {
+	BrowserBundleService,
+	type BrowserBundleGroupedEntry,
+} from '../../../browser-bundle.service.ts';
+
+export abstract class BaseScriptProcessor<T extends ScriptAsset> extends BaseProcessor<T> {
+	private readonly browserBundleService: BrowserBundleService;
+
+	constructor({ appConfig }: { appConfig: EcoPagesAppConfig }) {
+		super({ appConfig });
+		this.browserBundleService = new BrowserBundleService(appConfig);
+	}
+
+	protected shouldBundle(dep: T): boolean {
+		return dep.bundle !== false;
+	}
+
+	protected getBundlerOptions(dep: T): Record<string, any> {
+		if (dep.packageRole === 'page-script' && dep.bundleOptions?.splitting === undefined) {
+			return {
+				...dep.bundleOptions,
+				splitting: false,
+			};
+		}
+
+		return dep.bundleOptions || {};
+	}
+
+	protected collectBuildPlugins(excludePluginNames?: string[]): EcoBuildPlugin[] {
+		const buildPlugins = getAppBrowserBuildPlugins(this.appConfig);
+		if (!excludePluginNames || excludePluginNames.length === 0) {
+			return buildPlugins;
+		}
+
+		const excluded = new Set(excludePluginNames);
+		return buildPlugins.filter((plugin) => !excluded.has(plugin.name));
+	}
+
+	protected async bundleScript({
+		entrypoint,
+		outdir,
+		excludeAppBuildPlugins,
+		plugins: additionalPlugins,
+		...rest
+	}: {
+		entrypoint: string;
+		outdir: string;
+	} & ScriptAsset['bundleOptions']): Promise<string> {
+		const buildPlugins = this.collectBuildPlugins(excludeAppBuildPlugins);
+		const allPlugins = additionalPlugins ? [...additionalPlugins, ...buildPlugins] : buildPlugins;
+
+		const buildResult = await this.browserBundleService.bundle({
+			profile: 'browser-script',
+			entrypoints: [entrypoint],
+			outdir,
+			root: this.appConfig.rootDir,
+			excludeAppBuildPlugins,
+			splitting: true,
+			naming: '[name]-[hash].[ext]',
+			plugins: allPlugins,
+			...rest,
+		});
+
+		if (!buildResult.success) {
+			for (const log of buildResult.logs) {
+				appLogger.debug(log.message, log);
+			}
+		}
+
+		const entryBaseName = path.parse(entrypoint).name;
+		const entryOutput = buildResult.outputs
+			.map((output) => output.path)
+			.find((outputPath) => path.basename(outputPath) === `${entryBaseName}.js`);
+
+		if (entryOutput) {
+			return entryOutput;
+		}
+
+		const nonVendorOutput = buildResult.outputs
+			.map((output) => output.path)
+			.find((outputPath) => !path.basename(outputPath).startsWith('vendors'));
+
+		if (nonVendorOutput) {
+			return nonVendorOutput;
+		}
+
+		const primaryOutput = buildResult.outputs[0]?.path;
+		if (primaryOutput) {
+			return primaryOutput;
+		}
+
+		const namedFallbackOutput = path.join(outdir, `${entryBaseName}.js`);
+		if (fileSystem.exists(namedFallbackOutput)) {
+			return namedFallbackOutput;
+		}
+
+		const fallbackOutput = path.join(outdir, 'entry_0.js');
+		if (fileSystem.exists(fallbackOutput)) {
+			return fallbackOutput;
+		}
+
+		const logMessage = buildResult.logs.map((log) => log.message).join(' | ');
+		throw new Error(`No build output generated for ${entrypoint}${logMessage ? `: ${logMessage}` : ''}`);
+	}
+
+	protected async bundleScripts({
+		entries,
+		outdir,
+		excludeAppBuildPlugins,
+		plugins: additionalPlugins,
+		...rest
+	}: {
+		entries: BrowserBundleGroupedEntry[];
+		outdir: string;
+	} & ScriptAsset['bundleOptions']): Promise<Map<string, string>> {
+		const buildPlugins = this.collectBuildPlugins(excludeAppBuildPlugins);
+		const allPlugins = additionalPlugins ? [...additionalPlugins, ...buildPlugins] : buildPlugins;
+
+		const buildResult = await this.browserBundleService.bundleGroupedEntries(entries, {
+			profile: 'browser-script',
+			outdir,
+			root: this.appConfig.rootDir,
+			excludeAppBuildPlugins,
+			...rest,
+			splitting: true,
+			naming: '[name]-[hash].[ext]',
+			plugins: allPlugins,
+		});
+
+		if (!buildResult.success) {
+			for (const log of buildResult.logs) {
+				appLogger.debug(log.message, log);
+			}
+		}
+
+		const outputs = buildResult.outputs.map((output) => output.path);
+		const entryOutputs = new Map<string, string>();
+
+		for (const entry of entries) {
+			const exactOutput = outputs.find((outputPath) => path.basename(outputPath) === `${entry.entryName}.js`);
+			if (exactOutput) {
+				entryOutputs.set(entry.entryName, exactOutput);
+				continue;
+			}
+
+			const hashedOutput = outputs.find((outputPath) => path.basename(outputPath).startsWith(`${entry.entryName}-`));
+			if (hashedOutput) {
+				entryOutputs.set(entry.entryName, hashedOutput);
+				continue;
+			}
+
+			const fallbackOutput = path.join(outdir, `${entry.entryName}.js`);
+			if (fileSystem.exists(fallbackOutput)) {
+				entryOutputs.set(entry.entryName, fallbackOutput);
+				continue;
+			}
+
+			const logMessage = buildResult.logs.map((log) => log.message).join(' | ');
+			throw new Error(
+				`No build output generated for grouped entry ${entry.entryName}${logMessage ? `: ${logMessage}` : ''}`,
+			);
+		}
+
+		return entryOutputs;
+	}
+}

package/src/services/assets/asset-processing-service/processors/index.ts

@@ -0,0 +1,5 @@
+export * from './script/content-script.processor.ts';
+export * from './script/file-script.processor.ts';
+export * from './script/node-module-script.processor.ts';
+export * from './stylesheet/content-stylesheet.processor.ts';
+export * from './stylesheet/file-stylesheet.processor.ts';

package/src/services/assets/asset-processing-service/processors/script/content-script.processor.test.ts

@@ -0,0 +1,192 @@
+import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
+import { fileSystem } from '@ecopages/file-system';
+import { ContentScriptProcessor } from './content-script.processor';
+import type { EcoPagesAppConfig } from '../../../../../types/internal-types.ts';
+import type { ContentScriptAsset } from '../../assets.types.ts';
+import type { BrowserBundleGroupedEntry } from '../../../browser-bundle.service.ts';
+
+function createMockConfig(): EcoPagesAppConfig {
+	return {
+		baseUrl: 'http://localhost:3000',
+		rootDir: '/test/project',
+		srcDir: 'src',
+		publicDir: 'public',
+		pagesDir: 'pages',
+		includesDir: 'includes',
+		layoutsDir: 'layouts',
+		distDir: '.eco/public',
+		workDir: '.eco',
+		templatesExt: [],
+		componentsDir: 'components',
+		robotsTxt: { preferences: { '*': [] } },
+		additionalWatchPaths: [],
+		defaultMetadata: { title: 'Test', description: 'Test' },
+		integrations: [],
+		integrationsDependencies: [],
+		absolutePaths: {
+			config: '/test/project/eco.config.ts',
+			componentsDir: '/test/project/src/components',
+			distDir: '/test/project/.eco/public',
+			workDir: '/test/project/.eco',
+			includesDir: '/test/project/src/includes',
+			layoutsDir: '/test/project/src/layouts',
+			pagesDir: '/test/project/src/pages',
+			projectDir: '/test/project',
+			publicDir: '/test/project/public',
+			srcDir: '/test/project/src',
+			htmlTemplatePath: '/test/project/src/html.tsx',
+			error404TemplatePath: '/test/project/src/404.tsx',
+		},
+		processors: new Map(),
+		loaders: new Map(),
+		sourceTransforms: new Map(),
+	};
+}
+
+class TestContentScriptProcessor extends ContentScriptProcessor {
+	readonly bundleScriptsCalls: Array<{
+		entries: BrowserBundleGroupedEntry[];
+		outdir: string;
+		naming?: string;
+	}> = [];
+	bundleScriptsResult = new Map<string, string>();
+	bundleScriptsError?: Error;
+
+	protected override async bundleScripts({
+		entries,
+		outdir,
+		naming,
+	}: {
+		entries: BrowserBundleGroupedEntry[];
+		outdir: string;
+		naming?: string;
+	}): Promise<Map<string, string>> {
+		this.bundleScriptsCalls.push({ entries, outdir, naming });
+
+		if (this.bundleScriptsError) {
+			throw this.bundleScriptsError;
+		}
+
+		return this.bundleScriptsResult;
+	}
+}
+
+describe('ContentScriptProcessor', () => {
+	beforeEach(() => {
+		vi.spyOn(fileSystem, 'ensureDir').mockImplementation(() => {});
+		vi.spyOn(fileSystem, 'write').mockImplementation(() => {});
+		vi.spyOn(fileSystem, 'remove').mockImplementation(() => {});
+		vi.spyOn(fileSystem, 'readFileSync').mockImplementation(() => '');
+	});
+
+	afterEach(() => {
+		vi.restoreAllMocks();
+	});
+
+	test('processGrouped should bundle grouped entries together and preserve logical entry mapping', async () => {
+		const processor = new TestContentScriptProcessor({ appConfig: createMockConfig() });
+		processor.bundleScriptsResult = new Map([
+			['page-entry', '/test/project/.eco/public/assets/page-entry-abc123.js'],
+			['lazy-entry', '/test/project/.eco/public/assets/lazy-entry-def456.js'],
+		]);
+
+		const deps: ContentScriptAsset[] = [
+			{
+				kind: 'script',
+				source: 'content',
+				content: 'import "/test/project/src/page.ts";',
+				position: 'head',
+				attributes: { type: 'module', defer: '' },
+				packageRole: 'page-script',
+				groupedBundle: { id: 'bundle-1', entryName: 'page-entry' },
+			},
+			{
+				kind: 'script',
+				source: 'content',
+				content: 'import "/test/project/src/lazy.ts";',
+				position: 'head',
+				attributes: { type: 'module', defer: '', 'data-eco-lazy-key': 'lazy-key' },
+				excludeFromHtml: true,
+				groupedBundle: { id: 'bundle-1', entryName: 'lazy-entry' },
+			},
+		];
+
+		const results = await processor.processGrouped(deps);
+
+		expect(processor.bundleScriptsCalls).toHaveLength(1);
+		expect(processor.bundleScriptsCalls[0]).toEqual(
+			expect.objectContaining({
+				entries: expect.arrayContaining([
+					expect.objectContaining({ entryName: 'page-entry' }),
+					expect.objectContaining({ entryName: 'lazy-entry' }),
+				]),
+				naming: '[name]-[hash].[ext]',
+			}),
+		);
+
+		expect(results).toEqual([
+			expect.objectContaining({
+				filepath: '/test/project/.eco/public/assets/page-entry-abc123.js',
+				packageRole: 'page-script',
+				groupedBundle: { id: 'bundle-1', entryName: 'page-entry' },
+			}),
+			expect.objectContaining({
+				filepath: '/test/project/.eco/public/assets/lazy-entry-def456.js',
+				excludeFromHtml: true,
+				groupedBundle: { id: 'bundle-1', entryName: 'lazy-entry' },
+			}),
+		]);
+
+		expect(fileSystem.write).toHaveBeenCalledTimes(2);
+		expect(fileSystem.remove).toHaveBeenCalledTimes(1);
+	});
+
+	test('processGrouped should fall back to per-entry processing when bundling is disabled', async () => {
+		const processor = new ContentScriptProcessor({ appConfig: createMockConfig() });
+		const processSpy = vi.spyOn(processor, 'process').mockResolvedValueOnce({
+			kind: 'script',
+			inline: false,
+			filepath: '/tmp/first.js',
+		}).mockResolvedValueOnce({
+			kind: 'script',
+			inline: false,
+			filepath: '/tmp/second.js',
+		});
+
+		const results = await processor.processGrouped([
+			{
+				kind: 'script',
+				source: 'content',
+				content: 'console.log("first")',
+				bundle: false,
+			},
+			{
+				kind: 'script',
+				source: 'content',
+				content: 'console.log("second")',
+				bundle: false,
+			},
+		]);
+
+		expect(processSpy).toHaveBeenCalledTimes(2);
+		expect(results).toHaveLength(2);
+	});
+
+	test('processGrouped should remove temporary entries when bundling fails', async () => {
+		const processor = new TestContentScriptProcessor({ appConfig: createMockConfig() });
+		processor.bundleScriptsError = new Error('bundle failed');
+
+		await expect(
+			processor.processGrouped([
+				{
+					kind: 'script',
+					source: 'content',
+					content: 'console.log("grouped")',
+					groupedBundle: { id: 'bundle-1', entryName: 'page-entry' },
+				},
+			]),
+		).rejects.toThrow('bundle failed');
+
+		expect(fileSystem.remove).toHaveBeenCalledTimes(1);
+	});
+});

package/src/services/assets/asset-processing-service/processors/script/content-script.processor.ts

@@ -0,0 +1,134 @@
+import path from 'node:path';
+import { fileSystem } from '@ecopages/file-system';
+import type { ContentScriptAsset, ProcessedAsset } from '../../assets.types.ts';
+import { BaseScriptProcessor } from '../base/base-script-processor.ts';
+
+export class ContentScriptProcessor extends BaseScriptProcessor<ContentScriptAsset> {
+	async processGrouped(deps: ContentScriptAsset[]): Promise<ProcessedAsset[]> {
+		if (deps.length === 0) {
+			return [];
+		}
+
+		const shouldBundle = deps.every((dep) => this.shouldBundle(dep));
+		if (!shouldBundle || deps.some((dep) => dep.inline)) {
+			return Promise.all(deps.map((dep) => this.process(dep)));
+		}
+
+		const tempDir = path.join(
+			this.appConfig.absolutePaths.distDir,
+			`grouped-script-entries-${process.pid}-${Date.now()}-${Math.random().toString(36).slice(2)}`,
+		);
+		fileSystem.ensureDir(tempDir);
+
+		try {
+			const tempEntries = deps.map((dep, index) => {
+				const entryName = dep.groupedBundle?.entryName ?? dep.name ?? `grouped-script-${index}`;
+				const tempFilepath = path.join(tempDir, `${entryName}.js`);
+
+				fileSystem.write(tempFilepath, dep.content);
+
+				return {
+					dep,
+					entryName,
+					tempFilepath,
+				};
+			});
+
+			const primaryDep = deps[0]!;
+			const outputPaths = await this.bundleScripts({
+				...this.getBundlerOptions(primaryDep),
+				entries: tempEntries.map(({ entryName, tempFilepath }) => ({
+					entryName,
+					entrypoint: tempFilepath,
+				})),
+				outdir: this.getAssetsDir(),
+				minify: this.isProduction,
+				naming: '[name]-[hash].[ext]',
+			});
+
+			return tempEntries.map(({ dep, entryName }) => {
+				const bundledFilePath = outputPaths.get(entryName);
+				if (!bundledFilePath) {
+					throw new Error(`Missing grouped bundle output for ${entryName}`);
+				}
+
+				return {
+					filepath: bundledFilePath,
+					content: dep.inline ? fileSystem.readFileSync(bundledFilePath).toString() : undefined,
+					kind: 'script' as const,
+					position: dep.position,
+					attributes: dep.attributes,
+					inline: dep.inline,
+					excludeFromHtml: dep.excludeFromHtml,
+					packageRole: dep.packageRole,
+					groupedBundle: dep.groupedBundle,
+				};
+			});
+		} finally {
+			fileSystem.remove(tempDir);
+		}
+	}
+
+	async process(dep: ContentScriptAsset): Promise<ProcessedAsset> {
+		const hash = this.generateHash(dep.content);
+		const filename = dep.name ? `${dep.name}.js` : `script-${hash}.js`;
+		const shouldBundle = this.shouldBundle(dep);
+
+		const filepath = path.join(this.getAssetsDir(), 'scripts', filename);
+
+		if (!shouldBundle) {
+			if (!dep.inline) fileSystem.write(filepath, dep.content);
+			const unbundledProcessedAsset: ProcessedAsset = {
+				filepath,
+				content: dep.inline ? dep.content : undefined,
+				kind: 'script',
+				position: dep.position,
+				attributes: dep.attributes,
+				inline: dep.inline,
+				excludeFromHtml: dep.excludeFromHtml,
+				packageRole: dep.packageRole,
+			};
+
+			this.writeCacheFile(filename, unbundledProcessedAsset);
+			return unbundledProcessedAsset;
+		}
+
+		if (dep.content) {
+			const tempDir = this.appConfig.absolutePaths.distDir;
+			fileSystem.ensureDir(tempDir);
+			const tempFileName = path.join(
+				tempDir,
+				`${path.parse(filename).name}.${process.pid}.${Date.now()}.${Math.random().toString(36).slice(2)}.tmp.js`,
+			);
+			fileSystem.write(tempFileName, dep.content);
+
+			const bundledFilePath = await this.bundleScript({
+				entrypoint: tempFileName,
+				outdir: this.getAssetsDir(),
+				minify: this.isProduction,
+				naming: `${path.parse(filename).name}-[hash].[ext]`,
+				...this.getBundlerOptions(dep),
+			});
+
+			const processedAsset: ProcessedAsset = {
+				filepath: bundledFilePath,
+				content: dep.inline ? fileSystem.readFileSync(bundledFilePath).toString() : undefined,
+				kind: 'script',
+				position: dep.position,
+				attributes: dep.attributes,
+				inline: dep.inline,
+				excludeFromHtml: dep.excludeFromHtml,
+				packageRole: dep.packageRole,
+				groupedBundle: dep.groupedBundle,
+			};
+
+			fileSystem.remove(tempFileName);
+
+			this.writeCacheFile(filename, processedAsset);
+
+			return processedAsset;
+		}
+
+		throw new Error('No content found for script asset');
+	}
+}