sysutils/svgo
1
0
Fork 0
mirror of https://github.com/svg/svgo.git synced 2025-07-29 20:21:14 +03:00
Code Activity

Preverve viewBox in nested <svg>

Browse Source
This commit is contained in:
Bogdan Chadkin
2021-03-06 13:39:31 +03:00
parent a2b0e73767
commit 28c01cfe65
3 changed files with 52 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
plugins/removeViewBox.js
View File

@ -24,13 +24,16 @@ var viewBoxElems = ['svg', 'pattern', 'symbol'];
* @author Kir Belevich
*/
exports.fn = function (item) {
if (
item.isElem(viewBoxElems) &&
item.hasAttr('viewBox') &&
item.hasAttr('width') &&
item.hasAttr('height')
) {
// TODO remove width/height for such case instead
if (item.isElem('svg') && item.closestElem('svg')) {
return;
}
var nums = item.attr('viewBox').value.split(/[ ,]+/g);
@ -42,7 +45,5 @@ exports.fn = function(item) {
) {
item.removeAttr('viewBox');
}
}
};

29
test/plugins/removeViewBox.05.svg Normal file
View File

@ -0,0 +1,29 @@
ViewBox in nested <svg> should be preserved to not break scale
===
<svg width="480" height="360" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<svg id="svg-sub-root" viewBox="0 0 450 450" width="450" height="450">
<rect x="225" y="0" width="220" height="220" style="fill:magenta"/>
<rect x="0" y="225" width="220" height="220" style="fill:#f0f"/>
<rect x="225" y="225" width="220" height="220" fill="#f0f"/>
</svg>
</defs>
<use x="60" y="50" width="240" height="240" xlink:href="#svg-sub-root"/>
<rect x="300" y="170" width="118" height="118" fill="magenta"/>
</svg>
@@@
<svg width="480" height="360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<svg id="svg-sub-root" viewBox="0 0 450 450" width="450" height="450">
<rect x="225" y="0" width="220" height="220" style="fill:magenta"/>
<rect x="0" y="225" width="220" height="220" style="fill:#f0f"/>
<rect x="225" y="225" width="220" height="220" fill="#f0f"/>
</svg>
</defs>
<use x="60" y="50" width="240" height="240" xlink:href="#svg-sub-root"/>
<rect x="300" y="170" width="118" height="118" fill="magenta"/>
</svg>

4
test/regression.js
View File

@ -115,8 +115,8 @@ const runTests = async ({ svgFiles }) => {
name === 'styling-css-01-b' ||
name === 'styling-css-03-b' ||
name === 'styling-css-04-f' ||
// mismatched draft cases
name === 'struct-use-07-b'
// strange artifact breaks inconsistently breaks regression tests
name === 'filters-conv-05-f'
) {
console.info(`${name} is skipped`);
skipped += 1;