Entrez vos identifiants

x
OU
Vous avez oublié votre mot de passe ?
Utilisateur wiki : vous n'aviez pas d'email ?

Korben - Site d'actualité geek et tech

Go Top

Holmes – La CSS qui debug sec !

Holmes – La CSS qui debug sec !

Voici le dernier truc qui m'a fait halluciner. Il s'agit d'un debugger HTML5 réalisé entièrement en CSS3. Oui, c'est zarbi, mais ça fonctionne... Pour l'utiliser, il suffit d'appeler la feuille de style holmes.css (Surement en hommage au debugger Dr Watson, à moins que ce ne soit un hommage à Katie... va savoir...) dans vos pages et d'ajouter la class "holmes-debug" aux tags que vous voulez analyser (par exemple la balise <BODY> ou <HTML>).

<body class="holmes-debug">

Une fois cela fait, Holmes se chargera de surligner en rouge les erreurs, en jaunes les avertissements et en gris les styles périmés. Holmes sait reconnaitre les attributs obligatoires, mais manquants sur les tags ainsi que les éléments non-W3C ou qui ne sont plus supportés. Une manière simple et très visuelle de débugguer votre code HTML avant la mise en prod.

Holmes est compatible avec

  • Google Chrome 10+
  • Safari 5+
  • Opera 10+
  • Firefox 3.5+

Et apparemment avec IE9 (je n’ai pas testé), mais par contre, ça ne fonctionne pas avec IE8.

Holmes est téléchargeable ici


Facebook Twitter Email Copier Url

13 Responses to “Holmes – La CSS qui debug sec !”

  1. Yanntech dit :

    Sympa !

  2. frinux dit :

    Sympa, effectivement. Par contre à utiliser quand on écrit du code au fur et à mesure, car il n’y as pas vraiment moyen de savoir ce qui cloche quand c’est entouré.

  3. Ooo dit :

    si tu mets le curseur dessus ça devrait afficher un message. Chez moi ça fait ça.

  4. mart-e dit :

    Waw! Pas sûr que ce soit la méthode la plus efficace pour faire ça mais j’admire l’exploit.

  5. JCDusse1981 dit :

     James ?

    —>[]²

  6. Fanny dit :

    Jack ?

    –>[]³

  7. Cyril B. dit :

    Pas mal mais le problème c’est que si vous avez des erreurs dans des erreurs, impossible de toutes les voir.

  8. Daikyoka dit :

     C’est pas si bizarre car il utilise les sélecteur pour repérer les attributs présents ou manquants. Comme c’est du CSS3 il n’est pas compatible avec les navigateurs qui ne respectent pas le CSS3.
    C’est très intelligent et très ingénieux. :)

  9. Pour l’idée technique, bravo. Mais en pratique, holmes ne peut pas indiquer l’erreur en question ou proposer de corrections automatiques. Si on dispose d’un bon IDE avec validation HTML/CSS/JS à la saisie, aucun problème. Je conseille personnellement JetBrains WebStorm.

  10. Campion Kevin dit :

    C’est moche “la” CSS. On dit “du” CSS ou “le”. C’est comme “la” wifi, berk !!

  11. Tom Panier dit :

    Ça doit venir du fait qu’on dit *une* feuille de style en français… mais +1, c’est moche x)

  12. 7am dit :

    J’étais tombé dessus. Perso, je préfère l’utilisation du bookmarklet qu’on peut trouver ici : 
    http://www.red-root.com/sandbox/holmes/
    Je trouve ça plus pratique que d’ajouter une class=”holmes-debug”

La menace des failles 0-Day

capture-vjhj

"En avril 2014, les chercheurs en sécurité de Google sont tombé sur une vulnérabilité présente à l’intérieur de la bibliothèque cryptographique OpenSSL. Petit problème, OpenSSL est utilisé sur les 2/3 des sites web qui utilisent HTTPS mais aussi par les téléphones Android. Heartbleed était né."

Si comme moi vous êtes un passionné de sécurité informatique et que vous vous demandez qu'est-ce qu'un truc comme Heartbleed peut causer comme dommages, la lecture de cet article sur les failles 0-Day est pour vous...et je vous rassure je ne parle pas du dernier film Blackhat récemment vu au ciné ;)

Lire la suite

Vous avez aimé cet article ? Alors partagez-le avec vos amis en cliquant sur les boutons ci-dessous :

Twitter Facebook Google Plus Linkedin email
Rejoignez les 55272 korbenautes
et réveillez le bidouilleur qui est en vous
abonnez-vous en savoir plus
"Vous aimez bidouiller ?" Oui j'adore l'informatique et la technologie
Suivez Korben Un jour ça vous sauvera la vie.. Ou celle d'un(e) ami(e)
  • Rejoignez les 55271 bidouilleurs de la grande famille des Korbenautes
    «Je considère que votre email est aussi important que le mien.»
    Korben
  • Univers Populaires

  • Site hébergé par
    Agarik Sponsor Korben
  • Vidéos

  • DANS TON CHAT (BASHFR)

    <TaskFreaker> salut Aldebran
    <Aldebran> Salut !
    <TaskFreaker> qu'est ce qui t'amène ici ?
    <Aldebran> j'ai fait une faute de frappe

    -- http://danstonchat.com/3232.html
  • Une astuce pour rendre

    Windows 10 plus rapide

    Si vous trouvez que Windows 10 est un peu lent, que vos applications ne se lancent pas très vite, que vos compilations prennent du temps, voici une petite astuce débusquée par Brominou pour accélérer le bouzin. Cliquez dans la zone de recherche de la barre Windows et tapez le mot clé...lire la suite

    Cryptool pour s'initier à la cryptographie

    Alors attention, ce n'est pas nouveau, mais je me suis dit que ce serait intéressant de vous en parler si vous ne connaissez pas encore. Cryptool est un logiciel open source éducatif qui va vous permettre de comprendre les principes de base de la cryptographie. Dans sa version 2, Cryptool intègre...lire la suite

    En ce moment dans l'univers "Windows"

    Voir tous les articles »