Depurar suplementos com ferramentas de programador no Microsoft Edge Legado

Artigo
07/14/2024

Este artigo mostra como depurar o código do lado do cliente (JavaScript ou TypeScript) do seu suplemento quando o seu computador está a utilizar uma combinação de versões do Windows e do Office que utilizam o controlo webview do Edge original, EdgeHTML.

Para determinar que browser ou webview está a utilizar, consulte Browsers e controlos webview utilizados pelos Suplementos do Office.

Dica

Nas versões recentes do Office, uma forma de identificar o controlo webview que o Office está a utilizar é através do menu de personalidade em qualquer suplemento onde esteja disponível. (O menu de personalidade não é suportado no Outlook.) Abra o menu e selecione Informações de Segurança. Na caixa de diálogo Informações de Segurança no Windows, o Runtime reporta o Microsoft Edge, o Microsoft Edge Legado ou o Internet Explorer. O runtime não está incluído na caixa de diálogo em versões mais antigas do Office.

Observação

Para instalar uma versão do Office que utiliza a webview legada do Edge ou para forçar a sua versão atual do Office a utilizar o Edge Legado, consulte Mudar para a WebView legada do Edge.

Depurar um suplemento do painel de tarefas com a Pré-visualização do Microsoft Edge DevTools

Instale a Pré-visualização do Microsoft Edge DevTools. (A palavra "Pré-visualização" está no nome por motivos históricos. Não existe uma versão mais recente.)

Observação

Se o suplemento tiver um comando de suplemento que executa uma função, a função é executada num processo de runtime do browser oculto ao qual as DevTools do Microsoft Edge não conseguem detetar ou anexar, pelo que a técnica descrita neste artigo não pode ser utilizada para depurar código na função.
Faça sideload e execute o suplemento.
Execute o Microsoft Edge DevTools.
Nas ferramentas, abra a guia Local. Seu suplemento será listado por nome. (Apenas os processos em execução no EdgeHTML são apresentados no separador. A ferramenta não pode anexar a processos em execução noutros browsers ou webviews, incluindo o Microsoft Edge (WebView2) e o Internet Explorer (Trident).)
Selecione o nome do suplemento para o abrir nas ferramentas.
Abra a guia Depurador.
Abra o ficheiro que pretende depurar com os seguintes passos.
1. Na barra de tarefas do depurador, selecione Mostrar localizar em ficheiros. Esta ação irá abrir uma janela de pesquisa.
2. Introduza uma linha de código do ficheiro que pretende depurar na caixa de pesquisa. Deve ser algo que não é provável que esteja em qualquer outro ficheiro.
3. Selecione o botão atualizar.
4. Nos resultados da pesquisa, selecione a linha para abrir o ficheiro de código no painel acima dos resultados da pesquisa.
Para definir um ponto de interrupção, selecione a linha no ficheiro de código. O ponto de interrupção está registado no painel Pilha de chamadas (canto inferior direito). Também pode existir um ponto vermelho pela linha no ficheiro de código, mas isto não é apresentado de forma fiável.
Execute funções no suplemento conforme necessário para disparar o ponto de interrupção.

Dica

Para obter mais informações sobre como utilizar as ferramentas, consulte Ferramentas de Programação do Microsoft Edge (EdgeHTML).

Depurar uma caixa de diálogo num suplemento

Se o seu suplemento utilizar a API de Caixa de Diálogo do Office, a caixa de diálogo é executada num processo separado do painel de tarefas (se existir) e as ferramentas têm de ser anexadas a esse processo. Siga estas etapas.

Execute o suplemento e as ferramentas.
Abra a caixa de diálogo e, em seguida, selecione o botão Atualizar nas ferramentas. O processo de caixa de diálogo é apresentado. O nome é proveniente do <title> elemento no ficheiro HTML que está aberto na caixa de diálogo.
Selecione o processo para o abrir e depurar, tal como descrito na secção Depurar um suplemento do painel de tarefas com a Pré-visualização do Microsoft Edge DevTools.

Mudar para o Edge Legacy Webview

Existem duas formas de mudar o Edge Legacy Webview. Pode executar um comando simples numa linha de comandos ou pode instalar uma versão do Office que utiliza o Edge Legado por predefinição. Recomendamos o primeiro método. No entanto, deve utilizar o segundo nos seguintes cenários.

O seu projeto foi desenvolvido com o Visual Studio e o IIS. Não se baseia Node.js.
Quer ser absolutamente robusto nos seus testes.
Se, por algum motivo, a ferramenta de linha de comandos não funcionar.

Alternar através da linha de comandos

Se o seu projeto for baseado em Node.js (ou seja, não for desenvolvido com o Visual Studio e o servidor de Informação Internet (IIS)), pode forçar o Office no Windows a utilizar o controlo webview edgeHTML fornecido pelo Edge Legado ou o controlo de webview Trident fornecido pelo Internet Explorer para executar suplementos, mesmo que tenha uma combinação de versões do Windows e do Office que normalmente utilizaria uma descrição Web mais recente. Para obter mais informações sobre que browsers e webviews são utilizados por várias combinações de versões do Windows e do Office, consulte Browsers e controlos webview utilizados pelos Suplementos do Office.

