Problema com URIs de dados e mesclagem de arquivos CSS

A mesclagem de arquivos CSS do Magento está fingindo o nome do host para meus dados-uris porque o RegEx in Mage_Core_Model_Design_Package( beforeMergeCss) não funciona conforme o esperado. Ele deve incluir o nome do host nos caminhos de imagem relativos, mas não nos URIs de dados.

$cssUrl = '/url\\(\\s*(?!data:)([^\\)\\s]+)\\s*\\)?/';
$contents = preg_replace_callback($cssUrl, array($this, '_cssMergerUrlCallback'), $contents);

Código CSS:

background: #fafafa url("data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==") no-repeat;

Resultado após mesclagem:

background: #fafafa url("http://shop12.dev/skin/frontend/shop/default/styles/data:image/svg+xml;base64")PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==") no-repeat;

Como evitar isso? Não consegui descobrir como corrigir a sintaxe do RegEx usado. (Usar um GIF não é uma solução real para mim)

No iphone.css, o magento também usa URI de dados, mas sem aspas, tente fazer o mesmo

background: #fafafa url(data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==) no-repeat;

No seu caso, em vez de

/url\\(\\s*(?!data:)([^\\)\\s]+)\\s*\\)?/

você deveria usar

/url\\(\\s*(?![\"\']?data:)([^)]+)\\)/

Na verdade, esse regexp cobre mais casos

/url\\(\\s*(?![\"\']?data:)(?!\%)([^\\)\\s]+)\\s*\\)?/

Especialmente esses dados svg otimizados com gradientes: http://codepen.io/tigt/post/optimizing-svgs-in-data-uris

Eu tinha o mesmo problema (ainda presente no Magento versão 1.9.3.1), por isso criei um módulo para solucionar esse bug: https://github.com/just-better/magento1-css-merge-data-uri- consertar