@wordbricks/playwright-mcp 0.1.20 → 0.1.23

package/lib/extension/extensionContextFactory.js

@@ -1,56 +0,0 @@
-/**
- * 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 debug from 'debug';
-import * as playwright from 'playwright-core';
-import { startHttpServer } from '../utils/httpServer.js';
-import { CDPRelayServer } from './cdpRelay.js';
-const debugLogger = debug('pw:mcp:relay');
-export class ExtensionContextFactory {
-    name = 'extension';
-    description = 'Connect to a browser using the Playwright MCP extension';
-    _browserChannel;
-    _userDataDir;
-    constructor(browserChannel, userDataDir) {
-        this._browserChannel = browserChannel;
-        this._userDataDir = userDataDir;
-    }
-    async createContext(clientInfo, abortSignal) {
-        const browser = await this._obtainBrowser(clientInfo, abortSignal);
-        return {
-            browserContext: browser.contexts()[0],
-            close: async () => {
-                debugLogger('close() called for browser context');
-                await browser.close();
-            }
-        };
-    }
-    async _obtainBrowser(clientInfo, abortSignal) {
-        const relay = await this._startRelay(abortSignal);
-        await relay.ensureExtensionConnectionForMCPContext(clientInfo, abortSignal);
-        return await playwright.chromium.connectOverCDP(relay.cdpEndpoint());
-    }
-    async _startRelay(abortSignal) {
-        const httpServer = await startHttpServer({});
-        if (abortSignal.aborted) {
-            httpServer.close();
-            throw new Error(abortSignal.reason);
-        }
-        const cdpRelayServer = new CDPRelayServer(httpServer, this._browserChannel, this._userDataDir);
-        abortSignal.addEventListener('abort', () => cdpRelayServer.stop());
-        debugLogger(`CDP relay server started, extension endpoint: ${cdpRelayServer.extensionEndpoint()}.`);
-        return cdpRelayServer;
-    }
-}

package/lib/frameworkPatterns.js

@@ -1,35 +0,0 @@
-/**
- * Shared framework state patterns used by framework state detection hook
- */
-export const FRAMEWORK_STATE_PATTERNS = [
-    // React/Next.js
-    '__NEXT_DATA__',
-    '__reactServerState',
-    // Remix
-    '__remixContext',
-    '__remixManifest',
-    '__remixRouteModules',
-    // Apollo GraphQL
-    '__APOLLO_STATE__',
-    '__APOLLO_CLIENT__',
-    // Redux/State Management
-    '__PRELOADED_STATE__',
-    '__INITIAL_STATE__',
-    '__REDUX_STATE__',
-    // Vue/Nuxt
-    '__NUXT__',
-    // Gatsby
-    '___gatsby',
-    '___loader',
-    // Generic SSR
-    '__SSR_DATA__',
-    '__APP_STATE__',
-    '__SERVER_STATE__',
-    // Others
-    '__QWIK_STATE__',
-    '__SVELTE__',
-    '__ANGULAR__',
-    '__SOLID__',
-    '__ASTRO_DATA__',
-];
-export const MAX_DISPLAY_ITEMS = 5;

package/lib/hooks/antiBotDetectionHook.js

