Débogueur de type Firebug pour Google Chrome

Y a-t-il quelque chose comme Firebug que vous pouvez utiliser dans Google Chrome?

Fonctionnalités essentielles que j'aimerais:

• Inspecter la source HTML (sélectionner des éléments, les supprimer, etc.)
• vérifier les valeurs CSS (la solution intégrée est bizarre, en quelque sorte)

Il existe un outil de type Firebug déjà intégré à Chrome. Faites un clic droit n'importe où sur une page et choisissez "Inspecter l'élément" dans le menu. Chrome a un outil graphique pour le débogage (comme dans Firebug), vous pouvez donc déboguer JavaScript. Il fait également bien l'inspection CSS et peut même changer le rendu CSS à la volée.

Pour plus d'informations, voir https://developers.google.com/chrome-developer-tools/

Firebug Lite prend en charge l'inspection des éléments HTML, du style CSS calculé et bien plus encore. Puisqu'il s'agit de JavaScript pur, il fonctionne dans de nombreux navigateurs différents. Il vous suffit d'inclure le script dans votre source ou d'ajouter le bookmarklet à votre barre de signets pour l'inclure sur n'importe quelle page en un seul clic.

http://getfirebug.com/lite.html

Ajout de quelques points de discussion en tant que personne qui utilise Firebug / Chrome Inspector tous les jours:

1. Au moment de la rédaction, il n'y a que l'inspecteur DOM de Google et non, il n'a pas toutes les fonctionnalités de Firebug

2. Inspector est une version «allégée» de Firebug: l'interface n'est pas aussi bonne IMO, l'inspection des éléments dans les deux versions récentes est maintenant maladroite, mais Firebug est encore mieux; Je me retrouve à essayer de trouver l'amour pour Chrome (car c'est une expérience de navigateur meilleure et plus rapide), mais pour le travail de développement, ça craint toujours pour moi.

3. La prévisualisation / modification en direct de DOM / CSS est encore bien meilleure dans Firebug; Le CSS calculé et la vue du modèle de boîte sont meilleurs dans Firebug;

4. D'une manière ou d'une autre, il est juste plus facile de lire / utiliser Firebug peut-être à cause de la facilité de navigation, de manipulation / modification du document dans plusieurs domaines clés? Qui sait. Je suis habitué à l'interface et je pense que Chrome Inspector n'est pas aussi bon, bien que ce soit une chose subjective que j'admets.

5. L'onglet Cookies / Net me sont extrêmement utiles dans Firebug. Peut-être que Chrome Inspector l'a maintenant? La dernière fois, je ne l'ai pas vérifié, car Chrome se met à jour en arrière-plan sans votre intervention (obtient votre consentement par défaut comme tous les bons suzerains).

6. Dernier point: le jour où Google Chrome obtient un Firebug complet, Firefox meurt pour les développeurs car Firefox avait 3 ans pour rendre le moteur de mise en page de Gecko aussi rapide que WebKit et ils ne l'ont pas fait. Désolé de le dire sans ambages mais c'est la vérité.

Vous voyez, maintenant tout le monde veut s'éloigner de Flash au lieu de jQuery motivé par l'accessibilité mobile et l'interactivité (iPhone, iPad, Android) et JavaScript est `` soudainement '' un gros problème (c'est du sarcasme), de sorte que le navire a navigué, Firefox. Et cela me rend triste, en tant que fan de Mozilla. Chrome est simplement un meilleur navigateur jusqu'à ce que Firefox mette à jour son moteur JavaScript.

F12

J'aime les raccourcis

Essayez ceci, il s'appelle Firebug Lite et fonctionne apparemment avec la version bêta de Chrome.

Vous pouvez également le trouver sur: https://chrome.google.com/extensions/

Vous pouvez définir ce bookmarklet dans votre "Bookmarks Bar" afin que Firebug lite soit toujours disponible dans le navigateur Chrome / Chromium (mettez ceci comme URL):

javascript:var firebug=document.createElement('script');firebug.setAttribute('src','http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js');document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);

Ou essayez les scripts utilisateur: http://dev.chromium.org/developers/design-documents/user-scripts

jQuerify est l'extension parfaite pour intégrer jQuery dans la console Chrome et est aussi simple que vous pouvez l'imaginer. Cette extension indique également si jQuery a déjà été intégré dans une page.

Cette extension est utilisée pour intégrer jQuery dans n'importe quelle page de votre choix. Il permet d'utiliser jQuery dans le shell de la console (vous pouvez invoquer la console Chrome par Ctrl+ Shift+ j".).

Pour intégrer jQuery dans l'onglet sélectionné, cliquez sur le bouton d'extension.

L'extension officielle Firebug Chrome ou vous pouvez télécharger et empaqueter l'extension vous-même.

https://getfirebug.com/releases/lite/chrome/

Eh bien, il est possible d'activer les scripts Greasemonkey pour Google Chrome, alors peut-être existe-t-il un moyen d'installer Firebug en utilisant cette méthode? Firebug Lite fonctionnerait également, mais ce n'est tout simplement pas la même sensation que d'utiliser la version complète :(

willshouse.com/2009/05/29/install-greasemonkey-for-chrome-a-better-guide/

Cela ne répond pas à votre question mais, au cas où vous l'auriez manqué, le développeur Web de Chris Pederick est désormais disponible pour Chrome: https://chrome.google.com/extensions/detail/bfbameneiokkgbdmiekhjnmfkcnldhhm .

Oubliez tout ce dont vous avez tous besoin, inspecteur indépendant du navigateur, mise à jour dom

https://goggles.webmaker.org/en-US

il suffit de mettre en signet et d'aller à n'importe quelle page Web et de cliquer sur ce signet ..

il s'agit en fait de lunettes Mozilla project, amazing amazing amazing ...

F12 (uniquement sous Linux et Windows)

OU

Ctrl ⇧ I

( ⌥ ⌘ Isi vous êtes sur Mac)

Veuillez essayer Firebug Lite pour Google Chrome

Si vous utilisez Chromium sur Ubuntu en utilisant le ppa nocturne, vous devriez avoir le chromium-browser-inspector