remy/inliner
1
1
Fork 0
mirror of https://github.com/remy/inliner.git synced 2024-08-16 20:00:35 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: nested double quotes with url() in style

Browse Source 
NB: using ' instead of ", and trying to escape properly
NB: tests results not updated yet
NB: '&' in an SVG text (still) not handled

Fixes #152
Fixes #153
This commit is contained in:
Rémi Emonet 2017-08-25 01:03:59 +02:00 committed by Remy Sharp
parent bf70e131be
commit ff2285312a
2 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
lib/css.js
View File

@ -36,7 +36,7 @@ function getImages(root, css) {
return Promise.all(images.map(function map(url) {
return inliner.image(url.resolved).then(function then(dataURL) {
inliner.jobs.done.images();
css = replace(css, url.source, 'url("' + dataURL + '")');
css = replace(css, url.source, 'url(\'' + dataURL + '\')');
return css;
});
})).then(function then() {

27
lib/image.js
View File

@ -28,13 +28,30 @@ function image(url) {
debug('errored', result.error);
return reject(new Error(result.error));
}
// supposing/given:
// - we are in a CSS single quoted string
// - this css *may* be in a HTML file, in a <style>
// - this css *may* be in a HTML file, in a double-quoted attribute
// - the optimizer possibly replaced:
// - & by &amp; <<< unhandled: add a &amp; in the svg text to test
// - ' by &apos;
// - " by &quot; (not around attributes)
// Thus, we have to do a tricky escape pattern
// ... we use % encoding for html level escape
// ... we need to use proper \ escape for css level escape
// ... (or we could have a ' in ' problem (nested sinle quotes))
// ... so, before anything, we need to escape both \ and %
var replacements = {
'<': '%3C',
'>': '%3E',
'"': '%22',
'\'': '%27',
'<': '%3C', // html escape
'"': '%22', // html escape
'&quot;': '%22', // html escape
'#': '%23', // css url path escape
'\n': '\\n', // css string escape
'\'': '\\\'',// css string escape
'&apos;': '\\\'',// css string escape
};
var body = result.data.replace(/["'<>]/g, function (m) {
var body = result.data.replace(/\\/g, '\\').replace(/%/g, '%25')
.replace(/[<"#\n']|&quot;|&apos;/g, function (m) {
return replacements[m];
});
resolve('data:image/svg+xml;utf8,' + body);