chrome-ai-bridge 1.0.5 → 1.0.7

package/build/src/tools/chatgpt-web.js

@@ -256,7 +256,7 @@ export const askChatGPTWeb = defineTool({
                     response.appendResponseLine(`既存のプロジェクトチャットを使用: ${latestSession.url}`);
                 }
                 else {
-                    response.appendResponseLine('既存チャットが見つかりませんでした。新規作成します。');
+                    response.appendResponseLine('📝 新規チャットを作成します');
                     isNewChat = true;
                 }
             }

package/build/src/tools/gemini-image.js

@@ -0,0 +1,370 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import fs from 'node:fs';
+import path from 'node:path';
+import os from 'node:os';
+import { Jimp } from 'jimp';
+import z from 'zod';
+import { GEMINI_CONFIG } from '../config.js';
+import { getLoginStatus, waitForLoginStatus, LoginStatus, } from '../login-helper.js';
+import { ToolCategories } from './categories.js';
+import { defineTool } from './ToolDefinition.js';
+/**
+ * Default crop margin in pixels (will be adjusted based on actual watermark size)
+ */
+const DEFAULT_CROP_MARGIN = 80;
+/**
+ * Navigate with retry logic
+ */
+async function navigateWithRetry(page, url, options = { waitUntil: 'networkidle2', maxRetries: 3 }) {
+    const { waitUntil, maxRetries = 3 } = options;
+    let lastError = null;
+    for (let attempt = 1; attempt <= maxRetries; attempt++) {
+        try {
+            await page.goto(url, { waitUntil, timeout: 30000 });
+            return;
+        }
+        catch (error) {
+            lastError = error instanceof Error ? error : new Error(String(error));
+            const isRetryable = lastError.message.includes('ERR_ABORTED') ||
+                lastError.message.includes('net::ERR_');
+            if (!isRetryable || attempt === maxRetries) {
+                throw lastError;
+            }
+            await new Promise(resolve => setTimeout(resolve, 1000 * attempt));
+        }
+    }
+    throw lastError;
+}
+/**
+ * Find or create a dedicated Gemini tab
+ */
+async function getOrCreateGeminiPage(context) {
+    await context.createPagesSnapshot();
+    const pages = context.getPages();
+    for (const page of pages) {
+        const url = page.url();
+        if (url.includes('gemini.google.com')) {
+            await page.bringToFront();
+            return page;
+        }
+    }
+    const newPage = await context.newPage();
+    return newPage;
+}
+/**
+ * Enhance prompt for better watermark cropping
+ * Adds composition requirements to center the subject and use solid background
+ */
+function enhancePromptForCropping(prompt) {
+    const compositionRequirements = `
+
+Composition requirements:
+- Center the main subject with generous padding on all sides (at least 15% margin from edges)
+- Use a clean, solid background color
+- Ensure no important elements touch the image edges, especially the bottom-right corner`;
+    return prompt + compositionRequirements;
+}
+/**
+ * Crop image to remove watermark (uniform crop from all sides)
+ */
+async function cropWatermark(inputPath, outputPath, margin = DEFAULT_CROP_MARGIN) {
+    const image = await Jimp.read(inputPath);
+    const { width, height } = image;
+    // Crop from all sides
+    const newWidth = width - margin * 2;
+    const newHeight = height - margin * 2;
+    if (newWidth <= 0 || newHeight <= 0) {
+        throw new Error(`Image too small to crop: ${width}x${height} with margin ${margin}`);
+    }
+    image.crop({ x: margin, y: margin, w: newWidth, h: newHeight });
+    await image.write(outputPath);
+    return { width: newWidth, height: newHeight };
+}
+/**
+ * Wait for download to complete and return the file path
+ * Looks for new image files (png, jpg, jpeg) in the download directory
+ */
+async function waitForDownload(downloadDir, timeoutMs = 60000) {
+    const startTime = Date.now();
+    const checkInterval = 1000; // Check every second
+    // Get initial files with their mtimes
+    const initialFiles = new Map();
+    try {
+        const files = await fs.promises.readdir(downloadDir);
+        for (const f of files) {
+            if (/\.(png|jpg|jpeg)$/i.test(f)) {
+                const stat = await fs.promises.stat(path.join(downloadDir, f));
+                initialFiles.set(f, stat.mtime.getTime());
+            }
+        }
+    }
+    catch {
+        // Directory might not exist, continue
+    }
+    while (Date.now() - startTime < timeoutMs) {
+        await new Promise(resolve => setTimeout(resolve, checkInterval));
+        try {
+            const currentFiles = await fs.promises.readdir(downloadDir);
+            for (const f of currentFiles) {
+                // Only check image files
+                if (!/\.(png|jpg|jpeg)$/i.test(f))
+                    continue;
+                // Skip incomplete downloads
+                if (f.endsWith('.crdownload') || f.endsWith('.tmp'))
+                    continue;
+                const filePath = path.join(downloadDir, f);
+                const stat = await fs.promises.stat(filePath);
+                const mtime = stat.mtime.getTime();
+                // Check if this is a new file or modified after we started
+                const initialMtime = initialFiles.get(f);
+                if (!initialMtime || mtime > initialMtime) {
+                    // Verify file is complete (size > 0 and not growing)
+                    await new Promise(resolve => setTimeout(resolve, 500));
+                    const stat2 = await fs.promises.stat(filePath);
+                    if (stat2.size > 0 && stat2.size === stat.size) {
+                        return filePath;
+                    }
+                }
+            }
+        }
+        catch {
+            // Continue on error
+        }
+    }
+    throw new Error(`Download timeout after ${timeoutMs}ms`);
+}
+export const askGeminiImage = defineTool({
+    name: 'ask_gemini_image',
+    description: 'Generate image using Gemini (Nano Banana / 3 Preview) via browser. ' +
+        'Automatically crops watermark from edges. ' +
+        'Rate limit: ~2 images/day for free users.',
+    annotations: {
+        category: ToolCategories.NAVIGATION_AUTOMATION,
+        readOnlyHint: false,
+    },
+    schema: {
+        prompt: z
+            .string()
+            .describe('Image generation prompt. Use natural language descriptions. ' +
+            'Structure: [Subject + Adjectives] doing [Action] in [Location/Context]. ' +
+            '[Composition/Camera Angle]. [Lighting/Atmosphere]. [Style/Media]. ' +
+            'HEX color codes like "#9F2B68" are supported.'),
+        outputPath: z
+            .string()
+            .describe('Output file path for the generated image. ' +
+            'Will be cropped to remove watermark. Example: /tmp/generated-image.png'),
+        cropMargin: z
+            .number()
+            .optional()
+            .describe(`Pixels to crop from each edge to remove watermark. Default: ${DEFAULT_CROP_MARGIN}`),
+        skipCrop: z
+            .boolean()
+            .optional()
+            .describe('Skip watermark cropping (keep original image). Default: false'),
+    },
+    handler: async (request, response, context) => {
+        const { prompt, outputPath, cropMargin = DEFAULT_CROP_MARGIN, skipCrop = false, } = request.params;
+        const page = await getOrCreateGeminiPage(context);
+        try {
+            response.appendResponseLine('Geminiに接続中...');
+            // Navigate to Gemini
+            await navigateWithRetry(page, GEMINI_CONFIG.BASE_URL + 'app', {
+                waitUntil: 'networkidle2',
+            });
+            // Wait for UI to stabilize
+            try {
+                await Promise.race([
+                    page.waitForSelector('button[aria-label*="Account"], button[aria-label*="アカウント"]', { timeout: 10000 }),
+                    page.waitForSelector('[role="textbox"]', { timeout: 10000 }),
+                ]);
+            }
+            catch {
+                response.appendResponseLine('⚠️ UI安定化待機タイムアウト（続行）');
+            }
+            // Check login
+            const loginStatus = await getLoginStatus(page, 'gemini');
+            if (loginStatus === LoginStatus.NEEDS_LOGIN) {
+                response.appendResponseLine('\n❌ Geminiへのログインが必要です');
+                response.appendResponseLine('📱 ブラウザでGoogleアカウントにログインしてください');
+                const finalStatus = await waitForLoginStatus(page, 'gemini', 120000, msg => response.appendResponseLine(msg));
+                if (finalStatus !== LoginStatus.LOGGED_IN) {
+                    response.appendResponseLine('❌ ログインタイムアウト');
+                    return;
+                }
+            }
+            response.appendResponseLine('✅ ログイン確認完了');
+            // Enhance prompt for better cropping
+            const enhancedPrompt = enhancePromptForCropping(prompt);
+            response.appendResponseLine('プロンプトを送信中...');
+            // Input enhanced prompt
+            const questionSent = await page.evaluate(promptText => {
+                const clearElement = (el) => {
+                    while (el.firstChild) {
+                        el.removeChild(el.firstChild);
+                    }
+                };
+                const textbox = document.querySelector('[role="textbox"]');
+                if (textbox) {
+                    textbox.focus();
+                    clearElement(textbox);
+                    textbox.textContent = promptText;
+                    textbox.dispatchEvent(new Event('input', { bubbles: true }));
+                    return true;
+                }
+                return false;
+            }, enhancedPrompt);
+            if (!questionSent) {
+                response.appendResponseLine('❌ 入力欄が見つかりません');
+                return;
+            }
+            await new Promise(resolve => setTimeout(resolve, 500));
+            // Click send button
+            const sent = await page.evaluate(() => {
+                const buttons = Array.from(document.querySelectorAll('button'));
+                const sendButton = buttons.find(b => b.textContent?.includes('プロンプトを送信') ||
+                    b.textContent?.includes('送信') ||
+                    b.getAttribute('aria-label')?.includes('送信') ||
+                    b.getAttribute('aria-label')?.includes('Send'));
+                if (sendButton && !sendButton.disabled) {
+                    sendButton.click();
+                    return true;
+                }
+                return false;
+            });
+            if (!sent) {
+                await page.keyboard.press('Enter');
+                response.appendResponseLine('⚠️ 送信ボタンが見つかりません (Enterキーを試行)');
+            }
+            response.appendResponseLine('🎨 画像生成中... (1-2分かかることがあります)');
+            // Wait for image generation to complete
+            // Look for generated image or download button
+            const startTime = Date.now();
+            const maxWaitTime = 180000; // 3 minutes
+            let imageFound = false;
+            while (Date.now() - startTime < maxWaitTime) {
+                await new Promise(resolve => setTimeout(resolve, 2000));
+                const status = await page.evaluate(() => {
+                    // Check for generated image
+                    const images = document.querySelectorAll('img[src*="blob:"], img[src*="generated"]');
+                    // Check for download button or menu
+                    const downloadButtons = Array.from(document.querySelectorAll('button, [role="menuitem"]'));
+                    const hasDownload = downloadButtons.some(b => b.textContent?.includes('ダウンロード') ||
+                        b.textContent?.includes('Download') ||
+                        b.getAttribute('aria-label')?.includes('download') ||
+                        b.getAttribute('aria-label')?.includes('ダウンロード'));
+                    // Check if still generating
+                    const isGenerating = document.body.innerText.includes('生成中') ||
+                        document.body.innerText.includes('Generating') ||
+                        document.querySelector('[role="progressbar"]') !== null;
+                    return {
+                        imageCount: images.length,
+                        hasDownload,
+                        isGenerating,
+                    };
+                });
+                if (status.imageCount > 0 || status.hasDownload) {
+                    imageFound = true;
+                    response.appendResponseLine(`✅ 画像生成完了 (${Math.floor((Date.now() - startTime) / 1000)}秒)`);
+                    break;
+                }
+                if (!status.isGenerating && Date.now() - startTime > 30000) {
+                    // Not generating and no image after 30s - might have failed
+                    response.appendResponseLine('⚠️ 生成中インジケータが消えました...');
+                }
+            }
+            if (!imageFound) {
+                response.appendResponseLine('❌ 画像生成タイムアウト (3分)');
+                return;
+            }
+            // Try to download the image
+            response.appendResponseLine('📥 画像をダウンロード中...');
+            // Click download button - Gemini uses "フルサイズの画像をダウンロード" button
+            const downloadClicked = await page.evaluate(() => {
+                const buttons = Array.from(document.querySelectorAll('button'));
+                // Look for "フルサイズの画像をダウンロード" or "フルサイズでダウンロード" button
+                const downloadBtn = buttons.find(b => {
+                    const text = b.textContent || '';
+                    const ariaLabel = b.getAttribute('aria-label') || '';
+                    const description = b.getAttribute('aria-describedby')
+                        ? document.getElementById(b.getAttribute('aria-describedby'))?.textContent || ''
+                        : '';
+                    return (text.includes('フルサイズ') ||
+                        text.includes('ダウンロード') ||
+                        ariaLabel.includes('ダウンロード') ||
+                        ariaLabel.includes('download') ||
+                        description.includes('フルサイズ') ||
+                        description.includes('ダウンロード'));
+                });
+                if (downloadBtn) {
+                    downloadBtn.click();
+                    return true;
+                }
+                return false;
+            });
+            if (!downloadClicked) {
+                response.appendResponseLine('⚠️ ダウンロードボタンが見つかりません');
+                response.appendResponseLine('ヒント: ブラウザで画像を右クリックして保存してください');
+                return;
+            }
+            // Wait for download to start (Gemini shows progress bar)
+            response.appendResponseLine('⏳ ダウンロード処理を待機中...');
+            await new Promise(resolve => setTimeout(resolve, 3000));
+            // Wait for download to complete - check user's Downloads folder
+            const userDownloadsDir = path.join(os.homedir(), 'Downloads');
+            let downloadedPath;
+            try {
+                downloadedPath = await waitForDownload(userDownloadsDir, 60000); // 60 seconds
+                response.appendResponseLine(`✅ ダウンロード完了: ${path.basename(downloadedPath)}`);
+            }
+            catch (error) {
+                response.appendResponseLine('❌ ダウンロード待機タイムアウト (60秒)');
+                response.appendResponseLine('ヒント: ブラウザで画像を右クリックして「画像を保存」してください');
+                return;
+            }
+            // Ensure output directory exists
+            const outputDir = path.dirname(outputPath);
+            await fs.promises.mkdir(outputDir, { recursive: true });
+            // Crop watermark or copy directly
+            if (skipCrop) {
+                await fs.promises.copyFile(downloadedPath, outputPath);
+                response.appendResponseLine(`📄 画像保存（クロップなし）: ${outputPath}`);
+            }
+            else {
+                response.appendResponseLine(`✂️ ウォーターマークをクロップ中 (margin: ${cropMargin}px)...`);
+                try {
+                    const { width, height } = await cropWatermark(downloadedPath, outputPath, cropMargin);
+                    response.appendResponseLine(`✅ クロップ完了: ${width}x${height}px → ${outputPath}`);
+                }
+                catch (error) {
+                    const msg = error instanceof Error ? error.message : String(error);
+                    response.appendResponseLine(`⚠️ クロップ失敗: ${msg}`);
+                    response.appendResponseLine('元の画像をそのまま保存します...');
+                    await fs.promises.copyFile(downloadedPath, outputPath);
+                }
+            }
+            // Cleanup temp file
+            try {
+                await fs.promises.unlink(downloadedPath);
+            }
+            catch {
+                // Ignore cleanup errors
+            }
+            response.appendResponseLine('\n🎉 画像生成完了!');
+            response.appendResponseLine(`📁 出力: ${outputPath}`);
+        }
+        catch (error) {
+            const msg = error instanceof Error ? error.message : String(error);
+            if (msg.includes('Target closed') || msg.includes('Session closed')) {
+                response.appendResponseLine('❌ ブラウザ接続が切れました');
+                response.appendResponseLine('→ MCPサーバーを再起動してください');
+            }
+            else {
+                response.appendResponseLine(`❌ エラー: ${msg}`);
+            }
+        }
+    },
+});

