Aprimorando o modo de agente do Copilot do GitHub com o MCP

Saiba como usar o PROTOCOLO MCP (Model Context Protocol) para expandir as funcionalidades agente de Bate-Papo Copilot.

Neste artigo

Observação

Os servidores MCP na política Copilot para empresas e organizações, desabilitados por padrão, controlam o uso do MCP.

Sobre Copilotos recursos de agente e o MCP

          CopilotOs recursos agente referem-se à capacidade de **trabalhar de forma independente** executando fluxos de trabalho de várias etapas sem orientação constante, **tomar decisões** escolhendo ferramentas e abordagens apropriadas com base no contexto e **iterar e adaptar** ajustando sua abordagem de acordo com comentários e resultados. Você pode acessar estes recursos usando o modo de agente.

Quando combinado com servidores MCP (Model Context Protocol), o modo de agente se torna significativamente mais poderoso, dando Copilot acesso a recursos externos sem alternar o contexto. Isso permite que Copilot complete "loops" agênticos, nos quais pode adaptar dinamicamente sua abordagem encontrando informações relevantes de forma autônoma, analisando o feedback e tomando decisões informadas. Com o MCP, Copilot pode concluir uma tarefa com intervenção humana mínima, ajustando continuamente sua estratégia com base no que descobre.

Benefícios de combinar o MCP com o modo de agente

Ao usar servidores MCP com o modo de agente, você possibilita vários benefícios principais:

  •         **Contexto estendido**: os servidores MCP fornecem Copilot acesso a fontes de dados externas, APIs e ferramentas.

  •         **Redução do esforço manual**: Copilot pode executar tarefas como criar problemas e executar fluxos de trabalho enquanto você se concentra em tarefas de valor mais alto.

  •         **Integração perfeita**: Copilot pode trabalhar em uma tarefa que envolva várias ferramentas e plataformas sem alternar contextos ou exigir integrações personalizadas.

Práticas recomendadas para usar o MCP com o modo de agente

Siga estas práticas recomendadas para aproveitar ao máximo a combinação de servidores MCP com o modo de agente.

Estratégias de solicitação

  •         **Estabelecer metas específicas**: no prompt, defina claramente o que você quer realizar e a saída desejada.

  •         **Fornecer contexto**: inclua informações relevantes em segundo plano sobre seu projeto e requisitos, incluindo links para recursos externos que Copilot podem ser acessados.

  •         **Definir limites:** especifique todas as restrições ou limitações para a tarefa. Por exemplo, se você quiser Copilot planejar apenas um novo recurso e ainda não fizer nenhuma alteração, especifique isso. Você também pode limitar quais ferramentas do MCP estão habilitadas.

  •         **Confirmações de solicitação**: solicite Copilot para confirmar seu entendimento antes de prosseguir com mudanças significativas.

  •         **Use arquivos de prompt ou instruções personalizadas**: você pode criar arquivos de prompt ou arquivos de instruções personalizados para orientar Copilot em relação a como agir em diferentes servidores MCP. Consulte [AUTOTITLE](/copilot/concepts/about-customizing-github-copilot-chat-responses).

Uso do servidor MCP

  •         **Escolher servidores relevantes**: selecione e habilite servidores MCP alinhados às suas necessidades específicas de fluxo de trabalho.

  •         **Começar de modo simples**: comece com alguns servidores MCP bem estabelecidos antes de adicionar integrações mais complexas.

  •         **Testar a conectividade**: verifique se todos os servidores MCP estão configurados corretamente e acessíveis antes de iniciar tarefas do modo de agente.

