web-dev-qa-db-fra.com

Est-il possible de modifier les valeurs des variables javascript lors du débogage dans Google Chrome?

Je débogue une application javascript (en utilisant Chrome dev tools)], et j'aimerais modifier certaines valeurs de variable tout en parcourant le code.

Est-ce possible?

J'ai essayé et obtenu quelque chose comme:

> modeline
1
> modeline=0
0             <<< seems to work but... 
> modeline
1             <<< ups!!

Mais je suis incapable de trouver une documentation qui indique ce qui peut ou ne peut pas être fait ...

javascriptdebugginggoogle-chrome
74
tato

Pourquoi cette réponse reçoit-elle toujours des votes positifs?

Per réponse de Mikaël Mayer , ce n'est plus un problème, et ma réponse est obsolète (go() retourne maintenant 30 Après avoir nettoyé la console). Ceci a été corrigé en juillet 2013, selon le rapport de bogue lié ci-dessus dans commentaire de gabrielmaldi . Cela me fait peur que je reçois toujours des votes positifs - cela me fait penser que le votant ne comprend ni la question ni ma réponse.

Je vais laisser ma réponse originale ici pour des raisons historiques, mais aller vers le haut réponse de Mikaël à la place .

L'astuce est que vous ne pouvez pas modifier directement une variable locale, mais vous pouvez modifier les propriétés d'un objet. Vous pouvez également modifier la valeur d'une variable globale:

var g_n = 0;
function go()
{
    var n = 0;
    var o = { n: 0 };
    return g_n + n + o.n;  // breakpoint here
}

console:

> g_n = 10
  10
> g_n
  10
> n = 10
  10
> n
  0
> o.n = 10
  10
> o.n
  10

Vérifiez le résultat de go() après avoir défini le point d'arrêt et exécuté ces appels dans la console. Vous constaterez que le résultat est 20 plutôt que 0 (mais malheureusement, pas 30).

39
gilly3

Ceci est maintenant possible dans chrome 35 (aujourd'hui, à compter du 11 juillet 2014). Je ne sais pas quelle version l'a permis en premier.

Je viens de tester @ gilly3 par exemple sur ma machine et ça marche.

  • Ouvrez la console, dans Sources et dans l'onglet Snippets, ajoutez un nouvel extrait, collez-y le code suivant:

    var g_n = 0; function go() { var n = 0; var o = { n: 0 }; return g_n + n + o.n; // breakpoint here }

  • Cliquez avec le bouton droit sur le nom de l'extrait de code, puis cliquez sur "Exécuter" (la fonction n'est toutefois pas activée).

  • Ajoutez le point d'arrêt à l'instruction return.
  • Dans la console ci-dessous, tapez go()
  • et changez les valeurs de variable comme démontré ci-dessous

function with local modification allowed.

et le résultat retourné g_n + n + o.n a 30 ans.

58
Mikaël Mayer

Ceci est un bogue reconnu dans Chrome Dev Tools:

http://code.google.com/p/chromium/issues/detail?id=124206

7
brianpeiris

Firebug semble vous permettre de le faire.

4
Bobo

Il semble que non.

Mettez un point d'arrêt, quand il arrête de basculer vers la console, essayez de définir la variable. Il ne commet pas d'erreur lorsque vous lui affectez une valeur différente, mais si vous la lisez après l'attribution, la valeur n'est pas modifiée. : - /

4
Vlad GURDIGA

Oui! Finalement! Je viens de l'essayer avec Chrome, version 66.0.3359.170 (Build officiel) (64 bits) sur Mac.

Vous pouvez modifier les valeurs dans les étendues comme dans la première image ou avec la console comme dans la deuxième image.

Chrome debugger change values

enter image description here

2
Tyler Collier

En fait, il existe une solution de contournement. Copiez la méthode entière, modifiez son nom, par exemple. originalName () à originalName2 () mais modifiez la variable à l'intérieur pour qu'elle prenne la valeur de votre choix, ou transmettez-la en tant que paramètre.

Ensuite, si vous appelez cette méthode directement à partir de la console, elle aura les mêmes fonctionnalités mais vous pourrez modifier les valeurs des variables.

Si la méthode est appelée automatiquement, tapez à la place dans la console

originalName = null;
function originalName(original params..)
{
    alert("modified internals");
    add whatever original code you want
}
2
mdubez

Je suis en mesure de modifier une valeur de variable de script par affectation dans la console. Semble le plus simple.

2
Jeff Lowery

Je ne sais pas pourquoi chrome n'autorise pas cette fonctionnalité idiote ... mais la seule façon de changer les valeurs de variable avec succès est de modifier le script directement dans le chrome éditeur sous l'onglet "Sources" (cela modifie le comportement de votre script jusqu'à ce que vous actualisiez la page), mais ces modifications seront perdues lors de l'actualisation, soyez donc prudent.

1
LeonardoX

J'avais le même problème, je suis allé à la rubrique "À propos de Google Chrome" -> Aide et il a été dit que je devais redémarrer mon navigateur pour obtenir les dernières mises à jour.

C'est ce que j'ai fait et, tout à coup, je peux maintenant modifier les variables locales. Cliquez simplement sur la variable que vous souhaitez modifier dans la fenêtre Variables de périmètre, puis entrez votre nouvelle valeur.

J'ai toutefois remarqué certaines bizarreries, que je devais enjamber certaines affectations de variables non liées avant de pouvoir modifier le texte dans la fenêtre de droite (variables de portée).

0
GilesDMiddleton