Observação

A ferramenta utilizada para forçar a alteração no Webview só é suportada no canal de subscrição Beta do Microsoft 365. Adira ao programa Microsoft 365 Insider e selecione a opção Canal Beta para aceder às compilações do Office Beta. Consulte também Acerca do Office: Que versão do Office estou a utilizar?.

Estritamente, é a webview mudança desta ferramenta (consulte o Passo 2) que requer o canal Beta. A ferramenta tem outros comutadores que não têm este requisito.

Se o seu projeto não tiver sido criado com a ferramenta Gerador Yeoman para Suplementos do Office , tem de instalar a ferramenta office-addin-dev-settings. Execute o seguinte comando numa linha de comandos.
```
npm install office-addin-dev-settings --save-dev
```
Importante

A ferramenta office-addin-dev-settings não é suportada no Mac.
Especifique o webview que pretende que o Office utilize com o seguinte comando numa linha de comandos na raiz do projeto. Substitua <path-to-manifest> pelo caminho relativo, que é apenas o nome do ficheiro de manifesto se estiver na raiz do projeto. Substitua por <webview> ou edge-legacyie . Tenha em atenção que as opções têm o nome dos browsers nos quais as webviews tiveram origem. A ie opção significa "Trident" e a opção edge-legacy significa "EdgeHTML".
```
npx office-addin-dev-settings webview <path-to-manifest> <webview>
```
Eis alguns exemplos.
```
npx office-addin-dev-settings webview manifest.xml ie
```
```
npx office-addin-dev-settings webview manifest.json edge-legacy
```
Deverá ver uma mensagem na linha de comandos a indicar que o tipo de webview está agora definido como IE (ou Edge Legado).
Quando tiver terminado, defina o Office para retomar a utilização da vista Web predefinida para a sua combinação de versões do Windows e do Office com o seguinte comando.
```
npx office-addin-dev-settings webview <path-to-manifest> default
```

Instalar uma versão do Office que utiliza o Edge Legado

Utilize o procedimento seguinte para instalar uma versão do Office (transferida a partir de uma subscrição do Microsoft 365) que utiliza o Microsoft Edge Legacy Webview (EdgeHTML) para executar suplementos ou uma versão que utiliza o Internet Explorer (Trident).

Em qualquer aplicação do Office, abra o separador Ficheiro no friso e, em seguida, selecione Conta ou Contado Office. Selecione o botão Acerca do nome do anfitrião (por exemplo, Acerca do Word).
Na caixa de diálogo que é aberta, localize o número de compilação xx.x.xxxxx.xxxxx completo e faça uma cópia do mesmo algures.
Baixar a Ferramenta de Implantação do Office.
Execute o ficheiro transferido para extrair a ferramenta. É-lhe pedido para escolher onde instalar a ferramenta.

Na pasta onde instalou a ferramenta (onde se encontra o setup.exe ficheiro), crie um ficheiro de texto com o nome config.xml e adicione os seguintes conteúdos.

<Configuration>
  <Add OfficeClientEdition="64" Channel="SemiAnnual" Version="16.0.xxxxx.xxxxx">
    <Product ID="O365ProPlusRetail">
      <Language ID="en-us" />
    </Product>
  </Add>
</Configuration>

Altere o Version valor.
- Para instalar uma versão que utiliza o EdgeHTML, altere-a para 16.0.11929.20946.
- Para instalar uma versão que utiliza o Trident, altere-a para 16.0.10730.20348.
Opcionalmente, altere o valor de OfficeClientEdition para "32" para instalar o Office de 32 bits e altere o valor conforme necessário para instalar o Language ID Office num idioma diferente.
Abra uma linha de comandos como administrador.
Navegue para a pasta com os setup.exe ficheiros e config.xml .
Execute o seguinte comando:
```
setup.exe /configure config.xml
```
Este comando instala o Office. Esse processo pode demorar alguns minutos.
Limpe a cache do Office.

Importante

Após a instalação, certifique-se de que desativa a atualização automática do Office, para que o Office não seja atualizado para uma versão que não utilize a vista Web com a qual pretende trabalhar antes de concluir a sua utilização. Isto pode ocorrer a poucos minutos da instalação. Siga estas etapas.

Inicie uma aplicação do Office e abra um novo documento.
Abra o separador Ficheiro no friso e, em seguida, selecione Conta do Office ou Conta.
Na coluna Informações do Produto , selecione Opções de Atualização e, em seguida, selecione Desativar Atualizações. Se essa opção não estiver disponível, o Office já está configurado para não atualizar automaticamente.

Quando terminar de utilizar a versão antiga do Office, reinstale a sua versão mais recente ao editar o config.xml ficheiro e ao alterar o Version para o número de compilação que copiou anteriormente. Em seguida, repita o setup.exe /configure config.xml comando numa linha de comandos de administrador. Opcionalmente, reativar as atualizações automáticas.

Compartilhar via