package/build/src/tools/optional-tools.js

@@ -4,12 +4,14 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import * as chatgptWebTools from './chatgpt-web.js';
+import * as geminiImageTools from './gemini-image.js';
 import * as geminiWebTools from './gemini-web.js';
 /**
  * All optional (web-llm) tools as an array.
  */
 export const optionalTools = [
     ...Object.values(chatgptWebTools),
+    ...Object.values(geminiImageTools),
     ...Object.values(geminiWebTools),
 ];
 /**
@@ -61,9 +63,9 @@ export function getOptionalToolCount() {
  * Metadata about optional tools for documentation.
  */
 export const WEB_LLM_TOOLS_INFO = {
-    disclaimer: 'Web-LLM tools (ask_chatgpt_web, ask_gemini_web) are experimental and best-effort. ' +
+    disclaimer: 'Web-LLM tools (ask_chatgpt_web, ask_gemini_web, ask_gemini_image) are experimental and best-effort. ' +
         'They depend on specific website UIs and may break when those UIs change. ' +
         'For production use, consider using official APIs instead.',
     disableEnvVar: 'MCP_DISABLE_WEB_LLM',
-    tools: ['ask_chatgpt_web', 'ask_gemini_web'],
+    tools: ['ask_chatgpt_web', 'ask_gemini_image', 'ask_gemini_web'],
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-ai-bridge",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "MCP server bridging Chrome browser and AI assistants (ChatGPT, Gemini). Browser automation + AI consultation.",
   "type": "module",
   "bin": "./scripts/cli.mjs",
@@ -59,6 +59,7 @@
     "@modelcontextprotocol/sdk": "1.18.1",
     "archiver": "^7.0.1",
     "debug": "4.4.3",
+    "jimp": "^1.6.0",
     "puppeteer": "^24.31.0",
     "yargs": "18.0.0"
   },