Symphony.

I stumble upon a strange thing that I don’t quite understand (*XSLT newbie).

I would like to have my HTML code neatly indented (at least while in development, although I don’t think whitespace is really that relevant compared to other optimalisation).

To pretty-print my HTML source I removed the xsl:strip-spaces and changed indent="no" to "yes".

This correctly picks up on newlines (enters) but disregards tabs (view:source in Google Chrome). I would expect tabs to show up, is this not correct?

I noticed the tabs are recognized when changing the xsl output method to xml

What exactly does this output method do? Why does it pick up tabs when being “xml” and how do I ‘enable’ tabs in HTML output method?

edit: Another thing I noticed is that ‘output method HTML’ adds a ‘traditional’ meta charset element. I already used the HTML5 <meta charset="UTF-8"/> but it is ignored. Plus: all my elements are closed (HTML4 style) instead of self-closed (XHTML style) with />

This is probably a very n00bish oversight, but it seems that output method XML handles my markup exactly the way I want it: XHTML-style syntax, proper indentation and HTML5-style elements. Is it safe/ok/appropriate to just use the XML ouput method?

I’m super keen on using Symphony but a bit taken aback by XSLT (and especially its whitespace handling). Thanks for any pointers.

What exactly does this output method do? Why does it pick up tabs when being “xml” and how do I ‘enable’ tabs in HTML output method?

Exactly as you’ve discovered — it allows for HTML 4-esque markup with closing tags. It is perfectly safe to use xml as the output type. The lack of indenting when using html even when you set indent="yes" I believe is down to a bug in the libXSL processor that PHP uses rather than a Symphony bug.

I prefer to use an output type of xml with indent set to yes to get nice pretty indenting. I’ve never used the strip-space so can’t be sure what effect that has with different combinations of the above.

This correctly picks up on newlines (enters) but disregards tabs (view:source in Google Chrome). I would expect tabs to show up, is this not correct?

Yes it’s a known bheaviour. :)

Another thing I noticed is that ‘output method HTML’ adds a ‘traditional’ meta charset element. I already used the HTML5 but it is ignored.

I believe it has to do with the fact that XSLT is not really “HTML5-ready”. However it shouldn’t be a problem to use the old-style charset declaration. If you want, you can replace it with the HTML5 <meta charset="UTF-8"/> by writing a small extension that uses the FrontendOutputPostGenerate delegate (see this example).

Plus: all my elements are closed (HTML4 style) instead of self-closed (XHTML style) with />

That because HTML is not XHTML, thus it is syntactically correct to have elements without a closing tag.

Is it safe/ok/appropriate to just use the XML ouput method?

As long as you deliver your pages with the correct mimetype, it is. Given that this approach may raise issues on legacy browsers, my suggestion is to use the html output with a legacy-compact DOCTYPE that is HTML5 compatible (see this thread).

Good luck! :)

Edit: Well, Nick is too quick for me ;)

First off: excuses, these issues have been many times discussed before:

• http://getsymphony.com/discuss/thread/43003/1/
• http://getsymphony.com/discuss/thread/29218/#position-3
• http://getsymphony.com/discuss/thread/29292/

Thanks guys. However Nick’s suggestion seems to contradict eKoeS’s :)

Nick, you are suggesting I just use the XML output method and continue to use the XHTML syntax (lowercase, />-closing, elements, quoted attributes, etc.)

eKoeS is suggesting the opposite: use the HTML output method and a legacy-compat doctype.

Without wanting to go into a HTML vs. XHTML syntax flamewar (been there) I think I’ll go with Nick’s suggestion: I’m used to the XHTML syntax.

eKoeS: You seem to suggest that the XML output method is OK only with the ‘correct’ mimetype (I’m guessing you mean xhtml/xml or application/xml?) Remember that it is perfectly fine to use the XHTML syntax in HTML5 documents send as text/html! Or am I missing some Symphony/XSLT restriction?

The HTML5 ‘minimal’ doctype hack (in <xsl:text>) is fine in itself right? If so: I like the look of that better than the legacy-compat one ;-)

How do I ensure that my (conditional) comments show up in the source? Should I wrap (conditional) comments in <xsl:comment> tags?

Remember that it is perfectly fine to use the XHTML syntax in HTML5 documents send as text/html!

Yeah I know, but it’s a matter of tastes. I just don’t see any reasons for using the XHTML syntax in my pages for now (even if I was a real fan of XHTML 2.0 and an annoying standardista!…) ;)

Or am I missing some Symphony/XSLT restriction?

As far as I know, there’s no restriction. It’s okay to use the xml output method and then switch to a HTML5 DOCTYPE.

eKoeS you’re right: it’s a matter of taste.

So, am I correct in thinking I need <xsl:comment> tags around Conditional Comments?

Another thing I ran into was a textarea with no ‘value’:

<textarea placeholder="Your comments..."></textarea>

This is incorrectly parsed: the textarea is given a self-closing syntax (/>) and next elements are borked.

You’ll notice that I use the placeholder attribute, this is why the textarea itself is empty.

The only way around the incorrect rendering was to actually add some text. However: this breaks the placeholder functionality :-/

Also: script elements (<script src=""... ></script>) are given the same treatment: Javascript is therefore not executed.

