web-dev-qa-db-fra.com

Configuration du débogage à distance avec PhantomJS

J'essaie de configurer le débogage à distance avec PhantomJS, sans trop de chance. Je suis les instructions sur https://github.com/ariya/phantomjs/wiki/Troubleshooting . J'ai un petit programme nommé debug.js:

var system  = require('system' ), fs = require('fs'), webpage = require('webpage');

(function(phantom){
    var page=webpage.create();

    function debugPage(){
        console.log("Refresh a second debugger-port page and open a second webkit inspector for the target page.");
        console.log("Letting this page continue will then trigger a break in the target page.");
        debugger; // pause here in first web browser tab for steps 5 & 6
        page.open(system.args[1]);
        page.evaluateAsync(function() {
            debugger; // step 7 will wait here in the second web browser tab
        });
    }
    debugPage();
}(phantom));

Maintenant, je lance cela à partir de la ligne de commande:

$ phantomjs --remote-debugger-port=9001 --remote-debugger-autorun=yes debug.js my.xhtml

Les messages console.log Sont maintenant affichés dans la fenêtre Shell. J'ouvre une page de navigateur pour localhost:9001. C'est à ce stade que la documentation indique "obtenir le premier inspecteur Web pour le contexte fantôme". Cependant, je ne vois qu'une seule entrée pour about:blank. Lorsque je clique dessus, j'obtiens un inspecteur pour les non pertinents sur: page blanche, avec l'URL http://localhost:9001/webkit/inspector/inspector.html?page=1. La documentation parle de l'exécution de __run(), mais je n'arrive pas à accéder à la page où je ferais cela; about:html Semble continuer une __run() qui est un no-op.

FWIW, j'utilise PhantomJS 1.9.1 sous W8.

Qu'est-ce que je rate?

35
user663031

La documentation dit:

Pour exécuter votre script, entrez simplement la commande __run () dans la console Web Inspector.

__run() n'est pas un no-op mais juste un wrapper pour votre script. Vous devez d'abord sélectionner l'onglet Console, puis entrer __run() dans la fenêtre de commande. Si vous connaissez Chrome, c'est à peu près la même chose que pour les développeurs.

debug console

23
Cybermaxs

Pour déboguer un script, lancez phantomjs comme ceci:

phantomjs --remote-debugger-port=9000 hello.js

Voici un script de test super simple qui fonctionne (hello.js). Notez que vous devez mettre debugger; En haut de votre script, ou n'importe où dans votre script que vous souhaitez introduire dans le débogueur.

hello.js

debugger;

for (var i=0; i < 5; i++)
{
  console.log('debugging in phantom js:' + i);
}

phantom.exit();

Maintenant, chargez simplement l'URL suivante dans votre navigateur:

http://127.0.0.1:9000/

Ensuite, vous verrez un lien répertorié dans la page du navigateur

about:blank

Cliquez dessus, puis vous verrez une page entière qui ressemble à l'inspecteur Chrome. Cliquez sur le bouton "Console" dans la barre d'outils qui se trouve sur cette page (pas la console de Chrome ou Safari que vous avez l'habitude d'utiliser).

Maintenant, dans cette console, tapez __run() et appuyez sur Entrée. Votre script s'affichera et commencera le débogage!

21
Brad Parks

J'ai eu des problèmes pour que le débogage fonctionne sur Mac en utilisant Chrome Version 57.0.2987.133 (64 bits). J'ai eu le débogueur pour qu'il s'ouvre sur localhost: 9000 (127.0.0.1.19000 ne fonctionnait pas) pour moi) mais après avoir entré __run () (oui, avec un double soulignement), il n'y a pas eu de réponse. Je pouvais voir d'autres fichiers js sous Sources, le mien était répertorié mais était vide. (J'ai activé le débogage dans Chrome)

J'ai essayé la même chose en safari et tout a fonctionné comme annoncé.

MISE À JOUR pour Chrome: (de Thiago Fernandes ci-dessous): Apparemment, le problème est dû au Chrome n'acceptant pas la touche Entrée, donc la solution consiste à évaluer cette fonction à l'intérieur chrome console, pour faire fonctionner enterKey:

function isEnterKey(event) { return (event.keyCode !== 229 && event.keyIdentifier === "Enter") || event.keyCode === 13; } 
10
Astra Bear

Dans mon cas, la __run() ne serait pas exécutée dans la console. Si c'est le même problème que vous, lisez la suite ....

Ouvrez PowerShell et exécutez le script:

cls
# we go to the folder where our test.js script resides
cd "C:\Users\xxx\Phantomjs.Console"
phantomjs --remote-debugger-port=9000 --remote-debugger-autorun=yes test.js 
  1. Ouvrez votre navigateur Chrome et accédez à
  2. http: // localhost: 90
  3. Cliquez sur votre fichier, dans mon cas test.js.
  4. Passez à l'onglet Sources!
  5. Exécutez __run() sous Watch Expressions !

Mettez une instruction debugger dans votre script pour le débogage!

enter image description here

3
Legends