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

package/src/plugins/eco-component-meta-plugin.test.ts

@@ -1,406 +0,0 @@
-import { describe, expect, it, vi } from 'vitest';
-import {
-	createEcoComponentMetaPlugin,
-	createEcoComponentMetaTransform,
-	createEcoComponentMetaVitePlugin,
-} from './eco-component-meta-plugin';
-import type { EcoPagesAppConfig } from '../types/internal-types';
-import { fileSystem } from '@ecopages/file-system';
-
-/**
- * Creates a regex pattern to match __eco injection with any id hash.
- * The id is a base36 hash that varies, so we match it with a pattern.
- */
-function ecoMetaPattern(file: string, integration: string): RegExp {
-	const escapedFile = file.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-	return new RegExp(`__eco: \\{ id: "[a-z0-9]+", file: "${escapedFile}", integration: "${integration}" \\}`);
-}
-
-describe('eco-component-meta-plugin', () => {
-	const Config = {
-		integrations: [
-			{
-				name: 'kitajs',
-				extensions: ['.kita.tsx'],
-			},
-			{
-				name: 'react',
-				extensions: ['.tsx'],
-			},
-			{
-				name: 'ghtml',
-				extensions: ['.ts', '.ghtml.ts'],
-			},
-		],
-	} as EcoPagesAppConfig;
-
-	const plugin = createEcoComponentMetaPlugin({ config: Config });
-	const transform = createEcoComponentMetaTransform({ config: Config });
-
-	async function runPluginOnContent(content: string, filePath: string) {
-		let regexFilter: RegExp | undefined;
-		let onLoadCallback: any;
-
-		const buildMock = {
-			onLoad: (options: { filter: RegExp }, callback: any) => {
-				regexFilter = options.filter;
-				onLoadCallback = callback;
-			},
-		};
-
-		plugin.setup(buildMock as any);
-
-		if (!onLoadCallback || !regexFilter) {
-			throw new Error('Plugin did not register onLoad handler');
-		}
-
-		if (!regexFilter.test(filePath)) {
-			throw new Error(`File path ${filePath} does not match plugin filter ${regexFilter}`);
-		}
-
-		const fileSpy = vi.spyOn(fileSystem, 'readFileSync').mockImplementation(() => content);
-
-		try {
-			return await onLoadCallback({ path: filePath });
-		} finally {
-			fileSpy.mockRestore();
-		}
-	}
-
-	it('creates a bundler-neutral transform that strips query suffixes through the Vite adapter', () => {
-		const vitePlugin = createEcoComponentMetaVitePlugin({ config: Config });
-		const result = vitePlugin.transform(
-			"import { eco } from '@ecopages/core';\nexport default eco.page({ render: () => '<main />' });",
-			'/path/to/pages/index.tsx?import',
-		);
-
-		expect(typeof result).toBe('object');
-		expect((result as { code: string }).code).toMatch(ecoMetaPattern('/path/to/pages/index.tsx', 'react'));
-	});
-
-	it('creates a shared transform primitive that can run without the loader wrapper', () => {
-		const result = transform.transform(
-			"import { eco } from '@ecopages/core';\nexport default eco.page({ render: () => '<main />' });",
-			'/path/to/pages/index.tsx',
-		);
-
-		expect(typeof result).toBe('object');
-		expect((result as { code: string }).code).toMatch(ecoMetaPattern('/path/to/pages/index.tsx', 'react'));
-	});
-
-	it('should inject __eco into X.config assignment in TSX files', async () => {
-		const content = `
-            MyComponent.config = {
-                dependencies: {}
-            };
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/component.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/component.tsx', 'react'));
-	});
-
-	it('should NOT inject __eco into config patterns in non-EcoComponent files', async () => {
-		const content = `
-            export const config = {
-                apiUrl: 'https://api.example.com',
-                theme: 'dark'
-            };
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/settings.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).not.toContain('__eco:');
-	});
-
-	it('should inject __eco into EcoComponent-typed object with config property', async () => {
-		const content = `
-            import type { EcoComponent } from '@ecopages/core';
-
-            export const LitCounter: EcoComponent = {
-                config: {
-                    dependencies: {
-                        scripts: ['lit-counter.script.ts'] } } };
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/lit-counter.ts');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/lit-counter.ts', 'ghtml'));
-	});
-
-	it('should inject __eco into eco.component() call', async () => {
-		const content = `
-            import { eco } from '@ecopages/core';
-            export const Counter = eco.component${'<CounterProps>'}({
-                dependencies: {
-                    scripts: ['./counter.ts'] },
-                render: () => '${'<div>'}Counter${'</div>'}' });
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/counter.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/counter.tsx', 'react'));
-		expect(result.contents).toContain('eco.component' + '<CounterProps>({');
-	});
-
-	it('should inject __eco into eco.page call', async () => {
-		const content = `
-            import { eco } from '@ecopages/core';
-            export default eco.page({
-                dependencies: {
-                    components: [] },
-                render: () => '${'<main>'}Page${'</main>'}' });
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/pages/index.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/pages/index.tsx', 'react'));
-	});
-
-	it('should inject __eco into eco.layout call', async () => {
-		const content = `
-            import { eco } from '@ecopages/core';
-            export const MainLayout = eco.layout({
-                render: ({ children }) => '${'<main>'}' + children + '${'</main>'}' });
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/layouts/main-layout.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/layouts/main-layout.tsx', 'react'));
-	});
-
-	it('should inject __eco into eco.html call', async () => {
-		const content = `
-            import { eco } from '@ecopages/core';
-            export default eco.html({
-                render: ({ children }) => '${'<html><body>'}' + children + '${'</body></html>'}' });
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/html.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/html.tsx', 'react'));
-	});
-
-	it('should inject __eco into eco.component() with lazy dependencies', async () => {
-		const content = `
-            export const LazyCounter = eco.component({
-                dependencies: {
-					scripts: [{ src: './counter.ts', lazy: { 'on:interaction': 'click' } }] },
-                render: () => '${'<div>'}Lazy${'</div>'}' });
-        `;
-
-		const result = await runPluginOnContent(content, '/path/to/lazy-counter.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/lazy-counter.tsx', 'react'));
-	});
-
-	it('should detect kitajs integration from .kita.tsx extension', async () => {
-		const content = `import { eco } from '@ecopages/core';
-import type { PageHeadProps } from '@ecopages/core';
-
-export const Head = eco.component<PageHeadProps<string>>({
-	dependencies: {
-		stylesheets: ['../styles/global.css'] },
-	render: ({ metadata, children }) => (
-		<head>
-			<meta charset="UTF-8" />
-			{children}
-		</head>
-	) });`;
-
-		const result = await runPluginOnContent(content, '/path/to/includes/head.kita.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/includes/head.kita.tsx', 'kitajs'));
-	});
-
-	it('should handle eco.page with complex generic types', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export default eco.page<{ title: string; callback: (arg: string) => void }>({
-	staticProps: async () => ({ props: { title: 'Hello', callback: () => {} } }),
-	render: (props) => '<div>' + props.title + '</div>' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/pages/complex.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/pages/complex.tsx', 'react'));
-	});
-
-	it('should handle multiple eco.component calls in same file', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export const Button = eco.component({
-	render: () => '<button>Click</button>' });
-
-export const Input = eco.component({
-	render: () => '<input type="text" />' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/components.tsx');
-
-		expect(result).toBeDefined();
-		const matches = result.contents.match(
-			/__eco: \{ id: "[a-z0-9]+", file: "\/path\/to\/components\.tsx", integration: "react" \},/g,
-		);
-		expect(matches).toHaveLength(2);
-	});
-
-	it('should handle eco.component with empty config object', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export const Simple = eco.component({});
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/simple.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/simple.tsx', 'react'));
-	});
-
-	it('should not inject into non-eco call expressions', async () => {
-		const content = `
-import { other } from 'some-lib';
-
-export const Thing = other.component({
-	render: () => '<div>Thing</div>' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/thing.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).not.toContain('__eco:');
-	});
-
-	it('should not inject into non-config variable declarations', async () => {
-		const content = `
-const settings = {
-	theme: 'dark',
-	locale: 'en' };
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/settings.ts');
-
-		expect(result).toBeDefined();
-		expect(result.contents).not.toContain('__eco:');
-	});
-
-	it('should handle file paths with special characters in directory', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export default eco.page({
-	render: () => '<div>Page</div>' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/my-app/pages/index.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/my-app/pages/index.tsx', 'react'));
-	});
-
-	it('should handle eco.component with nested object in dependencies', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export const LazyComponent = eco.component({
-	dependencies: {
-		stylesheets: ['./style.css'],
-		scripts: [{ src: './script.ts', lazy: { 'on:interaction': 'click' } }],
-		components: [] },
-	render: () => '<div>Lazy</div>' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/lazy.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/lazy.tsx', 'react'));
-	});
-
-	it('should preserve original code structure after injection', async () => {
-		const content = `import { eco } from '@ecopages/core';
-
-export const Counter = eco.component({
-	dependencies: {
-		scripts: ['./counter.ts'] },
-	render: () => '<button>0</button>' });`;
-
-		const result = await runPluginOnContent(content, '/path/to/counter.tsx');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toContain("import { eco } from '@ecopages/core';");
-		expect(result.contents).toContain("scripts: ['./counter.ts']");
-		expect(result.contents).toContain("render: () => '<button>0</button>'");
-	});
-
-	it('should handle query string in file path for cache busting', async () => {
-		const content = `
-import { eco } from '@ecopages/core';
-
-export default eco.page({
-	render: () => '<div>Page</div>' });
-`;
-
-		const result = await runPluginOnContent(content, '/path/to/pages/index.tsx?update=123456');
-
-		expect(result).toBeDefined();
-		expect(result.contents).toMatch(ecoMetaPattern('/path/to/pages/index.tsx', 'react'));
-	});
-
-	describe('Regression: eco-blog views failure', () => {
-		it('should inject __eco into a kitajs page with complex props and no manual __eco', async () => {
-			const content = `import { eco } from '@ecopages/core';
-import { MainLayout } from '@/layouts/main-layout.kita';
-import type { Post } from '@/lib/db';
-
-export interface BlogListProps {
-	posts: Post[];
-}
-
-export const BlogList = eco.page<BlogListProps>({
-	layout: MainLayout,
-	metadata: () => ({
-		title: 'EcoBlog | Home',
-		description: 'A blog about sustainability and technology' }),
-	render: ({ posts }) => {
-		return (
-			<div class="max-w-3xl mx-auto space-y-12">
-                {/* content */}
-			</div>
-		);
-	} });`;
-
-			const result = await runPluginOnContent(
-				content,
-				'/path/to/playground/eco-blog/src/views/blog-list.kita.tsx',
-			);
-
-			expect(result).toBeDefined();
-			expect(result.contents).toMatch(
-				ecoMetaPattern('/path/to/playground/eco-blog/src/views/blog-list.kita.tsx', 'kitajs'),
-			);
-		});
-
-		it('should inject __eco even if the eco call is not at the top level', async () => {
-			const content = `
-                import { eco } from '@ecopages/core';
-                const createPage = () => eco.page({ render: () => 'hi' });
-                export default createPage();
-            `;
-			const result = await runPluginOnContent(content, '/path/to/nested.tsx');
-			expect(result.contents).toMatch(ecoMetaPattern('/path/to/nested.tsx', 'react'));
-		});
-	});
-});