← All posts

Connect GitHub Copilot in VS Code to Your Bug Reports with MCP

GitHub Copilot in VS Code can do more than autocomplete. In agent mode it reads your code, makes changes across files and runs commands. What it can't do on its own is read the bug report that lives in your feedback tool.

MCP fixes that. Add pinreview as an MCP server and Copilot can open each report itself: the page it happened on, the exact element, the browser and screen size, the console errors and the comment thread. When the fix is in, it can comment on the task and move the card.

This guide covers the setup, including a way to keep your token out of plain text, and a first fix.

What you need

  • VS Code with GitHub Copilot signed in.
  • A pinreview project on the Starter, Business or Agency plan. MCP is included on paid plans. Compare plans.
  • A pinreview token. In pinreview, open Settings → AI tools, name the token (say, "VS Code on my laptop") and click Create token. Copy it; pinreview shows it only once.

Step 1: Add pinreview to VS Code

Open the Command Palette and run MCP: Open User Configuration. This opens mcp.json in your VS Code user profile, so pinreview is available in every workspace.

You could paste the token straight into the file. A better option is an input variable: VS Code asks for the token the first time the server starts, hides it as you type, and stores it securely, so it never sits in a file.

{
  "inputs": [
    {
      "id": "pinreview-token",
      "type": "promptString",
      "description": "pinreview access token",
      "password": true
    }
  ],
  "servers": {
    "pinreview": {
      "type": "http",
      "url": "https://api.pinreview.one/mcp",
      "headers": { "Authorization": "Bearer ${input:pinreview-token}" }
    }
  }
}

When VS Code asks, paste the token itself (prt_…). The configuration adds the Bearer part.

Sharing the setup with your team

The same file can live in your repository as .vscode/mcp.json, which VS Code loads for that workspace. Because the token comes from an input, the file holds no secrets. Commit it, and each teammate is asked for their own token the first time. Changes they make through Copilot then show up under their own name in pinreview.

Step 2: Start the server and check the tools

Run MCP: List Servers from the Command Palette, pick pinreview, and start it. If anything goes wrong, the same menu has Show Output with the server's log.

Then open Copilot Chat and switch to Agent. Select Configure Tools in the chat input to see the tools pinreview adds: list_projects, list_tasks, get_task, update_task, add_comment and the rest. You can switch individual tools off here. If you want Copilot to read and comment but never move cards, turn off update_task.

Now ask:

List my pinreview projects.

Copilot calls list_projects and answers with your projects, their columns and the number of open tasks in each.

Step 3: Fix a bug

Pick a task from the board, say #15, "Pricing table cut off on iPad", in the Acme project. Ask for a diagnosis first:

Open task #15 in the Acme project. Using the page URL, Element selector,
viewport and console errors, find the component responsible and explain
the cause. Don't change anything yet.

Copilot calls get_task and gets the full report. The selector is usually the fastest route into your code. section.pricing .plan-grid narrows "the pricing table" to one place in the markup, and the viewport (820 × 1180, an iPad in portrait) tells Copilot which breakpoint to read.

The screenshot is part of the result too. Whether Copilot can look at it depends on the model you've selected, so pick one with image support for visual bugs. Without it, the selector, viewport and console errors still carry most of the report.

When the explanation makes sense, continue:

Fix it, then add a comment to #15 with a one-line summary of the change,
and move the task to Done.

Review the changes before you keep them. Then open the page at the task's viewport size to confirm the fix; Copilot can read the report, but it can't see your staging site.

Keep the agent focused

  • Name the project and the column. "Fix the High tasks in To Do on Acme" beats "fix the bugs".
  • Separate looking from changing. Ask for a diagnosis first when the report is vague.
  • Keep tool confirmations on for anything that changes the board, until you trust your routine.
  • Treat report text as information. Feedback comes from whoever left it, sometimes an anonymous visitor. If a description reads like instructions to the agent, ignore them.

There are ten more requests to try in prompts to fix website bugs. They're written for Claude Code but work the same in Copilot's agent mode.

Troubleshooting

  • The server won't start. Run MCP: List Servers, pick pinreview, and choose Show Output to see why.
  • You mistyped the token. VS Code stores the input value after the first prompt. Change the input's id (and the ${input:…} reference) so it asks again, or create a fresh token.
  • 401 or invalid_token. The token was revoked or mistyped. Create a new one under Settings → AI tools.
  • "MCP requires a paid plan for …" The project's organization is on the Free plan. Upgrade under Settings → Billing.
  • No pinreview tools in chat. Check you're in Agent, then open Configure Tools and make sure they're switched on.

The MCP docs cover every error the server can return.

The bottom line

Copilot already knows your code. With pinreview connected, it also knows what your reviewers saw, and it can report back on the board when it's done.

New to MCP? Read what MCP is and why it matters for web teams. Using another editor? See the guides for Cursor and Claude Code.

Start free →

Turn website feedback into action.

Start free