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

#623 tool_star cypress test cases added

master
agriyadev5 2021-08-27 19:26:07 +05:30
parent 41dbec29af
commit 427b09ca6a
4 changed files with 923 additions and 257 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

230
cypress/integration/ui/__snapshots__/scenario1.js.snap
View File

@ -14,44 +14,6 @@ exports[`use all parts of svg-edit > check tool_source_set #0`] = `
</svg>
`;
exports[`use all parts of svg-edit > check tool_line #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"
opacity="0.5"
style="pointer-events:none"
x1="200"
y1="200"
x2="220"
y2="220"
id="svg_1"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</line>
</g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_shape #0`] = `
<svg
xmlns="http://www.w3.org/2000/svg"
@ -66,139 +28,17 @@ exports[`use all parts of svg-edit > check tool_shape #0`] = `
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<line
fill="none"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x1="200"
y1="200"
x2="220"
y2="220"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(43.2643 210 210)"
></line>
<path
fill="#FF0000"
stroke="#000000"
stroke-width="5"
opacity="0.5"
style="pointer-events:none"
d="m309.60653833763354,262.7975086895094 c37.05917105721012,-106.31729401658639 182.2582183141481,0 0,136.6936637356111 c-182.2582183141481,-136.6936637356111 -37.05917105721012,-243.0109577521975 0,-136.6936637356111 z"
id="svg_2"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</path>
</g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_rect_square #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"
style="pointer-events:inherit"
x1="200"
y1="200"
x2="220"
y2="220"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(43.2643 210 210)"
></line>
<path
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
d="m309.60653833763354,262.7975086895094 c37.05917105721012,-106.31729401658639 182.2582183141481,0 0,136.6936637356111 c-182.2582183141481,-136.6936637356111 -37.05917105721012,-243.0109577521975 0,-136.6936637356111 z"
id="svg_2"
d="m208.99746606586632,203.82033218045854 c4.117685576066451,-11.81303239035457 20.250912669179264,0 0,15.18818450188445 c-20.250912669179264,-15.18818450188445 -4.117685576066451,-27.00121689223902 0,-15.18818450188445 z"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(43.2545 208.997 209.008)"
></path>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
opacity="0.5"
style="pointer-events:inherit"
x="296"
y="136"
width="150"
height="120"
id="svg_3"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
opacity="0.5"
style="pointer-events:inherit"
x="446"
y="76"
width="180"
height="180"
id="svg_4"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
opacity="0.5"
style="pointer-events:inherit"
x="216"
y="156"
width="100"
height="100"
id="svg_5"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</rect>
</g>
</svg>
`;
@ -217,75 +57,23 @@ exports[`use all parts of svg-edit > check tool_image #0`] = `
>
<g class="layer" style="pointer-events:all">
<title style="pointer-events:inherit">Layer 1</title>
<line
fill="none"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x1="200"
y1="200"
x2="220"
y2="220"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(43.2643 210 210)"
></line>
<path
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
d="m309.60653833763354,262.7975086895094 c37.05917105721012,-106.31729401658639 182.2582183141481,0 0,136.6936637356111 c-182.2582183141481,-136.6936637356111 -37.05917105721012,-243.0109577521975 0,-136.6936637356111 z"
id="svg_2"
d="m208.99746606586632,203.82033218045854 c4.117685576066451,-11.81303239035457 20.250912669179264,0 0,15.18818450188445 c-20.250912669179264,-15.18818450188445 -4.117685576066451,-27.00121689223902 0,-15.18818450188445 z"
id="svg_1"
fill-opacity="1"
stroke-opacity="1"
transform="rotate(43.2545 208.997 209.008)"
></path>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="296"
y="136"
width="150"
height="120"
id="svg_3"
fill-opacity="1"
stroke-opacity="1"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="446"
y="76"
width="180"
height="180"
id="svg_4"
fill-opacity="1"
stroke-opacity="1"
></rect>
<rect
fill="#FF0000"
stroke="#000000"
stroke-width="5"
style="pointer-events:inherit"
x="216"
y="156"
width="100"
height="100"
id="svg_5"
fill-opacity="1"
stroke-opacity="1"
></rect>
<image
x="296"
y="176"
x="295"
y="295"
width="20"
height="20"
id="svg_6"
id="svg_2"
opacity="0.5"
style="pointer-events:inherit"
xlink:href="./images/logo.svg"

