web-dev-qa-db-fra.com

comment déboguer le js dans jsfiddle

Je regarde ce jsfiddle: http://jsfiddle.net/carpasse/mcVfK/ Cela fonctionne bien ce n’est pas le problème, je veux juste savoir comment déboguer à travers le javascript. J'ai essayé d'utiliser la commande de débogage et je ne peux pas le trouver dans l'onglet sources? Aucune idée de comment je peux déboguer ceci?

du code du violon:

angular.module('app', ['appServices'])
    .config(['$routeProvider', function($routeProvider) {
        $routeProvider.
                when('/home', {templateUrl: 'home.html',   controller: HomeCtrl}).
                when('/list', {templateUrl: 'list.html',   controller: ListCtrl}).
                when('/detail/:itemId', {templateUrl: 'detail.html',   controller: DetailCtrl}).
                when('/settings', {templateUrl: 'settings.html',   controller: SettingsCtrl}).
                otherwise({redirectTo: '/home'});
}]);
87
Pindakaas

Le code JavaScript est exécuté à partir du dossier fiddle.jshell.net de l'onglet Sources de Chrome. Vous pouvez ajouter des points d'arrêt au fichier d'index présenté dans la capture d'écran de Chrome ci-dessous.

Debugging JSFiddle in Chrome

enter image description here

49
apandit

Utilisez l'instruction debugger; dans le code. Le navigateur insère un point d'arrêt dans cette instruction et vous pouvez continuer dans le débogueur du navigateur. 

Cela devrait fonctionner au moins en chrome et firefox. https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/debugger

angular.module('app', ['appServices'])
.config(['$routeProvider', function($routeProvider) {
    // *** Debugger invoked here
    debugger;
    $routeProvider.
            when('/home', {templateUrl: 'home.html',   controller: HomeCtrl}).
            when('/list', {templateUrl: 'list.html',   controller: ListCtrl}).
            when('/detail/:itemId', {templateUrl: 'detail.html',   controller: DetailCtrl}).
            when('/settings', {templateUrl: 'settings.html',   controller: SettingsCtrl}).
            otherwise({redirectTo: '/home'});
}]);
26
user3335908

Quelque chose mérite d'être mentionné. Si vous utilisez des outils de développement chrome. presse ctrl+shift+F et vous pouvez rechercher dans tous les fichiers de la source.

6
Oliver Orchard

En plus des autres réponses.

Très souvent, il est utile d'écrire les informations de débogage dans la console: 

console.log("debug information here");

La sortie est disponible dans la console des outils de développement des navigateurs. Comme s'il était enregistré depuis le code javascript habituel.
C'est assez simple et efficace.

3
Alexander Stepaniuk

Ajouter une instruction de débogage dans le code et activer les "Outils de développement" dans le bowser . Ensuite, lorsque vous exécutez le code dans JSFiddle, le débogueur sera lancé!.

0
P.Muralikrishna

Voici un autre endroit :)

Sous le noeud Jsfiddle.net.

 enter image description here

0
Sampath