@@ -1,171 +0,0 @@
-import ms from 'ms';
-import { Ok } from '../utils/result.js';
-import { hookNameSchema } from './schema.js';
-import { getEventsAfter, isEventType, trackEvent } from './events.js';
-const RESOLUTION_WAIT_MS = ms('10s');
-const lastProcessedEventIdByContext = new WeakMap();
-const detectedProvidersByContext = new WeakMap();
-const isLikelyResolved = async (ctx) => {
-    if (!ctx.tab?.page)
-        return false;
-    const host = ctx.tab.page.url();
-    if (host.includes('challenges.cloudflare.com'))
-        return false;
-    return ctx.tab.page.evaluate(() => {
-        const challengeSelectors = [
-            '#challenge-stage',
-            '#cf-challenge-running',
-            'iframe[src*="turnstile"]',
-            'form[action*="/cdn-cgi/challenge-platform"]',
-            '[data-cf-challenge]'
-        ];
-        const hasChallengeDom = challengeSelectors.some(selector => document.querySelector(selector));
-        if (hasChallengeDom)
-            return false;
-        const title = document.title.toLowerCase();
-        const bodyText = (document.body?.innerText || '').slice(0, 2000).toLowerCase();
-        if (title.includes('just a moment') || bodyText.includes('just a moment'))
-            return false;
-        if (title.includes('checking your browser') || bodyText.includes('checking your browser'))
-            return false;
-        return true;
-    });
-};
-const getDetectedProviders = (context) => {
-    const detectedProviders = detectedProvidersByContext.get(context);
-    if (detectedProviders)
-        return detectedProviders;
-    const newSet = new Set();
-    detectedProvidersByContext.set(context, newSet);
-    return newSet;
-};
-const updateLastProcessedEventId = (context, events) => {
-    const lastEvent = events[events.length - 1];
-    if (!lastEvent)
-        return;
-    lastProcessedEventIdByContext.set(context, lastEvent.id);
-};
-const isStatusOk = (status) => status >= 200 && status < 400;
-const providerConfigs = [
-    {
-        provider: 'cloudflare-turnstile',
-        match: event => isStatusOk(event.data.status) &&
-            event.data.url.includes('challenges.cloudflare.com') &&
-            event.data.url.includes('/turnstile/'),
-    },
-    {
-        provider: 'aws-waf',
-        match: event => isStatusOk(event.data.status) &&
-            event.data.method.toUpperCase() === 'POST' &&
-            event.data.url.includes('.awswaf.com') &&
-            event.data.url.includes('/telemetry'),
-    },
-];
-export const getAntiBotProviderConfigs = () => providerConfigs;
-const waitForResolution = async (ctx) => {
-    const start = Date.now();
-    if (!ctx.tab?.page)
-        return { resolved: false, waitedMs: 0 };
-    await ctx.tab.page.waitForTimeout(RESOLUTION_WAIT_MS);
-    const resolved = await isLikelyResolved(ctx);
-    return { resolved, waitedMs: Date.now() - start };
-};
-const detectAntiBot = (ctx, events) => {
-    const detectedProviders = getDetectedProviders(ctx.context);
-    const networkEvents = events.filter(isEventType('network-request'));
-    return providerConfigs.reduce((acc, config) => {
-        if (detectedProviders.has(config.provider))
-            return acc;
-        const match = networkEvents.find(config.match);
-        if (!match)
-            return acc;
-        detectedProviders.add(config.provider);
-        return {
-            hits: [
-                ...acc.hits,
-                {
-                    provider: config.provider,
-                    url: match.data.url,
-                    status: match.data.status,
-                }
-            ],
-        };
-    }, { hits: [] });
-};
-export const antiBotDetectionPreHook = {
-    name: hookNameSchema.enum['anti-bot-detection-pre'],
-    handler: async (ctx) => {
-        if (lastProcessedEventIdByContext.has(ctx.context))
-            return Ok(undefined);
-        if (typeof ctx.eventStore.lastSeenEventId === 'number')
-            lastProcessedEventIdByContext.set(ctx.context, ctx.eventStore.lastSeenEventId);
-        return Ok(undefined);
-    },
-};
-export const antiBotDetectionPostHook = {
-    name: hookNameSchema.enum['anti-bot-detection-post'],
-    handler: async (ctx) => {
-        const newEvents = getEventsAfter(ctx.eventStore, lastProcessedEventIdByContext.get(ctx.context));
-        if (newEvents.length === 0)
-            return Ok(undefined);
-        const detection = detectAntiBot(ctx, newEvents);
-        if (detection.hits.length > 0) {
-            detection.hits.forEach(hit => {
-                trackEvent(ctx.context, {
-                    type: 'anti-bot',
-                    data: {
-                        provider: hit.provider,
-                        detectionMethod: 'network-request',
-                        url: hit.url,
-                        status: hit.status,
-                        action: 'detected',
-                        waitMs: RESOLUTION_WAIT_MS,
-                    },
-                });
-            });
-            const waitResult = await waitForResolution(ctx);
-            detection.hits.forEach(hit => {
-                trackEvent(ctx.context, {
-                    type: 'anti-bot',
-                    data: {
-                        provider: hit.provider,
-                        detectionMethod: 'network-request',
-                        url: hit.url,
-                        status: hit.status,
-                        action: waitResult.resolved ? 'resolved' : 'still-blocked',
-                        waitMs: waitResult.waitedMs,
-                    },
-                });
-            });
-        }
-        updateLastProcessedEventId(ctx.context, newEvents);
-        return Ok(undefined);
-    },
-};
-export const antiBotDetectionHooks = {
-    pre: antiBotDetectionPreHook,
-    post: antiBotDetectionPostHook,
-};
-export const formatAntiBotEvent = (event) => {
-    if (event.data.action === 'still-blocked') {
-        const waitSeconds = event.data.waitMs ? Math.round(event.data.waitMs / 1000) : 0;
-        if (event.data.provider === 'cloudflare-turnstile')
-            return `Anti-bot still active: Cloudflare Turnstile after ${waitSeconds || '<1'}s wait`;
-        if (event.data.provider === 'aws-waf')
-            return `Anti-bot still active: AWS WAF after ${waitSeconds || '<1'}s wait`;
-        return 'Anti-bot mechanism still active';
-    }
-    if (event.data.action === 'resolved') {
-        const waitSeconds = event.data.waitMs ? Math.round(event.data.waitMs / 1000) : 0;
-        if (event.data.provider === 'cloudflare-turnstile')
-            return `Anti-bot resolved: Cloudflare Turnstile after ${waitSeconds || '<1'}s wait`;
-        if (event.data.provider === 'aws-waf')
-            return `Anti-bot resolved: AWS WAF after ${waitSeconds || '<1'}s wait`;
-        return 'Anti-bot mechanism resolved';
-    }
-    if (event.data.provider === 'cloudflare-turnstile')
-        return `Anti-bot detected: Cloudflare Turnstile (${event.data.status})`;
-    if (event.data.provider === 'aws-waf')
-        return `Anti-bot detected: AWS WAF telemetry request (${event.data.status})`;
-    return 'Anti-bot mechanism detected';
-};

