Combres not fixing relative URLs despite the filter?

Question

UPDATE : Here is an example of the CSS I think is having a problem:

.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }

UPDATE - Created a workitem in issue tracker for combres on codeplex.

UPDATE : I looked at the logs and I found what is going on -

2011-10-24 16:32:20,490 [15] WARN  Combres.Filters.FixUrlsInCssFilter - Cannot fix url url(images/ui-icons_454545_256x240.png)
System.ArgumentOutOfRangeException: Length cannot be less than zero.
Parameter name: length
   at System.String.InternalSubStringWithChecks(Int32 startIndex, Int32 length, Boolean fAlwaysCopy)
   at System.String.Substring(Int32 startIndex, Int32 length)
   at Combres.Filters.FixUrlsInCssFilter.FixUrl(Resource resource, Match match)

So, can I get the source code and look at it or do I need to maybe put it on the combres issue tracker ?

I am using the filter -

 <filter type="Combres.Filters.FixUrlsInCssFilter, Combres" />

which is supposed to fix the relative urls issue mentioned here. But the urls (css background images) are still using the wrong path and do something like

http://somedomain.com/combres.axd/pics/pic.png

instead of using

http://somedomain.com/pics/pic.png

I also tried applying explicitly using -

<filter type="Combres.Filters.FixUrlsInCssFilter, Combres" acceptedResourceSets="myCss"  />

Can anyone give my any suggestions? I found something similar, but its solution does not work for me.

UPDATE : Here's my combres.xml just in case -

<?xml version="1.0" encoding="utf-8" ?>
<!--
  This file contains basic settings needed for most web apps.
  For full Combres settings (with explanation), refer to the sample definition file: combres_full_with_annotation.xml
  Also, refer to Combres' documentation: http://combres.codeplex.com/documentation  
