OmniFaces conditionalComment not written to HTML output

问题

I'm using OmniFaces conditionalComment to load a javascript file for IE 6 browsers. On the webiste it says the script should be included in the page as:

<script type="text/javascript" src="[JS library]"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
  <script type="text/javascript" src="selectivizr.js"></script>
  <noscript><link rel="stylesheet" href="[fallback css]" /></noscript>
<![endif]-->

This is not valid xml, so can't be used in the JSF xhtml files. Instead I use this:

<h:body>
  <f:facet name="last">
    <o:conditionalComment if="if (gte IE 6)&amp;(lte IE 8)">
      <h:outputScript library="js" name="selectivizr-min.js" target="head"/>
    </o:conditionalComment>
  </f:facet>
...
</h:body>

I include the script in the body part of the xhtml and put it in the facet name="last", so it is included after JQuery (I use PirmeFaces and read that's the safest way to do that). target="head" ensures that it is written to the head section of the resulting html file. The link to the script is included in the correct part of the document (after the PrimeFaces imports), but it is not surrounded by the conditional comments.

Here is the relevant part of the html (reformatted for easier reading):

<head>
  <link type="text/css" rel="stylesheet" href="/javax.faces.resource/theme.css.xhtml?ln=primefaces-aristo" />
  <link type="text/css" rel="stylesheet" href="/javax.faces.resource/primefaces.css.xhtml?ln=primefaces&amp;v=5.1" />
  <script type="text/javascript" src="/javax.faces.resource/jquery/jquery.js.xhtml?ln=primefaces&amp;v=5.1"></script>
  <script type="text/javascript" src="/javax.faces.resource/primefaces.js.xhtml?ln=primefaces&amp;v=5.1"></script>
  <script type="text/javascript" src="/javax.faces.resource/jquery/jquery-plugins.js.xhtml?ln=primefaces&amp;v=5.1"></script>
  <script type="text/javascript" src="/javax.faces.resource/omnifaces.js.xhtml?ln=omnifaces"></script>
  <link type="text/css" rel="stylesheet" href="/javax.faces.resource/styles.css.xhtml?ln=css" />
  <script type="text/javascript" src="/javax.faces.resource/selectivizr-min.js.xhtml?ln=js"></script>

The last line is missing the comments (!--[if (gte IE 6)&(lte IE 8)]> ...).

What am I doing wrong? Any suggestions?

Cheers, Dominik

回答1:

This problem is two-fold:

The <f:facet name="last"> makes no sense in this context. Get rid of it. It would be ignored including any of its children. It's only valid inside <h:head> (and even then only if you're using PrimeFaces; who actually overlooked the native JSF possibility to order head resources as last).
You can't use <h:outputScript> (nor <h:outputStylesheet> inside <o:conditionalComment>, because JSF will implicitly auto-relocate it to the <head>. This is also hinted in the documentation and showcase.

Just use plain vanilla <script> (or <link rel="stylesheet">).

<o:conditionalComment if="(gte IE 6)&amp;(lte IE 8)">
    <script src="#{resource['js/selectivizr-min.js']}" />
</o:conditionalComment>

Note that I fixed the invalid if attribute value by removing the duplicated if.

Unrelated to the concrete problem: The library="js" indicates a misunderstanding of the library attribute. Carefully read What is the JSF resource library for and how should it be used? The #{resource} resolver in above answer has already been altered to use js as regular folder instead of as library.

来源：https://stackoverflow.com/questions/26719135/omnifaces-conditionalcomment-not-written-to-html-output

标签

jsf

omnifaces

conditional-comments