#623 circle, fhellipse and ellipse cypress test case added

cypress/integration/ui/__snapshots__/scenario2.js.snap

@@ -14,7 +14,7 @@ exports[`use all parts of svg-edit > check tool_source_set #0`] = `
 </svg>
 `;
 
-exports[`use all parts of svg-edit > check tool_path #0`] = `
+exports[`use all parts of svg-edit > check tool_circle #0`] = `
 <svg
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg"
@@ -28,13 +28,15 @@ exports[`use all parts of svg-edit > check tool_path #0`] = `
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       opacity="0.5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
     >
       <animate
@@ -44,7 +46,7 @@ exports[`use all parts of svg-edit > check tool_path #0`] = `
         fill="freeze"
         to="1"
       ></animate>
-    </path>
+    </circle>
   </g>
 </svg>
 `;
@@ -63,22 +65,26 @@ exports[`use all parts of svg-edit > check tool_fhellipse #0`] = `
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
-    ></path>
+      fill-opacity="1"
+      stroke-opacity="1"
+    ></circle>
     <ellipse
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       opacity="0.5"
       style="pointer-events:inherit"
-      cx="310"
+      cx="299"
-      cy="180"
+      cy="169"
       rx="60"
       ry="50"
       id="svg_2"
@@ -95,7 +101,7 @@ exports[`use all parts of svg-edit > check tool_fhellipse #0`] = `
 </svg>
 `;
 
-exports[`use all parts of svg-edit > check tool_ellipse_circle #0`] = `
+exports[`use all parts of svg-edit > check tool_ellipse #0`] = `
 <svg
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg"
@@ -109,21 +115,25 @@ exports[`use all parts of svg-edit > check tool_ellipse_circle #0`] = `
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
-    ></path>
+      fill-opacity="1"
+      stroke-opacity="1"
+    ></circle>
     <ellipse
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      cx="310"
+      cx="299"
-      cy="180"
+      cy="169"
       rx="60"
       ry="50"
       id="svg_2"
@@ -136,8 +146,8 @@ exports[`use all parts of svg-edit > check tool_ellipse_circle #0`] = `
       stroke-width="5"
       opacity="0.5"
       style="pointer-events:inherit"
-      cx="125"
+      cx="114"
-      cy="200"
+      cy="189"
       rx="55"
       ry="25"
       id="svg_3"
@@ -150,25 +160,6 @@ exports[`use all parts of svg-edit > check tool_ellipse_circle #0`] = `
         to="1"
       ></animate>
     </ellipse>
-    <circle
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      opacity="0.5"
-      style="pointer-events:inherit"
-      cx="200"
-      cy="100"
-      r="30"
-      id="svg_4"
-    >
-      <animate
-        attributeName="opacity"
-        begin="indefinite"
-        dur="0.2"
-        fill="freeze"
-        to="1"
-      ></animate>
-    </circle>
   </g>
 </svg>
 `;
@@ -187,20 +178,24 @@ exports[`use all parts of svg-edit > check tool_circle_change_fill_color #0`] =
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
-    ></path>
+      fill-opacity="1"
+      stroke-opacity="1"
+    ></circle>
     <ellipse
       fill="#ffff00"
       stroke="#000000"
       stroke-width="5"
-      cx="310"
+      cx="299"
-      cy="180"
+      cy="169"
       rx="60"
       ry="50"
       id="svg_2"
@@ -212,26 +207,14 @@ exports[`use all parts of svg-edit > check tool_circle_change_fill_color #0`] =
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      cx="125"
+      cx="114"
-      cy="200"
+      cy="189"
       rx="55"
       ry="25"
       id="svg_3"
       fill-opacity="1"
       stroke-opacity="1"
     ></ellipse>
-    <circle
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      style="pointer-events:inherit"
-      cx="200"
-      cy="100"
-      r="30"
-      id="svg_4"
-      fill-opacity="1"
-      stroke-opacity="1"
-    ></circle>
   </g>
 </svg>
 `;
@@ -250,20 +233,24 @@ exports[`use all parts of svg-edit > check tool_circle_change_opacity #0`] = `
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
-    ></path>
+      fill-opacity="1"
+      stroke-opacity="1"
+    ></circle>
     <ellipse
       fill="#ffff00"
       stroke="#000000"
       stroke-width="5"
-      cx="310"
+      cx="299"
-      cy="180"
+      cy="169"
       rx="60"
       ry="50"
       id="svg_2"
