ASP.NET Hosting

HTML reformatting and Visual Studio: it's a feature!

This is a followup to my post on the automatic reformatting of HTML/ASPX that happens in VS 2005. You'll be happy to learn that although it looks like it, it's not a bug at all but a feature...
At first, when you witness automatic reformatting like this, it feels like something bad happens (again). But thanks to Barry Tang and Scott Guthrie from the ASP.NET team, I'll be able to explain you why this happens. Let me try to summarize the rationale behind this...

What was happening in my case was that <li> tags that I had on distinct lines were all of a sudden all on one line after me changing something in the Design view and switching back to the Source view.
For example, when I had something like this:

<ul>
  <li>aaa</li>
  <li>bbb</li>
</ul>


it could become something like this after adding a letter:

<ul>
  <li>aaa z</li><li>bbb</li>
</ul>


The reason for this is that VS 2005 tries not to reformat your code, but it doesn’t want to change your page rendering as well. In this case, not reformatting the HTML source would change the rendering of the page in Internet Explorer (not in Firefox though). This is due to the importance of whitespaces in HTML.

In most cases, whitespaces are very important. Let's take another example. Let's say you have the following markup in source view:

<html>
  <body>
    <input />
    <input />
  </body>
</html>


If you go to Design view, you will see a whitespace between the two inputs. Now, try removing the whitespace between them and go back to Source view. In this case, if VS preserves the newline between the two inputs when we switch back to Source view, it will put the whitespace between the two inputs right back and that would just undo what you did in design view. That’s why whitespace rules take precedence over formatting.

Something that may be confusing though is the opposite case. If you have this in source:

<html>
  <body>
    <input /><input />
  </body>
</html>


Then switch to design, then add a space between the two inputs, then switch back to source, what do you get?

<html>
  <body>
    <input />
    <input />
  </body>
</html>


Why is this happening? This is due to another rule: the default behavior for "empty" tags is to have a line-break before and a line-break after. You can see this or change it in "Tools | Text Editor | HTML | Format | Tag Specific Options".
When you know why it happens, there is no problem. But when you don't, which is highly probable when you first work with VS 2005, you have to admit that it's funny to see that when you expect to have your tags on separate lines you end up having them on one single line, and when you expect to have them on one single line, then end up on several lines!

I hope this explaination helps you to undertand why we can see some reformatting happen. I'm sure that for everyone who see this at work without this kind of explaination will think it a bug. But it's not, it's actually a useful feature. It's just that it's not an obvious one.
The thing you have to keep in mind is that ASP.NET and Visual Studio teams think that it is more important to preserve rendering. And I agree with them.

8 Comments

  • Ok, good to know that this isn't a bug. So far I have found the new HTML source code editor to be a fantastic improvement over VS.Net 2003's. No more white spaces where there shouldn't be. And now I can have my source code look pretty. Before I turned off all auto-formatting when switching between design and source modes.

  • Your explanation makes sense; their implementation doesn't. It's not hard to remember that a white space between tags collapses. If you add something between tags, white space is preserved. Knowing that you are free to choose whether you want to put tags on one line or separate lines. Forcing formatting just to preserve rendering for IE is just plain wrong.



    Thanks for the tip. I'll try to put together some samples on my end to play with.

  • So I'm counfused. Can we finally shut formatting off totally in 2005. Will the editor finally obey the option to stop reformating HTML???

  • I don't know. It seems to me like it's one of the numerous bugs that never got fixed in Internet Explorer. IE seems to insert extra whitespaces when dealing with LI tags, something that doesn't seem required otherwise.

    The only thing I know is that the behavior we can see in VS2005 with LI tags is here because of IE.

  • When I first saw the title of this blog entry I naturally assumed it was one of those classic MS "It's not a bug; it's a feature! *wink* *wink*" rants.

    What a disappointment to find out you are sincere!

    I hate to kill the messenger by mucking up your blog with a bunch of (righteous) anti-MS vitriol, but just in case any MS personnel happen to visit, I must state for the record that this behavior -- and all similar undoing-the-user's-hard-work/second-guessing-the-user's-intent-type behavior (especially to compensate for shortcomings in another piece of MS software) -- is uninspiring and offensive.

    By the way, I am speaking as a user of VS2k3. To hear that this specific problem -- and any problem of this nature, period -- still exists in VS2k5 is extremely disheartening. Considering the price that is being charged for these tools, the number of development revisions they have gone through, and they way they are promoted as "state-of-the-art", it's really just plain inexcusable.

    I have used MS tools regularly for many years, but in the past few I have begun to seriously examine alternatives like Eclipse, PHP, MySQL, Firefox, etc., and to utilize and recommend them wherever possible. (And what a shame! It's not due to deficiencies in the core concepts and technologies, but because of needless, common-sense-defying nuisance issues like this.)

    So, I am "voting with my feet" (albeit gradually), as poorly-cared-for customers are known to do.

    I doubt I can express my dissatisfaction any more clearly than that.

    (...at least not in a forum that women or children might read!)

  • I am thoroughly unimpressed and dissatisfied by this explaination. Dreamweaver lets me format my HTML anyway I want and my pages still work in IE.

    MS - STOP REFORMATTING MY CODE!!!

  • I'm glad I happened across this post - I thought I was going crazy. I'm trying to format a list to use as a nav bar, and VS2k5 kept inserting extra space between the tags. Everything rendered fine in Firefox, but was totally screwed up in IE. Then I looked at the DOM using the developer toolbar in IE, and saw an extra text node after each list node.

    When I went to the designer and deleted the space after the tag, then went back to the code, it was as you explained - everything on one line.

    I don't care if they say this is a "feature." If it looks like a bug, acts like a bug, and smells like a bug, then it needs to be squished like a bug.

  • Would it not be simple enough, that if one is to try to automated everything knowing one will not be able to meet all the scenarios, one should only automate by adding features only if paired with their corresponding on/off switch. That way when your logic lacks completeness, you do not impose your GOOF-UPs(nicely said) on others!!!.
    ...and it can all be done using a config file, in case some of you are worried about speed and size.

Comments have been disabled for this content.