Considerações de segurança

  •         **Use OAuth quando disponível**: Para servidores MCP como GitHub, prefira a autenticação OAuth em vez de personal access tokens. Consulte [AUTOTITLE](/copilot/customizing-copilot/using-model-context-protocol/using-the-github-mcp-server#remote-mcp-server-configuration-with-oauth).

  •         **Limitar permissões**: conceda aos servidores MCP apenas as permissões mínimas necessárias para suas tarefas.

  •         **Revise as conexões**: avalie regularmente quais servidores MCP têm acesso ao seu ambiente de desenvolvimento.

  •         **Atividade de monitoramento**: acompanhe quais ações Copilot são executadas por meio de servidores MCP.

  •         **Impedir vazamentos de segredo**: a proteção por push impede que segredos sejam incluídos em respostas geradas por IA e impede que você exponha segredos por meio de todas as ações executadas usando o GitHub servidor MCP. No momento, isso está disponível apenas para repositórios públicos. Consulte [AUTOTITLE](/code-security/secret-scanning/introduction/about-push-protection).

Exemplo de cenário: implementar a conformidade de acessibilidade

Observação

O cenário a seguir se destina apenas a demonstrar os padrões e estratégias que você pode usar com o modo de agente e servidores MCP para concluir uma tarefa do início ao fim. O cenário, os prompts e as respostas são apenas exemplos.

Digamos que sua equipe tenha recebido comentários de que o portal do cliente precisa ser atualizado para cumprir os padrões de acessibilidade mais recentes. Você foi encarregado de melhorar a acessibilidade em todo o aplicativo com as seguintes diretrizes:

  • Uma lista de especificações definidas pela equipe de design.
  • Problemas criados no repositório do project após uma auditoria de acessibilidade.

Você pode usar o Copilot modo de agente para aproveitar vários servidores MCP para implementar melhorias de acessibilidade com eficiência.

O cenário a seguir demonstra como você pode usar prompts separados para diferentes fases (pesquisa, planejamento, implementação e validação), resultando em vários "loops" de agente alinhados livremente com fases de ciclo de vida de desenvolvimento de software. Essa abordagem cria pontos de verificação naturais em que você pode examinar o progresso, fornecer comentários e ajustar seus requisitos antes Copilot de continuar para a próxima fase.

  •         [Pré-requisitos](#prerequisites)

  •         [Como configurar os servidores MCP](#setting-up-mcp-servers)

  •         [Etapa 1: Ciclo de pesquisa – Analisando requisitos de acessibilidade](#step-1-research-loop---analyzing-accessibility-requirements)

  •         [Passo 2: Planejamento do ciclo – estratégia de implementação de acessibilidade](#step-2-planning-loop---accessibility-implementation-strategy)

  •         [Step 3: loop de implementação – aprimoramentos de acessibilidade](#step-3-implementation-loop---making-accessibility-improvements)

  •         [Passo 4: Teste do loop – Verificação de acessibilidade com o Playwright](#step-4-testing-loop---accessibility-verification-with-playwright)

  •         [Etapa 5: Atualizando GitHub questões](#step-5-updating-github-issues)

  •         [Leitura adicional](#further-reading)

Pré-requisitos

Antes de usar o modo de agente com MCP, verifique se você tem:

  • Uma IDE com Copilot integração e suporte a MCP (como Visual Studio Code)
  • Modo de agente habilitado
  • Acesso aos servidores MCP que você precisa e deseja usar

Como configurar os servidores MCP

Primeiro, você precisa configurar os servidores MCP que prevê Copilot serão necessários. Para este exemplo de cenário, usaremos:

  •         **
        GitHub Servidor MCP**: configurar o GitHub Servidor MCP para habilitar Copilot o acesso ao repositório, examinar sua base de código, pesquisar problemas existentes, criar branches e gerenciar solicitações de pull. Consulte [AUTOTITLE](/copilot/customizing-copilot/using-model-context-protocol/using-the-github-mcp-server).

  •         **Servidor Figma MCP**: configure o servidor FIGMA MCP para permitir o Copilot acesso a arquivos de design que incluem especificações de acessibilidade, como requisitos de contraste de cores, estados de foco e padrões de interação. Consulte [Figma-Context-MCP](https://github.com/GLips/Figma-Context-MCP) ou experimente o servidor MCP do modo [Dev](https://help.figma.com/hc/en-us/articles/32132100833559-Guide-to-the-Dev-Mode-MCP-Server).

  •         **Servidor MCP do dramaturgo**: configure o servidor MCP do Dramaturgo para habilitar Copilot a gravação e a execução de testes automatizados de acessibilidade, incluindo compatibilidade com leitor de tela e testes de navegação de teclado. Consulte [mcp-playwright](https://github.com/executeautomation/mcp-playwright).

Etapa 1: Pesquisa loop – Analisando os requisitos de acessibilidade

Solicite Copilot a análise de requisitos de acessibilidade e problemas relacionados à GitHub acessibilidade existentes no projeto.

No prompt, inclua um link para o arquivo Figma. Para que o Copilot consiga ler e analisar com sucesso as especificações de design, selecione um nó ou camada específica no arquivo, de modo que a ID do nó seja incluída na URL.

Exemplo de prompt 1

Copilot prompt
I need to make our customer portal WCAG 2.1 AA compliant. Use the Figma MCP to analyze our design specifications at https://figma.com/design/DESIGN-FILE-FOR-ACCESSIBILITY-SPECS?node-id=NODE_ID for accessibility requirements. Also use the GitHub MCP to find open GitHub issues with the labels accessibility or WCAG in the customer-portal repository. Then sort them into categories and list each issue that falls under the category with the issue title and number.

Exemplo de resposta 1

          Copilot deve responder primeiro solicitando permissão para executar ferramentas dos servidores MCP do Figma e do GitHub. Quando você permitir, Copilot analisará as especificações de design do Figma e buscará e organizará issues do GitHub em categorias.

Por exemplo, Copilot pode identificar o contraste de cores como uma categoria com base na identificação de vários problemas relacionados a ele.

  • Problemas de contraste de cores
    • Problema nº 134: taxa de contraste de texto do painel abaixo de 4,5:1
    • Problema nº 156: os estados de erro de formulário não cumprem os requisitos de contraste

Isso oferece uma visão geral abrangente dos requisitos de acessibilidade, permitindo que você priorize Copilot e crie um plano.

Etapa 2: Ciclo de Planejamento – Estratégia de Implementação de Acessibilidade

Em seguida, peça Copilot para criar um plano de implementação detalhado.

Exemplo de prompt 2

Copilot prompt
Based on your accessibility analysis of our Figma designs and GitHub issues, create a focused implementation plan for an immediate pull request addressing the highest priority accessibility issues. Don't make any changes yet. Also suggest follow-up issues we should create for the remaining Figma specifications.

Exemplo de resposta 2

          Copilot responderá criando um plano de implementação priorizado focado em problemas de acessibilidade de alto impacto para um pull request imediato, sugerindo questões de acompanhamento para o trabalho restante.

Por exemplo, Copilot pode identificar o que precisa ser feito para corrigir os problemas na categoria de contraste de cores.

          **1. Correções de contraste de cores:**
  • Atualizar variáveis de cor de texto em variables.scss para garantir a taxa de contraste de 4,5:1 para todo o texto normal
  • Modificar as cores do componente da interface do usuário no DashboardCard.vue e em outros componentes primários para atender à taxa de contraste de 3:1
  • Priorizar a correção do Problema nº 134 (contraste de texto do painel) e do Problema nº 156 (estados de erro de formulário)

Você pode pedir Copilot para ajustar o plano com base no que você deseja focar. O resultado é um plano que você está confortável com o qual agora pode pedir Copilot para implementar.

Etapa 3: Iteração da implementação – Aprimoramentos de acessibilidade

Depois de examinar o plano, solicite Copilot que comece a implementar correções de acessibilidade.

Exemplo de prompt 3

Copilot prompt
Create a new branch and implement the critical accessibility fixes according to your proposed implementation plan. Focus on the top three categories that you identified as highest priority. Create a pull request with proper references to the issues being fixed.

Exemplo de resposta 3

          Copilot responderá executando o plano de implementação, fazendo alterações de código direcionadas para resolver os problemas de acessibilidade identificados e criando uma solicitação de pull.

Por exemplo, Copilot pode criar um novo branch chamado fix/critical-accessibility-issues e fazer alterações para resolver os problemas de contraste de cores.

  • Corrigidos problemas de contraste de texto do painel (Problema nº 134):
    • Variáveis de cor de texto atualizadas no src/styles/variables.scss de #767676 para #595959
    • Texto em cor escura modificado sobre planos de fundo cinza-claro em DashboardCard.vue para garantir a relação 4,5:1.

Eu abri um pull request nº 213 com essas alterações.

Etapa 4: Teste de loop – Verificação de acessibilidade com Playwright

Você pode solicitar Copilot para criar e executar testes de acessibilidade usando o Playwright MCP.

Exemplo de prompt 4

Copilot prompt
Create focused accessibility tests for the components we've updated in the pull request. Use the Playwright MCP.

Exemplo de resposta 4

          Copilot responderá desenvolvendo testes de acessibilidade e, se necessário, criando um arquivo de configuração do Dramaturgo.

Por exemplo, Copilot pode criar um arquivo de teste em torno do contraste de texto.

          **Implementação de teste:**
  • Criado um arquivo de teste direcionado em tests/accessibility/: * contrast.spec.ts – valida as taxas de contraste de texto

Depois que os testes forem criados, Copilot pedirá permissão para usar várias ferramentas do MCP do Dramaturgo para executar os testes. Observe que, às vezes, Copilot pode fazer testes adicionais que você não necessariamente pediu; você pode tentar evitar isso ajustando seu prompt para ser mais rigoroso.

Etapa 5: Atualizando os problemas GitHub

Por fim, solicite Copilot que atualize os GitHub problemas que foram resolvidos no pedido de pull e crie tarefas de acompanhamento.

Exemplo de prompt 5

Copilot prompt
Update the GitHub issues we've fixed in the pull request with comments summarizing the changes. Create the follow-up issues you suggested for the remaining accessibility work.

Exemplo de resposta 5

          Copilot responderá solicitando permissão para usar as ferramentas necessárias do GitHub servidor MCP. Em seguida, ele atualizará as questões GitHub com comentários detalhados e criará questões estruturadas para acompanhamento do trabalho restante.

Por exemplo, Copilot adicionará comentários nos problemas de contraste de cores inicialmente identificados na etapa de pesquisa.

          **Problemas atualizados com comentários:**
  • Problema nº 134: "Taxa de contraste de texto do painel abaixo de 4,5:1"
    • Comentário: "Corrigido na PR nº 213 atualizando variáveis de cor de texto em variables.scss e no componente DashboardCard. Todo o texto do painel agora cumpre a taxa de contraste de 4,5:1, verificada por testes automatizados".

Agora você pode examinar a pull request e fazer ajustes. Depois de verificar se as alterações são válidas, você pode mesclar como com qualquer outra pull request.

Atividade prática

Pratique integrar o MCP com GitHub Copilot no exercício Integrar MCP com GitHub Copilot de Habilidades.

Neste exercício, você aprenderá a:

  • Configure e conecte o GitHub servidor MCP a GitHub Copilot.
  • Use a linguagem natural para interagir com serviços externos por meio de ferramentas MCP no modo de agente.
  • Pesquise e analise projetos semelhantes com MCP.
  • Realize a triagem, crie e gerencie GitHub problemas, e implemente alterações com GitHub Copilot.

Leitura adicional

  •         **Conceitos básicos do MCP**: para obter mais informações sobre como configurar e ajustar servidores MCP, confira [AUTOTITLE](/copilot/customizing-copilot/using-model-context-protocol/extending-copilot-chat-with-mcp).

  •         **Using MCP servers**: Para obter ideias adicionais sobre como integrar o MCP ao GitHub Copilot, consulte [5 maneiras de transformar seu fluxo de trabalho usando GitHub Copilot e MCP](https://github.blog/ai-and-ml/github-copilot/5-ways-to-transform-your-workflow-using-github-copilot-and-mcp/) no the GitHub Blog.