Webvizio MCP Server

Instructions

Implementation Reference

• src/server.ts:341-357 (handler)

  The MCP handler function for 'get_task_screenshot' tool. It takes task UUID, fetches screenshot via WebvizioClient, and returns it as base64 PNG image content.

  async (args: { uuid: string }) => {
    try {
      const screenshot = await this.webvizioClient.getTaskScreenshot({ uuid: args.uuid });
  
      return {
        content: [
          {
            type: 'image' as const,
            data: screenshot,
            mimeType: 'image/png'
          }
        ]
      };
    } catch (error) {
      return this.handleError(error, 'get_task_screenshot');
    }
  }

• src/server.ts:332-340 (schema)

  Tool schema including description, input schema (UUID), and annotations for the MCP tool.

  {
    description: 'Fetches the task screenshot. By default, a screenshot is automatically generated when a task is created, displaying the page in the browser exactly as the user saw it at that moment. A distinctive lilac marker on the screenshot indicates the location of the element on the page that the task refers to. In some cases, the task author may also add additional hints and instructions directly onto the screenshot. Use this tool if the task prompt lacks sufficient information for execution. Analyzing a screenshot can also be particularly useful for tasks related to layout or resolving visual bugs. Do not use this tool if the task and its solution methods are entirely clear from the task prompt ', 
    inputSchema: {
      uuid: z.string().describe('The uuid of the task to get the screenshot for')
    },
    annotations: {
      title: 'Get Task Screenshot'
    }
  },

• src/server.ts:330-358 (registration)

  Registration of the 'get_task_screenshot' MCP tool with schema and handler.

  this.server.registerTool(
    'get_task_screenshot',
    {
      description: 'Fetches the task screenshot. By default, a screenshot is automatically generated when a task is created, displaying the page in the browser exactly as the user saw it at that moment. A distinctive lilac marker on the screenshot indicates the location of the element on the page that the task refers to. In some cases, the task author may also add additional hints and instructions directly onto the screenshot. Use this tool if the task prompt lacks sufficient information for execution. Analyzing a screenshot can also be particularly useful for tasks related to layout or resolving visual bugs. Do not use this tool if the task and its solution methods are entirely clear from the task prompt ', 
      inputSchema: {
        uuid: z.string().describe('The uuid of the task to get the screenshot for')
      },
      annotations: {
        title: 'Get Task Screenshot'
      }
    },
    async (args: { uuid: string }) => {
      try {
        const screenshot = await this.webvizioClient.getTaskScreenshot({ uuid: args.uuid });
  
        return {
          content: [
            {
              type: 'image' as const,
              data: screenshot,
              mimeType: 'image/png'
            }
          ]
        };
      } catch (error) {
        return this.handleError(error, 'get_task_screenshot');
      }
    }
  );

• src/webvizio-client.ts:179-194 (helper)

  WebvizioClient helper method that fetches task screenshot from API endpoint `/task/{uuid}/screenshot` and converts to base64 string.

   async getTaskScreenshot(request: WebvizioGetTaskRequest): Promise<string> {
    try {
      const response = await this.client.get(`/task/${request.uuid}/screenshot`);
      if (!response.data?.screenshot) {
        throw new Error('Failed to get task screenshot');
      }
      const imageResponse = await axios.get(response.data.screenshot, {
        responseType: 'arraybuffer'
      });
      const base64Image = Buffer.from(imageResponse.data, 'binary').toString('base64');
      return base64Image;
    } catch (error) {
      console.error('[Webvizio API] Error getting task screenshot:', error);
      throw error;
    }
  }

• src/types.ts:20-22 (schema)

  Type definition for task request used in getTaskScreenshot (uuid: string).

  export interface WebvizioGetTaskRequest {
    uuid: string;
  }