cssprobe-cli 0.2.5 → 0.2.7

package/dist/config/config.js

@@ -77,16 +77,29 @@ function resolveProfile(args) {
     const rc = readRcFile();
     return rc.profiles[name] || {};
 }
+function parseViewport(raw) {
+    const match = raw.match(/^(\d+)\s*[xX*](\d+)$/);
+    if (!match)
+        return undefined;
+    const width = Number(match[1]);
+    const height = Number(match[2]);
+    if (width > 0 && height > 0)
+        return { width, height };
+    return undefined;
+}
 function loadConfig(args) {
     const profile = resolveProfile(args);
     const browser = args.browser || process.env.CSSPROBE_BROWSER || profile.browser || 'chromium';
     const depthRaw = args.depth ?? process.env.CSSPROBE_DEPTH ?? profile.depth;
     const depth = depthRaw ? Number(depthRaw) : 6;
     const headed = !!(args.headed || process.env.CSSPROBE_HEADED === 'true' || profile.headed === 'true');
+    const viewportRaw = args.viewport || process.env.CSSPROBE_VIEWPORT || profile.viewport;
+    const viewport = viewportRaw ? parseViewport(viewportRaw) : undefined;
     return {
         browser,
         depth: Number.isNaN(depth) ? 6 : depth,
         headed,
+        viewport,
         output: args.json ? 'json' : 'text',
         raw: !!args.raw,
     };
@@ -96,6 +109,7 @@ function maskConfig(config) {
         browser: config.browser,
         depth: String(config.depth),
         headed: String(config.headed),
+        ...(config.viewport ? { viewport: `${config.viewport.width}x${config.viewport.height}` } : {}),
     };
 }
 function writeRcConfig(key, value, profileName) {

package/dist/config/helpGenerator.js

@@ -80,7 +80,9 @@ function generateCommandHelp(command) {
     return lines.join('\n');
 }
 const categories = [
-    { name: 'core', title: 'Inspection' },
+    { name: 'core', title: 'Session Management' },
+    { name: 'cssprobe', title: 'CSS Inspection' },
+    { name: 'export', title: 'Export' },
     { name: 'config', title: 'Configuration' },
     { name: 'skill', title: 'Agent Skills' },
 ];

package/dist/daemon/daemon.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Daemon process for cssprobe-cli.
+ * Manages browser and executes commands via Unix socket.
+ * Adapted from playwright-cli.
+ */
+import type { ClientInfo } from './session';
+export interface DaemonOptions {
+    headed?: boolean;
+    browser?: string;
+}
+export declare function startDaemon(sessionName: string, clientInfo: ClientInfo, options: DaemonOptions): Promise<string>;

package/dist/daemon/daemon.js

@@ -0,0 +1,233 @@
+"use strict";
+/**
+ * Daemon process for cssprobe-cli.
+ * Manages browser and executes commands via Unix socket.
+ * Adapted from playwright-cli.
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startDaemon = startDaemon;
+const fs_1 = __importDefault(require("fs"));
+const net_1 = __importDefault(require("net"));
+const path_1 = __importDefault(require("path"));
+const socketConnection_1 = require("../utils/socketConnection");
+const launcher_1 = require("../browser/launcher");
+const analyzer_1 = require("../engine/analyzer");
+const renderer_1 = require("../engine/renderer");
+async function startDaemon(sessionName, clientInfo, options) {
+    const sessionConfig = createSessionConfig(clientInfo, sessionName, options);
+    const { socketPath } = sessionConfig;
+    // Clean up existing socket file on Unix
+    if (process.platform !== 'win32' && await socketExists(socketPath)) {
+        try {
+            await fs_1.default.promises.unlink(socketPath);
+        }
+        catch (error) {
+            throw error;
+        }
+    }
+    // Create browser launcher
+    const launcher = new launcher_1.BrowserLauncher({
+        browser: options.browser || 'chromium',
+        headed: options.headed !== false,
+    });
+    const server = net_1.default.createServer(socket => {
+        const connection = new socketConnection_1.SocketConnection(socket);
+        connection.onmessage = async (message) => {
+            const { id, method, params } = message;
+            try {
+                if (method === 'stop') {
+                    await deleteSessionFile(sessionConfig);
+                    await launcher.close();
+                    connection.send({ id, result: 'ok' }).catch(() => { });
+                    process.exit(0);
+                }
+                else if (method === 'run') {
+                    const result = await executeCommand(launcher, params.args);
+                    await connection.send({ id, result });
+                }
+                else {
+                    throw new Error(`Unknown method: ${method}`);
+                }
+            }
+            catch (e) {
+                const error = e.message;
+                connection.send({ id, error }).catch(() => { });
+            }
+        };
+    });
+    await new Promise((resolve, reject) => {
+        server.on('error', reject);
+        server.listen(socketPath, () => resolve());
+    });
+    await saveSessionFile(clientInfo, sessionConfig);
+    console.log(`Daemon listening on ${socketPath}`);
+    return socketPath;
+}
+async function executeCommand(launcher, args) {
+    const command = args._[0];
+    const params = args._.slice(1);
+    switch (command) {
+        case 'goto': {
+            const url = params[0] || 'about:blank';
+            await launcher.open(url);
+            return { text: `Navigated to ${url}` };
+        }
+        case 'inspect': {
+            const selector = params[0];
+            if (!selector)
+                throw new Error('Selector is required for inspect command');
+            const snapshot = await launcher.collect({
+                rootSelector: selector,
+                downDepth: args.depth || 6,
+                maxNodes: 60,
+                upTo: 'html',
+            });
+            const findings = (0, analyzer_1.analyze)(snapshot);
+            if (args.json) {
+                return { text: JSON.stringify((0, renderer_1.renderJSON)(snapshot, findings, args.brief), null, 2) };
+            }
+            else {
+                return { text: (0, renderer_1.renderMarkdown)(snapshot, findings, args.brief, args.layout) };
+            }
+        }
+        case 'tree': {
+            const selector = params[0];
+            if (!selector)
+                throw new Error('Selector is required for tree command');
+            const snapshot = await launcher.collect({
+                rootSelector: selector,
+                downDepth: args.depth || 6,
+                maxNodes: 60,
+                upTo: 'html',
+            });
+            // Render tree only
+            const lines = [];
+            lines.push(`## DOM tree (${snapshot.downDepth} levels deep)`);
+            lines.push('```');
+            renderNode(snapshot.tree, lines, 0);
+            lines.push('```');
+            return { text: lines.join('\n') };
+        }
+        case 'layout': {
+            const selector = params[0];
+            if (!selector)
+                throw new Error('Selector is required for layout command');
+            const snapshot = await launcher.collect({
+                rootSelector: selector,
+                downDepth: 6,
+                maxNodes: 60,
+                upTo: 'html',
+            });
+            const findings = (0, analyzer_1.analyze)(snapshot);
+            return { text: (0, renderer_1.renderMarkdown)(snapshot, findings, false, true) };
+        }
+        case 'findings': {
+            const selector = params[0];
+            if (!selector)
+                throw new Error('Selector is required for findings command');
+            const snapshot = await launcher.collect({
+                rootSelector: selector,
+                downDepth: 6,
+                maxNodes: 60,
+                upTo: 'html',
+            });
+            const findings = (0, analyzer_1.analyze)(snapshot);
+            const important = findings.filter(f => f.level === 'warning' || f.level === 'error');
+            if (important.length === 0) {
+                return { text: 'No warnings or errors found.' };
+            }
+            const lines = important.map(f => {
+                const icon = f.level === 'error' ? '⚠' : '⚠';
+                return `- ${icon} ${f.message} [${f.confidence}]${f.location ? ` @ ${f.location}` : ''}`;
+            });
+            return { text: lines.join('\n') };
+        }
+        case 'inject-css': {
+            const css = params[0];
+            if (!css)
+                throw new Error('CSS is required for inject-css command');
+            const page = launcher.getPage();
+            if (!page)
+                throw new Error('Browser is not open. Run: cssprobe-cli open <url>');
+            await page.addStyleTag({ content: css });
+            return { text: JSON.stringify({ success: true }) };
+        }
+        case 'screenshot': {
+            const page = launcher.getPage();
+            if (!page)
+                throw new Error('Browser is not open. Run: cssprobe-cli open <url>');
+            const buffer = await page.screenshot({ fullPage: args.fullPage });
+            const base64 = buffer.toString('base64');
+            return { text: `data:image/png;base64,${base64}` };
+        }
+        case 'eval': {
+            const expression = params[0];
+            if (!expression)
+                throw new Error('Expression is required for eval command');
+            const page = launcher.getPage();
+            if (!page)
+                throw new Error('Browser is not open. Run: cssprobe-cli open <url>');
+            const result = await page.evaluate(expression);
+            return { text: JSON.stringify(result, null, 2) };
+        }
+        default:
+            throw new Error(`Unknown command: ${command}`);
+    }
+}
+function renderNode(node, lines, indent) {
+    if (!node)
+        return;
+    const cls = node.classes?.length ? `.${node.classes.join('.')}` : '';
+    const id = node.id ? `#${node.id}` : '';
+    const m = node.metrics;
+    const s = node.shape || {};
+    const shapeStr = s.role ? `[${s.role} h:${s.heightStrategy} w:${s.widthStrategy}]` : '';
+    const flag = [];
+    if (node.flags?.overflowsParent)
+        flag.push('⚠parent-overflow');
+    if (node.flags?.overflowsViewport)
+        flag.push('⚠viewport-overflow');
+    if (m?.clientHeight === 0 && m?.offsetHeight === 0)
+        flag.push('⚠collapsed');
+    lines.push(`${'  '.repeat(indent)}<${node.tag}${id}${cls}> ${shapeStr} [${node.props?.position},${node.props?.display}] rect(${m?.rect?.width}×${m?.rect?.height})${flag.length ? ' ' + flag.join(' ') : ''}`);
+    for (const child of node.children || [])
+        renderNode(child, lines, indent + 1);
+}
+async function socketExists(socketPath) {
+    try {
+        const stat = await fs_1.default.promises.stat(socketPath);
+        return stat?.isSocket() || false;
+    }
+    catch {
+        return false;
+    }
+}
+function createSessionConfig(clientInfo, sessionName, options) {
+    return {
+        name: sessionName,
+        version: clientInfo.version,
+        timestamp: Date.now(),
+        socketPath: daemonSocketPath(clientInfo, sessionName),
+        browser: {
+            browserName: options.browser || 'chromium',
+            launchOptions: { headless: options.headed === false },
+        },
+    };
+}
+function daemonSocketPath(clientInfo, sessionName) {
+    return path_1.default.join(clientInfo.daemonProfilesDir, `${sessionName}.sock`);
+}
+async function saveSessionFile(clientInfo, sessionConfig) {
+    await fs_1.default.promises.mkdir(clientInfo.daemonProfilesDir, { recursive: true });
+    const sessionFile = path_1.default.join(clientInfo.daemonProfilesDir, `${sessionConfig.name}.session`);
+    await fs_1.default.promises.writeFile(sessionFile, JSON.stringify(sessionConfig, null, 2));
+}
+async function deleteSessionFile(sessionConfig) {
+    await fs_1.default.promises.unlink(sessionConfig.socketPath).catch(() => { });
+    const sessionFile = path_1.default.join(path_1.default.dirname(sessionConfig.socketPath), `${sessionConfig.name}.session`);
+    await fs_1.default.promises.rm(sessionFile).catch(() => { });
+}
+//# sourceMappingURL=daemon.js.map

package/dist/daemon/daemonEntry.d.ts

@@ -0,0 +1,6 @@
+#!/usr/bin/env node
+/**
+ * Daemon entry point for cssprobe-cli.
+ * This file is spawned as a child process by the session.
+ */
+export {};

package/dist/daemon/daemonEntry.js

@@ -0,0 +1,27 @@
+#!/usr/bin/env node
+"use strict";
+/**
+ * Daemon entry point for cssprobe-cli.
+ * This file is spawned as a child process by the session.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const daemon_1 = require("./daemon");
+const session_1 = require("./session");
+const args = process.argv.slice(2);
+const sessionName = args[0] || 'default';
+const options = {
+    headed: args.includes('--headed'),
+    browser: args.find(a => a.startsWith('--browser='))?.split('=')[1],
+};
+async function main() {
+    try {
+        const clientInfo = (0, session_1.createClientInfo)();
+        await (0, daemon_1.startDaemon)(sessionName, clientInfo, options);
+    }
+    catch (e) {
+        console.error('Failed to start daemon:', e.message);
+        process.exit(1);
+    }
+}
+main();
+//# sourceMappingURL=daemonEntry.js.map

package/dist/daemon/session.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Session management for cssprobe-cli.
+ * Simplified version of playwright-cli's session management.
+ * Only supports single 'default' session.
+ */
+export interface SessionConfig {
+    name: string;
+    version: string;
+    timestamp: number;
+    socketPath: string;
+    browser: {
+        browserName: string;
+        launchOptions: Record<string, any>;
+        userDataDir?: string;
+    };
+}
+export interface SessionFile {
+    file: string;
+    daemonDir: string;
+    config: SessionConfig;
+}
+export declare class Session {
+    readonly name: string;
+    readonly config: SessionConfig;
+    private _sessionFile;
+    constructor(sessionFile: SessionFile);
+    run(args: Record<string, any> & {
+        _: string[];
+    }): Promise<{
+        text: string;
+    }>;
+    stop(): Promise<{
+        wasOpen: boolean;
+    }>;
+    canConnect(): Promise<boolean>;
+    private _connect;
+    private _stopDaemon;
+    static startDaemon(args: Record<string, any>, mode: 'open' | 'attach'): Promise<{
+        pid: number | undefined;
+    }>;
+}
+export interface ClientInfo {
+    version: string;
+    workspaceDirHash: string;
+    daemonProfilesDir: string;
+    workspaceDir: string | undefined;
+    homeDir: string;
+}
+export declare function createClientInfo(): ClientInfo;
+export declare function loadSession(): Promise<Session | undefined>;
+export declare function saveSession(config: SessionConfig): Promise<void>;
+export declare function deleteSession(): Promise<void>;

package/dist/daemon/session.js

@@ -0,0 +1,220 @@
+"use strict";
+/**
+ * Session management for cssprobe-cli.
+ * Simplified version of playwright-cli's session management.
+ * Only supports single 'default' session.
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Session = void 0;
+exports.createClientInfo = createClientInfo;
+exports.loadSession = loadSession;
+exports.saveSession = saveSession;
+exports.deleteSession = deleteSession;
+const crypto_1 = __importDefault(require("crypto"));
+const fs_1 = __importDefault(require("fs"));
+const net_1 = __importDefault(require("net"));
+const os_1 = __importDefault(require("os"));
+const path_1 = __importDefault(require("path"));
+const socketConnection_1 = require("../utils/socketConnection");
+class Session {
+    name;
+    config;
+    _sessionFile;
+    constructor(sessionFile) {
+        this.config = sessionFile.config;
+        this.name = this.config.name;
+        this._sessionFile = sessionFile;
+    }
+    async run(args) {
+        const { socket } = await this._connect();
+        if (!socket)
+            throw new Error('Browser is not open. Run:\n\n  cssprobe-cli open <url>\n\nto start the browser session.');
+        return await SocketConnectionClient.sendAndClose(socket, 'run', { args, cwd: process.cwd() });
+    }
+    async stop() {
+        if (!await this.canConnect())
+            return { wasOpen: false };
+        await this._stopDaemon();
+        return { wasOpen: true };
+    }
+    async canConnect() {
+        const { socket } = await this._connect();
+        if (socket) {
+            socket.destroy();
+            return true;
+        }
+        return false;
+    }
+    async _connect() {
+        return await new Promise(resolve => {
+            const socket = net_1.default.createConnection(this.config.socketPath, () => {
+                resolve({ socket });
+            });
+            socket.on('error', error => {
+                if (os_1.default.platform() !== 'win32')
+                    void fs_1.default.promises.unlink(this.config.socketPath).catch(() => { }).then(() => resolve({ error }));
+                else
+                    resolve({ error });
+            });
+        });
+    }
+    async _stopDaemon() {
+        const { socket } = await this._connect();
+        if (!socket)
+            return;
+        let error;
+        await SocketConnectionClient.sendAndClose(socket, 'stop', {}).catch(e => error = e);
+        if (error && !error?.message?.includes('Session closed'))
+            throw error;
+    }
+    static async startDaemon(args, mode) {
+        const clientInfo = createClientInfo();
+        await fs_1.default.promises.mkdir(clientInfo.daemonProfilesDir, { recursive: true });
+        const sessionName = 'default';
+        const errLog = path_1.default.join(clientInfo.daemonProfilesDir, sessionName + '.err');
+        const err = fs_1.default.openSync(errLog, 'w');
+        const daemonArgs = [
+            path_1.default.join(__dirname, 'daemonEntry.js'),
+            sessionName,
+        ];
+        if (args.headed)
+            daemonArgs.push('--headed');
+        if (args.browser)
+            daemonArgs.push(`--browser=${args.browser}`);
+        const child = require('child_process').spawn(process.execPath, daemonArgs, {
+            detached: true,
+            stdio: ['ignore', 'pipe', err],
+            cwd: process.cwd(),
+        });
+        let outLog = '';
+        await new Promise((resolve, reject) => {
+            child.stdout.on('data', (data) => {
+                outLog += data.toString();
+                if (outLog.includes('Daemon listening on'))
+                    resolve();
+            });
+            child.on('close', (code) => {
+                const errLogContent = fs_1.default.readFileSync(errLog, 'utf-8');
+                reject(new Error(`Daemon process exited with code ${code}` + (outLog ? '\n' + outLog : '') + (errLogContent ? '\n' + errLogContent : '')));
+            });
+        });
+        child.stdout.destroy();
+        child.unref();
+        return { pid: child.pid };
+    }
+}
+exports.Session = Session;
+class SocketConnectionClient {
+    _connection;
+    _nextMessageId = 1;
+    _callbacks = new Map();
+    constructor(socket) {
+        this._connection = new socketConnection_1.SocketConnection(socket);
+        this._connection.onmessage = message => this._onMessage(message);
+        this._connection.onclose = () => this._rejectCallbacks();
+    }
+    async send(method, params = {}) {
+        const messageId = this._nextMessageId++;
+        const message = { id: messageId, method, params };
+        const responsePromise = new Promise((resolve, reject) => {
+            this._callbacks.set(messageId, { resolve, reject });
+        });
+        const [result] = await Promise.all([responsePromise, this._connection.send(message)]);
+        return result;
+    }
+    static async sendAndClose(socket, method, params = {}) {
+        const connection = new SocketConnectionClient(socket);
+        try {
+            return await connection.send(method, params);
+        }
+        finally {
+            connection.close();
+        }
+    }
+    close() {
+        this._connection.close();
+    }
+    _onMessage(object) {
+        if (object.id && this._callbacks.has(object.id)) {
+            const callback = this._callbacks.get(object.id);
+            this._callbacks.delete(object.id);
+            if (object.error)
+                callback.reject(new Error(object.error));
+            else
+                callback.resolve(object.result);
+        }
+    }
+    _rejectCallbacks() {
+        for (const callback of this._callbacks.values())
+            callback.reject(new Error('Session closed'));
+        this._callbacks.clear();
+    }
+}
+function createClientInfo() {
+    const workspaceDir = findWorkspaceDir(process.cwd());
+    const version = require('../../package.json').version;
+    const hash = crypto_1.default.createHash('sha1');
+    hash.update(workspaceDir || __dirname);
+    const workspaceDirHash = hash.digest('hex').substring(0, 16);
+    return {
+        version,
+        workspaceDir,
+        workspaceDirHash,
+        daemonProfilesDir: daemonProfilesDir(workspaceDirHash),
+        homeDir: os_1.default.homedir(),
+    };
+}
+function findWorkspaceDir(startDir) {
+    let dir = startDir;
+    for (let i = 0; i < 10; i++) {
+        if (fs_1.default.existsSync(path_1.default.join(dir, '.cssprobe-cli')))
+            return dir;
+        const parentDir = path_1.default.dirname(dir);
+        if (parentDir === dir)
+            break;
+        dir = parentDir;
+    }
+    return undefined;
+}
+const baseDaemonDir = (() => {
+    let localCacheDir;
+    if (process.platform === 'linux')
+        localCacheDir = process.env.XDG_CACHE_HOME || path_1.default.join(os_1.default.homedir(), '.cache');
+    if (process.platform === 'darwin')
+        localCacheDir = path_1.default.join(os_1.default.homedir(), 'Library', 'Caches');
+    if (process.platform === 'win32')
+        localCacheDir = process.env.LOCALAPPDATA || path_1.default.join(os_1.default.homedir(), 'AppData', 'Local');
+    if (!localCacheDir)
+        throw new Error('Unsupported platform: ' + process.platform);
+    return path_1.default.join(localCacheDir, 'cssprobe-cli', 'daemon');
+})();
+const daemonProfilesDir = (workspaceDirHash) => {
+    return path_1.default.join(baseDaemonDir, workspaceDirHash);
+};
+async function loadSession() {
+    const clientInfo = createClientInfo();
+    const sessionFile = path_1.default.join(clientInfo.daemonProfilesDir, 'default.session');
+    try {
+        const data = await fs_1.default.promises.readFile(sessionFile, 'utf-8');
+        const config = JSON.parse(data);
+        return new Session({ file: sessionFile, config, daemonDir: clientInfo.daemonProfilesDir });
+    }
+    catch {
+        return undefined;
+    }
+}
+async function saveSession(config) {
+    const clientInfo = createClientInfo();
+    await fs_1.default.promises.mkdir(clientInfo.daemonProfilesDir, { recursive: true });
+    const sessionFile = path_1.default.join(clientInfo.daemonProfilesDir, 'default.session');
+    await fs_1.default.promises.writeFile(sessionFile, JSON.stringify(config, null, 2));
+}
+async function deleteSession() {
+    const clientInfo = createClientInfo();
+    const sessionFile = path_1.default.join(clientInfo.daemonProfilesDir, 'default.session');
+    await fs_1.default.promises.unlink(sessionFile).catch(() => { });
+}
+//# sourceMappingURL=session.js.map