750
cypress/integration/ui/__snapshots__/scenario7.js.snap Normal file
View File

@ -0,0 +1,750 @@
exports[`use all parts of svg-edit > check tool_source_set #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"><title>Layer 1</title></g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_star #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">
<title>Layer 1</title>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokewidth="5"
starradiusmultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
>
<animate
attributeName="opacity"
begin="indefinite"
dur="0.2"
fill="freeze"
to="1"
></animate>
</polygon>
</g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_star_clone #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2"
></polygon>
</g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_star_change_rotation #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2_id"
class="svg_2_class"
transform="rotate(25 320 163.634)"
></polygon>
</g>
</svg>
`;
exports[`use all parts of svg-edit > check tool_star_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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2_id"
class="svg_2_class"
transform="rotate(25 320 163.634)"
filter="url(#svg_2_id_blur)"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_opacity #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2_id"
class="svg_2_class"
filter="url(#svg_2_id_blur)"
opacity="0.5"
transform="rotate(25 320 163.634)"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_bring_to_back #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>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2_id"
class="svg_2_class"
filter="url(#svg_2_id_blur)"
opacity="0.5"
transform="rotate(25 320 163.634)"
></polygon>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_bring_to_front #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
<polygon
cx="300"
cy="150"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="320,103.33333587646484 333.0618896484375,152.0218505859375 383.4037780761719,149.39886474609375 341.13458251953125,176.86705017089844 359.1856689453125,223.93446350097656 320,192.22222900390625 280.8143310546875,223.93446350097656 298.86541748046875,176.86705017089844 256.5962371826172,149.39886474609375 306.9381103515625,152.0218505859375 320,103.33333587646484 333.0618896484375,152.0218505859375 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
id="svg_2_id"
class="svg_2_class"
filter="url(#svg_2_id_blur)"
opacity="0.5"
transform="rotate(25 320 163.634)"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_delete #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_align_to_page #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="5"
fill-opacity="1"
stroke-opacity="1"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_stroke_width #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="15"
fill-opacity="1"
stroke-opacity="1"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_stroke_style #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="15"
fill-opacity="1"
stroke-opacity="1"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_line_cap #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#FF0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#000000"
stroke-width="15"
fill-opacity="1"
stroke-opacity="1"
stroke-dasharray="5,2,2,2"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_stoke_fill_color #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="5"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#bf0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="300,83.33333333333333 313.0618944953883,132.02184456944562 363.40376775301024,129.39886704167017 321.13458925100343,156.86704431944327 339.18568348616486,203.93446629166317 300,172.22222222222223 260.81431651383514,203.93446629166317 278.86541074899657,156.86704431944327 236.59623224698976,129.39886704167017 286.9381055046117,132.02184456944562 300,83.33333333333333 313.0618944953883,132.02184456944562 "
stroke="#0000bf"
stroke-width="15"
fill-opacity="1"
stroke-opacity="1"
stroke-dasharray="5,2,2,2"
stroke-linecap="square"
></polygon>
</g>
<defs>
<filter id="svg_2_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_star_change_sides #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>
<polygon
cx="300"
cy="150"
id="svg_1"
shape="star"
point="6"
r="66.66666666666667"
radialshift="0"
r2="22.222222222222225"
orient="point"
fill="#bf0000"
strokecolor="#000000"
strokeWidth="5"
starRadiusMultiplier="3"
points="301.08849207560223,76.2796007792155 312.1996031867133,123.70125847289464 358.8235189945648,109.61293411254883 323.31071429782446,142.94626744588217 358.82351899456484,176.27960077921549 312.1996031867134,162.1912764188697 301.08849207560223,209.61293411254883 289.97738096449115,162.1912764188697 243.35346515663966,176.2796007792155 278.86626985338,142.94626744588217 243.35346515663966,109.61293411254883 289.97738096449115,123.70125847289464 301.08849207560223,76.2796007792155 312.1996031867134,123.70125847289464 "
stroke="#0000bf"
stroke-width="15"
fill-opacity="1"
stroke-opacity="1"
stroke-dasharray="5,2,2,2"
stroke-linecap="square"
></polygon>
</g>
<defs>
<filter id="svg_2_id_blur" x="-50%" y="-50%" width="200%" height="200%">
<feGaussianBlur in="SourceGraphic" stdDeviation="5"></feGaussianBlur>
</filter>
</defs>
</svg>
`;

36
cypress/integration/ui/scenario1.js
View File

@ -23,18 +23,6 @@ describe('use all parts of svg-edit', function () {
cy.get('#tool_source_save').click({ force: true });
testSnapshot();
});
it('check tool_line', function () {
cy.get('#tool_line')
.click({ force: true });
cy.get('#svgcontent')
.trigger('mousemove', 200, 200, { force: true })
.trigger('mousedown', 200, 200, { force: true })
.trigger('mousemove', 20, 20, { force: true })
.trigger('mouseup', { force: true });
// cy.get('#angle').click({ force: true }).invoke('attr', 'value', '45');
//.shadow().get('elix-number-spin-box').shadow().find('plain-repeat-button-0').click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_shape', function () {
cy.get('#tool_shapelib').shadow().find('.overall').eq(0).click({ force: true });
cy.get('[data-shape="heart"]').click({ force: true });
@ -49,30 +37,7 @@ describe('use all parts of svg-edit', function () {
.trigger('mouseup', { force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_rect_square', function () {
cy.get('#tool_rect').click({ force: true });
cy.get('#svgcontent')
.trigger('mousedown', 100, -60, { force: true })
.trigger('mousemove', 250, 60, { force: true })
.trigger('mouseup', { force: true });
cy.get('#tool_square').click({ force: true });
cy.get('#svgcontent')
.trigger('mousedown', 250, -60, { force: true })
.trigger('mousemove', 430, 120, { force: true })
.trigger('mouseup', { force: true });
cy.get('#tool_fhrect')
.click({ force: true });
cy.get('#svgcontent')
.trigger('mousedown', 20, 80, { force: true })
.trigger('mousemove', 120, 80, { force: true })
.trigger('mousemove', 120, 180, { force: true })
.trigger('mousemove', 20, 180, { force: true })
.trigger('mousemove', 20, 80, { force: true })
.trigger('mouseup', 20, 80, { force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_image', function () {
cy.get('#tool_image').click({ force: true });
cy.get('#svgcontent')
.trigger('mousedown', 100, 100, { force: true })
@ -87,5 +52,4 @@ describe('use all parts of svg-edit', function () {
});
cy.get('#svgcontent').toMatchSnapshot();
});
});

164
cypress/integration/ui/scenario7.js Normal file
View File

@ -0,0 +1,164 @@
import {
visitAndApproveStorage
} from '../../support/ui-test-helper.js';
const testSnapshot = () => {
cy.get('#svgcontent').cleanSnapshot();
};
describe('use all parts of svg-edit', function () {
before(() => {
visitAndApproveStorage();
});
it('check tool_source_set', function () {
cy.get('#tool_source').click({ force: true });
cy.get('#svg_source_textarea')
.type('{selectall}', { force: true })
.type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<g class="layer">
<title>Layer 1</title>
</g>
</svg>`, { force: true, parseSpecialCharSequences: false });
cy.get('#tool_source_save').click({ force: true });
testSnapshot();
});
it('check tool_star', function () {
cy.get('#tool_star')
.click({ force: true });
cy.get('#svgcontent')
.trigger('mousedown', 300, 150, { force: true })
.trigger('mousemove', 300, 250, { force: true })
.trigger('mouseup', { force: true });
testSnapshot();
});
it('check tool_star_clone', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#tool_clone').click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_class', function () {
cy.get('#svg_2').click({ force: true });
cy.get('#elem_class').shadow().find('elix-input').eq(0).shadow().find('#inner').eq(0)
.type('svg_2_class{enter}', { force: true });
cy.get('#svg_2')
.should('satisfy', ($el) => {
const classList = Array.from($el[0].classList);
return classList.includes('svg_2_class');
});
});
it('check tool_star_change_id', function () {
cy.get('#svg_2').click({ force: true }).click({ force: true });
cy.get('#elem_id').shadow().find('elix-input').eq(0).shadow().find('#inner').eq(0)
.type('_id{enter}', { force: true });
cy.get('#svg_2_id')
.should('satisfy', ($el) => {
const classList = Array.from($el[0].classList);
return classList.includes('svg_2_class');
});
});
it('check tool_star_change_rotation', function () {
cy.get('#svg_2_id').click({ force: true });
for(let n = 0; n < 5; n ++){
cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
}
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_blur', function () {
cy.get('#svg_2_id').click({ force: true });
for(let n = 0; n < 10; n ++){
cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
}
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_opacity', function () {
cy.get('#svg_2_id').click({ force: true });
for(let n = 0; n < 10; n ++){
cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
.click({ force: true });
}
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_bring_to_back', function () {
cy.get('#svg_2_id').click({ force: true });
cy.get('#tool_move_bottom').click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_bring_to_front', function () {
cy.get('#svg_2_id').click({ force: true });
cy.get('#tool_move_top').click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_delete', function () {
cy.get('#svg_2_id').click({ force: true });
cy.get('#tool_delete').click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_align_to_page', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#tool_position').shadow().find('elix-dropdown-list').eq(0).invoke('attr', 'opened', 'opened');
cy.get('#tool_position').find('se-list-item').eq(0).shadow().find('elix-option').eq(0)
.click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
/* it('check tool_star_change_x_y_coordinate', function () {
cy.get('#svg_1').click({ force: true });
for(let n = 0; n < 25; n ++){
cy.get('#selected_x').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
}
for(let n = 0; n < 25; n ++){
cy.get('#selected_y').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
}
cy.get('#svgcontent').toMatchSnapshot();
}); */
it('check tool_star_change_stroke_width', function () {
cy.get('#svg_1').click({ force: true });
for(let n = 0; n < 10; n ++){
cy.get('#stroke_width').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
}
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_stroke_style', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#stroke_style').shadow().find('elix-dropdown-list').eq(0).invoke('attr', 'opened', 'opened');
cy.get('#stroke_style').find('se-list-item').eq(3).shadow().find('elix-option').eq(0)
.click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_line_cap', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#stroke_linecap').shadow().find('elix-dropdown-list').eq(0).invoke('attr', 'opened', 'opened');
cy.get('#stroke_linecap').find('se-list-item').eq(1).shadow().find('elix-option').eq(0)
.click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_stoke_fill_color', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#stroke_color').shadow().find('#picker').eq(0).click({ force: true });
cy.get('#stroke_color').shadow().find('#color_picker').eq(0)
.find('#jGraduate_colPick').eq(0).find('#jPicker-table').eq(0)
.find('.QuickColor').eq(51).click({ force: true });
cy.get('#stroke_color').shadow().find('#color_picker').eq(0)
.find('#jGraduate_colPick').eq(0).find('#jPicker-table').eq(0)
.find('#Ok').eq(0).click({ force: true });
cy.get('#fill_color').shadow().find('#picker').eq(0).click({ force: true });
cy.get('#fill_color').shadow().find('#color_picker').eq(0)
.find('#jGraduate_colPick').eq(0).find('#jPicker-table').eq(0)
.find('.QuickColor').eq(3).click({ force: true });
cy.get('#fill_color').shadow().find('#color_picker').eq(0)
.find('#jGraduate_colPick').eq(0).find('#jPicker-table').eq(0)
.find('#Ok').eq(0).click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
it('check tool_star_change_sides', function () {
cy.get('#svg_1').click({ force: true });
cy.get('#starNumPoints').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
.click({ force: true });
cy.get('#svgcontent').toMatchSnapshot();
});
});