separate svgcanvas from svgedit

now you can use directlt svgcanvas. see readme.md

* configure workspaces
* move svgcanvas to packages folder
* move utils to common and paint to svgcanvas
* make svgcanvas a dependency of svgedit
* update deps
* workspaces requires npm 7 at least so the ci needs a new node version
* update github actions to V3
* update snapshots using custom svg exports
* remove unmaintained cypress snapshot plugin
* new github action to add coverage in PR
* Update onpushandpullrequest.yml
* svgcanvas v7.1.6

.github/comment-template.md

@@ -0,0 +1,20 @@
+## Coverage Report
+
+Commit: [{{short_commit_sha}}]({{commit_link}})
+Base: [{{base_ref}}@{{base_short_commit_sha}}]({{base_commit_link}})
+
+| Type                      | Base                                       | This PR                                                                            |
+|---------------------------|--------------------------------------------|------------------------------------------------------------------------------------|
+| Total Statements Coverage | {{base_total_statements_coverage_percent}} | {{total_statements_coverage_percent}} ({{total_statements_coverage_percent_diff}}) |
+| Total Branches Coverage   | {{base_total_branches_coverage_percent}}   | {{total_branches_coverage_percent}} ({{total_branches_coverage_percent_diff}})     |
+| Total Functions Coverage  | {{base_total_functions_coverage_percent}}  | {{total_functions_coverage_percent}} ({{total_functions_coverage_percent_diff}})   |
+| Total Lines Coverage      | {{base_total_lines_coverage_percent}}      | {{total_lines_coverage_percent}} ({{total_lines_coverage_percent_diff}})           |
+
+<details>
+<summary>Details (changed files)</summary>
+{{changed_files_coverage_table}}
+</details>
+<details>
+<summary>Details (all files)</summary>
+{{files_coverage_table}}
+</details>

.github/workflows/onpullrequest.yml

@@ -0,0 +1,32 @@
+name: Node CI
+
+on: [pull_request]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: 16.x
+    - name: npm install, test and lint
+      run: |
+        npm ci
+        npm run build --workspace=packages/svgcanvas
+        npm run lint
+        npm run test
+      env:
+        CI: true
+    - name: Report NYC coverage
+      uses: sidx1024/report-nyc-coverage-github-action@v1.2.6
+      with:
+        # Path to coverage file generated by "nyc report".
+        coverage_file: "coverage/coverage-summary.json"
+        base_coverage_file: "coverage/coverage-summary.json"
+        comment_template_file: ".github/comment-template.md"
+
+

.github/workflows/onpush.yml

@@ -0,0 +1,24 @@
+name: Node CI
+
+on: [push]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: 16.x
+    - name: npm install, test and lint
+      run: |
+        npm ci
+        npm run build --workspace=packages/svgcanvas
+        npm run lint
+        npm run test
+      env:
+        CI: true
+

.github/workflows/onpushandpullrequest.yml

@@ -1,20 +0,0 @@
-name: Node CI
-
-on: [push, pull_request]
-
-jobs:
-  build:
-
-    runs-on: ubuntu-latest
-
-    steps:
-    - uses: actions/checkout@v2
-    - name: Use Node.js
-      uses: actions/setup-node@v2
-      with:
-        node-version: 14.x
-    - name: npm install, test and lint
-      run: |
-        npm ci
-        npm run lint
-        npm run test

CHANGES.md

@@ -1,4 +1,10 @@
 # SVG-Edit CHANGES
+
+## 7.2.0
+- introduce the notion of workspace 
+- separate svgcanvas into a package
+
+**Warning: This version will break applications using svgcanvas directly. You need to change your import to "@svgedit/svgcanvas"** 
 ## 7.1.4
 - Implement horizontal or vertical distribution alignment (mulder3062)
 - fix several bugs and update to latest dependencies

LICENSE-MIT.txt

