Arrêter le débogueur dans le navigateur Web lorsque la valeur de l'objet a changé

Question

J'ai un <input type="hidden">. J'ai besoin de voir quand ça change la valeur. J'ai beaucoup de fichiers JavaScript qui modifient sa valeur.

Je peux simplement aller partout où les valeurs sont modifiées et ajouter l'instruction debugger, mais cela prendra beaucoup de temps. Je l'ai appris Object.watch() mais il exécute une fonction spécifique après la valeur ont été changés, mais je veux voir où il changé dans le code, pas quand.

Existe-t-il un moyen d'y parvenir, peut-être en affichant le numéro de ligne et le nom de fichier JavaScript ou en arrêtant le débogueur dans le navigateur Web?

Answer 1

Les points de changement DOM ont été récupérés.

1. Passez à Éléments panneau de DevTools.
2. Recherchez l'élément dans le volet HTML.
3. Cliquez avec le bouton droit sur l'élément.
4. Sélectionner Rupture>Modifications d'attributs.

Si vous avez besoin pour afficher les modifications à la valeur de l'élément aussi, puis faites un clic droit sur le parent de l'élément et sélectionnez Subtree Modifications.

Answer 2

Le code suivant renvoie une erreur Cannot assign to read only property.. (avec trace de la pile) que vous pouvez prendre (ou vue dans les outils de dev):

'use strict'; 
var o = {a: 29}; 
throwOnChange(o, 'a'); 

// as much code as you like here.. 

o.a++; // this will throw an error 

function throwOnChange(obj, prop) { 
    Object.defineProperty(obj, prop, { 
    value: obj[prop], 
    writable: false 
    }); 
} 

Il suffit de l'utiliser sur votre input.value analogue.

Deux notes cependant:

1. Vous devez 'use strict' pour que cela fonctionne, il aurait simplement ignorer l'affectation.
2. S'il vous plaît voir Object.defineProperty()

Hope this helps.