@teardown/cli 1.2.34 → 1.2.35

package/dist/modules/dev/dev-server/dev-server.js

@@ -0,0 +1,269 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DevServer = void 0;
+exports.makeLogEntryFromFastifyLog = makeLogEntryFromFastifyLog;
+const compress_1 = __importDefault(require("@fastify/compress"));
+const cors_1 = __importDefault(require("@fastify/cors"));
+const middie_1 = __importDefault(require("@fastify/middie"));
+const sensible_1 = __importDefault(require("@fastify/sensible"));
+const cli_server_api_1 = require("@react-native-community/cli-server-api");
+const metro_config_1 = require("@react-native/metro-config");
+const fastify_1 = __importDefault(require("fastify"));
+const metro_1 = __importDefault(require("metro"));
+const node_stream_1 = require("node:stream");
+const keyboard_handler_1 = require("../dev-menu/keyboard-handler");
+const terminal_reporter_1 = require("../terminal/terminal.reporter");
+const inspector_1 = require("./inspector/inspector");
+const devtools_plugin_1 = require("./plugins/devtools.plugin");
+const favicon_plugin_1 = require("./plugins/favicon.plugin");
+const multipart_plugin_1 = require("./plugins/multipart.plugin");
+const systrace_plugin_1 = require("./plugins/systrace.plugin");
+const wss_1 = require("./plugins/wss");
+const web_socket_api_server_1 = require("./plugins/wss/servers/web-socket-api.server");
+const web_socket_events_server_1 = require("./plugins/wss/servers/web-socket-events.server");
+const web_socket_message_server_1 = require("./plugins/wss/servers/web-socket-message.server");
+const sybmolicate_plugin_1 = require("./sybmolicate/sybmolicate.plugin");
+class DevServer {
+    config;
+    terminalReporter;
+    stream;
+    instance;
+    apiServer;
+    messageServer;
+    eventsServer;
+    keyboardHandler;
+    inspector;
+    constructor(config) {
+        this.config = config;
+        this.terminalReporter = new terminal_reporter_1.TeardownTerminalReporter(this);
+        this.stream = new node_stream_1.Writable({
+            write: this.onWrite.bind(this),
+        });
+        this.instance = (0, fastify_1.default)({
+            // disableRequestLogging: true,
+            logger: {
+                level: "trace",
+                stream: this.stream,
+            },
+            ...(config.https ? { https: config.https } : undefined),
+        });
+        this.apiServer = new web_socket_api_server_1.WebSocketApiServer(this.instance);
+        this.messageServer = new web_socket_message_server_1.WebSocketMessageServer(this.instance);
+        this.eventsServer = new web_socket_events_server_1.WebSocketEventsServer(this.instance, {
+            webSocketMessageServer: this.messageServer,
+        });
+        this.keyboardHandler = new keyboard_handler_1.KeyboardHandlerManager(this);
+        this.inspector = new inspector_1.Inspector({
+            projectRoot: this.config.projectRoot,
+            serverBaseUrl: this.getDevServerUrl(),
+            // eventReporter: this.terminalReporter,
+        });
+    }
+    async onWrite(chunk, encoding, callback) {
+        if (chunk == null) {
+            return;
+        }
+        const log = JSON.parse(chunk.toString());
+        this.apiServer.send(log);
+        callback();
+    }
+    getDevServerUrl() {
+        const https = this.config.https ? "https" : "http";
+        return `${https}://${this.config.host}:${this.config.port}`;
+    }
+    onInitializeDone() {
+        this.keyboardHandler.initialize();
+    }
+    reportMetroEvent(event) {
+        this.apiServer.send({
+            type: "metro_event",
+            event,
+        });
+        switch (event.type) {
+            case "client_log":
+                this.eventsServer.broadcastEvent(event);
+                break;
+        }
+    }
+    onBundleBuilt(bundlePath) {
+        // console.log("onBundleBuilt", bundlePath);
+        // this.messageServer.broadcast("reload");
+    }
+    onClientConnected(platform, clientId) {
+        // this.messageServer.broadcast("reload", undefined, []);
+        // this.instance.wss.router.onClientConnected(platform, clientId);
+        // this.onMessage({
+        // 	level: 30,
+        // 	time: Date.now(),
+        // 	pid: 1,
+        // 	hostname: "localhost",
+        // });
+    }
+    async loadMetroConfig() {
+        const config = await metro_1.default.loadConfig({
+            cwd: this.config.projectRoot,
+            ...this.config,
+        });
+        const reactNativeConfig = (0, metro_config_1.getDefaultConfig)(this.config.projectRoot);
+        return (0, metro_config_1.mergeConfig)(reactNativeConfig, config);
+    }
+    _metroConfig = null;
+    async getMetroConfig() {
+        if (!this._metroConfig) {
+            this._metroConfig = await this.loadMetroConfig();
+        }
+        return (0, metro_config_1.mergeConfig)(this._metroConfig, {
+            reporter: this.terminalReporter,
+        });
+    }
+    async registerPlugins() {
+        const metroConfig = await this.getMetroConfig();
+        const serverInstance = await metro_1.default.createConnectMiddleware(metroConfig, {
+            watch: true,
+            onBundleBuilt: this.onBundleBuilt.bind(this),
+        });
+        const websockets = this.inspector.createWebSocketServers();
+        // const devMiddleware = createDevMiddleware({
+        // 	projectRoot: this.config.projectRoot,
+        // 	serverBaseUrl: `http://${this.config.host}:${this.config.port}`,
+        // 	logger: this.instance.log,
+        // 	unstable_customInspectorMessageHandler:
+        // 		this.customInspectorMessageHandler.bind(this),
+        // 	unstable_experiments: {
+        // 		enableNetworkInspector: true,
+        // 	},
+        // });
+        // const debuggerConnectionServer = new DebuggerConnectionServer({
+        // 	devices: this.devices,
+        // 	eventReporter: this.eventReporter,
+        // 	startHeartbeat: this.startHeartbeat,
+        // });
+        // const deviceConnectionServer = new DeviceConnectionServer(this.instance);
+        await this.instance.register(cors_1.default, {
+            origin: "*",
+            // 	"localhost",
+            // 	"localhost:8081",
+            // 	"127.0.0.1",
+            // 	"127.0.0.1:8081",
+            // 	/localhost:\d+/,
+            // 	/127\.0\.0\.1:\d+/,
+            // ],
+            // methods: ["GET", "PUT", "POST", "DELETE", "OPTIONS"],
+            // allowedHeaders: ["Content-Type", "Authorization", "X-Requested-With"],
+            // credentials: true,
+            // maxAge: 86400,
+            // preflight: true,
+            preflightContinue: true,
+        });
+        await this.instance.register(compress_1.default);
+        await this.instance.register(sensible_1.default);
+        await this.instance.register(middie_1.default);
+        await this.instance.register(wss_1.wssPlugin, {
+            metroConfig,
+            metroServer: serverInstance.metroServer,
+            onClientConnected: this.onClientConnected.bind(this),
+            messageServer: this.messageServer,
+            eventsServer: this.eventsServer,
+            apiServer: this.apiServer,
+            endpoints: {
+                "/inspector/debug": websockets["/inspector/debug"],
+                "/inspector/device": websockets["/inspector/device"],
+                "/inspector/network": websockets["/inspector/debug"],
+            },
+        });
+        await this.instance.register(multipart_plugin_1.multipartPlugin);
+        await this.instance.register(devtools_plugin_1.devtoolsPlugin, {
+            host: this.config.host,
+            port: this.config.port,
+            https: this.config.https,
+        });
+        await this.instance.register(sybmolicate_plugin_1.symbolicatePlugin, {
+            onSymbolicate: this.onSymbolicate.bind(this),
+        });
+        await this.instance.register(systrace_plugin_1.systracePlugin);
+        await this.instance.register(favicon_plugin_1.faviconPlugin);
+        // Register middleware
+        this.instance.use("/open-url", cli_server_api_1.openURLMiddleware);
+        this.instance.use("/open-stack-frame", (0, cli_server_api_1.openStackFrameInEditorMiddleware)({
+            watchFolders: [this.config.projectRoot],
+        }));
+        this.instance.use(serverInstance.metroServer.processRequest);
+        this.instance.use((req, resp, next) => this.inspector.handleHttpRequest(req, resp, next));
+    }
+    onSymbolicate(request, reply) {
+        const result = JSON.parse(request.rawBody);
+        const { codeFrame, stack } = result;
+        this.instance.log.info("onSymbolicate", { codeFrame, stack });
+    }
+    registerHooks() {
+        this.instance.log.info("Registering hooks");
+        this.instance = this.instance.addHook("onSend", async (request, reply, payload) => {
+            reply.header("X-Content-Type-Options", "nosniff");
+            reply.header("X-React-Native-Project-Root", this.config.projectRoot);
+            const [pathname] = request.url.split("?");
+            if (pathname.endsWith(".map")) {
+                reply.header("Access-Control-Allow-Origin", "devtools://devtools");
+            }
+            return payload;
+        });
+        this.instance.log.info("Hooks registered");
+    }
+    registerRoutes() {
+        this.instance.log.info("Registering routes");
+        this.instance.get("/", async () => "React Native packager is running");
+        this.instance.get("/status", async () => "packager-status:running");
+        this.instance.log.info("Routes registered");
+    }
+    async initialize() {
+        this.instance.log.info("Initializing dev server");
+        await this.registerPlugins();
+        this.registerHooks();
+        this.registerRoutes();
+        this.instance.log.info("Dev server initialized");
+    }
+    async start() {
+        this.instance.log.info("Starting dev server", this.config);
+        await this.instance.listen({
+            port: this.config.port,
+            host: this.config.host,
+        });
+        this.instance.log.info("Dev server started", this.instance.server.address());
+    }
+    async stop() {
+        this.instance.log.info("Stopping dev server");
+        await this.instance.close();
+        this.instance.log.info("Dev server stopped");
+    }
+    getInstance() {
+        return this.instance;
+    }
+}
+exports.DevServer = DevServer;
+const levelToTypeMapping = {
+    10: "debug",
+    20: "debug",
+    30: "info",
+    40: "warn",
+    50: "error",
+    60: "error",
+};
+function makeLogEntryFromFastifyLog(data) {
+    const { level, time, pid, hostname, ...rest } = data;
+    const levelToTypeMapping = {
+        10: "debug",
+        20: "debug",
+        30: "info",
+        40: "warn",
+        50: "error",
+        60: "error",
+    };
+    return {
+        type: levelToTypeMapping[level] ?? "log",
+        timestamp: time,
+        issuer: "",
+        message: [rest],
+    };
+}

