

JavaScript tool that validates your HTML and warns you in the web console - bootslebaron
https://github.com/philipwalton/html-inspector/

======
macobo
Link to a CDN in your README, so your users can test the tool more easily.

~~~
bootslebaron
It's not my tool, but do you know about rawgithub.com? Just use the Github
version if all you're doing is testing.

[https://rawgithub.com/philipwalton/html-
inspector/master/dis...](https://rawgithub.com/philipwalton/html-
inspector/master/dist/html-inspector.js)

~~~
kmf
I wouldn't encourage this, even for testing. Github isn't built to be a CDN --
it's not super performant.

[http://stackoverflow.com/questions/5502540/should-github-
be-...](http://stackoverflow.com/questions/5502540/should-github-be-used-as-a-
cdn-for-javascript-libraries)

~~~
wldlyinaccurate
rawgithub.com is not raw.github.com. You can read about it on the homepage:
[http://rawgithub.com/](http://rawgithub.com/)

------
suyash
Browser's web inspectors need to integrate this tool.

~~~
wallio
Yes - it seems strange that this has not already been integrated into Google
DevTools which I generally use. Perhaps there is a similar Chrome extension or
Firebug add-in but have not see it.

Not the same thing but there is already a jslint Chrome extension <1> and a
proposal to add jshint to DevTools itself <2>.

<1> [https://chrome.google.com/webstore/detail/jslint-for-
google-...](https://chrome.google.com/webstore/detail/jslint-for-google-
chrome/jllekaioicnhoinolncnmofahonmmaio)

<2> [https://groups.google.com/forum/#!topic/google-chrome-
develo...](https://groups.google.com/forum/#!topic/google-chrome-developer-
tools/_tYVsIoLlG4)

~~~
suyash
Safari Web inspector is open source now, someone can integrate and submit a
patch for it as well. I prefer Safari over Chrome.

------
kevingadd
Can you actually validate HTML from user mode javascript? Isn't the HTML that
you can access from JS the result of the browser's parser doing various things
to 'fix up' mangled/incorrect HTML, and map the HTML to the actual object
model (tbody elements, for example)?

~~~
philipwalton
Yes, you are correct. It's impossible to validate HTML from DOM traversal
alone because the browser has already parsed it and forgiven any errors it was
able to. (I didn't choose this title and agree that it's a little misleading.)

Technically, you _could_ validate the markup if you did an AJAX request for
the current URL and parsed the result yourself; however, if your app is
generated dynamically and rendered primarily client side, you'd be missing a
lot of the alterations done by your JavaScript in that validation.

This is why I think both tools have their place.

I try address this issue in my blog post introducing HTML Inspector under the
section "How is HTML Inspector different than the W3C Validator?"
[http://philipwalton.com/articles/introducing-html-
inspector/](http://philipwalton.com/articles/introducing-html-inspector/)

~~~
kevingadd
Makes sense! Being able to detect a subset of errors in dynamic HTML is a nice
feature, even if you have to rely on a static validator like the W3's for
syntax errors.