package/lib/hooks/core.js

@@ -1,144 +0,0 @@
-import { reduce } from '@fxts/core';
-import { getEventStore, trackEvent } from './events.js';
-import { consumeEvents } from './eventConsumer.js';
-import { toolNameSchema } from './schema.js';
-export { Ok, Err } from '../utils/result.js';
-export const runHook = async (hook, ctx) => {
-    const result = await hook.handler(ctx);
-    if (!result.ok)
-        throw result.error;
-    return ctx;
-};
-export const hookRegistryMap = new WeakMap();
-export const createHookRegistry = () => ({
-    tools: new Map(),
-});
-export const setToolHooks = (registry, toolHooks) => ({
-    tools: new Map([...registry.tools, [toolHooks.toolName, toolHooks]]),
-});
-export const getToolHooks = (registry, toolName) => {
-    return registry.tools.get(toolName);
-};
-export const wrapToolWithHooks = (tool, registry) => {
-    const parsedName = toolNameSchema.safeParse(tool.schema.name);
-    if (!parsedName.success)
-        return tool; // Tool name not in our schema, don't apply hooks
-    // NOTE: This means tool call events won't be tracked for tools not in toolNameSchema.
-    // All tools exposed by this MCP server should be added to the schema.
-    const toolName = parsedName.data;
-    const toolHooks = getToolHooks(registry, toolName);
-    // Even if no hooks configured, we still need to consume events and track tool calls
-    if (!toolHooks || (toolHooks.preHooks.length === 0 && toolHooks.postHooks.length === 0)) {
-        return {
-            ...tool,
-            handle: async (context, params, response) => {
-                const eventStore = getEventStore(context);
-                // Consume pre-tool events
-                consumeEvents(context, eventStore, response);
-                // Track tool execution
-                const startTime = Date.now();
-                let success = true;
-                try {
-                    await tool.handle(context, params, response);
-                }
-                catch (error) {
-                    success = false;
-                    throw error;
-                }
-                finally {
-                    // Record tool call completion
-                    const executionTime = Date.now() - startTime;
-                    trackEvent(context, {
-                        type: 'tool-call',
-                        data: {
-                            toolName,
-                            params: params,
-                            executionTime,
-                            success,
-                        },
-                        timestamp: startTime,
-                    });
-                    // Consume post-tool events
-                    consumeEvents(context, eventStore, response);
-                }
-            },
-        };
-    }
-    return {
-        ...tool,
-        handle: async (context, params, response) => {
-            const eventStore = getEventStore(context);
-            // Consume pre-tool events
-            consumeEvents(context, eventStore, response);
-            // Track tool execution
-            const startTime = Date.now();
-            // Run pre-hooks
-            const hookContext = {
-                context,
-                tab: context.currentTab(),
-                params,
-                toolName,
-                response,
-                eventStore,
-            };
-            try {
-                await reduce(async (ctx, hook) => runHook(hook, await ctx), Promise.resolve(hookContext), toolHooks.preHooks);
-            }
-            catch (error) {
-                // Pre-hook already handled messaging (e.g., require-tab pre-hook sets tabs section)
-                // Avoid adding a duplicate error line in the Result section.
-                return;
-            }
-            // Run original tool
-            let success = true;
-            try {
-                await tool.handle(context, params, response);
-            }
-            catch (error) {
-                success = false;
-                throw error;
-            }
-            finally {
-                // Record tool call completion
-                const executionTime = Date.now() - startTime;
-                trackEvent(context, {
-                    type: 'tool-call',
-                    data: {
-                        toolName,
-                        params: params,
-                        executionTime,
-                        success,
-                    },
-                    timestamp: startTime,
-                });
-            }
-            // Run post-hooks
-            const postHookContext = {
-                context,
-                tab: context.currentTab(),
-                params,
-                toolName,
-                response,
-                eventStore: getEventStore(context),
-            };
-            try {
-                await reduce(async (ctx, hook) => runHook(hook, await ctx), Promise.resolve(postHookContext), toolHooks.postHooks);
-            }
-            catch (error) {
-                response.addError(error instanceof Error ? error.message : 'Post-hook failed');
-            }
-            // Consume post-tool events
-            consumeEvents(context, eventStore, response);
-        },
-    };
-};
-export const getHookRegistry = (context) => {
-    const registry = hookRegistryMap.get(context);
-    return registry || createHookRegistry();
-};
-export const applyHooksToTools = (tools, context) => {
-    const registry = getHookRegistry(context);
-    if (registry.tools.size === 0)
-        return tools;
-    return tools.map(tool => wrapToolWithHooks(tool, registry));
-};

