Cursor Talk to Figma MCP

Instructions

Implementation Reference

• src/talk_to_figma_mcp/server.ts:2403-2448 (registration)

  Registration of the 'join_channel' MCP tool, including input schema (channel: string) and the handler function that validates input and calls the joinChannel helper.

  server.tool(
    "join_channel",
    "Join a specific channel to communicate with Figma",
    {
      channel: z.string().describe("The name of the channel to join").default(""),
    },
    async ({ channel }) => {
      try {
        if (!channel) {
          // If no channel provided, ask the user for input
          return {
            content: [
              {
                type: "text",
                text: "Please provide a channel name to join:",
              },
            ],
            followUp: {
              tool: "join_channel",
              description: "Join the specified channel",
            },
          };
        }
  
        await joinChannel(channel);
        return {
          content: [
            {
              type: "text",
              text: `Successfully joined channel: ${channel}`,
            },
          ],
        };
      } catch (error) {
        return {
          content: [
            {
              type: "text",
              text: `Error joining channel: ${error instanceof Error ? error.message : String(error)
                }`,
            },
          ],
        };
      }
    }
  );

• src/talk_to_figma_mcp/server.ts:2325-2338 (handler)

  The joinChannel helper function implements the core logic: sends a 'join' command via WebSocket to the Figma plugin server with the specified channel name and updates the currentChannel state.

  async function joinChannel(channelName: string): Promise<void> {
    if (!ws || ws.readyState !== WebSocket.OPEN) {
      throw new Error("Not connected to Figma");
    }
  
    try {
      await sendCommandToFigma("join", { channel: channelName });
      currentChannel = channelName;
      logger.info(`Joined channel: ${channelName}`);
    } catch (error) {
      logger.error(`Failed to join channel: ${error instanceof Error ? error.message : String(error)}`);
      throw error;
    }
  }

• src/talk_to_figma_mcp/server.ts:2341-2400 (helper)

  General sendCommandToFigma utility used by joinChannel to send the 'join' websocket message to the Figma plugin, with special handling for join command (no prior channel required).

  function sendCommandToFigma(
    command: FigmaCommand,
    params: unknown = {},
    timeoutMs: number = 30000
  ): Promise<unknown> {
    return new Promise((resolve, reject) => {
      // If not connected, try to connect first
      if (!ws || ws.readyState !== WebSocket.OPEN) {
        connectToFigma();
        reject(new Error("Not connected to Figma. Attempting to connect..."));
        return;
      }
  
      // Check if we need a channel for this command
      const requiresChannel = command !== "join";
      if (requiresChannel && !currentChannel) {
        reject(new Error("Must join a channel before sending commands"));
        return;
      }
  
      const id = uuidv4();
      const request = {
        id,
        type: command === "join" ? "join" : "message",
        ...(command === "join"
          ? { channel: (params as any).channel }
          : { channel: currentChannel }),
        message: {
          id,
          command,
          params: {
            ...(params as any),
            commandId: id, // Include the command ID in params
          },
        },
      };
  
      // Set timeout for request
      const timeout = setTimeout(() => {
        if (pendingRequests.has(id)) {
          pendingRequests.delete(id);
          logger.error(`Request ${id} to Figma timed out after ${timeoutMs / 1000} seconds`);
          reject(new Error('Request to Figma timed out'));
        }
      }, timeoutMs);
  
      // Store the promise callbacks to resolve/reject later
      pendingRequests.set(id, {
        resolve,
        reject,
        timeout,
        lastActivity: Date.now()
      });
  
      // Send the request
      logger.info(`Sending command to Figma: ${command}`);
      logger.debug(`Request details: ${JSON.stringify(request)}`);
      ws.send(JSON.stringify(request));
    });
  }