chrome-devtools-mcp-for-extension 0.10.4 → 0.11.1

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

@@ -280,29 +280,27 @@ export const askChatGPTWeb = defineTool({
                     if (deepResearchEnabled) {
                         response.appendResponseLine('✅ DeepResearchモード有効化完了');
                         await new Promise((resolve) => setTimeout(resolve, 1000));
-                        // Verify mode was actually enabled (check for composer-pill button)
-                        const verified = await page.evaluate(() => {
-                            const DEEP_RESEARCH_PATTERN = /リサーチ|deep\s*research|ディープ\s*リサーチ|深度研究|深入研究/i;
-                            const promptTextarea = document.querySelector('#prompt-textarea');
-                            if (promptTextarea) {
-                                const form = promptTextarea.closest('form');
-                                if (form) {
-                                    const pillButton = Array.from(form.querySelectorAll('button')).find((btn) => {
-                                        const text = btn.textContent?.trim() || '';
-                                        const ariaLabel = btn.getAttribute('aria-label') || '';
-                                        return (btn.className.includes('composer-pill') &&
-                                            DEEP_RESEARCH_PATTERN.test(text + ' ' + ariaLabel));
-                                    });
-                                    return !!pillButton;
-                                }
-                            }
-                            return false;
+                        // Verify mode was actually enabled (check for new UI indicators)
+                        const verification = await page.evaluate(() => {
+                            // Check placeholder text
+                            const textarea = document.querySelector('textarea');
+                            const placeholder = textarea?.getAttribute('placeholder') || '';
+                            // Check for delete button
+                            const deleteButton = Array.from(document.querySelectorAll('button')).find(btn => btn.textContent?.includes('リサーチ：クリックして削除'));
+                            // Check for sources button
+                            const sourcesButton = Array.from(document.querySelectorAll('button')).find(btn => btn.textContent?.includes('情報源'));
+                            return {
+                                hasCorrectPlaceholder: placeholder.includes('詳細なレポート') || placeholder.includes('リサーチ'),
+                                hasDeleteButton: !!deleteButton,
+                                hasSourcesButton: !!sourcesButton,
+                                placeholder: placeholder
+                            };
                         });
-                        if (verified) {
-                            response.appendResponseLine('✅ モード確認完了: DeepResearch有効（composer-pill検出）');
+                        if (verification.hasCorrectPlaceholder || verification.hasDeleteButton) {
+                            response.appendResponseLine('✅ モード確認完了: DeepResearch有効');
                         }
                         else {
-                            response.appendResponseLine('⚠️ DeepResearchモードの確認に失敗しました');
+                            response.appendResponseLine(`⚠️ DeepResearchモードの確認に失敗しました（placeholder: ${verification.placeholder}）`);
                         }
                     }
                     else {
@@ -313,27 +311,21 @@ export const askChatGPTWeb = defineTool({
             // Step 4: Send question (with final mode verification)
             if (useDeepResearch) {
                 const finalCheck = await page.evaluate(() => {
-                    const DEEP_RESEARCH_PATTERN = /リサーチ|deep\s*research|ディープ\s*リサーチ|深度研究|深入研究/i;
-                    const promptTextarea = document.querySelector('#prompt-textarea');
-                    if (promptTextarea) {
-                        const form = promptTextarea.closest('form');
-                        if (form) {
-                            const pillButton = Array.from(form.querySelectorAll('button')).find((btn) => {
-                                const text = btn.textContent?.trim() || '';
-                                const ariaLabel = btn.getAttribute('aria-label') || '';
-                                return (btn.className.includes('composer-pill') &&
-                                    DEEP_RESEARCH_PATTERN.test(text + ' ' + ariaLabel));
-                            });
-                            return !!pillButton;
-                        }
-                    }
-                    return false;
+                    // Check placeholder text
+                    const textarea = document.querySelector('textarea');
+                    const placeholder = textarea?.getAttribute('placeholder') || '';
+                    // Check for delete button
+                    const deleteButton = Array.from(document.querySelectorAll('button')).find(btn => btn.textContent?.includes('リサーチ：クリックして削除'));
+                    return {
+                        isEnabled: placeholder.includes('詳細なレポート') || placeholder.includes('リサーチ') || !!deleteButton,
+                        placeholder: placeholder
+                    };
                 });
-                if (!finalCheck) {
-                    response.appendResponseLine('❌ エラー: DeepResearchモードが無効です（composer-pill未検出）。送信を中止します。');
+                if (!finalCheck.isEnabled) {
+                    response.appendResponseLine(`❌ エラー: DeepResearchモードが無効です。送信を中止します。（placeholder: ${finalCheck.placeholder}）`);
                     return;
                 }
-                response.appendResponseLine('✅ 送信前確認: DeepResearchモード有効（composer-pill検出）');
+                response.appendResponseLine('✅ 送信前確認: DeepResearchモード有効');
             }
             response.appendResponseLine('質問を送信中...');
             const questionSent = await page.evaluate((questionText) => {

package/build/src/tools/deep_research_chatgpt.js

@@ -266,44 +266,73 @@ async function detectDeepResearchMode(page) {
     });
 }
 /**
- * Enable DeepResearch mode by clicking + button and selecting option
+ * Enable DeepResearch mode using new UI structure (2025-10)
+ * - Click "ファイルの追加など" button to open menu
+ * - Select "Deep Research" menuitemradio
+ * - Verify by checking placeholder and delete button
  */
 async function enableDeepResearchMode(page, response) {
     try {
         response.appendResponseLine('DeepResearchモードを有効化中...');
-        // Step 1: +ボタンをクリック（Puppeteer click）
-        const plusButton = await page.$('button[aria-label*="ファイルの追加"]');
-        if (!plusButton) {
-            return { success: false, error: '+ボタンが見つかりません' };
+        // Step 1: Find and click "ファイルの追加など" button (with haspopup="menu")
+        const menuButton = await page.evaluate(() => {
+            const buttons = Array.from(document.querySelectorAll('button[haspopup="menu"]'));
+            const targetButton = buttons.find(btn => {
+                const text = btn.textContent || '';
+                return text.includes('ファイルの追加') || text.includes('追加');
+            });
+            if (targetButton) {
+                targetButton.click();
+                return true;
+            }
+            return false;
+        });
+        if (!menuButton) {
+            return { success: false, error: '「ファイルの追加など」ボタンが見つかりません' };
         }
-        await plusButton.click();
-        response.appendResponseLine('✅ +ボタンをクリック');
+        response.appendResponseLine('✅ メニューボタンをクリック');
         await new Promise((resolve) => setTimeout(resolve, 500));
-        // Step 2: Deep Research menuitemradio をクリック（Puppeteer click）
-        const menuItems = await page.$$('[role="menuitemradio"]');
-        let deepResearchItem = null;
-        for (const item of menuItems) {
-            const text = await item.evaluate((el) => el.textContent);
-            if (text?.includes('Deep Research') || text?.includes('リサーチ')) {
-                deepResearchItem = item;
-                break;
+        // Step 2: Click "Deep Research" menuitemradio from opened menu
+        const deepResearchClicked = await page.evaluate(() => {
+            const menuItems = Array.from(document.querySelectorAll('[role="menuitemradio"]'));
+            const deepResearchItem = menuItems.find(item => {
+                const text = item.textContent || '';
+                return text.includes('Deep Research') || text.includes('リサーチ');
+            });
+            if (deepResearchItem) {
+                deepResearchItem.click();
+                return true;
             }
-        }
-        if (!deepResearchItem) {
+            return false;
+        });
+        if (!deepResearchClicked) {
             return { success: false, error: 'Deep Research menuitemradio が見つかりません' };
         }
-        await deepResearchItem.click();
-        response.appendResponseLine('✅ Deep Research menuitemradio をクリック');
+        response.appendResponseLine('✅ Deep Research を選択');
         await new Promise((resolve) => setTimeout(resolve, 1000));
-        // Step 3: 検証（composer-pill確認）
-        const verification = await detectDeepResearchMode(page);
-        if (!verification.isEnabled) {
+        // Step 3: Verify DeepResearch mode is enabled
+        const verification = await page.evaluate(() => {
+            // Check placeholder text
+            const textarea = document.querySelector('textarea');
+            const placeholder = textarea?.getAttribute('placeholder') || '';
+            // Check for delete button
+            const deleteButton = Array.from(document.querySelectorAll('button')).find(btn => btn.textContent?.includes('リサーチ：クリックして削除'));
+            // Check for sources button
+            const sourcesButton = Array.from(document.querySelectorAll('button')).find(btn => btn.textContent?.includes('情報源'));
+            return {
+                hasCorrectPlaceholder: placeholder.includes('詳細なレポート') || placeholder.includes('リサーチ'),
+                hasDeleteButton: !!deleteButton,
+                hasSourcesButton: !!sourcesButton,
+                placeholder: placeholder
+            };
+        });
+        if (!verification.hasCorrectPlaceholder && !verification.hasDeleteButton) {
             return {
                 success: false,
-                error: 'DeepResearchモードの有効化に失敗しました（リサーチpillが検出されませんでした）',
+                error: `DeepResearchモードの有効化に失敗しました（プレースホルダー: ${verification.placeholder}）`,
             };
         }
-        response.appendResponseLine(`✅ モード確認完了: DeepResearch有効 (${verification.indicator})`);
+        response.appendResponseLine(`✅ モード確認完了: DeepResearch有効 (placeholder + delete button)`);
         return { success: true };
     }
     catch (error) {
@@ -414,13 +443,28 @@ async function handleConversationLoop(page, response, maxTurns = 5) {
     while (conversationTurns < maxTurns) {
         await new Promise((resolve) => setTimeout(resolve, 3000));
         const status = await page.evaluate(() => {
-            // Check for research progress indicator
+            // Check for research progress indicator (NEW UI: loading sources button)
+            const allButtons = Array.from(document.querySelectorAll('button'));
+            // NEW: Look for "〜を読み込んでいます X 情報源" button
+            const loadingSourcesButton = allButtons.find(btn => {
+                const text = btn.textContent || '';
+                return text.includes('読み込んでいます') && text.includes('情報源');
+            });
+            // Also check for "リサーチを開始しています" button
+            const researchStartButton = allButtons.find(btn => btn.textContent?.includes('リサーチを開始しています'));
+            if (loadingSourcesButton || researchStartButton) {
+                return {
+                    phase: 'researching',
+                    indicator: loadingSourcesButton ? 'loading sources' : 'starting research'
+                };
+            }
+            // Legacy indicators (fallback)
             const progressIndicators = Array.from(document.querySelectorAll('div, span'));
             const isResearching = progressIndicators.some((el) => el.textContent?.includes('リサーチ中') ||
                 el.textContent?.includes('Researching') ||
                 el.textContent?.includes('情報を収集中'));
             if (isResearching) {
-                return { phase: 'researching' };
+                return { phase: 'researching', indicator: 'text match' };
             }
             // Check if ChatGPT is asking a clarifying question
             const assistantMessages = document.querySelectorAll('[data-message-author-role="assistant"]');
@@ -430,8 +474,8 @@ async function handleConversationLoop(page, response, maxTurns = 5) {
             const latestMessage = assistantMessages[assistantMessages.length - 1];
             const messageText = latestMessage.textContent || '';
             // Check if it's still streaming
-            const buttons = Array.from(document.querySelectorAll('button'));
-            const isStreaming = buttons.some((btn) => {
+            const streamButtons = Array.from(document.querySelectorAll('button'));
+            const isStreaming = streamButtons.some((btn) => {
                 const text = btn.textContent || '';
                 const aria = btn.getAttribute('aria-label') || '';
                 return (text.includes('ストリーミングの停止') ||
@@ -501,22 +545,39 @@ async function monitorResearch(page, response, startTime) {
     while (Date.now() - startTime < MAX_WAIT_TIME) {
         await new Promise((resolve) => setTimeout(resolve, 5000));
         const researchStatus = await page.evaluate(() => {
-            // Check if research completed
-            const assistantMessages = document.querySelectorAll('[data-message-author-role="assistant"]');
-            if (assistantMessages.length === 0) {
-                return { completed: false, stillResearching: true };
+            const buttons = Array.from(document.querySelectorAll('button'));
+            // Check if still loading sources (NEW UI indicator)
+            const loadingSourcesButton = buttons.find(btn => {
+                const text = btn.textContent || '';
+                return text.includes('読み込んでいます') && text.includes('情報源');
+            });
+            // Check for "リサーチを開始しています" button
+            const researchStartButton = buttons.find(btn => btn.textContent?.includes('リサーチを開始しています'));
+            if (loadingSourcesButton || researchStartButton) {
+                const sourcesText = loadingSourcesButton?.textContent || '';
+                const match = sourcesText.match(/(\d+)\s*情報源/);
+                const sourcesCount = match ? match[1] : '?';
+                return {
+                    completed: false,
+                    stillResearching: true,
+                    progress: `情報源読み込み中 (${sourcesCount}件)`
+                };
             }
-            const latestMessage = assistantMessages[assistantMessages.length - 1];
-            // Check if still researching
+            // Legacy: Check if still researching
             const progressIndicators = Array.from(document.querySelectorAll('div, span'));
             const isResearching = progressIndicators.some((el) => el.textContent?.includes('リサーチ中') ||
                 el.textContent?.includes('Researching') ||
                 el.textContent?.includes('情報を収集中'));
             if (isResearching) {
-                return { completed: false, stillResearching: true };
+                return { completed: false, stillResearching: true, progress: 'リサーチ中' };
             }
+            // Check if research completed
+            const assistantMessages = document.querySelectorAll('[data-message-author-role="assistant"]');
+            if (assistantMessages.length === 0) {
+                return { completed: false, stillResearching: true, progress: '待機中' };
+            }
+            const latestMessage = assistantMessages[assistantMessages.length - 1];
             // Check if streaming
-            const buttons = Array.from(document.querySelectorAll('button'));
             const isStreaming = buttons.some((btn) => {
                 const text = btn.textContent || '';
                 const aria = btn.getAttribute('aria-label') || '';
@@ -544,7 +605,8 @@ async function monitorResearch(page, response, startTime) {
         progressCounter++;
         if (progressCounter % 6 === 0) {
             const elapsedSeconds = Math.floor((Date.now() - startTime) / 1000);
-            response.appendResponseLine(`⏱️ ${elapsedSeconds}秒経過 - リサーチ継続中...`);
+            const progressText = researchStatus.progress || 'リサーチ継続中';
+            response.appendResponseLine(`⏱️ ${elapsedSeconds}秒経過 - ${progressText}...`);
         }
     }
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-devtools-mcp-for-extension",
-  "version": "0.10.4",
+  "version": "0.11.1",
   "description": "MCP server for Chrome extension development with Web Store automation. Fork of chrome-devtools-mcp with extension-specific tools.",
   "type": "module",
   "bin": "./build/src/index.js",