in progress

2021-12-27 20:54:49 -03:00
parent f32be000a0
commit 258e2bd6a1
28 changed files with 220 additions and 218 deletions
--- a/cypress/integration/ui/snapshots/scenario.js.snap
+++ b/cypress/integration/ui/snapshots/scenario.js.snap
@@ -28,9 +28,7 @@ exports[`use various parts of svg-edit > check tool_fhpath #0`] = `
  fill-opacity="1"
  stroke-opacity="1"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
-  </g>
+  <g class="layer"><title>Layer 1</title></g>
 </svg>
 `;

--- a/cypress/integration/ui/snapshots/scenario2.js.snap
+++ b/cypress/integration/ui/snapshots/scenario2.js.snap
@@ -26,14 +26,13 @@ exports[`use all parts of svg-edit > check tool_circle #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <circle
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      cx="150"
      cy="150"
      r="111.80339887498948"
@@ -63,13 +62,12 @@ exports[`use all parts of svg-edit > check tool_fhellipse #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <circle
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      cx="150"
      cy="150"
      r="111.80339887498948"
@@ -82,7 +80,6 @@ exports[`use all parts of svg-edit > check tool_fhellipse #0`] = `
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      cx="299"
      cy="169"
      rx="60"
@@ -113,13 +110,12 @@ exports[`use all parts of svg-edit > check tool_ellipse #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <circle
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      cx="150"
      cy="150"
      r="111.80339887498948"
@@ -131,7 +127,6 @@ exports[`use all parts of svg-edit > check tool_ellipse #0`] = `
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      cx="299"
      cy="169"
      rx="60"
@@ -145,7 +140,6 @@ exports[`use all parts of svg-edit > check tool_ellipse #0`] = `
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      cx="114"
      cy="189"
      rx="55"
@@ -176,13 +170,12 @@ exports[`use all parts of svg-edit > check tool_circle_change_fill_color #0`] =
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <circle
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      cx="150"
      cy="150"
      r="111.80339887498948"
@@ -206,7 +199,6 @@ exports[`use all parts of svg-edit > check tool_circle_change_fill_color #0`] =
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      cx="114"
      cy="189"
      rx="55"
@@ -214,6 +206,7 @@ exports[`use all parts of svg-edit > check tool_circle_change_fill_color #0`] =
      id="svg_3"
      fill-opacity="1"
      stroke-opacity="1"
+      transform="matrix(1 0 0 1 0 0)"
    ></ellipse>
  </g>
 </svg>
--- a/cypress/integration/ui/snapshots/scenario3.js.snap
+++ b/cypress/integration/ui/snapshots/scenario3.js.snap
@@ -26,14 +26,13 @@ exports[`use all parts of svg-edit > check tool_path #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <path
      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"
      id="svg_1"
    >
@@ -61,8 +60,8 @@ exports[`use all parts of svg-edit > check tool_path_change_node_xy #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <path
      fill="#FF0000"
      stroke="#000000"
@@ -88,8 +87,8 @@ exports[`use all parts of svg-edit > check tool_path_change_seg_type #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <path
      fill="#FF0000"
      stroke="#000000"
@@ -115,8 +114,8 @@ exports[`use all parts of svg-edit > check tool_path_change_clone_node #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <path
      fill="#FF0000"
      stroke="#000000"
@@ -142,8 +141,8 @@ exports[`use all parts of svg-edit > check tool_path_openclose #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <path
      fill="#FF0000"
      stroke="#000000"
--- a/cypress/integration/ui/snapshots/scenario4.js.snap
+++ b/cypress/integration/ui/snapshots/scenario4.js.snap
@@ -26,14 +26,13 @@ exports[`use all parts of svg-edit > check tool_rect #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <rect
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      x="150"
      y="150"
      width="100"
@@ -64,13 +63,12 @@ exports[`use all parts of svg-edit > check tool_fhrect #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <rect
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      x="150"
      y="150"
      width="100"
@@ -84,7 +82,6 @@ exports[`use all parts of svg-edit > check tool_fhrect #0`] = `
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      x="350"
      y="230"
      width="120"
@@ -115,13 +112,12 @@ exports[`use all parts of svg-edit > check tool_square #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <rect
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      x="150"
      y="150"
      width="100"
@@ -134,7 +130,6 @@ exports[`use all parts of svg-edit > check tool_square #0`] = `
      fill="#FF0000"
      stroke="#000000"
      stroke-width="5"
-      style="pointer-events:inherit"
      x="350"
      y="230"
      width="120"
@@ -148,7 +143,6 @@ exports[`use all parts of svg-edit > check tool_square #0`] = `
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:inherit"
      x="225"
      y="300"
      width="50"
--- a/cypress/integration/ui/snapshots/scenario5.js.snap
+++ b/cypress/integration/ui/snapshots/scenario5.js.snap
@@ -26,14 +26,13 @@ exports[`use all parts of svg-edit > check tool_line #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <line
      fill="none"
      stroke="#000000"
      stroke-width="5"
      opacity="0.5"
-      style="pointer-events:none"
      x1="200"
      y1="200"
      x2="450"
--- a/cypress/integration/ui/snapshots/scenario6.js.snap
+++ b/cypress/integration/ui/snapshots/scenario6.js.snap
@@ -67,8 +67,8 @@ exports[`use all parts of svg-edit > check tool_polygon_clone #0`] = `
  y="480"
  viewBox="0 0 640 480"
 >
-  <g class="layer" style="pointer-events:all">
-    <title style="pointer-events:inherit">Layer 1</title>
+  <g class="layer">
+    <title>Layer 1</title>
    <polygon
      cx="325"
      cy="250"
@@ -79,7 +79,7 @@ exports[`use all parts of svg-edit > check tool_polygon_clone #0`] = `
      edge="63.333333333333336"
      fill="#FF0000"
      strokecolor="#000000"
-      strokeWidth="5"
+      strokewidth="5"
      points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 "
      stroke="#000000"
      stroke-width="5"
@@ -95,7 +95,7 @@ exports[`use all parts of svg-edit > check tool_polygon_clone #0`] = `
      edge="63.333333333333336"
      fill="#FF0000"
      strokecolor="#000000"
-      strokeWidth="5"
+      strokewidth="5"
      points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 "
      stroke="#000000"
      stroke-width="5"
--- a/cypress/integration/ui/scenario.js
+++ b/cypress/integration/ui/scenario.js
@@ -31,7 +31,7 @@ describe('use various parts of svg-edit', function () {
      .trigger('mousedown', 200, 200, { force: true })
      .trigger('mousemove', 20, 20, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text', function () {
    cy.get('#tool_text')
@@ -54,6 +54,8 @@ describe('use various parts of svg-edit', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_italic')
      .click({ force: true });
+    // eslint-disable-next-line cypress/no-unnecessary-waiting
+    cy.wait(500);
    testSnapshot();
  });
  it('check tool_bold', function () {
@@ -72,7 +74,7 @@ describe('use various parts of svg-edit', function () {
      cy.get('#selected_y').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_font_size', function () {
    cy.get('#svg_1').click({ force: true });
@@ -80,13 +82,13 @@ describe('use various parts of svg-edit', function () {
      cy.get('#font_size').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_stroke_width', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#stroke_width').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_stoke_fill_color', function () {
    cy.get('#svg_1').click({ force: true });
@@ -104,7 +106,7 @@ describe('use various parts of svg-edit', function () {
    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();
+    testSnapshot();
  });
  it('check tool_text_anchor_start', function () {
    cy.get('#svg_1').click({ force: true });
@@ -130,7 +132,7 @@ describe('use various parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_blur', function () {
    cy.get('#svg_2').click({ force: true });
@@ -138,7 +140,7 @@ describe('use various parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_opacity', function () {
    cy.get('#svg_2').click({ force: true });
@@ -146,14 +148,14 @@ describe('use various parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_align_to_page', function () {
    cy.get('#svg_2').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(2).shadow().find('elix-option').eq(0)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_class', function () {
    cy.get('#svg_2').click({ force: true });
@@ -178,11 +180,11 @@ describe('use various parts of svg-edit', function () {
  it('check tool_text_delete', function () {
    cy.get('#svg_2_id').click({ force: true });
    cy.get('#tool_delete').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_text_change_font_family', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_font_family').shadow().find('select').select("Serif");
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
 });
--- a/cypress/integration/ui/scenario1.js
+++ b/cypress/integration/ui/scenario1.js
@@ -35,7 +35,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown')
      .trigger('mousemove', 20, 20, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_image', function () {
    cy.get('#tool_image').click({ force: true });
@@ -50,6 +50,6 @@ describe('use all parts of svg-edit', function () {
        cy.stub($win, 'prompt').returns('./images/logo.svg');
        cy.contains('OK');
      });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
 });
--- a/cypress/integration/ui/scenario2.js
+++ b/cypress/integration/ui/scenario2.js
@@ -30,7 +30,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 150, 150, { force: true })
      .trigger('mousemove', 250, 200, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_fhellipse', function () {
    cy.get('#tool_fhellipse')
@@ -42,7 +42,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousemove', 200, 180, { force: true })
      .trigger('mousemove', 200, 80, { force: true })
      .trigger('mouseup', 200, 80, { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_ellipse', function () {
    cy.get('#tool_ellipse').click({ force: true });
@@ -50,13 +50,13 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 75, 150, { force: true })
      .trigger('mousemove', 130, 175, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_circle_change_fill_color', function () {
    cy.get('#svg_2').click({ force: true });
    cy.get('#js-se-palette').find('.square').eq(8)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_circle_change_opacity', function () {
    cy.get('#svg_2').click({ force: true });
@@ -64,7 +64,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_ellipse_change_rotation', function () {
    cy.get('#svg_3').click({ force: true });
@@ -72,7 +72,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_ellipse_change_blur', function () {
    cy.get('#svg_3').click({ force: true });
@@ -80,7 +80,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_ellipse_change_cx_cy_coordinate', function () {
    cy.get('#svg_3').click({ force: true });
@@ -92,7 +92,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#ellipse_cy').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_ellipse_change_rx_ry_radius', function () {
    cy.get('#svg_3').click({ force: true });
@@ -104,21 +104,21 @@ describe('use all parts of svg-edit', function () {
      cy.get('#ellipse_ry').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  it('check tool_ellipse_clone', function () {
    cy.get('#svg_2').click({ force: true });
    cy.get('#tool_clone').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
 });
--- a/cypress/integration/ui/scenario3.js
+++ b/cypress/integration/ui/scenario3.js
@@ -38,7 +38,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousemove', 0, 0, { force: true })
      .trigger('mousedown', 0, 0, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_path_change_node_xy', function () {
    cy.get('#svg_1').click({ force: true });
@@ -51,7 +51,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#path_node_y').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_path_change_seg_type', function () {
    cy.get('#svg_1').click({ force: true });
@@ -61,7 +61,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', { force: true })
      .trigger('mousemove', 130, 175, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_path_change_clone_node', function () {
    cy.get('#svg_1').click({ force: true });
@@ -71,14 +71,14 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', { force: true })
      .trigger('mousemove', 130, 175, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_path_openclose', function () {
    cy.get('#tool_select').click({ force: true });
    cy.get('#svg_1').click({ force: true });
    cy.get('#svg_1').dblclick({ force: true });
    cy.get('#tool_openclose_path').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  /* it('check tool_path_add_subpath', function () {
    cy.get('#tool_add_subpath').click({ force: true });
@@ -95,6 +95,6 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 0, 0, { force: true })
      .trigger('mouseup', { force: true });
    cy.get('#tool_select').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  }); */
 });
--- a/cypress/integration/ui/scenario4.js
+++ b/cypress/integration/ui/scenario4.js
@@ -30,7 +30,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 150, 150, { force: true })
      .trigger('mousemove', 250, 200, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_fhrect', function () {
    cy.get('#tool_fhrect')
@@ -42,7 +42,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousemove', 200, 180, { force: true })
      .trigger('mousemove', 200, 80, { force: true })
      .trigger('mouseup', 200, 80, { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_square', function () {
    cy.get('#tool_square').click({ force: true });
@@ -50,13 +50,13 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 75, 150, { force: true })
      .trigger('mousemove', 125, 200, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_fill_color', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#js-se-palette').find('.square').eq(8)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_rotation', function () {
    cy.get('#svg_1').click({ force: true });
@@ -64,7 +64,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_blur', function () {
    cy.get('#svg_1').click({ force: true });
@@ -72,7 +72,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_opacity', function () {
    cy.get('#svg_1').click({ force: true });
@@ -80,7 +80,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_fhrect_change_x_y_coordinate', function () {
    cy.get('#svg_2').click({ force: true });
@@ -92,7 +92,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#selected_y').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_fhrect_change_width_height', function () {
    cy.get('#svg_2').click({ force: true });
@@ -104,22 +104,22 @@ describe('use all parts of svg-edit', function () {
      cy.get('#rect_height').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_square_clone', function () {
    cy.get('#svg_3').click({ force: true });
    cy.get('#tool_clone').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_square_bring_to_back', function () {
    cy.get('#svg_3').click({ force: true });
    cy.get('#tool_move_bottom').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_square_bring_to_front', function () {
    cy.get('#svg_3').click({ force: true });
    cy.get('#tool_move_top').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_square_change_corner_radius', function () {
    cy.get('#svg_4').click({ force: true });
@@ -127,19 +127,19 @@ describe('use all parts of svg-edit', function () {
      cy.get('#rect_rx').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_to_path', function () {
    cy.get('#svg_2').click({ force: true });
    cy.get('#tool_topath').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_delete', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_delete').click({ force: true });
    cy.get('#svg_3').click({ force: true });
    cy.get('#tool_delete').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_rect_change_class', function () {
    cy.get('#svg_2').click({ force: true });
--- a/cypress/integration/ui/scenario5.js
+++ b/cypress/integration/ui/scenario5.js
@@ -31,7 +31,7 @@ describe('use all parts of svg-edit', function () {
      .trigger('mousedown', 200, 200, { force: true })
      .trigger('mousemove', 250, 250, { force: true })
      .trigger('mouseup', { force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_class', function () {
    cy.get('#svg_1').click({ force: true });
@@ -59,7 +59,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_blur', function () {
    cy.get('#svg_1_id').click({ force: true });
@@ -67,7 +67,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_opacity', function () {
    cy.get('#svg_1_id').click({ force: true });
@@ -75,12 +75,12 @@ describe('use all parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_delete', function () {
    cy.get('#svg_1_id').click({ force: true });
    cy.get('#tool_delete').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_clone', function () {
    cy.get('#tool_line')
@@ -92,17 +92,17 @@ describe('use all parts of svg-edit', function () {
      .trigger('mouseup', { force: true });
    cy.get('#svg_2').click({ force: true });
    cy.get('#tool_clone').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_bring_to_back', function () {
    cy.get('#svg_2').click({ force: true });
    cy.get('#tool_move_bottom').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_bring_to_front', function () {
    cy.get('#svg_2').click({ force: true });
    cy.get('#tool_move_top').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_x_y_coordinate', function () {
    cy.get('#svg_2').click({ force: true });
@@ -122,7 +122,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#line_y2').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_stroke_width', function () {
    cy.get('#svg_2').click({ force: true });
@@ -130,7 +130,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#stroke_width').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_change_stoke_color', function () {
    cy.get('#svg_3').click({ force: true });
@@ -141,13 +141,13 @@ describe('use all parts of svg-edit', function () {
    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('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_line_align_to_page', function () {
    cy.get('#svg_3').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(2).shadow().find('elix-option').eq(0)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
 });
--- a/cypress/integration/ui/scenario6.js
+++ b/cypress/integration/ui/scenario6.js
@@ -35,7 +35,7 @@ describe('use all parts of svg-edit', function () {
  it('check tool_polygon_clone', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_clone').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_change_class', function () {
    cy.get('#svg_2').click({ force: true });
@@ -63,7 +63,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_change_blur', function () {
    cy.get('#svg_2_id').click({ force: true });
@@ -71,7 +71,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_change_opacity', function () {
    cy.get('#svg_2_id').click({ force: true });
@@ -79,29 +79,29 @@ describe('use all parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_bring_to_back', function () {
    cy.get('#svg_2_id').click({ force: true });
    cy.get('#tool_move_bottom').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_bring_to_front', function () {
    cy.get('#svg_2_id').click({ force: true });
    cy.get('#tool_move_top').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_delete', function () {
    cy.get('#svg_2_id').click({ force: true });
    cy.get('#tool_delete').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_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();
+    testSnapshot();
  });
  /* it('check tool_polygon_change_x_y_coordinate', function () {
    cy.get('#svg_1').click({ force: true });
@@ -113,7 +113,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#selected_y').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  }); */
  it('check tool_polygon_change_stroke_width', function () {
    cy.get('#svg_1').click({ force: true });
@@ -121,7 +121,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#stroke_width').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_polygon_change_stoke_fill_color', function () {
    cy.get('#svg_1').click({ force: true });
@@ -139,12 +139,12 @@ describe('use all parts of svg-edit', function () {
    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();
+    testSnapshot();
  });
  it('check tool_polygon_change_sides', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#polySides').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
      .click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
 });
--- a/cypress/integration/ui/scenario7.js
+++ b/cypress/integration/ui/scenario7.js
@@ -35,7 +35,7 @@ describe('use all parts of svg-edit', function () {
  it('check tool_star_clone', function () {
    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_clone').click({ force: true });
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_star_change_class', function () {
    cy.get('#svg_2').click({ force: true });
@@ -63,7 +63,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#angle').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_star_change_blur', function () {
    cy.get('#svg_2_id').click({ force: true });
@@ -71,7 +71,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#blur').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_star_change_opacity', function () {
    cy.get('#svg_2_id').click({ force: true });
@@ -79,29 +79,29 @@ describe('use all parts of svg-edit', function () {
      cy.get('#opacity').shadow().find('elix-number-spin-box').eq(0).shadow().find('#downButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
  it('check tool_star_change_stroke_width', function () {
    cy.get('#svg_1').click({ force: true });
@@ -109,7 +109,7 @@ describe('use all parts of svg-edit', function () {
      cy.get('#stroke_width').shadow().find('elix-number-spin-box').eq(0).shadow().find('#upButton').eq(0)
        .click({ force: true });
    }
-    cy.get('#svgcontent').toMatchSnapshot();
+    testSnapshot();
  });
  it('check tool_star_change_stoke_fill_color', function () {
    cy.get('#svg_1').click({ force: true });
@@ -127,12 +127,12 @@ describe('use all parts of svg-edit', function () {
    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();
+    testSnapshot();
  });
  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();
+    testSnapshot();
  });
 });
--- a/cypress/integration/unit/history.js
+++ b/cypress/integration/unit/history.js
@@ -1,6 +1,6 @@
 import { NS } from '../../../instrumented/svgcanvas/namespaces.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
-import * as hstory from '../../../instrumented/svgcanvas/history.js';
+import * as history from '../../../instrumented/svgcanvas/history.js';

 describe('history', function () {
  // TODO(codedread): Write tests for handling history events.
@@ -14,7 +14,7 @@ describe('history', function () {
  // const svg = document.createElementNS(NS.SVG, 'svg');
  let undoMgr = null;

-  class MockCommand extends hstory.Command {
+  class MockCommand extends history.Command {
    constructor (optText) {
      super();
      this.text = optText;
@@ -39,7 +39,7 @@ describe('history', function () {
   * @returns {void}
   */
  beforeEach(function () {
-    undoMgr = new hstory.UndoManager();
+    undoMgr = new history.UndoManager();

    document.body.textContent = '';
    this.divparent = document.createElement('div');
@@ -69,19 +69,19 @@ describe('history', function () {
  });

  it('Test svgedit.history package', function () {
-    assert.ok(hstory);
-    assert.ok(hstory.MoveElementCommand);
-    assert.ok(hstory.InsertElementCommand);
-    assert.ok(hstory.ChangeElementCommand);
-    assert.ok(hstory.RemoveElementCommand);
-    assert.ok(hstory.BatchCommand);
-    assert.ok(hstory.UndoManager);
-    assert.equal(typeof hstory.MoveElementCommand, typeof function () { /* empty fn */ });
-    assert.equal(typeof hstory.InsertElementCommand, typeof function () { /* empty fn */ });
-    assert.equal(typeof hstory.ChangeElementCommand, typeof function () { /* empty fn */ });
-    assert.equal(typeof hstory.RemoveElementCommand, typeof function () { /* empty fn */ });
-    assert.equal(typeof hstory.BatchCommand, typeof function () { /* empty fn */ });
-    assert.equal(typeof hstory.UndoManager, typeof function () { /* empty fn */ });
+    assert.ok(history);
+    assert.ok(history.MoveElementCommand);
+    assert.ok(history.InsertElementCommand);
+    assert.ok(history.ChangeElementCommand);
+    assert.ok(history.RemoveElementCommand);
+    assert.ok(history.BatchCommand);
+    assert.ok(history.UndoManager);
+    assert.equal(typeof history.MoveElementCommand, typeof function () { /* empty fn */ });
+    assert.equal(typeof history.InsertElementCommand, typeof function () { /* empty fn */ });
+    assert.equal(typeof history.ChangeElementCommand, typeof function () { /* empty fn */ });
+    assert.equal(typeof history.RemoveElementCommand, typeof function () { /* empty fn */ });
+    assert.equal(typeof history.BatchCommand, typeof function () { /* empty fn */ });
+    assert.equal(typeof history.UndoManager, typeof function () { /* empty fn */ });
  });

  it('Test UndoManager methods', function () {
@@ -275,7 +275,7 @@ describe('history', function () {
  });

  it('Test MoveElementCommand', function () {
-    let move = new hstory.MoveElementCommand(this.div3, this.div1, this.divparent);
+    let move = new history.MoveElementCommand(this.div3, this.div1, this.divparent);
    assert.ok(move.unapply);
    assert.ok(move.apply);
    assert.equal(typeof move.unapply, typeof function () { /* empty fn */ });
@@ -291,7 +291,7 @@ describe('history', function () {
    assert.equal(this.divparent.firstElementChild.nextElementSibling, this.div2);
    assert.equal(this.divparent.lastElementChild, this.div3);

-    move = new hstory.MoveElementCommand(this.div1, null, this.divparent);
+    move = new history.MoveElementCommand(this.div1, null, this.divparent);

    move.unapply();
    assert.equal(this.divparent.firstElementChild, this.div2);
@@ -303,7 +303,7 @@ describe('history', function () {
    assert.equal(this.divparent.firstElementChild.nextElementSibling, this.div2);
    assert.equal(this.divparent.lastElementChild, this.div3);

-    move = new hstory.MoveElementCommand(this.div2, this.div5, this.div4);
+    move = new history.MoveElementCommand(this.div2, this.div5, this.div4);

    move.unapply();
    assert.equal(this.divparent.firstElementChild, this.div1);
@@ -321,7 +321,7 @@ describe('history', function () {
  });

  it('Test InsertElementCommand', function () {
-    let insert = new hstory.InsertElementCommand(this.div3);
+    let insert = new history.InsertElementCommand(this.div3);
    assert.ok(insert.unapply);
    assert.ok(insert.apply);
    assert.equal(typeof insert.unapply, typeof function () { /* empty fn */ });
@@ -339,7 +339,7 @@ describe('history', function () {
    assert.equal(this.div1.nextElementSibling, this.div2);
    assert.equal(this.div2.nextElementSibling, this.div3);

-    insert = new hstory.InsertElementCommand(this.div2);
+    insert = new history.InsertElementCommand(this.div2);

    insert.unapply();
    assert.equal(this.divparent.childElementCount, 2);
@@ -358,7 +358,7 @@ describe('history', function () {
    const div6 = document.createElement('div');
    div6.id = 'div6';

-    let remove = new hstory.RemoveElementCommand(div6, null, this.divparent);
+    let remove = new history.RemoveElementCommand(div6, null, this.divparent);
    assert.ok(remove.unapply);
    assert.ok(remove.apply);
    assert.equal(typeof remove.unapply, typeof function () { /* empty fn */ });
@@ -377,7 +377,7 @@ describe('history', function () {
    assert.equal(this.div1.nextElementSibling, this.div2);
    assert.equal(this.div2.nextElementSibling, this.div3);

-    remove = new hstory.RemoveElementCommand(div6, this.div2, this.divparent);
+    remove = new history.RemoveElementCommand(div6, this.div2, this.divparent);

    remove.unapply();
    assert.equal(this.divparent.childElementCount, 4);
@@ -395,7 +395,7 @@ describe('history', function () {

  it('Test ChangeElementCommand', function () {
    this.div1.setAttribute('title', 'new title');
-    let change = new hstory.ChangeElementCommand(this.div1,
+    let change = new history.ChangeElementCommand(this.div1,
      { title: 'old title', class: 'foo' });
    assert.ok(change.unapply);
    assert.ok(change.apply);
@@ -411,7 +411,7 @@ describe('history', function () {
    assert.ok(!this.div1.getAttribute('class'));

    this.div1.textContent = 'inner text';
-    change = new hstory.ChangeElementCommand(this.div1,
+    change = new history.ChangeElementCommand(this.div1,
      { '#text': null });

    change.unapply();
@@ -421,7 +421,7 @@ describe('history', function () {
    assert.equal(this.div1.textContent, 'inner text');

    this.div1.textContent = '';
-    change = new hstory.ChangeElementCommand(this.div1,
+    change = new history.ChangeElementCommand(this.div1,
      { '#text': 'old text' });

    change.unapply();
@@ -450,7 +450,7 @@ describe('history', function () {
    });

    gethrefvalue = '#newhref';
-    change = new hstory.ChangeElementCommand(rect,
+    change = new history.ChangeElementCommand(rect,
      { '#href': '#oldhref' });
    assert.equal(justCalled, 'getHref');

@@ -466,7 +466,7 @@ describe('history', function () {

    const line = document.createElementNS(NS.SVG, 'line');
    line.setAttribute('class', 'newClass');
-    change = new hstory.ChangeElementCommand(line, { class: 'oldClass' });
+    change = new history.ChangeElementCommand(line, { class: 'oldClass' });

    assert.ok(change.unapply);
    assert.ok(change.apply);
@@ -484,7 +484,7 @@ describe('history', function () {
    let concatResult = '';
    MockCommand.prototype.apply = function () { concatResult += this.text; };

-    const batch = new hstory.BatchCommand();
+    const batch = new history.BatchCommand();
    assert.ok(batch.unapply);
    assert.ok(batch.apply);
    assert.ok(batch.addSubCommand);
--- a/cypress/integration/unit/select.js
+++ b/cypress/integration/unit/select.js
@@ -36,7 +36,8 @@ describe('select', function () {
  /**
  * @implements {module:select.SVGFactory}
  */
-  const mockFactory = {
+  const mockSvgCanvas = {
+    curConfig: mockConfig,
    createSVGElement (jsonMap) {
      const elem = document.createElementNS(NS.SVG, jsonMap.element);
      Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
@@ -44,8 +45,8 @@ describe('select', function () {
      });
      return elem;
    },
-    svgRoot () { return svgroot; },
-    svgContent () { return svgContent; },
+    getSvgRoot () { return svgroot; },
+    getSvgContent () { return svgContent; },
    getDataStorage () { return dataStorage; }
  };

@@ -54,18 +55,18 @@ describe('select', function () {
   * @returns {void}
   */
  beforeEach(() => {
-    svgroot = mockFactory.createSVGElement({
+    svgroot = mockSvgCanvas.createSVGElement({
      element: 'svg',
      attr: { id: 'svgroot' }
    });
-    svgContent = mockFactory.createSVGElement({
+    svgContent = mockSvgCanvas.createSVGElement({
      element: 'svg',
      attr: { id: 'svgcontent' }
    });

    svgroot.append(svgContent);
    /* const rect = */ svgContent.append(
-      mockFactory.createSVGElement({
+      mockSvgCanvas.createSVGElement({
        element: 'rect',
        attr: {
          id: 'rect',
@@ -117,7 +118,7 @@ describe('select', function () {
    assert.equal(svgroot.childNodes.item(0), svgContent);
    assert.ok(!svgroot.querySelector('#selectorParentGroup'));

-    select.init(mockConfig, mockFactory);
+    select.init(mockSvgCanvas);

    assert.equal(svgroot.childNodes.length, 3);

--- a/cypress/integration/unit/utilities-bbox.js
+++ b/cypress/integration/unit/utilities-bbox.js
@@ -60,7 +60,6 @@ describe('utilities bbox', function () {
        });
        path.replacePathSeg(type, i, pts, pth);
      }
-      // path.reorientGrads(pth, m);
      return undefined;
    }
  };
@@ -82,7 +81,18 @@ describe('utilities bbox', function () {
    });
    sandbox.append(svgroot);

-    path.init(null);
+    const mockSvgCanvas = {
+      createSVGElement (jsonMap) {
+        const elem = document.createElementNS(NS.SVG, jsonMap.element);
+        Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
+          elem.setAttribute(attr, value);
+        });
+        return elem;
+      },
+      getSvgRoot () { return svgroot; }
+    };
+
+    path.init(mockSvgCanvas);
    mockaddSVGElemensFromJsonCallCount = 0;
  });

--- a/cypress/integration/unit/utilities-performance.js
+++ b/cypress/integration/unit/utilities-performance.js
@@ -144,7 +144,6 @@ describe('utilities performance', function () {
        // path.replacePathSeg(type, i, pts, path);
      }

-      // utilities.reorientGrads(path, m);
      return undefined;
    }
  };