Hands-On LabDepuração avançada com IntelliTrace usando Visual Studio Ultimate 2012Versão do laboratório: 11.0.50727.1 (RTM)

Última atualização: 8/21/2012

Data da tradução: 10/09/2012

CONTEÚDOS

VISÃO GERAL............................................................................................................................................ 3

EXERCÍCIO 1: INTRODUZINDO INTELLITRACE.....................................................................................3

EXERCÍCIO 2: USANDO INTELLITRACE COM INFORMAÇÃO DE CHAMADA...................................13

Visão Geral

Neste laboratório você irá aprender sobre a ferramenta de depuração do Intelli Trace no Visual Studio Ultimate 2012. Antes da adição do IntelliTrace, a depuração era realizada de um ponto específico no tempo, a partir daquele momento. Se você quisesse encontrar informação de um ponto anterior, deveria especificar um breakpoint e então re-executar a aplicação. O IntelliTrace possibilita a visualização de um número maior de pontos de execução, que ocorreram no passado, e os disponibiliza, comparando variáveis, pilhas de chamadas e etc. a fim de ajudar a identificar as causas dos problemas sem a necessidade de reproduzi-los.

Nota: Esta máquina virtual foi pré-configurada para arquivar as fontes e símbolos para os trabalhos desenvolvidos. Isso possibilita que os arquivos que você recebe de uma sessão com IntelliTrace possam ser corretamente combinados com um trabalho específico. A fim de tirar a melhor vantagem do IntelliTrace para suas aplicações de software, você pode pesquisar O post desse Blog o qual entra em maiores detalhes e da instruções para disponibilizar estas ferramentas.

Pré-requisitos

A fim de completar este laboratório, você precisará de uma máquina virtual com o Visual Studio 2012 disponibilizada pela Microsoft. Mais informações sobre a disponibilização e utilização da máquina virtual, por favor, acesse o post deste Blog .

Exercícios

Este laboratório prático inclui os seguintes exercícios:

1. Introdução ao IntelliTrace

2. Usando o IntelliTrace com informações de chamada

Tempo estimado para completar o exercício: 60 minutos.

Exercício 1: Introduzindo o IntelliTrace

Neste exercício, você verá como o IntelliTrace pode ajudar a depurar uma falha em um arquivo XML em um ASP.NET website.

Nota: O IntelliTrace suporta depuração de aplicações em Visual Basic e C# que usam .NET versão2.0, 3.0, 3.5, 4, or 4.5 (ASP.NET, Windows Forms, WPF, Windows Workflow, e WCF). O IntelliTrace não suporta depuração em C++, script, ou em linguagens não gerenciadas. Para informações mais detalhadas sobre o que o IntelliTrace suporta, por favor consultar a documentação do Visual Studio 2012 no Microsoft Developer Network.

1. Logue como Julia. Todas as senhas dos usuários são P2ssw0rd.

2. Abra o Microsoft Visual Studio em Start | All Programs | Microsoft Visual Studio 2012 | Visual Studio 2012.

3. Na página de Start, clique em Connect to Team Foundation Server…

Figura 1Localização do link Connect to Team Foundation Server

4. Escolha TailspinToysCollection no link Connect to Team Foundation Server dialog e clique no botão Connect. Se a confirmação for solicitada, clique no botão Yes na página de confirmação.

Figura 2Selecionando TailspinToysCollection project collection

5. No Source Control Explorer (View | Other Windows | Source Control Explorer), navegue para Tailspin Toys | Development | Iteration 2 e dê um clique duplo no arquivo TailspinToys.sln para abrir o Tailspin Toys solution.

6. Reconstrua a solução (Build | Rebuild Solution pelo menu principal). Este passo deve levar alguns minutos para completar.

7. Abra a janela Options em Tools | Options... e clique em IntelliTrace .

8. Certifique-se de que a checkbox Enable IntelliTrace está marcada como “IntelliTrace events only”. Este é o valor padrão por causa das implicações mínimas de performance.

Figura 3IntelliTrace options

Nota: Os eventos IntelliTrace salvos em um arquivo IntelliTrace possuem a extensão .iTrace. Estes arquivos podem ser salvos e usados mais tarde com o intuito de realizar a depuração com o IntelliTrace, possibilitando os testadores de anexar estas informações detalhadas de depuração diretamente aos relatórios de bugs.

9. Selecione o link IntelliTrace Events a esquerda e então selecione a check box File para obter os eventos gravados de arquivos IntelliTrace. Clique em OK.

Figura 4Colete os IntelliTrace events relacionados ao file access

10. Comece uma sessão de depuração pressionando F5. Isso carregará a página default para a empresa fictícia Tailspin Toys.