package/dist/modules/dev/dev-server/inspector/device.event-reporter.js

@@ -0,0 +1,165 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DeviceEventReporter = void 0;
+const ttlcache_1 = __importDefault(require("@isaacs/ttlcache"));
+class DeviceEventReporter {
+    eventReporter;
+    metadata;
+    pendingCommands;
+    constructor(eventReporter, metadata) {
+        this.eventReporter = eventReporter;
+        this.metadata = metadata;
+        this.pendingCommands = new ttlcache_1.default({
+            ttl: 10000,
+            dispose: (command, id, reason) => {
+                if (reason === "delete" || reason === "set") {
+                    // TODO: Report clobbering ('set') using a dedicated error code
+                    return;
+                }
+                this.logExpiredCommand(command);
+            },
+        });
+    }
+    logRequest(req, origin, metadata) {
+        this.pendingCommands.set(req.id, {
+            method: req.method,
+            requestOrigin: origin,
+            requestTime: Date.now(),
+            metadata,
+        });
+    }
+    logResponse(res, origin, metadata) {
+        const pendingCommand = this.pendingCommands.get(res.id);
+        if (!pendingCommand) {
+            this.eventReporter.logEvent({
+                type: "debugger_command",
+                protocol: "CDP",
+                requestOrigin: null,
+                method: null,
+                status: "coded_error",
+                errorCode: "UNMATCHED_REQUEST_ID",
+                responseOrigin: origin,
+                timeSinceStart: null,
+                appId: this.metadata.appId,
+                deviceId: this.metadata.deviceId,
+                deviceName: this.metadata.deviceName,
+                pageId: metadata.pageId,
+                frontendUserAgent: metadata.frontendUserAgent,
+                prefersFuseboxFrontend: metadata.prefersFuseboxFrontend,
+            });
+            return;
+        }
+        const timeSinceStart = Date.now() - pendingCommand.requestTime;
+        this.pendingCommands.delete(res.id);
+        if (res.error) {
+            let message = res.error.message;
+            if ("data" in res.error) {
+                message += ` (${String(res.error.data)})`;
+            }
+            this.eventReporter.logEvent({
+                type: "debugger_command",
+                requestOrigin: pendingCommand.requestOrigin,
+                method: pendingCommand.method,
+                protocol: "CDP",
+                status: "coded_error",
+                errorCode: "PROTOCOL_ERROR",
+                errorDetails: message,
+                responseOrigin: origin,
+                timeSinceStart,
+                appId: this.metadata.appId,
+                deviceId: this.metadata.deviceId,
+                deviceName: this.metadata.deviceName,
+                pageId: pendingCommand.metadata.pageId,
+                frontendUserAgent: pendingCommand.metadata.frontendUserAgent,
+                prefersFuseboxFrontend: metadata.prefersFuseboxFrontend,
+            });
+            return;
+        }
+        this.eventReporter.logEvent({
+            type: "debugger_command",
+            protocol: "CDP",
+            requestOrigin: pendingCommand.requestOrigin,
+            method: pendingCommand.method,
+            status: "success",
+            responseOrigin: origin,
+            timeSinceStart,
+            appId: this.metadata.appId,
+            deviceId: this.metadata.deviceId,
+            deviceName: this.metadata.deviceName,
+            pageId: pendingCommand.metadata.pageId,
+            frontendUserAgent: pendingCommand.metadata.frontendUserAgent,
+            prefersFuseboxFrontend: metadata.prefersFuseboxFrontend,
+        });
+    }
+    logConnection(connectedEntity, metadata) {
+        this.eventReporter.logEvent({
+            type: "connect_debugger_frontend",
+            status: "success",
+            appId: this.metadata.appId,
+            deviceName: this.metadata.deviceName,
+            deviceId: this.metadata.deviceId,
+            pageId: metadata.pageId,
+            frontendUserAgent: metadata.frontendUserAgent,
+        });
+    }
+    logDisconnection(disconnectedEntity) {
+        const errorCode = disconnectedEntity === "device"
+            ? "DEVICE_DISCONNECTED"
+            : "DEBUGGER_DISCONNECTED";
+        for (const pendingCommand of this.pendingCommands.values()) {
+            this.eventReporter.logEvent({
+                type: "debugger_command",
+                protocol: "CDP",
+                requestOrigin: pendingCommand.requestOrigin,
+                method: pendingCommand.method,
+                status: "coded_error",
+                errorCode,
+                responseOrigin: "proxy",
+                timeSinceStart: Date.now() - pendingCommand.requestTime,
+                appId: this.metadata.appId,
+                deviceId: this.metadata.deviceId,
+                deviceName: this.metadata.deviceName,
+                pageId: pendingCommand.metadata.pageId,
+                frontendUserAgent: pendingCommand.metadata.frontendUserAgent,
+                prefersFuseboxFrontend: pendingCommand.metadata.prefersFuseboxFrontend,
+            });
+        }
+        this.pendingCommands.clear();
+    }
+    logProxyMessageHandlingError(messageOrigin, error, message) {
+        this.eventReporter.logEvent({
+            type: "proxy_error",
+            status: "error",
+            messageOrigin,
+            message,
+            error: error.message,
+            errorStack: error.stack ?? "",
+            appId: this.metadata.appId,
+            deviceId: this.metadata.deviceId,
+            deviceName: this.metadata.deviceName,
+            pageId: null,
+        });
+    }
+    logExpiredCommand(pendingCommand) {
+        this.eventReporter.logEvent({
+            type: "debugger_command",
+            protocol: "CDP",
+            requestOrigin: pendingCommand.requestOrigin,
+            method: pendingCommand.method,
+            status: "coded_error",
+            errorCode: "TIMED_OUT",
+            responseOrigin: "proxy",
+            timeSinceStart: Date.now() - pendingCommand.requestTime,
+            appId: this.metadata.appId,
+            deviceId: this.metadata.deviceId,
+            deviceName: this.metadata.deviceName,
+            pageId: pendingCommand.metadata.pageId,
+            frontendUserAgent: pendingCommand.metadata.frontendUserAgent,
+            prefersFuseboxFrontend: pendingCommand.metadata.prefersFuseboxFrontend,
+        });
+    }
+}
+exports.DeviceEventReporter = DeviceEventReporter;