@@ -1,4 +1,4 @@
-Copyright (c) 2009-2018 by SVG-edit authors (see AUTHORS file)
+Copyright (c) 2009-2022 by SVG-edit authors (see AUTHORS file)
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -8,60 +8,120 @@
 [![Total Alerts](https://img.shields.io/lgtm/alerts/g/SVG-Edit/svgedit.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/SVG-Edit/svgedit/alerts)
 [![Code Quality: Javascript](https://img.shields.io/lgtm/grade/javascript/g/SVG-Edit/svgedit.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/SVG-Edit/svgedit/context:javascript)
 
-SVG-edit is a fast, web-based, JavaScript-driven SVG drawing editor that
+**SVGEdit** is a fast, web-based, JavaScript-driven SVG drawing editor that
-works in any modern browser.
+works in any modern browser. **SVGEdit** is based on a powerful SVG canvas **@svgedit/svgcanvas**
 
 ![screenshot](docs/screenshot.png)
 [](https://upload.wikimedia.org/wikipedia/commons/f/fd/Ghostscript_Tiger.svg)
 
 ## Contributions
 
-SVGEdit is the most popular open source SVG editor. It was started more than 10 years ago by a fantastic team of developers. Unfortunately, the product was not maintained for a quite long period. We decided to give this tool a new life by refreshing many aspects.
+SVGEdit is the most popular open source SVG editor. It was started more than 13 years ago by a fantastic team of developers. Unfortunately, the product was not maintained for a quite long period. We decided to give this tool a new life by refreshing many aspects.
+
 Please let us know with an issue or a discussions if you wish to contribute.
-## Demo
 
-Thanks to **Netlify**, you can test the following builds: 
+## I want to use SVGEDit
 
-### [Try SVGEdit V7 (latest build)](https://svgedit.netlify.app/editor/index.html)
+Thanks to **Netlify**, you can access the following builds from your favorite browser:
 
-[Try SVGEdit V7 (latest published version)](https://unpkg.com/svgedit@latest/dist/editor/index.html)
+[Try SVGEdit V7 (master branch on github)](https://svgedit.netlify.app/editor/index.html)
 
-## Prior V7:
+[Try SVGEdit V7 (latest published version on npm)](https://unpkg.com/svgedit@latest/dist/editor/index.html)
+
+### Prior V7:
+
+We recommand using the V7 version but for older browsers or some abandoned features, you may need to access to old versions of SVGEdit.
 
 [Try SVGEdit 6.1.0 here](https://60a0000fc9900b0008fd268d--svgedit.netlify.app/editor/index.html)
-
 [Try SVGEdit 5.1.0 here](https://unpkg.com/svgedit@5.1.0/editor/svg-editor.html)
 
 Additional tip: you may try a version released on NPM using unpkg for example with version 3.2.0:
 [https://unpkg.com/svgedit@3.2.0/editor/svg-editor.html](https://unpkg.com/svgedit@3.2.0/editor/svg-editor.html)
 
-## Installation
+## I want to use SVGEdit in my environment
 
-### Quick install
+If you want to run a local version of SVGEdit, please follow these instructions:
 
-1. Clone or copy the repository contents
+1. Clone or copy the repository contents from github
 1. run `npm i` to install dependencies
 1. run `npm run start` to start a local server
 1. Use your browser to access `http://localhost:8000/src/editor/index.html`
 
-### Integrating SVGEdit into your own application
+## I want to contribute to SVGEdit
+
+Thanks!
+
+SVG-Edit is made of two major components:
+
+1. The "svgcanvas" that takes care of the underlying svg edition. It can be used to build your own editor.
+1. The "editor" that takes care of the editor UI (menus, buttons, etc.)
+
+You should fork SVGEdit in your github environment and install locally SVGEdit as explained above.
+Before you submit your PR, please make sure you run locally:
+
+1. `npm run lint` to check that you follow the standardjs rules (https://standardjs.com/rules) for the linter
+1. `npm run test` to run a suite of Cypress tests (https://www.cypress.io/).
+
+If you intend to contribute on a regular basis, let us know so we can add you in the maintainer team.
+
+## I want to integrate SVGEdit into my own Web application
 
 V7 is changing significantly the way to integrate and customize SVG-Edit. You can have a look to index.html to see how you can insert a div element into your HTML code and inject the editor into the div.
 
-SVG-Edit is made of two major components:
+```
-1. The "svgcanvas" that takes care of the underlying svg edition. It can be used to build your own editor. See example in the demos folder or the svg-edit-react repository.
+<head>
-1. The "editor" that takes care of the editor UI (menus, buttons, etc.)
+   <!-- You need to include the CSS for SVGEdit somewhere in your application -->
+  <link href="./svgedit.css" rel="stylesheet" media="all"></link>
+</head>
+
+<body>
+  <!-- svgedit container can be positionned anywhere in the DOM
+       but it must have a width and a height -->
+  <div id="container" style="width:100%;height:100vh"></div>
+</body>
+<script type="module">
+  /* You need to call the Editor and load it in the <div> */
+  import Editor from './Editor.js'
+  /* for available options see the file `docs/tutorials/ConfigOptions.md */
+  const svgEditor = new Editor(document.getElementById('container'))
+  /* initialize the Editor */
+  svgEditor.init()
+  /* set the configuration */
+  svgEditor.setConfig({
+          allowInitialUserOverride: true,
+          extensions: [],
+          noDefaultExtensions: false,
+          userExtensions: []
+  })
+</script>
+</html>
+```
+## I want to build my own svg editor
+You can just use the underlying canvas and use it in your application with your favorite framework.
+See example in the demos folder or the svg-edit-react repository. 
+
+To install the canvas:
+
+`npm i -s '@svgedit/svgcanvas'`
+
+you can then import it in your application: 
+
+`import svgCanvas from '@svgedit/svgcanvas'`
 
-For earlier versions of SVGEdit, please look in their respective branches.
 ## Supported browsers
+
 Developments and Continuous Integration are done with a **Chrome** environment. Chrome, FireFox and Safari recent versions are supported (in the meaning that we will try to fix bugs for these browsers).
+
 Support for old browsers may require to use an older version of the package. However, please open an issue if you need support for a specific version of your browser so the project team can decide if we should support with the latest version.
 
 ## Sample extension based on React
+
 A sample React component was used to build a svgedit extension.
 To activate:
+
 - "npm run build" from the extension folder "src/editor/react-extensions/react-test" in order to create the bundle for the extension.
 - modify "index.html" to activate the extension as a userExtensions
+
 ```
 svgEditor.setConfig({
           allowInitialUserOverride: true,
@@ -70,11 +130,14 @@ svgEditor.setConfig({
           userExtensions: ['./react-extensions/react-test/dist/react-test.js']
         })
 ```
+
 ## Further reading and more information
- * Participate in [discussions](https://github.com/SVG-Edit/svgedit/discussions) 
+
- * See [AUTHORS](AUTHORS) file for authors.
+- Participate in [discussions](https://github.com/SVG-Edit/svgedit/discussions)
- * [StackOverflow](https://stackoverflow.com/tags/svg-edit) group.
+- See [AUTHORS](AUTHORS) file for authors.
+- [StackOverflow](https://stackoverflow.com/tags/svg-edit) group.
 
 # Hosting
+
 SVGedit versions are deployed to:
 [![Deploys by Netlify](https://www.netlify.com/img/global/badges/netlify-color-accent.svg)](https://www.netlify.com)

archive/gh-disabled-workflows/coverage.yml

@@ -1,16 +0,0 @@
-name: Coverage
-
-on: [push]
-
-jobs:
-  build:
-
-    runs-on: ubuntu-latest
-
-    steps:
-    - uses: actions/checkout@v1
-    - name: Coverage
-      run: |
-        npm ci
-        npm run test-cov
-        exit 0

archive/gh-disabled-workflows/nodejs.yml

@@ -1,26 +0,0 @@
-name: Node CI
-
-on: [push]
-
-jobs:
-  build:
-
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [10.x, 12.x]
-
-    steps:
-    - uses: actions/checkout@v1
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
-      with:
-        node-version: ${{ matrix.node-version }}
-    - name: npm install, build, and test
-      run: |
-        npm ci
-        npm run build --if-present
-        npm test
-      env:
-        CI: true

babel.config.json

@@ -4,7 +4,7 @@
       "@babel/env",
       {
         "useBuiltIns": "entry",
-        "corejs": "3.19"
+        "corejs": "3.24"
       }
     ]
   ]

composer.json

@@ -28,7 +28,7 @@
         },
         {
             "name": "Optimistik SAS",
-            "email": "contact@optimistik.io"
+            "email": "contact@optimistik.com"
         }
     ],
     "keywords": [

cypress.config.js

@@ -6,12 +6,6 @@ module.exports = defineConfig({
   pageLoadTimeout: 120000,
   includeShadowDom: true,
   scrollBehavior: false,
-  'cypress-plugin-snapshots': {
-    autoCleanUp: true,
-    prettier: true,
-    updateSnapshots: false,
-    diffLines: 5
-  },
   e2e: {
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.

cypress/__svgSnapshots__/scenario-check tool_bold.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="24" font-style="italic" font-weight="bold" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="220" xml:space="preserve" y="220">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_clone.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" x="220" xml:space="preserve" y="220">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_italic.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="24" font-style="italic" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="220" xml:space="preserve" y="220">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_length_adjust.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" lengthAdjust="spacingAndGlyphs" letter-spacing="10" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through overline" textLength="20" word-spacing="15" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_letter_spacing.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" letter-spacing="10" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through overline" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_source.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario-check tool_text.svg

@@ -0,0 +1,6 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_align_to_page.svg

@@ -0,0 +1,12 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" filter="url(#svg_2_blur)" font-family="Serif" font-size="24" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="0" text-anchor="middle" x="623.33" xml:space="preserve" y="245">AB</text>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_blur.svg

@@ -0,0 +1,12 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" filter="url(#svg_2_blur)" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_font_family.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_font_size.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_opacity.svg

@@ -0,0 +1,12 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" filter="url(#svg_2_blur)" font-family="Serif" font-size="24" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="0" text-anchor="middle" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_stoke_fill_color.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_stroke_width.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#000000" text-anchor="middle" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_change_x_y_coordinate.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#000000" font-family="Serif" font-size="24" font-style="italic" font-weight="bold" id="svg_1" stroke="#000000" stroke-width="0" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="200" xml:space="preserve" y="200">AB</text>
+  <text fill="#000000" font-family="Serif" font-size="24" id="svg_2" stroke="#000000" stroke-width="0" text-anchor="middle" x="245" xml:space="preserve" y="245">AB</text>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_decoration_linethrough.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_decoration_overline.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through overline" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_decoration_underline.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" text-decoration="underline" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_delete.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" stroke="#0000bf" text-anchor="middle" transform="matrix(1 0 0 1 0 0)" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_text_length.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" letter-spacing="10" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through overline" textLength="20" word-spacing="15" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario-check tool_word_spacing.svg

@@ -0,0 +1,7 @@
+<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>
+  <text fill="#bf0000" font-family="Serif" font-size="34" font-style="italic" font-weight="bold" id="svg_1" letter-spacing="10" stroke="#0000bf" text-anchor="middle" text-decoration="underline line-through overline" word-spacing="15" x="200" xml:space="preserve" y="200">AB</text>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario1-check tool_image.svg

@@ -0,0 +1,7 @@
+<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g class="layer">
+  <title>Layer 1</title>
+  <path d="m489.76,93.43c78.24,-224.45 384.77,0 0,288.58c-384.77,-288.58 -78.24,-513.02 0,-288.58z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+  <image height="20" id="svg_2" width="20" x="-100" xlink:href="./images/logo.svg" y="300"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario1-check tool_shape.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m10.73,93.43c78.24,-224.45 384.77,0 0,288.58c-384.77,-288.58 -78.24,-513.02 0,-288.58z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario1-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario2-check tool_circle.svg

@@ -0,0 +1,6 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_circle_change_fill_color.svg

@@ -0,0 +1,8 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" rx="60" ry="50" stroke="#000000"/>
+  <ellipse cx="114" cy="189" fill="#FF0000" id="svg_3" rx="55" ry="25" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_circle_change_opacity.svg

@@ -0,0 +1,8 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000"/>
+  <ellipse cx="114" cy="189" fill="#FF0000" id="svg_3" rx="55" ry="25" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse.svg

@@ -0,0 +1,8 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#FF0000" id="svg_2" rx="60" ry="50" stroke="#000000"/>
+  <ellipse cx="114" cy="189" fill="#FF0000" id="svg_3" rx="55" ry="25" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_bring_to_back.svg

@@ -0,0 +1,13 @@
+<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>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000"/>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="139" cy="214" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="80" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 139 214)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_bring_to_front.svg

@@ -0,0 +1,13 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="139" cy="214" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="80" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 139 214)"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_change_blur.svg

@@ -0,0 +1,13 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+  <ellipse cx="114" cy="189" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="55" ry="25" stroke="#000000" transform="rotate(25 114 189)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_change_cx_cy_coordinate.svg

@@ -0,0 +1,13 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+  <ellipse cx="139" cy="214" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="55" ry="25" stroke="#000000" transform="rotate(25 139 214)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_change_rotation.svg

@@ -0,0 +1,8 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+  <ellipse cx="114" cy="189" fill="#FF0000" id="svg_3" rx="55" ry="25" stroke="#000000" transform="rotate(25 114 189)"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_change_rx_ry_radius.svg

@@ -0,0 +1,13 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+  <ellipse cx="139" cy="214" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="80" ry="50" stroke="#000000" transform="rotate(25 139 214)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_ellipse_clone.svg

@@ -0,0 +1,14 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="139" cy="214" fill="#FF0000" filter="url(#svg_3_blur)" id="svg_3" rx="80" ry="50" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 139 214)"/>
+  <ellipse cx="299" cy="169" fill="#ffff00" id="svg_2" opacity="0.5" rx="60" ry="50" stroke="#000000"/>
+  <ellipse cx="319" cy="189" fill="#ffff00" id="svg_4" opacity="0.5" rx="60" ry="50" stroke="#000000"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_3_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_fhellipse.svg

@@ -0,0 +1,7 @@
+<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>
+  <circle cx="150" cy="150" fill="#FF0000" id="svg_1" r="111.8" stroke="#000000"/>
+  <ellipse cx="299" cy="169" fill="#FF0000" id="svg_2" rx="60" ry="50" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario2-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario3-check tool_path.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m50,50l100,50l-25,100l-75,-150z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario3-check tool_path_change_clone_node.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m201,246l-26,-121l-25,100c50.5,60.5 164,206.5 135.75,160.13c-28.25,-46.38 -72.25,-114.13 -84.75,-139.13z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario3-check tool_path_change_node_xy.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m75,75l100,50l-25,100l-75,-150z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario3-check tool_path_change_seg_type.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m75,75l100,50l-25,100c101,121 -50,-100 -75,-150z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario3-check tool_path_openclose.svg

@@ -0,0 +1,6 @@
+<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>
+  <path d="m201,246l-26,-121l-25,100c50.5,60.5 164,206.5 135.75,160.13c-28.25,-46.38 -72.25,-114.13 -84.75,-139.13z" fill="#FF0000" id="svg_1" stroke="#000000"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario3-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario4-check tool_fhrect.svg

@@ -0,0 +1,7 @@
+<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>
+  <rect fill="#FF0000" height="50" id="svg_1" stroke="#000000" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_fhrect_change_width_height.svg

@@ -0,0 +1,13 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="125" id="svg_2" stroke="#000000" width="145" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_fhrect_change_x_y_coordinate.svg

@@ -0,0 +1,13 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect.svg

@@ -0,0 +1,6 @@
+<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>
+  <rect fill="#FF0000" height="50" id="svg_1" stroke="#000000" width="100" x="150" y="150"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_change_blur.svg

@@ -0,0 +1,13 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" stroke="#000000" transform="rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_change_fill_color.svg

@@ -0,0 +1,8 @@
+<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>
+  <rect fill="#ffff00" height="50" id="svg_1" stroke="#000000" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_change_opacity.svg

@@ -0,0 +1,13 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_change_rotation.svg

@@ -0,0 +1,8 @@
+<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>
+  <rect fill="#ffff00" height="50" id="svg_1" stroke="#000000" transform="rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_change_to_path.svg

@@ -0,0 +1,14 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <path d="m375,255l145,0l0,125l-145,0l0,-125z" fill="#FF0000" id="svg_2" opacity="0.5" stroke="#000000"/>
+  <rect fill="#FF0000" height="50" id="svg_4" rx="25" ry="25" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="245" y="320"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_rect_delete.svg

@@ -0,0 +1,8 @@
+<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>
+  <path d="m375,255l145,0l0,125l-145,0l0,-125z" fill="#FF0000" id="svg_2" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0)"/>
+  <rect fill="#FF0000" height="50" id="svg_4" rx="25" ry="25" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="245" y="320"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario4-check tool_square.svg

@@ -0,0 +1,8 @@
+<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>
+  <rect fill="#FF0000" height="50" id="svg_1" stroke="#000000" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="100" id="svg_2" stroke="#000000" width="120" x="350" y="230"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" width="50" x="225" y="300"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_square_bring_to_back.svg

@@ -0,0 +1,14 @@
+<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>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" width="50" x="225" y="300"/>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="125" id="svg_2" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="145" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_4" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="245" y="320"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_square_bring_to_front.svg

@@ -0,0 +1,14 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="125" id="svg_2" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="145" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_4" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="245" y="320"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_square_change_corner_radius.svg

@@ -0,0 +1,14 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="125" id="svg_2" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="145" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_4" rx="25" ry="25" stroke="#000000" width="50" x="245" y="320"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="50" x="225" y="300"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario4-check tool_square_clone.svg

@@ -0,0 +1,14 @@
+<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>
+  <rect fill="#ffff00" filter="url(#svg_1_blur)" height="50" id="svg_1" opacity="0.5" stroke="#000000" transform="matrix(1 0 0 1 0 0) rotate(25 200 175)" width="100" x="150" y="150"/>
+  <rect fill="#FF0000" height="125" id="svg_2" stroke="#000000" transform="matrix(1 0 0 1 0 0)" width="145" x="375" y="255"/>
+  <rect fill="#FF0000" height="50" id="svg_3" stroke="#000000" width="50" x="225" y="300"/>
+  <rect fill="#FF0000" height="50" id="svg_4" stroke="#000000" width="50" x="245" y="320"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line.svg

@@ -0,0 +1,6 @@
+<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>
+  <line fill="none" id="svg_1" stroke="#000000" stroke-width="5" x1="200" x2="450" y1="200" y2="450"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_align_to_page.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#bf5f00" stroke-width="5" x1="387.5" x2="637.5" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="15" transform="matrix(1 0 0 1 0 0)" x1="225" x2="475" y1="175" y2="425"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_bring_to_back.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="5" x1="200" x2="450" y1="200" y2="450"/>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#000000" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_bring_to_front.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#000000" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="5" x1="200" x2="450" y1="200" y2="450"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_blur.svg

@@ -0,0 +1,11 @@
+<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>
+  <line class="svg_1_class" fill="none" filter="url(#svg_1_id_blur)" id="svg_1_id" stroke="#000000" stroke-width="5" transform="rotate(25 325 325)" x1="200" x2="450" y1="200" y2="450"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_opacity.svg

@@ -0,0 +1,11 @@
+<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>
+  <line class="svg_1_class" fill="none" filter="url(#svg_1_id_blur)" id="svg_1_id" opacity="0.5" stroke="#000000" stroke-width="5" transform="rotate(25 325 325)" x1="200" x2="450" y1="200" y2="450"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_1_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_rotation.svg

@@ -0,0 +1,6 @@
+<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>
+  <line class="svg_1_class" fill="none" id="svg_1_id" stroke="#000000" stroke-width="5" transform="rotate(25 325 325)" x1="200" x2="450" y1="200" y2="450"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_stoke_color.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#bf5f00" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="15" transform="matrix(1 0 0 1 0 0)" x1="225" x2="475" y1="175" y2="425"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_stroke_width.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#000000" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="15" x1="225" x2="475" y1="175" y2="425"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_change_x_y_coordinate.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#000000" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="5" x1="225" x2="475" y1="175" y2="425"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_clone.svg

@@ -0,0 +1,10 @@
+<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>
+  <line fill="none" id="svg_2" opacity="0.5" stroke="#000000" stroke-width="5" x1="200" x2="450" y1="200" y2="450"/>
+  <line fill="none" id="svg_3" opacity="0.25" stroke="#000000" stroke-width="5" x1="220" x2="470" y1="220" y2="470">
+   <animate attributeName="opacity" begin="indefinite" dur="0.2" fill="freeze" id="svg_4" to="0.5"/>
+  </line>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario5-check tool_line_delete.svg

@@ -0,0 +1,6 @@
+<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>

cypress/__svgSnapshots__/scenario5-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario6-check tool_polygon.svg

@@ -0,0 +1,6 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_align_to_page.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="637.5,250 600.2736206054688,301.23773193359375 540.0400390625,281.6666564941406 540.0400390625,218.3333282470703 600.2736206054688,198.7622528076172 637.5,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_bring_to_back.svg

@@ -0,0 +1,12 @@
+<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>
+  <polygon class="svg_2_class" cx="325" cy="250" edge="63.33" fill="#FF0000" filter="url(#svg_2_id_blur)" id="svg_2_id" opacity="0.5" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5" transform="rotate(25 350.145 270)"/>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_bring_to_front.svg

@@ -0,0 +1,12 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+  <polygon class="svg_2_class" cx="325" cy="250" edge="63.33" fill="#FF0000" filter="url(#svg_2_id_blur)" id="svg_2_id" opacity="0.5" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5" transform="rotate(25 350.145 270)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_blur.svg

@@ -0,0 +1,12 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+  <polygon class="svg_2_class" cx="325" cy="250" edge="63.33" fill="#FF0000" filter="url(#svg_2_id_blur)" id="svg_2_id" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5" transform="rotate(25 350.145 270)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_opacity.svg

@@ -0,0 +1,12 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+  <polygon class="svg_2_class" cx="325" cy="250" edge="63.33" fill="#FF0000" filter="url(#svg_2_id_blur)" id="svg_2_id" opacity="0.5" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5" transform="rotate(25 350.145 270)"/>
+ </g>
+ <defs>
+  <filter height="200%" id="svg_2_id_blur" width="200%" x="-50%" y="-50%">
+   <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
+  </filter>
+ </defs>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_rotation.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+  <polygon class="svg_2_class" cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_2_id" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5" transform="rotate(25 350 270)"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_sides.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#bf0000" id="svg_1" orient="x" points="664.9855026971727,249.999995640346 633.318836030506,304.8482712133604 569.9855026971727,304.8482712133604 538.318836030506,249.999995640346 569.9855026971726,195.15172006733155 633.318836030506,195.15172006733155 664.9855026971727,249.99999564034596 " shape="regularPoly" sides="6" stroke="#0000bf" stroke-width="15"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_stoke_fill_color.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#bf0000" id="svg_1" orient="x" points="637.5,250 600.2736206054688,301.23773193359375 540.0400390625,281.6666564941406 540.0400390625,218.3333282470703 600.2736206054688,198.7622528076172 637.5,250 " shape="regularPoly" sides="5" stroke="#0000bf" stroke-width="15"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_change_stroke_width.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="637.5,250 600.2736206054688,301.23773193359375 540.0400390625,281.6666564941406 540.0400390625,218.3333282470703 600.2736206054688,198.7622528076172 637.5,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="15"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_clone.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_2" orient="x" points="398.8745422363281,270 361.6481628417969,321.23773193359375 301.4145812988281,301.6666564941406 301.4145812988281,238.3333282470703 361.6481628417969,218.7622528076172 398.8745422363281,270 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_polygon_delete.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="325" cy="250" edge="63.33" fill="#FF0000" id="svg_1" orient="x" points="378.87455119562924,250 341.6481518837726,301.23774297708 281.41457251841285,281.6666666666667 281.4145725184128,218.33333333333334 341.6481518837726,198.76225702291998 378.87455119562924,250 " shape="regularPoly" sides="5" stroke="#000000" stroke-width="5"/>
+ </g>
+
+</svg>

cypress/__svgSnapshots__/scenario6-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario7-check tool_source_set.svg

@@ -0,0 +1,5 @@
+<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>

cypress/__svgSnapshots__/scenario7-check tool_star.svg

@@ -0,0 +1,6 @@
+<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>
+  <polygon cx="300" cy="150" fill="#FF0000" id="svg_1" orient="point" point="5" 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 " r="66.67" r2="22.22" radialshift="0" shape="star" starRadiusMultiplier="3" stroke="#000000" stroke-width="5"/>
+ </g>
+</svg>

cypress/__svgSnapshots__/scenario7-check tool_star_align_to_page.svg

@@ -0,0 +1,7 @@
+<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>
+  <polygon cx="300" cy="150" fill="#FF0000" id="svg_1" orient="point" point="5" points="574.0962219238281,83.33333587646484 587.1581115722656,132.0218505859375 637.5,129.39886474609375 595.2308044433594,156.86705017089844 613.2818908691406,203.93446350097656 574.0962219238281,172.22222900390625 534.9105529785156,203.93446350097656 552.9616394042969,156.86705017089844 510.6924591064453,129.39886474609375 561.0343322753906,132.0218505859375 574.0962219238281,83.33333587646484 587.1581115722656,132.0218505859375 " r="66.67" r2="22.22" radialshift="0" shape="star" starRadiusMultiplier="3" stroke="#000000" stroke-width="5"/>
+ </g>
+
+</svg>