-->
<combres xmlns='urn:combres'>
  <filters>
    <filter type="Combres.Filters.FixUrlsInCssFilter, Combres" acceptedResourceSets="LogCreateCss"  />
    <filter type="Combres.Filters.DotLessCssFilter, Combres"  acceptedResourceSets="LogCreateCss"  />
  </filters>
  <cssMinifiers>
    <minifier name="yui" type="Combres.Minifiers.YuiCssMinifier, Combres">
      <param name="CssCompressionType" type="string" value="StockYuiCompressor" />
      <param name="ColumnWidth" type="int" value="-1" />
    </minifier>
  </cssMinifiers>
  <jsMinifiers>
    <minifier name="msajax" type="Combres.Minifiers.MSAjaxJSMinifier, Combres" binderType="Combres.Binders.SimpleObjectBinder, Combres">
      <param name="CollapseToLiteral" type="bool" value="true" />
      <param name="EvalsAreSafe" type="bool" value="true" />
      <param name="MacSafariQuirks" type="bool" value="true" />
      <param name="CatchAsLocal" type="bool" value="true" />
      <param name="LocalRenaming" type="string" value="CrunchAll" />
      <param name="OutputMode" type="string" value="SingleLine" />
      <param name="RemoveUnneededCode" type="bool" value="true" />
      <param name="StripDebugStatements" type="bool" value="true" />
    </minifier>
    <minifier name="yui" type="Combres.Minifiers.YuiJSMinifier, Combres">
      <param name="IsVerboseLogging" type="bool" value="false" />
      <param name="IsObfuscateJavascript" type="bool" value="true" />
      <param name="PreserveAllSemicolons" type="bool" value="false" />
      <param name="DisableOptimizations" type="bool" value="true" />
      <param name="LineBreakPosition" type="int" value="-1" />
    </minifier>
  </jsMinifiers>
  <resourceSets url="~/combres.axd" defaultDuration="30"
                                defaultVersion="auto"
                                defaultDebugEnabled="false"
                                defaultJSMinifierRef="msajax"
                                defaultCssMinifierRef="yui">
    <resourceSet name="siteCss" type="css" minifierRef="yui">
      <resource path="\Content\StyleSheets\reset.css" />
      <resource path="\Content\StyleSheets\960.css" />
      <resource path="\Content\StyleSheets\Site960.css" />
      <resource path="\Content\StyleSheets\Site.css" />
    </resourceSet>
    <resourceSet name="siteJs" type="js" minifierRef="msajax">
      <resource path="\Scripts\jquery-1.5.1.min.js" />
      <resource path="\Content\Scripts\blockUI.js"  />
    </resourceSet>
    <resourceSet name="overviewCss" type="css" minifierRef="yui">
      <resource path="\Content\Plugins\fancybox\css\jquery.fancybox-1.3.4.css" />
      <resource path="\Content\StyleSheets\overview_kam.css" />
    </resourceSet>
    <resourceSet name="overviewJs" type="js" minifierRef="msajax">
      <resource path="\Content\Plugins\fancybox\scripts\jquery.fancybox-1.3.4.pack.js" />
    </resourceSet>
    <resourceSet name="LogCreateCss" type="css" minifierRef="yui">
      <resource path="\Content\Plugins\fancybox\css\jquery.fancybox-1.3.4.css" />
    </resourceSet>
    <resourceSet name="activityLogCloseCreateJs" type="js" minifierRef="msajax">
      <resource path="\Content\Plugins\fancybox\scripts\jquery.fancybox-1.3.4.pack.js" />
      <resource path="\Content\Plugins\fancybox\scripts\jquery.fancybox-1.3.4.js" />
    </resourceSet>
    <resourceSet name="LogCreateCss" type="css" minifierRef="yui">
      <resource path="\Content\StyleSheets\Site.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.all.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery-ui.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.accordion.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.autocomplete.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.button.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.core.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.datepicker.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.dialog.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.menu.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.progressbar.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.resizable.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.selectable.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.slider.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.spinner.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.tabs.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.theme.css" />
      <resource path="\Content\Plugins\jquerySpinner\themes\base\jquery.ui.tooltip.css" />
      <resource path="\Content\Plugins\jquerySpinner\demos\demos.css" />
    </resourceSet>
    <resourceSet name="LogCreateJs" type="js" minifierRef="msajax"  >
      <resource path="\Content\Plugins\jquerySpinner\jquery-1.4.3.js" />
      <resource path="\Content\Scripts\ActivityLog\Create.js" />
      <resource path="\Content\Plugins\fancybox\scripts\jquery.fancybox-1.3.4.pack.js" />
      <resource path="\Content\Plugins\jquerySpinner\external\jquery.mousewheel-3.0.4.js" />
      <resource path="\Content\Plugins\jquerySpinner\external\glob.js" />
      <resource path="\Content\Plugins\jquerySpinner\external\glob.de-DE.js" />
      <resource path="\Content\Plugins\jquerySpinner\external\glob.ja-JP.js" />
      <resource path="\Content\Plugins\jquerySpinner\ui\jquery.ui.core.js" />
      <resource path="\Content\Plugins\jquerySpinner\ui\jquery.ui.widget.js" />
      <resource path="\Content\Plugins\jquerySpinner\ui\jquery.ui.button.js" />
      <resource path="\Content\Plugins\jquerySpinner\ui\jquery.ui.spinner.js" />

    </resourceSet>
  </resourceSets>
</combres>

Answer 1

I think the image portion of your css is malformed; try this instead:

url('images/ui-bg_flat_75_ffffff_40x100.png') /*{bgImgUrlContent}*/

Note the addition of single quotes and the space between the closing ")" and the comment block

From experience, I can recommend using the application root relative syntax to keep things cleaner, for example, I would change what you have to:

url('~/images/ui-bg_flat_75_ffffff_40x100.png') /*{bgImgUrlContent}*/

Update:

Another option would be to write your own ISingleContentFilter implementation that was more tolerant of the sort of syntax that appears in your css files. You can have a look at the combres FixUrlsInCssFilter one for a good starting point.

Update:

If you've created your own improved version of the filter, simply compile it as part of your web project and reference it in combres.xml as such:

<filters>
      <filter type="YourProject.MyBetterFilter, YourProject" />
</filters>

There is no need to completely recompile (and mantain) a custom version of Combres to extend it this way.