package/lib/hooks/eventConsumer.js

@@ -1,52 +0,0 @@
-import { getEventsAfter, isEventType, updateLastSeenId } from './events.js';
-import { formatWaitEvent } from './waitHook.js';
-import { formatPageHeightEvent } from './pageHeightHook.js';
-import { formatNetworkEvent } from './networkTrackingHook.js';
-import { planGroupedMessages } from './grouping.js';
-import { formatToolCallEvent } from './formatToolCallEvent.js';
-import { formatFrameworkStateEvent } from './frameworkStateHook.js';
-import { formatJsonLdEvent } from './jsonLdDetectionHook.js';
-import { formatAntiBotEvent, getAntiBotProviderConfigs } from './antiBotDetectionHook.js';
-import { isAntiBotUrl } from './networkFilters.js';
-const eventFormatters = {
-    'wait': formatWaitEvent,
-    'page-height-change': formatPageHeightEvent,
-    'network-request': formatNetworkEvent,
-    'tool-call': formatToolCallEvent,
-    'framework-state': formatFrameworkStateEvent,
-    'json-ld': formatJsonLdEvent,
-    'anti-bot': formatAntiBotEvent,
-};
-const formatEvent = (event) => {
-    const formatter = eventFormatters[event.type];
-    return formatter(event);
-};
-const consumeEvent = (event, response, plan) => {
-    if (plan.skipIds.has(event.id))
-        return;
-    const replacement = plan.replacementById.get(event.id);
-    const formattedMessage = replacement ?? formatEvent(event);
-    response.addEvent(`[${event.id}] ${formattedMessage}`);
-};
-const shouldHideEvent = (event) => {
-    const isNetworkRequest = isEventType('network-request');
-    if (!isNetworkRequest(event))
-        return false;
-    if (isAntiBotUrl(event.data.url))
-        return true;
-    const configs = getAntiBotProviderConfigs().filter(config => config.provider === 'cloudflare-turnstile');
-    return configs.some(config => config.match(event));
-};
-export const consumeEvents = (context, eventStore, response) => {
-    const unconsumedEvents = getEventsAfter(eventStore, eventStore.lastSeenEventId);
-    if (unconsumedEvents.length === 0)
-        return;
-    const visibleEvents = unconsumedEvents.filter(event => !shouldHideEvent(event));
-    const plan = planGroupedMessages(visibleEvents);
-    // Consume all events in chronological order
-    for (const event of visibleEvents)
-        consumeEvent(event, response, plan);
-    // Update last seen event ID
-    const latestEvent = unconsumedEvents[unconsumedEvents.length - 1];
-    updateLastSeenId(context, latestEvent.id);
-};

