Google Chrome Dev Tools may fool you!

To my extreme surprise I have found that in some certain situations Google Chrome Dev Tools (and probably all others, as they seem to share the same or similar engine) may fool you and show you something a bit different than the real source code of your page is!

As an example, take this case. Real source code (Ctrl+U) contained correctly closed <img /> tag:

<img src="/page/htdocs/images/checkmark-caribbean.png" alt="Alt text" width="16" height="16" />

While Chrome Dev Tools (Ctrl+Shift+C) showed something like this:

<img src="/page/htdocs/images/checkmark-caribbean.png" alt="Alt text" width="16" height="16"/>

As I was informed here (actually, as someone reminded me something, that I knew and should remember! :]), HTML5 does not require you to close single tags. So, this is not a big deal.

But, even so… What could be the purpose of changing real source code in dev tools? I don’t know…