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: ensure svg viewBox is kept

Browse Source 
Fixes #102

Use lowerCaseAttributeNames=false when SVG present
This commit is contained in:
Remy Sharp 2016-07-31 15:18:25 +01:00
parent 0772d51069
commit c085114ebf
7 changed files with 22 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
lib/index.js
View File

@ -251,10 +251,15 @@ function main() {
// if we spot some SVG elements in the source,
// then we'll parse as XML to correctly get the SVG
if (body.indexOf('<?xml') !== -1 || body.indexOf('<?XML') !== -1) {
if (body.indexOf('<?xml') !== -1 ||
body.indexOf('<?XML') !== -1) {
cheerioLoadOptions.xmlMode = true;
}
if (body.indexOf('<svg') !== -1) {
cheerioLoadOptions.lowerCaseAttributeNames = false;
}
var todo = inliner.findAssets(body, cheerioLoadOptions);
var $ = todo.$;
delete todo.$;

39
lib/svgo-config.js
View File

@ -1,39 +0,0 @@
module.exports = { plugins: [
{ removeDoctype: true },
{ removeXMLProcInst: true },
{ removeComments: true },
{ removeMetadata: true },
{ removeEditorsNSData: true },
{ cleanupAttrs: true },
{ convertStyleToAttrs: true },
{ cleanupIDs: true },
{ removeRasterImages: true },
{ removeUselessDefs: true },
{ cleanupNumericValues: true },
{ cleanupListOfValues: true },
{ convertColors: true },
{ removeUnknownsAndDefaults: true },
{ removeNonInheritableGroupAttrs: true },
{ removeUselessStrokeAndFill: true },
{ removeViewBox: true },
{ cleanupEnableBackground: true },
{ removeHiddenElems: true },
{ removeEmptyText: true },
{ convertShapeToPath: true },
{ moveElemsAttrsToGroup: true },
{ moveGroupAttrsToElems: true },
{ collapseGroups: true },
{ convertPathData: true },
{ convertTransform: true },
{ removeEmptyAttrs: true },
{ removeEmptyContainers: true },
{ mergePaths: true },
{ removeUnusedNS: true },
{ transformsWithOnePath: true },
{ sortAttrs: true },
{ removeTitle: true },
{ removeDesc: true },
{ removeDimensions: true },
{ removeAttrs: true },
{ addClassesToSVGElement: true },
], };

14
lib/tasks/svg.js
View File

@ -19,10 +19,10 @@ function resolve(inliner, todo, $) {
debug('optimising svg');
// reconstruct the SVG element outer tag
var top = '<svg ' + Object.keys(svg.attribs).reduce(function (acc, curr) {
acc.push(curr + '="' + svg.attribs[curr] + '"');
return acc;
}, []).join(' ') + '>';
// console.log(Object.keys(svg.attribs).map(_ => `${_}="${svg.attribs[_]}"`));
var top = '<svg ' + Object.keys(svg.attribs).map(function (key) {
return key + '="' + svg.attribs[key] + '"';
}).join(' ') + '>';
source = top + source + '</svg>';
@ -31,13 +31,15 @@ function resolve(inliner, todo, $) {
debug('svg failed', result.error);
return;
}
debug('optimised again');
debug('optimisation complete');
$svg.replaceWith(result.data);
});
inliner.jobs.done.svg();
resolve();
});
});
}
}

2
test/fixtures/inline-svg.result.html vendored
View File

File diff suppressed because one or more lines are too long

2
test/fixtures/svg-compress.result.html vendored
View File

File diff suppressed because one or more lines are too long

1
test/fixtures/svg-viewbox.result.html vendored Normal file
View File

@ -0,0 +1 @@
<button data-menu="menu-primary-menu" id="toogle-menu" title="menu"> <svg class="bnw-icon_api-mobile-menu" viewBox="0 0 512 512"><path d="M0 0zm53 431c-4 0-8-4-8-9v-64c0-5 4-9 8-9h406c4 0 8 4 8 9v64c0 5-4 9-8 9zm0-128c-4 0-8-4-8-9v-64c0-5 4-9 8-9h406c4 0 8 4 8 9v64c0 5-4 9-8 9zm0-128c-4 0-8-4-8-9v-64c0-5 4-9 8-9h406c4 0 8 4 8 9v64c0 5-4 9-8 9z"/></svg> </button>

5
test/fixtures/svg-viewbox.src.html vendored Normal file
View File

@ -0,0 +1,5 @@
<button data-menu="menu-primary-menu" id="toogle-menu" title="menu">
<svg class="bnw-icon_api-mobile-menu" viewBox="0 0 512 512">
<path d="m0 0z m53 431c-4 0-8-4-8-9l0-64c0-5 4-9 8-9l406 0c4 0 8 4 8 9l0 64c0 5-4 9-8 9z m0-128c-4 0-8-4-8-9l0-64c0-5 4-9 8-9l406 0c4 0 8 4 8 9l0 64c0 5-4 9-8 9z m0-128c-4 0-8-4-8-9l0-64c0-5 4-9 8-9l406 0c4 0 8 4 8 9l0 64c0 5-4 9-8 9z"></path>
</svg>
</button>