package/lib/hooks/events.js

@@ -1,42 +0,0 @@
-import { pipe, filter, toArray } from '@fxts/core';
-export const isEventType = (type) => (event) => event.type === type;
-export const createEventStore = () => ({
-    events: new Map(),
-    lastSeenEventId: undefined,
-    nextEventId: 1,
-});
-export const trackEvent = (context, params) => {
-    const store = getEventStore(context);
-    const eventId = store.nextEventId++;
-    const event = {
-        id: eventId,
-        type: params.type,
-        data: params.data,
-        timestamp: params.timestamp ?? Date.now()
-    };
-    store.events.set(eventId, event);
-    return eventId;
-};
-export const updateLastSeenId = (context, eventId) => {
-    const store = getEventStore(context);
-    store.lastSeenEventId = eventId;
-    return context;
-};
-export const getEventsAfter = (store, afterEventId) => {
-    if (!afterEventId) {
-        return pipe(store.events.values(), toArray);
-    }
-    return pipe(store.events.values(), filter(event => event.id > afterEventId), toArray);
-};
-const eventStoreMap = new WeakMap();
-export const getEventStore = (context) => {
-    let store = eventStoreMap.get(context);
-    if (!store) {
-        store = createEventStore();
-        eventStoreMap.set(context, store);
-    }
-    return store;
-};
-export const setEventStore = (context, store) => {
-    eventStoreMap.set(context, store);
-};

package/lib/hooks/formatToolCallEvent.js

@@ -1,16 +0,0 @@
-export const formatToolCallEvent = (event) => {
-    const { toolName, params, executionTime, success } = event.data;
-    // Format parameters (truncate if too long)
-    const paramStr = params && Object.keys(params).length > 0
-        ? ` with params: ${JSON.stringify(params, null, 0).slice(0, 100)}`
-        : '';
-    // Format execution time if available
-    const timeStr = executionTime !== undefined
-        ? ` (${executionTime}ms)`
-        : '';
-    // Format success status if available
-    const statusStr = success !== undefined
-        ? success ? ' ✓' : ' ✗'
-        : '';
-    return `Tool ${toolName}${paramStr}${timeStr}${statusStr}`;
-};