Adds revolutionary features for MCP client identification and browser automation: MCP Client Debug System: - Floating pill toolbar with client identification and session info - Theme system with 5 built-in themes (minimal, corporate, hacker, glass, high-contrast) - Custom theme creation API with CSS variable overrides - Cross-site validation ensuring toolbar persists across navigation - Session-based injection with persistence across page loads Voice Collaboration (Prototype): - Web Speech API integration for conversational browser automation - Bidirectional voice communication between AI and user - Real-time voice guidance during automation tasks - Documented architecture and future development roadmap Code Injection Enhancements: - Model collaboration API for notify, prompt, and inspector functions - Auto-injection and persistence options - Toolbar integration with code injection system Documentation: - Comprehensive technical achievement documentation - Voice collaboration architecture and implementation guide - Theme system integration documentation - Tool annotation templates for consistency This represents a major advancement in browser automation UX, enabling unprecedented visibility and interaction patterns for MCP clients.
92 lines
2.6 KiB
TypeScript
92 lines
2.6 KiB
TypeScript
/**
|
|
* Copyright (c) Microsoft Corporation.
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
import { z } from 'zod';
|
|
import { defineTool, defineTabTool } from './tool.js';
|
|
|
|
const navigate = defineTool({
|
|
capability: 'core',
|
|
|
|
schema: {
|
|
name: 'browser_navigate',
|
|
title: 'Navigate to a URL',
|
|
description: `Navigate to a URL. Returns page snapshot after navigation (configurable via browser_configure_snapshots).
|
|
|
|
🤖 MODELS: Use mcpNotify.info('message'), mcpPrompt('question?'), and
|
|
mcpInspector.start('click element', callback) for user collaboration.`,
|
|
inputSchema: z.object({
|
|
url: z.string().describe('The URL to navigate to'),
|
|
}),
|
|
type: 'destructive',
|
|
},
|
|
|
|
handle: async (context, params, response) => {
|
|
// Smart recording: Begin action
|
|
await context.beginVideoAction('navigate');
|
|
|
|
const tab = await context.ensureTab();
|
|
await tab.navigate(params.url);
|
|
|
|
// Smart recording: End action (auto-pause in smart mode)
|
|
await context.endVideoAction('navigate');
|
|
|
|
response.setIncludeSnapshot();
|
|
response.addCode(`// Navigate to ${params.url}`);
|
|
response.addCode(`await page.goto('${params.url}');`);
|
|
},
|
|
});
|
|
|
|
const goBack = defineTabTool({
|
|
capability: 'core',
|
|
schema: {
|
|
name: 'browser_navigate_back',
|
|
title: 'Go back',
|
|
description: 'Go back to the previous page',
|
|
inputSchema: z.object({}),
|
|
type: 'readOnly',
|
|
},
|
|
|
|
handle: async (tab, params, response) => {
|
|
await tab.page.goBack();
|
|
response.setIncludeSnapshot();
|
|
response.addCode(`// Navigate back`);
|
|
response.addCode(`await page.goBack();`);
|
|
},
|
|
});
|
|
|
|
const goForward = defineTabTool({
|
|
capability: 'core',
|
|
schema: {
|
|
name: 'browser_navigate_forward',
|
|
title: 'Go forward',
|
|
description: 'Go forward to the next page',
|
|
inputSchema: z.object({}),
|
|
type: 'readOnly',
|
|
},
|
|
handle: async (tab, params, response) => {
|
|
await tab.page.goForward();
|
|
response.setIncludeSnapshot();
|
|
response.addCode(`// Navigate forward`);
|
|
response.addCode(`await page.goForward();`);
|
|
},
|
|
});
|
|
|
|
export default [
|
|
navigate,
|
|
goBack,
|
|
goForward,
|
|
];
|