@@ -276,94 +263,14 @@ exports[`use all parts of svg-edit > check tool_circle_change_opacity #0`] = `
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      cx="125"
+      cx="114"
-      cy="200"
+      cy="189"
       rx="55"
       ry="25"
       id="svg_3"
       fill-opacity="1"
       stroke-opacity="1"
     ></ellipse>
-    <circle
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      style="pointer-events:inherit"
-      cx="200"
-      cy="100"
-      r="30"
-      id="svg_4"
-      fill-opacity="1"
-      stroke-opacity="1"
-    ></circle>
-  </g>
-</svg>
-`;
-
-exports[`use all parts of svg-edit > check tool_circle_change_rotation #0`] = `
-<svg
-  id="svgcontent"
-  width="640"
-  height="480"
-  x="640"
-  y="480"
-  overflow="visible"
-  xmlns="http://www.w3.org/2000/svg"
-  xmlns:se="http://svg-edit.googlecode.com"
-  xmlns:xlink="http://www.w3.org/1999/xlink"
-  viewBox="0 0 640 480"
->
-  <!-- Created with SVG-edit - https://github.com/SVG-Edit/svgedit-->
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
-    <path
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
-      id="svg_1"
-    ></path>
-    <ellipse
-      fill="#ffff00"
-      stroke="#000000"
-      stroke-width="5"
-      cx="310"
-      cy="180"
-      rx="60"
-      ry="50"
-      id="svg_2"
-      fill-opacity="1"
-      stroke-opacity="1"
-      opacity="0.5"
-      transform="rotate(10 310 180)"
-    ></ellipse>
-    <ellipse
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      style="pointer-events:inherit"
-      cx="125"
-      cy="200"
-      rx="55"
-      ry="25"
-      id="svg_3"
-      fill-opacity="1"
-      stroke-opacity="1"
-      transform="rotate(15 125 200)"
-    ></ellipse>
-    <circle
-      fill="#FF0000"
-      stroke="#000000"
-      stroke-width="5"
-      style="pointer-events:inherit"
-      cx="200"
-      cy="100"
-      r="30"
-      id="svg_4"
-      fill-opacity="1"
-      stroke-opacity="1"
-    ></circle>
   </g>
 </svg>
 `;
@@ -382,20 +289,24 @@ exports[`use all parts of svg-edit > check tool_ellipse_change_rotation #0`] = `
 >
   <g class="layer" style="pointer-events:all">
     <title style="pointer-events:inherit">Layer 1</title>
-    <path
+    <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      d="M 50 50 L 150 100 L 125 200 L 50 50 z"
+      cx="150"
+      cy="150"
+      r="111.80339887498948"
       id="svg_1"
-    ></path>
+      fill-opacity="1"
+      stroke-opacity="1"
+    ></circle>
     <ellipse
       fill="#ffff00"
       stroke="#000000"
       stroke-width="5"
-      cx="310"
+      cx="299"
-      cy="180"
+      cy="169"
       rx="60"
       ry="50"
       id="svg_2"
@@ -407,27 +318,400 @@ exports[`use all parts of svg-edit > check tool_ellipse_change_rotation #0`] = `
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
-      cx="125"
+      cx="114"
-      cy="200"
+      cy="189"
       rx="55"
       ry="25"
       id="svg_3"
       fill-opacity="1"
       stroke-opacity="1"
-      transform="rotate(25 125 200)"
+      transform="rotate(25 114 189)"
+    ></ellipse>
+  </g>
+</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"
+  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="139"
+      cy="214"
+      rx="55"
+      ry="25"
+      id="svg_3"
+      fill-opacity="1"
+      stroke-opacity="1"
+      filter="url(#svg_3_blur)"
+      transform="rotate(25 139 214)"
+    ></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_rx_ry_radius #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="139"
+      cy="214"
+      rx="80"
+      ry="50"
+      id="svg_3"
+      fill-opacity="1"
+      stroke-opacity="1"
+      filter="url(#svg_3_blur)"
+      transform="rotate(25 139 214)"
+    ></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_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>
+    <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>
     <circle
       fill="#FF0000"
       stroke="#000000"
       stroke-width="5"
       style="pointer-events:inherit"
-      cx="200"
+      cx="150"
-      cy="100"
+      cy="150"
-      r="30"
+      r="111.80339887498948"
-      id="svg_4"
+      id="svg_1"
       fill-opacity="1"
       stroke-opacity="1"
     ></circle>