Nota: Se o projeto Tailspin.Web não está configurado como o projeto inicial, clique com o botão direito no link Tailspin.Web em Solution Explorer e selecione a opção “Set as StartUp Project”.

Figura 5Página default da Tailspin Toys

11. Selecione o link About Us no rodapé da página. Isso irá gerar uma exceção e mostrará um erro de página ASP.NET para a aplicação Tailspin Toys.

Figura 6Página de erro exibida quando o About Us é carregado

12. Volte para Visual Studio, localize a janela IntelliTrace e então clique no link Break All.

Figura 7Janela IntelliTrace

13. A janela IntelliTrace mostra uma lista sequencial dos eventos que foram coletados desde que você iniciou a sessão de depuração, com os mais recentes mostrados no topo.

Figura 8Janela IntelliTrace mostrando os eventos gravados

Nota: IntelliTrace é configurado por default para coletar certos eventos quando está depurando, alguns dos quais você pode ver na janela IntelliTrace Events agora. Você pode configurar quais categorias de eventos ou até mesmo eventos específicos serão coletados no link IntelliTrace options(Tools | Options).

14. Na janela IntelliTrace Events, localize e selecione o evento “Exception: Thrown” digitando XmlException que ocorre após a chamada ASP.NET. A página ‘/Home/About” é carregada. Ela irá mostrar detalhes sobre a exceção que ocorreu, assim como disponibilizará links para as janelas Locals e Call Stack. Essa exceção nos mostra que há um problema com o arquivo XML na linha 10, coluna 49, mas não nos diz a qual arquivo XML está se referindo.

Figura 9Exceção mostrada quando o arquivo XML é analisado

Figura 10Estado das páginas Locals e Call Stack durante a seleção da exceção

15. Selecione o evento “File Access” que precede a exceção, para visualizar o arquivo que foi acessado antes da exceção ocorrer.

Figura 11Arquivo Access event

16. Abra o arquivo Ads.xml clicando no link disponibilizado.

17. Observe que existe uma linha vermelha abaixo dos caracteres “&b=1” que estão inválidos no contexto. Note que está na linha 10, coluna 49 assim como a exceção XML reportada.

Figura 12Ads.xml mostrando caracteres inválidos

18. Remova os caracteres inválidos e salve o arquivo. A URL final mostrada deverá ser a seguinte: http://localhost/test.aspx?a=2.

Nota: Selecione o botão Edit quando solicitado pela janela Edit and Continue.

19. Pressione Ctrl+Shift+F5 (ou use Debug | Restart do menu principal) para reiniciar a sessão de depuração e Selecione o link About Us novamente para assegurar-se que agora está funcionando como deveria.

Figura 13Página About com working ad

20. Pare a sessão de depuração atual (Debug | Stop Debugging).

21. Desabilite o arquivo IntelliTrace events que você habilitou anteriormente retornando para Tools | Options | IntelliTrace. Não precisaremos destes eventos extras no próximo exercício.

Exercício 2: Usando IntelliTrace com chamadas de informação

Neste exercício, você aprenderá como usar o IntelliTrace para coletar informações de chamadas adicionais a fim de resolver um erro de código mais complicado.

1. Por default, apenas os eventos IntelliTrace são coletados na depuração, mas nós podemos também optar por coletar dados por qualquer método de entrada/saída e call site. Para realizar esta ação, selecione Tools | Options do menu principal do Visual Studio, localizado no link IntelliTrace, e selecione a opção “IntelliTrace events and call information”.

Figura 14IntelliTrace options ajustado para gravar informações de chamada

2. Clique em OK para continuar.

3. Inicie uma sessão de depuração pressionando F5.

4. Vamos testar a funcionalidade shopping cart adicionando dois produtos ao carrinho. clique no cabeçalho “Paper Airplanes” para visualizar os aviões catalogados.

Figura 15Catálogo de aviões de papel

5. A seguir, clique no botão “View Plane”pelo Contoso Cloud Explorer.

Figura 16

Página de produtos Contoso Cloud Explorer

6. Selecione o botão “Add To Cart” e verifique se a quantidade do item no carrinho é 1.

Figura 16Shopping cart mostrando 1 avião

7. Adicione outro “Contoso Cloud Explorer” no carrinho selecionando o link “Contoso Cloud Explorer” e Selecionando o botão “Add To Cart” novamente. Note que a quantidade continua 1 mesmo quando adicionamos 2 produtos.

8. Retorne ao Visual Studio e selecione Break All na janela IntelliTrace. Por default, nós visualizamos os eventos IntelliTrace mostrando a sequência de eventos gravados que levaram à quebra do depurador.

9. Na search box no topo da janela IntelliTrace, digite “post” e pressione Enter para iniciar uma busca. Isto irá retornar dois eventos “Post”, um para cada item do shopping cart adicionado.

