Frameworksp

Páginas filhas
  • Como depurar aplicativos web que utilizam o @totvs/protheus-lib-core

Objetivo

Este documento tem como objetivo mostrar como depurar aplicações web que utilizam o @totvs/protheus-lib-core.

O debug pode ser realizado dentro ou fora do Protheus, sendo que "dentro" refere-se à uma rotina PO-UI adicionada no menu do ERP e "fora" refere-se à execução local do aplicativo no browser, utilizando o comando "ng serve".

Depurando pelo browser (ng serve)

Para depurar o aplicativo pelo browser, ou seja, sem gerar o build da aplicação e adicionar no menu do Protheus, é necessário utilizar o REST, isso porque pelo browser não tem como o protheus-lib-core recuperar as informações da porta multiprotocolo e utilizá-la.

Consumo de licenças

Ao utilizar o REST para esse procedimento, serão consumidas as licenças REST. Porém, este é um passo somente para o processo de desenvolvimento e depuração. Portanto, ao executar o aplicativo dentro do Protheus com as configurações corretas, as licenças REST não serão consumidas.

Como fazer:

1. Informar o caminho do servidor REST na propriedade "api_baseUrl" do arquivo appConfig.json:

2. Subir a aplicação executando o comando "ng serve" – padrão Angular;

3. Depurar a aplicação seguindo o tutorial de como utilizar as Ferramentas para Desenvolvedores (DevTools) de acordo com o navegador que está sendo utilizado.
Exemplo para quem utiliza o Google Chrome: https://developer.chrome.com/docs/devtools/javascript?hl=pt-br
Exemplo para quem utiliza o Mozilla Firefox: https://firefox-source-docs.mozilla.org/devtools-user/
Obs: Este é um modelo de depuração padrão para aplicações web e cada navegador possui suas próprias características.

Neste modelo, algumas informações necessárias não são carregadas como, por exemplo, a autenticação do usuário para o uso das apis. Isso porque essas informações são atribuídas pelo protheus-lib-core somente quando executado dentro do Protheus. Deve-se analisar as informações necessárias de acordo com cada cenário.

Depurando pelo Protheus (webapp)

Para depurar o aplicativo pelo Protheus, é necessário gerar um build sem otimização.

Como fazer:

  1. Gerar o build sem otimização: "ng build --optimization=false --named-chunks=true --source-map=true". Estes são comandos padrão no Angular. Para consultá-los, clique aqui;
  2. Seguir os passos para compilar o .app;
  3. Abrir o app no Protheus;
  4. Depurar a aplicação seguindo o tutorial de como utilizar as Ferramentas para Desenvolvedores (DevTools) de acordo com o navegador que está sendo utilizado;
    Exemplo para quem utiliza o Google Chrome: https://developer.chrome.com/docs/devtools/javascript?hl=pt-br
    Exemplo para quem utiliza o Mozilla Firefox: https://firefox-source-docs.mozilla.org/devtools-user/
    Obs: Este é um modelo de depuração padrão para aplicações web e cada navegador possui suas próprias características.
  5. Para depurar, deve-se localizar a pasta que se encontra na app-root, referente ao aplicativo. Exemplo:

Neste exemplo, a pasta home_env_p12.1.2410 é a pasta referente ao aplicativo que está sendo depurado. Ao abrir, é possível visualizar seus fontes e depurá-los conforme necessidade.

Neste modelo, o aplicativo possui todas as informações necessárias que são atribuídas pelo protheus-lib-core, pois está sendo executado dentro do Protheus. Também não serão consumidas licenças REST, pois nele não é necessário informar nenhum servidor REST, o mesmo utilizará a porta multiprotocolo.