+    <ellipse
+      fill="#FF0000"
+      stroke="#000000"
+      stroke-width="5"
+      cx="139"
+      cy="214"
+      rx="80"
+      ry="50"
+      id="svg_3"
+      fill-opacity="1"
+      stroke-opacity="1"
+      filter="url(#svg_3_blur)"
+      transform="rotate(25 139 214)"
+    ></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_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>
+    <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="#FF0000"
+      stroke="#000000"
+      stroke-width="5"
+      cx="139"
+      cy="214"
+      rx="80"
+      ry="50"
+      id="svg_3"
+      fill-opacity="1"
+      stroke-opacity="1"
+      filter="url(#svg_3_blur)"
+      transform="rotate(25 139 214)"
+    ></ellipse>
+    <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>
+  </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_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>
+    <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="#FF0000"
+      stroke="#000000"
+      stroke-width="5"
+      cx="139"
+      cy="214"
+      rx="80"
+      ry="50"
+      id="svg_3"
+      fill-opacity="1"
+      stroke-opacity="1"
+      filter="url(#svg_3_blur)"
+      transform="rotate(25 139 214)"
+    ></ellipse>
+    <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="#ffff00"
+      stroke="#000000"
+      stroke-width="5"
+      cx="319"
+      cy="189"
+      rx="60"
+      ry="50"
+      fill-opacity="1"
+      stroke-opacity="1"
+      opacity="0.5"
+      id="svg_4"
+    ></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>
 `;

cypress/integration/ui/scenario2.js

@@ -23,20 +23,12 @@ describe('use all parts of svg-edit', function () {
     cy.get('#tool_source_save').click({ force: true });
     testSnapshot();
   });
-  it('check tool_path', function () {
+  it('check tool_circle', function () {
-    cy.get('#tool_path')
+    cy.get('#tool_circle')
       .click({ force: true });
     cy.get('#svgcontent')
-      .trigger('mousedown', 50, 50, { force: true })
+      .trigger('mousedown', 150, 150, { force: true })
-      .trigger('mouseup', { force: true })
+      .trigger('mousemove', 250, 200, { force: true })
-      .trigger('mousemove', 100, 50, { force: true })
-      .trigger('mousedown', 100, 50, { force: true })
-      .trigger('mouseup', { force: true })
-      .trigger('mousemove', 75, 150, { force: true })
-      .trigger('mousedown', 75, 150, { force: true })
-      .trigger('mouseup', { force: true })
-      .trigger('mousemove', 0, 0, { force: true })
-      .trigger('mousedown', 0, 0, { force: true })
       .trigger('mouseup', { force: true });
     cy.get('#svgcontent').toMatchSnapshot();
   });
@@ -52,17 +44,12 @@ describe('use all parts of svg-edit', function () {
       .trigger('mouseup', 200, 80, { force: true });
     cy.get('#svgcontent').toMatchSnapshot();
   });
-  it('check tool_ellipse_circle', function () {
+  it('check tool_ellipse', function () {
     cy.get('#tool_ellipse').click({ force: true });
     cy.get('#svgcontent')
       .trigger('mousedown', 75, 150, { force: true })
       .trigger('mousemove', 130, 175, { force: true })
       .trigger('mouseup', { force: true });
-    cy.get('#tool_circle').click({ force: true });
-    cy.get('#svgcontent')
-      .trigger('mousedown', 150, 50, { force: true })
-      .trigger('mousemove', 150, 80, { force: true })
-      .trigger('mouseup', { force: true });
     cy.get('#svgcontent').toMatchSnapshot();
   });
   it('check tool_circle_change_fill_color', function () {
@@ -73,7 +60,6 @@ describe('use all parts of svg-edit', function () {
   });
   it('check tool_circle_change_opacity', function () {
     cy.get('#svg_2').click({ force: true });
-    // cy.get('#opacity').trigger('click', 'bottomRight');
     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 });
@@ -82,12 +68,57 @@ describe('use all parts of svg-edit', function () {
   });
   it('check tool_ellipse_change_rotation', function () {
     cy.get('#svg_3').click({ force: true });
-    // cy.get('#opacity').trigger('click', 'bottomRight');
     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_ellipse_change_blur', function () {
+    cy.get('#svg_3').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_ellipse_change_cx_cy_coordinate', function () {
+    cy.get('#svg_3').click({ force: true });
+    for(let n = 0; n < 25; n ++){
+      cy.get('#ellipse_cx').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('#ellipse_cy').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
+        .click({ force: true });
+    }
+    cy.get('#svgcontent').toMatchSnapshot();
+  });
+  it('check tool_ellipse_change_rx_ry_radius', function () {
+    cy.get('#svg_3').click({ force: true });
+    for(let n = 0; n < 25; n ++){
+      cy.get('#ellipse_rx').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('#ellipse_ry').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
+        .click({ force: true });
+    }
+    cy.get('#svgcontent').toMatchSnapshot();
+  });
+  it('check tool_ellipse_bring_to_back', function () {
+    cy.get('#svg_2').click({ force: true });
+    cy.get('#tool_move_bottom').click({ force: true });
+    cy.get('#svgcontent').toMatchSnapshot();
+  });
+  it('check tool_ellipse_bring_to_front', function () {
+    cy.get('#svg_2').click({ force: true });
+    cy.get('#tool_move_top').click({ force: true });
+    cy.get('#svgcontent').toMatchSnapshot();
+  });
+  it('check tool_ellipse_clone', function () {
+    cy.get('#svg_2').click({ force: true });
+    cy.get('#tool_clone').click({ force: true });
+    cy.get('#svgcontent').toMatchSnapshot();
+  });
 });