10. Selecione o primeiro evento ASP.NET POST e observe que não existe fonte disponível para o evento. Isso é esperado porque este não é o código da nossa aplicação.

Figura 17Eventos ASP.NET não mostram as fontes por default

11. Selecione o segundo evento ASP.NET POST. Nós usaremos isso como um ponto de referência para auxiliar na navegação para o ponto na sessão de depuração onde o Add Item logic começa.

Figura 18Evento ASP.NET POST selecionado

12. Retorne para a lista completa de eventos gravados clicando no “X” azul a direita da search box.

13. Selecione o primeiro evento ADO.NET que ocorrer após o evento ASP.NET selecionado. Isso mostra que cada item adicionado para um carrinho resulta em uma pesquisa do cliente no banco de dados.

Figura 19Evento ADO.NET

14. Selecione o link “Calls View” no topo do evento selecionado para mostrar uma hierarquia completa de chamados da sessão de depuração. O quadro do topo da visualização de chamados mostra a pilha para o chamado atual.

Nota: Você também pode usar o link “Switch to IntelliTrace Calls View” no topo da janela IntelliTrace.

Figura 20Localização do link“Calls View”

Figura 21Visualização calls do IntelliTrace

15. Imagine que nós somos intimamente familizarizados com o código base, então nós sabemos que precisamos navegar de volta no tempo para a pilha de chamados ProcessRequestNotification a fim de localizar o código de nosso interesse. Dê um Clique duplo no chamados para System.Web.Hosting.PipelineRuntime.ProcessRequestNotification.

Figura 22Localização do chamado ProcessRequestNotification

16. Na visualização de chamados IntelliTrace calls view, clique duplo no chamado “Tailspin.Web.App.Controllers.CartController.AddItem(string sku = “papcce”)”. Todas as vezes que você realizar um clique duplo na metade inferior da visualização de chamados, o chamado é mandado para o topo e o ponteiro de instrução é sincronizado no editor de código para o ponto de entrada do método do chamado, assim como na depuração.

17. Na visualização de chamados IntelliTrace, clique duas vezes no chamado “Tailspin.Model.ShoppingCart.AddItem(Tailspin.Model.Product produt = {Tailspin.Model.Product})”.

18. Na visualização de chamados IntelliTrace, dê um duplo clique no chamado para AddItem que mostra “Tailspin.Model.Product product = {Tailspin.Model.Product}, int quantity = 1)” como parâmetro.

19. Na visualização de chamados IntelliTrace, dê um duplo clique no chamado para AddItem que mostra “Tailspin.Model.Product product = {Tailspin.Model.Product}, int quantity = 1, System.DateTime dateAdded = …)” como parâmetro. Navegar através da visualização de chamados é um caminho rápido para obter uma visão geral da hierarquia de chamados e para realizar longos saltos através desta hierarquia sem precisar seguir linha por linha.

Figura 23Visualização de chamados IntelliTrace mostrando o método AddItem

20. Na janela Locals, expanda a chamada de função “AddItem” para validar se o produto correto está sendo adicionado ao carrinho e se a quantidade adicionada é igual a 1. Em qualquer ponto da depuração do IntelliTrace, você pode olhar para as variáveis coletadas na janela Autos/Locals/Watch ou usando as dicas de dados no editor.

Figura 24Janela Locals mostrando parâmetros da opção AddItem

21. Passe direto por dois chamados pressionando F10 duas vezes. Mantenha em mente que enquanto nós estivermos no modo de depuração IntelliTrace, estamos passando através de eventos gravados e sites de chamados, não linha por linha do código.

Figura 25Localização no método AddItem onde AdjustQuantity é chamado

Nota: Você também pode usar o estilo de controle “VCR” mostrado no fim da janela do código fonte.

22. Na janela Locals, expanda a função “AdjustQuantity” para visualizar a quantidade que o carrinho está mostrando antes de adicionar o segundo produto. Desde que estivermos esperando a quantidade ajustada como 2, nós teremos localizado o bug.

Figura 26Janela Locals mostrando a quantidade incorreta

23. Pare a sessão de depuração atual. (Debug | Stop Debugging).

24. Mude o chamado AdjustQuantity(…) então isso adicionará na nova quantidade passada pelo método AddItem.

Figura 27Fixed call para o método AdjustQuantity

25. Verifique o conserto adicionando o mesmo produto duas vezes para assegurar que a quantidade do carrinho de compras está mostrando o valor 2.

Figura 28Carrinho de compras mostrando a quantidade correta de itens do produto

Nota: Caso necessite, você pode esvaziar manualmente o carrinho de compras atual, removendo manualmente os itens ou selecionando Tools | Safety | Delete Browsing History no Internet Explorer.