zcy
/
svgedit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update tests

master
JFH 2021-08-29 16:05:21 +02:00
parent 0d2c344fee
commit 6c708ed974
6 changed files with 198 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
cypress/integration/ui/__snapshots__/scenario2.js.snap
View File

@ -331,68 +331,6 @@ exports[`use all parts of svg-edit > check tool_ellipse_change_rotation #0`] = `
</svg>
`;
exports[`use all parts of svg-edit > check tool_ellipse_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<circle
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
cx="150"
cy="150"
r="111.80339887498948"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
></circle>
<ellipse
fill="#ffff00"
stroke="#000000"
stroke-width="5"
cx="299"
cy="169"
rx="60"
ry="50"
id="svg_2"
fill-opacity="1"
stroke-opacity="1"
opacity="0.5"
></ellipse>
<ellipse
fill="#FF0000"
stroke="#000000"
stroke-width="5"
cx="114"
cy="189"
rx="55"
ry="25"
id="svg_3"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(25 114 189)"
filter="url(#svg_3_blur)"
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_ellipse_change_cx_cy_coordinate #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
@ -448,8 +386,8 @@ exports[`use all parts of svg-edit > check tool_ellipse_change_cx_cy_coordinate
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_3_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -510,8 +448,8 @@ exports[`use all parts of svg-edit > check tool_ellipse_change_rx_ry_radius #0`]
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_3_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -572,8 +510,8 @@ exports[`use all parts of svg-edit > check tool_ellipse_bring_to_back #0`] = `
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_3_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -634,8 +572,8 @@ exports[`use all parts of svg-edit > check tool_ellipse_bring_to_front #0`] = `
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_3_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -708,6 +646,68 @@ exports[`use all parts of svg-edit > check tool_ellipse_clone #0`] = `
id="svg_4"
></ellipse>
</g>
<defs>
<filter id="svg_3_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_ellipse_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<circle
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
cx="150"
cy="150"
r="111.80339887498948"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
></circle>
<ellipse
fill="#ffff00"
stroke="#000000"
stroke-width="5"
cx="299"
cy="169"
rx="60"
ry="50"
id="svg_2"
fill-opacity="1"
stroke-opacity="1"
opacity="0.5"
></ellipse>
<ellipse
fill="#FF0000"
stroke="#000000"
stroke-width="5"
cx="114"
cy="189"
rx="55"
ry="25"
id="svg_3"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(25 114 189)"
filter="url(#svg_3_blur)"
></ellipse>
</g>
<defs>
<filter id="svg_3_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>

158
cypress/integration/ui/__snapshots__/scenario4.js.snap
View File

@ -280,69 +280,6 @@ exports[`use all parts of svg-edit > check tool_rect_change_rotation #0`] = `
</svg>
`;
exports[`use all parts of svg-edit > check tool_rect_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<rect
fill="#ffff00"
stroke="#000000"
stroke-width="5"
x="150"
y="150"
width="100"
height="50"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(25 200 175)"
filter="url(#svg_1_blur)"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="350"
y="230"
width="120"
height="100"
id="svg_2"
fill-opacity="1"
stroke-opacity="1"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="225"
y="300"
width="50"
height="50"
id="svg_3"
fill-opacity="1"
stroke-opacity="1"
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_rect_change_opacity #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
@ -400,8 +337,8 @@ exports[`use all parts of svg-edit > check tool_rect_change_opacity #0`] = `
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -463,8 +400,8 @@ exports[`use all parts of svg-edit > check tool_fhrect_change_x_y_coordinate #0`
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -526,8 +463,8 @@ exports[`use all parts of svg-edit > check tool_fhrect_change_width_height #0`]
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -600,8 +537,8 @@ exports[`use all parts of svg-edit > check tool_square_clone #0`] = `
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -674,8 +611,8 @@ exports[`use all parts of svg-edit > check tool_square_bring_to_back #0`] = `
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -748,8 +685,8 @@ exports[`use all parts of svg-edit > check tool_square_bring_to_front #0`] = `
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -824,8 +761,8 @@ exports[`use all parts of svg-edit > check tool_square_change_corner_radius #0`]
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -898,8 +835,8 @@ exports[`use all parts of svg-edit > check tool_rect_change_to_path #0`] = `
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -944,6 +881,69 @@ exports[`use all parts of svg-edit > check tool_rect_delete #0`] = `
ry="25"
></rect>
</g>
<defs>
<filter id="svg_1_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_rect_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<rect
fill="#ffff00"
stroke="#000000"
stroke-width="5"
x="150"
y="150"
width="100"
height="50"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(25 200 175)"
filter="url(#svg_1_blur)"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="350"
y="230"
width="120"
height="100"
id="svg_2"
fill-opacity="1"
stroke-opacity="1"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="225"
y="300"
width="50"
height="50"
id="svg_3"
fill-opacity="1"
stroke-opacity="1"
></rect>
</g>
<defs>
<filter id="svg_1_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>

88
cypress/integration/ui/__snapshots__/scenario5.js.snap
View File

@ -84,44 +84,6 @@ exports[`use all parts of svg-edit > check tool_line_change_rotation #0`] = `
</svg>
`;
exports[`use all parts of svg-edit > check tool_line_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<line
fill="none"
stroke="#000000"
stroke-width="5"
x1="200"
y1="200"
x2="450"
y2="450"
id="svg_1_id"
fill-opacity="1"
stroke-opacity="1"
class="svg_1_class"
transform="rotate(25 325 325)"
filter="url(#svg_1_id_blur)"
></line>
</g>
<defs>
<filter id="svg_1_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_line_change_opacity #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
@ -154,8 +116,8 @@ exports[`use all parts of svg-edit > check tool_line_change_opacity #0`] = `
></line>
</g>
<defs>
<filter id="svg_1_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_id_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -177,8 +139,8 @@ exports[`use all parts of svg-edit > check tool_line_delete #0`] = `
<title style="pointer-events:inherit">Layer 1</title>
</g>
<defs>
<filter id="svg_1_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_id_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -245,8 +207,8 @@ exports[`use all parts of svg-edit > check tool_line_clone #0`] = `
</line>
</g>
<defs>
<filter id="svg_1_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
<filter id="svg_1_id_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
@ -303,6 +265,44 @@ exports[`use all parts of svg-edit > check tool_fhrect_change_x_y_coordinate #0`
></animate>
</line>
</g>
<defs>
<filter id="svg_1_id_blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="1"></feGaussianBlur>
</filter>
</defs>
</svg>
`;
exports[`use all parts of svg-edit > check tool_line_change_blur #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
width="640"
height="480"
id="svgcontent"
overflow="visible"
x="640"
y="480"
viewBox="0 0 640 480"
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<line
fill="none"
stroke="#000000"
stroke-width="5"
x1="200"
y1="200"
x2="450"
y2="450"
id="svg_1_id"
fill-opacity="1"
stroke-opacity="1"
class="svg_1_class"
transform="rotate(25 325 325)"
filter="url(#svg_1_id_blur)"
></line>
</g>
<defs>
<filter id="svg_1_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>

11
cypress/integration/unit/utilities.js
View File

@ -113,17 +113,6 @@ describe('utilities', function () {
assert.equal(toXml('\'<&>"'), '&#x27;&lt;&amp;&gt;&quot;');
});
it('Test svgedit.utilities.fromXml() function', function () {
const { fromXml } = utilities;
assert.equal(fromXml('a'), 'a');
assert.equal(fromXml('ABC_'), 'ABC_');
assert.equal(fromXml('PB&amp;J'), 'PB&J');
assert.equal(fromXml('2 &lt; 5'), '2 < 5');
assert.equal(fromXml('5 &gt; 2'), '5 > 2');
assert.equal(fromXml('&lt;&amp;&gt;'), '<&>');
});
it('Test svgedit.utilities.encode64() function', function () {
const { encode64 } = utilities;

16
src/svgcanvas/undo.js
View File

@ -81,20 +81,6 @@ export const getUndoManager = function () {
if (values.stdDeviation) {
undoContext_.getCanvas().setBlurOffsets(cmd.elem.parentNode, values.stdDeviation);
}
// This is resolved in later versions of webkit, perhaps we should
// have a featured detection for correct 'use' behavior?
// ——————————
// Remove & Re-add hack for Webkit (issue 775)
// if (cmd.elem.tagName === 'use' && isWebkit()) {
// const {elem} = cmd;
// if (!elem.getAttribute('x') && !elem.getAttribute('y')) {
// const parent = elem.parentNode;
// const sib = elem.nextSibling;
// elem.remove();
// parent.insertBefore(elem, sib);
// // Ok to replace above with this? `sib.before(elem);`
// }
// }
if (cmd.elem.tagName === 'text'){
const [ dx, dy ] = [ cmd.newValues.x - cmd.oldValues.x,
cmd.newValues.y - cmd.oldValues.y ];
@ -248,7 +234,7 @@ export const changeSelectedAttributeNoUndoMethod = function (attr, newValue, ele
// we need to update the rotational transform attribute
const angle = getRotationAngle(elem);
if (angle !== 0 && attr !== 'transform') {
const tlist = elem.transform.baseVal;
const tlist = elem.transform?.baseVal;
let n = tlist.numberOfItems;
while (n--) {
const xform = tlist.getItem(n);

9
src/svgcanvas/utilities.js
View File

@ -1147,10 +1147,9 @@ export const getStrokedBBoxDefaultVisible = function (elems) {
* @param {boolean} toRad - When true returns the value in radians rather than degrees
* @returns {Float} The angle in degrees or radians
*/
export const getRotationAngleFromTransformList = function (tlist, toRad) {
if (!tlist) { return 0; } // <svg> elements have no tlist
const N = tlist.numberOfItems;
for (let i = 0; i < N; ++i) {
export const getRotationAngleFromTransformList = (tlist, toRad) => {
if (!tlist) { return 0; } // <svg> element have no tlist
for (let i = 0; i < tlist.numberOfItems; ++i) {
const xform = tlist.getItem(i);
if (xform.type === 4) {
return toRad ? xform.angle * Math.PI / 180.0 : xform.angle;
@ -1169,7 +1168,7 @@ export const getRotationAngleFromTransformList = function (tlist, toRad) {
export let getRotationAngle = function (elem, toRad) {
const selected = elem || editorContext_.getSelectedElements()[0];
// find the rotation transform (if any) and set it
const tlist = selected.transform.baseVal;
const tlist = selected.transform?.baseVal;
return getRotationAngleFromTransformList(tlist, toRad);
};