All this is fixed when setting the output method to HTML again.

It seems I’m not able to have pretty printed markup (tabs) AND functional HTML5 markup… Although Symphony seems great, my first impression of XSLT is ‘hasslebork’ :(

I’m sorry for my many questions but I think their relevant and could help people like me.

Cheers, Dave

So, am I correct in thinking I need tags around Conditional Comments?

Conditional Comments (for IE)

Nick, thanks! It seems I was editing my post at the same time you added your response. —^

Even with the CC hacks described in the threads you linked to it seems impossible to implement the CC solution from http://www.html5boilerplate.com

<!--[if (gt IE 9)|!(IE)]><!--> <body> <!--<![endif]-->

The issue, of course, is the ‘repeated’ comment within the conditional comment within the XSL comment :-/

(Seeing that HTML5 Boilerplate is pretty comprehensive) it would be awesome if some XSLT hero could ‘port’ that to a Symphony HTML5 utility.

PS: any ideas about my issue with the HTML mode and self-closing empty elements?

The only way around the incorrect rendering was to actually add some text. However: this breaks the placeholder functionality :-/

Try this (found here):

<xsl:text disable-output-escaping="yes"><![CDATA[<textarea placeholder="..."></textarea>]]></xsl:text>

Even with the CC hacks described in the threads you linked to it seems impossible to implement the CC solution from http://www.html5boilerplate.com

The following code works, but it will disable output indentation:

<xsl:comment><![CDATA[[if (gt IE 9)|!(IE)]><!]]></xsl:comment><xsl:text disable-output-escaping="yes"><![CDATA[<body>]]></xsl:text><xsl:comment><![CDATA[<![endif]]]></xsl:comment>

(Sorry, I can’t edit my previous message because the website shows an error “XSLT Error”)

I was thinking… instead of adding classes to the body, you can manually insert a new link element:

<xsl:comment><![CDATA[[if (gt IE 9)|!(IE)]><!]]></xsl:comment>
<link rel="stylesheet" href="cool_browsers.css" media="screen" />
<xsl:comment><![CDATA[<![endif]]]></xsl:comment>

I prefer to use an output type of xml with indent set to yes to get nice pretty indenting.

Sorry, I wasn’t thinking here. This works dandy for XHTML, but when outputting HTML5 I go with an html output type. Otherwise <script> tags get self-closed and all sorts of things throw browsers off.

eKoeS:

Thanks for the tip on the textarea fixin’. However; I don’t feel this is the way to go because I do not think it’s wise to try and work around all possible scenario’s. (It happens with <script> elements also, and who knows what else? Probably all empty elements.)

Thanks also for the last Conditional Comment fix: this indeed seems to format the Conditional Comment as needed, however it still results in errors. Somehow the <body> tag is not recognized :(

I know I could also use separate linked stylesheets in Conditional Comments, but (apart from the markup) the body-classes are imho a very elegant solution: they prevent separate HTTP requests and give you very fine-grained control to target IE without browser sniffing, they also are completely valid CSS (no CSS hacks needed).

@Nickdunn thanks. I’ve figured this out :-/

Please take a look at my other comment (thought it was more appropriate in the XSLT/HTML5 thread).

http://getsymphony.com/discuss/thread/43003/3/#position-57

At the moment it seems output method xml gives us everything we need, syntax-wise, but results in re-formatting empty elements and breaking the site. output method html converts the markup to HTML style, has trouble with the HTML5 doctype, and charset and does not indent :(

However; I don’t feel this is the way to go because I do not think it’s wise to try and work around all possible scenario’s. (It happens with <script> elements also, and who knows what else? Probably all empty elements.)

Yep, sorry! I didn’t know that there were so many drawbacks for people yearning to use HTML5 with a xml output method.

I know I could also use separate linked stylesheets in Conditional Comments, but (apart from the markup) the body-classes are imho a very elegant solution

Just for claryfing, I thought that the indentation problem mentioned in this post was caused by the body open tag. I then suggested to use link because I supposed that a self-closing tag would have fixed that. But I was wrong :)

eKoeS thanks again for reacting. I worked around the conditional comments by simply adding a new DIV element in IE.

I would still love to be able to use the org. CC solution though. It’s a bit frustrating to think that Plain Old Simple HTML is such a hassle with XSLT.

Any thoughts on the other issues as outlined in: http://getsymphony.com/discuss/thread/43003/3/#position-57

@nickdunn I am interested to hear your thoughts on these issues since you seem to have some experience with HTML5 and Symphony.

@icek - There’s no need for the new line (
) to force the HTML5 doctype onto a new line for cosmetic purposes.

Instead, if you want this, just close the xsl text on a new line and it will honour this enclosed newline:

<xsl:text disable-output-escaping="yes">&lt;</xsl:text>!DOCTYPE html<xsl:text disable-output-escaping="yes">&gt;
</xsl:text>

I would recommend the jQuery lines be

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">google.load("jquery", "1");</script>

Also: you'd probably want to link to the html5 Shiv javascript in your document's head section (before possible html5 elements and page-rendering-blocking stuffz). I would also recommend a fallback to a local version of jQuery (besides the link to Google's CDN) as such:

<script>window.jQuery || document.write('<script src="js/libs/jquery-1.5.1.min.js">x3C/script>')</script>