@buenojs/bueno 0.8.10 → 0.8.11

package/dist/frontend/dev-server.js

@@ -0,0 +1,735 @@
+/**
+ * Development Server Implementation
+ *
+ * Provides a development server with:
+ * - Static file serving using Bun.file()
+ * - Framework auto-detection
+ * - JSX/TSX transpilation using Bun's built-in capabilities
+ * - SPA fallback support
+ * - Integration with the Router for API routes
+ * - Graceful shutdown handling
+ */
+import { createLogger } from "../logger/index.js";
+import { createConsoleStreamManager, injectConsoleScript, } from "./console-stream.js";
+import { injectHMRScript } from "./hmr-client.js";
+import { createHMRManager } from "./hmr.js";
+import { createSSRRenderer } from "./ssr.js";
+// ============= Constants =============
+const DEFAULT_PORT = 3000;
+const DEFAULT_HOSTNAME = "localhost";
+const DEFAULT_PUBLIC_DIR = "public";
+const DEFAULT_PAGES_DIR = "pages";
+const MIME_TYPES = {
+    ".html": "text/html; charset=utf-8",
+    ".css": "text/css; charset=utf-8",
+    ".js": "application/javascript; charset=utf-8",
+    ".mjs": "application/javascript; charset=utf-8",
+    ".ts": "application/typescript; charset=utf-8",
+    ".tsx": "application/typescript; charset=utf-8",
+    ".jsx": "application/javascript; charset=utf-8",
+    ".json": "application/json; charset=utf-8",
+    ".png": "image/png",
+    ".jpg": "image/jpeg",
+    ".jpeg": "image/jpeg",
+    ".gif": "image/gif",
+    ".svg": "image/svg+xml",
+    ".ico": "image/x-icon",
+    ".woff": "font/woff",
+    ".woff2": "font/woff2",
+    ".ttf": "font/ttf",
+    ".eot": "application/vnd.ms-fontobject",
+    ".webp": "image/webp",
+    ".avif": "image/avif",
+    ".mp4": "video/mp4",
+    ".webm": "video/webm",
+    ".mp3": "audio/mpeg",
+    ".wav": "audio/wav",
+    ".pdf": "application/pdf",
+    ".zip": "application/zip",
+    ".wasm": "application/wasm",
+};
+// ============= Framework Detection =============
+const FRAMEWORK_INDICATORS = {
+    react: ["react", "react-dom"],
+    vue: ["vue"],
+    svelte: ["svelte"],
+    solid: ["solid-js"],
+};
+/**
+ * Detect framework from package.json dependencies
+ */
+function detectFramework(rootDir) {
+    try {
+        const packageJsonPath = `${rootDir}/package.json`;
+        const packageJsonFile = Bun.file(packageJsonPath);
+        if (!packageJsonFile.exists()) {
+            return {
+                framework: "react",
+                detected: false,
+                source: "config",
+            };
+        }
+        // Read package.json synchronously using Bun's sync read
+        const packageJson = JSON.parse(require("fs").readFileSync(packageJsonPath, "utf-8"));
+        const dependencies = {
+            ...packageJson.dependencies,
+            ...packageJson.devDependencies,
+        };
+        // Check for each framework in order of specificity
+        // Solid and Svelte are more specific than React/Vue
+        const frameworkOrder = [
+            "solid",
+            "svelte",
+            "vue",
+            "react",
+        ];
+        for (const framework of frameworkOrder) {
+            const indicators = FRAMEWORK_INDICATORS[framework];
+            if (indicators.some((pkg) => dependencies[pkg])) {
+                return {
+                    framework,
+                    detected: true,
+                    source: "package.json",
+                };
+            }
+        }
+        // Default to React if no framework detected
+        return {
+            framework: "react",
+            detected: false,
+            source: "config",
+        };
+    }
+    catch {
+        return {
+            framework: "react",
+            detected: false,
+            source: "config",
+        };
+    }
+}
+// ============= DevServer Class =============
+export class DevServer {
+    config;
+    state;
+    logger;
+    router = null;
+    apiRouter = null;
+    server = null;
+    middlewares = [];
+    eventListeners = [];
+    hmrManager = null;
+    consoleStreamManager = null;
+    ssrRenderer = null;
+    ssrEnabled = false;
+    constructor(config) {
+        this.config = this.normalizeConfig(config);
+        this.logger = createLogger({
+            level: "debug",
+            pretty: true,
+            context: { component: "DevServer" },
+        });
+        // Detect framework
+        const frameworkResult = this.config.framework === "auto"
+            ? detectFramework(this.config.rootDir)
+            : {
+                framework: this.config.framework,
+                detected: true,
+                source: "config",
+            };
+        this.state = {
+            running: false,
+            port: this.config.port,
+            hostname: this.config.hostname,
+            framework: frameworkResult.framework,
+            startTime: null,
+            activeConnections: 0,
+        };
+        if (frameworkResult.detected) {
+            this.logger.info(`Detected framework: ${frameworkResult.framework}`, {
+                source: frameworkResult.source,
+            });
+        }
+        else {
+            this.logger.info(`Using default framework: ${frameworkResult.framework}`);
+        }
+        // Initialize HMR if enabled
+        if (this.config.hmr) {
+            this.hmrManager = createHMRManager(frameworkResult.framework, this.config.port);
+            this.logger.info("HMR enabled");
+        }
+        // Initialize Console Stream if enabled (default: true)
+        if (this.config.consoleStream?.enabled !== false) {
+            this.consoleStreamManager = createConsoleStreamManager(this.config.port, this.config.consoleStream);
+            this.logger.info("Console streaming enabled");
+        }
+        this.emitEvent({
+            type: "framework-detected",
+            framework: frameworkResult.framework,
+        });
+    }
+    /**
+     * Normalize partial config to full config with defaults
+     */
+    normalizeConfig(config) {
+        return {
+            port: config.port ?? DEFAULT_PORT,
+            hostname: config.hostname ?? DEFAULT_HOSTNAME,
+            rootDir: config.rootDir,
+            publicDir: config.publicDir ?? DEFAULT_PUBLIC_DIR,
+            pagesDir: config.pagesDir ?? DEFAULT_PAGES_DIR,
+            hmr: config.hmr ?? true,
+            framework: config.framework ?? "auto",
+        };
+    }
+    /**
+     * Get current server state
+     */
+    getState() {
+        return { ...this.state };
+    }
+    /**
+     * Get server configuration
+     */
+    getConfig() {
+        return { ...this.config };
+    }
+    /**
+     * Get detected framework
+     */
+    getFramework() {
+        return this.state.framework;
+    }
+    /**
+     * Set the API router for handling API routes
+     */
+    setApiRouter(router) {
+        this.apiRouter = router;
+        this.logger.debug("API router configured");
+    }
+    /**
+     * Add middleware to the dev server
+     */
+    use(middleware) {
+        this.middlewares.push(middleware);
+        this.logger.debug("Middleware added");
+    }
+    /**
+     * Add event listener
+     */
+    onEvent(listener) {
+        this.eventListeners.push(listener);
+    }
+    /**
+     * Emit an event to all listeners
+     */
+    emitEvent(event) {
+        for (const listener of this.eventListeners) {
+            try {
+                listener(event);
+            }
+            catch (error) {
+                this.logger.error("Event listener error", error);
+            }
+        }
+    }
+    /**
+     * Get content type for a file path
+     */
+    getContentType(filePath) {
+        const ext = filePath.substring(filePath.lastIndexOf("."));
+        return MIME_TYPES[ext] || "application/octet-stream";
+    }
+    /**
+     * Resolve a request path to a file
+     */
+    async resolveFile(pathname) {
+        // Remove leading slash and query string
+        const cleanPath = pathname.split("?")[0].replace(/^\//, "");
+        // Try to find the file in public directory
+        const publicPath = `${this.config.rootDir}/${this.config.publicDir}/${cleanPath}`;
+        // Check if file exists
+        const publicFile = Bun.file(publicPath);
+        if (await publicFile.exists()) {
+            return {
+                found: true,
+                filePath: publicPath,
+                contentType: this.getContentType(publicPath),
+            };
+        }
+        // Try index.html for directory requests
+        const indexPath = `${this.config.rootDir}/${this.config.publicDir}/${cleanPath}/index.html`;
+        const indexFile = Bun.file(indexPath);
+        if (await indexFile.exists()) {
+            return {
+                found: true,
+                filePath: indexPath,
+                contentType: "text/html; charset=utf-8",
+            };
+        }
+        // SPA fallback to root index.html
+        const rootIndexPath = `${this.config.rootDir}/${this.config.publicDir}/index.html`;
+        const rootIndexFile = Bun.file(rootIndexPath);
+        if (await rootIndexFile.exists()) {
+            return {
+                found: true,
+                filePath: rootIndexPath,
+                contentType: "text/html; charset=utf-8",
+                isFallback: true,
+            };
+        }
+        return { found: false };
+    }
+    /**
+     * Transform a file based on its type
+     */
+    async transformFile(options) {
+        const { filePath, content, framework } = options;
+        // For JSX/TSX files, Bun handles transpilation automatically
+        // We just need to set the correct content type
+        const ext = filePath.substring(filePath.lastIndexOf("."));
+        if (ext === ".jsx" || ext === ".tsx") {
+            // Bun automatically handles JSX transpilation
+            // The content is returned as-is since Bun's serve handles it
+            return {
+                content,
+                contentType: "application/javascript; charset=utf-8",
+            };
+        }
+        return {
+            content,
+            contentType: this.getContentType(filePath),
+        };
+    }
+    /**
+     * Handle static file requests
+     */
+    async handleStaticFile(pathname) {
+        const resolution = await this.resolveFile(pathname);
+        if (!resolution.found || !resolution.filePath) {
+            return null;
+        }
+        const file = Bun.file(resolution.filePath);
+        if (!(await file.exists())) {
+            return null;
+        }
+        // Log if this is a fallback (SPA routing)
+        if (resolution.isFallback) {
+            this.logger.debug(`SPA fallback: ${pathname} -> index.html`);
+        }
+        // Inject HMR and Console scripts for HTML files
+        if (resolution.contentType === "text/html; charset=utf-8") {
+            let html = await file.text();
+            // Inject HMR script
+            if (this.hmrManager) {
+                html = injectHMRScript(html, this.hmrManager.getPort());
+            }
+            // Inject Console Stream script
+            if (this.consoleStreamManager) {
+                html = injectConsoleScript(html, this.consoleStreamManager.getPort());
+            }
+            return new Response(html, {
+                headers: {
+                    "Content-Type": "text/html; charset=utf-8",
+                },
+            });
+        }
+        return new Response(file, {
+            headers: {
+                "Content-Type": resolution.contentType || this.getContentType(resolution.filePath),
+            },
+        });
+    }
+    /**
+     * Handle API route requests
+     */
+    async handleApiRoute(request) {
+        if (!this.apiRouter) {
+            return null;
+        }
+        const url = new URL(request.url);
+        const method = request.method;
+        const match = this.apiRouter.match(method, url.pathname);
+        if (!match) {
+            return null;
+        }
+        this.logger.debug(`API route matched: ${method} ${url.pathname}`);
+        // Create a minimal context for the handler
+        const context = {
+            request,
+            method,
+            path: url.pathname,
+            url,
+            query: url.searchParams,
+            params: match.params,
+            headers: request.headers,
+            json: async () => request.json(),
+            text: async () => request.text(),
+            status: (code) => ({ status: code }),
+            header: (name, value) => ({ header: [name, value] }),
+        };
+        try {
+            const result = await match.handler(context);
+            if (result instanceof Response) {
+                return result;
+            }
+            // Convert result to JSON response
+            return Response.json(result);
+        }
+        catch (error) {
+            this.logger.error(`API route error: ${url.pathname}`, error);
+            return Response.json({
+                error: "Internal Server Error",
+                statusCode: 500,
+            }, { status: 500 });
+        }
+    }
+    /**
+     * Apply middleware chain
+     */
+    async applyMiddleware(request) {
+        if (this.middlewares.length === 0) {
+            return null;
+        }
+        let index = 0;
+        const next = async () => {
+            if (index >= this.middlewares.length) {
+                // Return a placeholder that indicates no middleware handled it
+                return new Response(null, { status: 404 });
+            }
+            const middleware = this.middlewares[index++];
+            return middleware(request, next);
+        };
+        const response = await next();
+        // If middleware returned 404, it means no middleware handled the request
+        if (response.status === 404 && !response.body) {
+            return null;
+        }
+        return response;
+    }
+    /**
+     * Main request handler
+     */
+    async handleRequest(request) {
+        const startTime = Date.now();
+        const url = new URL(request.url);
+        const pathname = url.pathname;
+        this.state.activeConnections++;
+        try {
+            // 1. Try middleware first
+            const middlewareResponse = await this.applyMiddleware(request);
+            if (middlewareResponse) {
+                this.logRequest(request.method, pathname, startTime);
+                return middlewareResponse;
+            }
+            // 2. Try API routes
+            const apiResponse = await this.handleApiRoute(request);
+            if (apiResponse) {
+                this.logRequest(request.method, pathname, startTime);
+                return apiResponse;
+            }
+            // 3. Try SSR if enabled
+            if (this.ssrEnabled) {
+                const ssrResponse = await this.handleSSRRequest(request);
+                if (ssrResponse) {
+                    this.logRequest(request.method, pathname, startTime);
+                    return ssrResponse;
+                }
+            }
+            // 4. Try static files
+            const staticResponse = await this.handleStaticFile(pathname);
+            if (staticResponse) {
+                this.logRequest(request.method, pathname, startTime);
+                return staticResponse;
+            }
+            // 5. 404 Not Found
+            this.logger.warn(`Not found: ${request.method} ${pathname}`);
+            return Response.json({
+                error: "Not Found",
+                statusCode: 404,
+            }, { status: 404 });
+        }
+        catch (error) {
+            this.logger.error(`Request error: ${pathname}`, error);
+            return Response.json({
+                error: "Internal Server Error",
+                statusCode: 500,
+                stack: process.env.NODE_ENV !== "production" && error instanceof Error
+                    ? error.stack
+                    : undefined,
+            }, { status: 500 });
+        }
+        finally {
+            this.state.activeConnections--;
+        }
+    }
+    /**
+     * Log a request
+     */
+    logRequest(method, path, startTime) {
+        const duration = Date.now() - startTime;
+        this.logger.debug(`${method} ${path}`, { duration: `${duration}ms` });
+        this.emitEvent({
+            type: "request",
+            method,
+            path,
+            duration,
+        });
+    }
+    /**
+     * Start the development server
+     */
+    async start() {
+        if (this.state.running) {
+            this.logger.warn("Server is already running");
+            return;
+        }
+        return new Promise((resolve, reject) => {
+            try {
+                this.server = Bun.serve({
+                    port: this.config.port,
+                    hostname: this.config.hostname,
+                    fetch: this.handleRequest.bind(this),
+                });
+                this.state.running = true;
+                this.state.startTime = new Date();
+                // Start HMR file watching
+                if (this.hmrManager) {
+                    this.hmrManager.startWatching(this.config.rootDir);
+                }
+                // Start Console Stream server
+                if (this.consoleStreamManager) {
+                    this.consoleStreamManager.start();
+                }
+                this.logger.info(`Development server started at http://${this.config.hostname}:${this.config.port}`);
+                this.emitEvent({
+                    type: "start",
+                    port: this.config.port,
+                    hostname: this.config.hostname,
+                });
+                resolve();
+            }
+            catch (error) {
+                this.logger.error("Failed to start server", error);
+                reject(error);
+            }
+        });
+    }
+    /**
+     * Stop the development server
+     */
+    async stop(reason) {
+        if (!this.state.running || !this.server) {
+            this.logger.warn("Server is not running");
+            return;
+        }
+        const server = this.server;
+        return new Promise((resolve, reject) => {
+            try {
+                // Stop HMR manager
+                if (this.hmrManager) {
+                    this.hmrManager.stop();
+                }
+                // Stop Console Stream manager
+                if (this.consoleStreamManager) {
+                    this.consoleStreamManager.stop();
+                }
+                server.stop(true);
+                this.state.running = false;
+                this.state.startTime = null;
+                this.logger.info(`Development server stopped${reason ? `: ${reason}` : ""}`);
+                this.emitEvent({
+                    type: "stop",
+                    reason,
+                });
+                resolve();
+            }
+            catch (error) {
+                this.logger.error("Failed to stop server", error);
+                reject(error);
+            }
+        });
+    }
+    /**
+     * Restart the development server
+     */
+    async restart() {
+        this.logger.info("Restarting development server...");
+        await this.stop("restart");
+        await this.start();
+    }
+    /**
+     * Check if the server is running
+     */
+    isRunning() {
+        return this.state.running;
+    }
+    /**
+     * Get server URL
+     */
+    getUrl() {
+        return `http://${this.config.hostname}:${this.config.port}`;
+    }
+    /**
+     * Get HMR manager
+     */
+    getHMRManager() {
+        return this.hmrManager;
+    }
+    /**
+     * Check if HMR is enabled
+     */
+    isHMREnabled() {
+        return this.hmrManager !== null && this.hmrManager.isEnabled();
+    }
+    /**
+     * Get HMR WebSocket URL
+     */
+    getHMRUrl() {
+        return this.hmrManager ? this.hmrManager.getWebSocketUrl() : null;
+    }
+    /**
+     * Get Console Stream manager
+     */
+    getConsoleStreamManager() {
+        return this.consoleStreamManager;
+    }
+    /**
+     * Check if console streaming is enabled
+     */
+    isConsoleStreamEnabled() {
+        return (this.consoleStreamManager !== null &&
+            this.consoleStreamManager.isEnabled());
+    }
+    /**
+     * Get Console Stream WebSocket URL
+     */
+    getConsoleStreamUrl() {
+        return this.consoleStreamManager
+            ? this.consoleStreamManager.getWebSocketUrl()
+            : null;
+    }
+    // ============= SSR Methods =============
+    /**
+     * Enable SSR with configuration
+     */
+    enableSSR(config) {
+        this.ssrRenderer = createSSRRenderer({
+            ...config,
+            framework: config.framework || this.state.framework,
+        });
+        this.ssrEnabled = true;
+        this.logger.info("SSR enabled", {
+            framework: config.framework || this.state.framework,
+        });
+    }
+    /**
+     * Disable SSR
+     */
+    disableSSR() {
+        this.ssrRenderer = null;
+        this.ssrEnabled = false;
+        this.logger.info("SSR disabled");
+    }
+    /**
+     * Check if SSR is enabled
+     */
+    isSSREnabled() {
+        return this.ssrEnabled && this.ssrRenderer !== null;
+    }
+    /**
+     * Get SSR renderer
+     */
+    getSSRRenderer() {
+        return this.ssrRenderer;
+    }
+    /**
+     * Set SSR renderer directly
+     */
+    setSSRRenderer(renderer) {
+        this.ssrRenderer = renderer;
+        this.ssrEnabled = true;
+        this.logger.info("SSR renderer configured");
+    }
+    /**
+     * Handle SSR request
+     */
+    async handleSSRRequest(request) {
+        if (!this.ssrEnabled || !this.ssrRenderer) {
+            return null;
+        }
+        const url = new URL(request.url);
+        const pathname = url.pathname;
+        // Skip static assets
+        if (this.isStaticAsset(pathname)) {
+            return null;
+        }
+        // Skip API routes
+        if (pathname.startsWith("/api/")) {
+            return null;
+        }
+        try {
+            // Check if streaming is enabled
+            if (this.ssrRenderer.isStreamingEnabled()) {
+                const stream = this.ssrRenderer.renderToStream(request.url, request);
+                return new Response(stream, {
+                    headers: {
+                        "Content-Type": "text/html; charset=utf-8",
+                    },
+                });
+            }
+            else {
+                const result = await this.ssrRenderer.render(request.url, request);
+                return new Response(result.html, {
+                    status: result.status,
+                    headers: {
+                        "Content-Type": "text/html; charset=utf-8",
+                    },
+                });
+            }
+        }
+        catch (error) {
+            this.logger.error(`SSR render error: ${pathname}`, error);
+            return null;
+        }
+    }
+    /**
+     * Check if path is a static asset
+     */
+    isStaticAsset(pathname) {
+        const staticExtensions = [
+            ".js",
+            ".mjs",
+            ".css",
+            ".json",
+            ".png",
+            ".jpg",
+            ".jpeg",
+            ".gif",
+            ".svg",
+            ".ico",
+            ".webp",
+            ".avif",
+            ".woff",
+            ".woff2",
+            ".ttf",
+            ".eot",
+            ".mp4",
+            ".webm",
+            ".mp3",
+            ".wav",
+            ".pdf",
+            ".zip",
+            ".wasm",
+        ];
+        return staticExtensions.some((ext) => pathname.endsWith(ext));
+    }
+}
+// ============= Factory Function =============
+/**
+ * Create a development server
+ */
+export function createDevServer(config) {
+    return new DevServer(config);
+}
+//# sourceMappingURL=dev-server.js.map