Desativar o modo headless
Às vezes, é útil ver o que o navegador está exibindo. Em vez de
iniciar no modo headless, inicie uma versão completa do navegador usando
headless: false
:
const browser = await puppeteer.launch({ headless: false });
Desacelerar
A opção slowMo
reduz a velocidade das operações do Puppeteer no valor especificado de
milissegundos. É outra forma de saber o que está acontecendo.
const browser = await puppeteer.launch({
headless: false,
slowMo: 250, // slow down by 250ms
});
Capturar saída do console
É possível detectar o evento console
. Isso também é útil ao depurar o código
em page.evaluate()
:
page.on('console', (msg) => console.log('PAGE LOG:', msg.text()));
await page.evaluate(() => console.log(`url is ${location.href}`));
Usar o depurador no navegador de código do aplicativo
Há dois contextos de execução: o node.js que está executando o código de teste e o navegador executando o código do aplicativo que está sendo testado. Isso permite depurar o código no
navegador de código do aplicativo, o código dentro de evaluate()
.
Usar {devtools: true}
ao iniciar o Puppeteer
const browser = await puppeteer.launch({ devtools: true });
Alterar o tempo limite padrão do teste
- jest::
jest.setTimeout(100000);
- jasmim:
jasmine.DEFAULT_TIMEOUT_INTERVAL = 100000;
- mocha:
this.timeout(100000);
. Não se esqueça de mudar o teste para usar a função, e não '=>'
Adicione uma instrução de avaliação com o depurador dentro ou adicione o depurador a uma instrução de avaliação:
await page.evaluate(() => {
debugger;
});
Em seguida, o teste para a execução na instrução de avaliação acima, e o Chromium para no modo de depuração.
Usar o depurador no node.js
Isso permite depurar o código de teste. Por exemplo, é possível ignorar await page.click()
no script node.js e ver o clique acontecer no navegador do código do aplicativo.
Não é possível executar await page.click()
no console do DevTools devido ao
bug 833928 do Chromium (link em inglês).
Portanto, se quiser testar algo, é preciso adicioná-lo ao arquivo de teste.
- Adicione o depurador ao teste, por exemplo:
javascript debugger; await page.click('a[target=_blank]');
- Defina headless como "false".
- Execute o nó
--inspect-brk
, por exemplo,node --inspect-brk node_modules/.bin/jest tests
. - No Chrome, abra
chrome://inspect/#devices
e clique eminspect
. - No navegador de teste recém-aberto, digite
F8
para retomar a execução do teste. - Agora o depurador está pronto e você pode depurar no navegador de teste
Ativar o registro detalhado
O tráfego de protocolo interno do DevTools é registrado com o módulo de depuração no namespace do Puppeteer.
# Basic verbose logging
env DEBUG="puppeteer:*" node script.js
# Protocol traffic can be rather noisy. This example filters out all Network
# domain messages
env DEBUG="puppeteer:*" env DEBUG_COLORS=true node script.js 2>&1 | grep -v '"Network'
Depurar o código do Puppeteer (nó)
Use ndb:
npm install -g ndb
(ou use npx).- Adicione um depurador ao código do Puppeteer (nó).
- Adicione
ndb
(ounpx ndb
) antes do comando de teste. Por exemplo:ndb jest
oundb mocha
(ounpx ndb jest
/npx ndb mocha
). - depure seu teste dentro do Chromium sem parar!