Skip to main content
Glama

playwright_click_and_switch_tab

Click a specified link using a CSS selector and automatically switch to the newly opened tab to streamline web navigation tasks in browser automation workflows.

Instructions

Click a link and switch to the newly opened tab

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector for the link to click

Implementation Reference

  • ClickAndSwitchTabTool class with execute method implementing the core logic: clicks selector, waits for new tab, switches to it using setGlobalPage, and returns success message with new URL.
    export class ClickAndSwitchTabTool extends BrowserToolBase {
      /**
       * Execute the click and switch tab tool
       */
      async execute(args: any, context: ToolContext): Promise<ToolResponse> {
        
        return this.safeExecute(context, async (page) => {
          // Listen for a new tab to open
          const [newPage] = await Promise.all([
            //context.browser.waitForEvent('page'), // Wait for a new page (tab) to open
            page.context().waitForEvent('page'),// Wait for a new page (tab) to open
            page.click(args.selector), // Click the link that opens the new tab
          ]);
    
          // Wait for the new page to load
          await newPage.waitForLoadState('domcontentloaded');
    
          // Switch control to the new tab
          setGlobalPage(newPage);
          //page= newPage; // Update the current page to the new tab
          //context.page = newPage;
          //context.page.bringToFront(); // Bring the new tab to the front
          return createSuccessResponse(`Clicked link and switched to new tab: ${newPage.url()}`);
          //return createSuccessResponse(`Clicked link and switched to new tab: ${context.page.url()}`);
        });
      }
  • Tool schema definition including name, description, and inputSchema requiring 'selector'.
      name: "playwright_click_and_switch_tab",
      description: "Click a link and switch to the newly opened tab",
      inputSchema: {
        type: "object",
        properties: {
          selector: { type: "string", description: "CSS selector for the link to click" },
        },
        required: ["selector"],
      },
    },
  • Switch case in handleToolCall that routes the tool call to ClickAndSwitchTabTool.execute
    case "playwright_click_and_switch_tab":
      return await clickAndSwitchTabTool.execute(args, context);
  • Instantiation of ClickAndSwitchTabTool instance in initializeTools
    if (!clickAndSwitchTabTool) clickAndSwitchTabTool = new ClickAndSwitchTabTool(server);
  • Import of ClickAndSwitchTabTool class
    import { ClickAndSwitchTabTool } from './tools/browser/interaction.js';

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/executeautomation/mcp-playwright'

If you have feedback or need assistance with the MCP directory API, please join our Discord server