enforce a few eslint rules

2021-05-13 01:00:09 +02:00
parent 9a5292b467
commit d3974f8f17
148 changed files with 1402 additions and 1398 deletions
--- a/cypress/integration/ui/accessibility.js
+++ b/cypress/integration/ui/accessibility.js
@@ -13,10 +13,10 @@ describe('UI - Accessibility', function () {
    cy.configureAxe({
      // Todo: Reenable when have time to fix
      // See https://www.deque.com/axe/axe-for-web/documentation/api-documentation/#user-content-parameters-1
-      rules: [{
+      rules: [ {
        id: 'meta-viewport',
        enabled: false
-      }]
+      } ]
      /*
      branding: {
        brand: String,
@@ -32,10 +32,10 @@ describe('UI - Accessibility', function () {
      {},
      {
        rules: {
-          'label-title-only': {enabled: false},
-          'page-has-heading-one': {enabled: false},
-          region: {enabled: false},
-          'scrollable-region-focusable': {enabled: false}
+          'label-title-only': { enabled: false },
+          'page-has-heading-one': { enabled: false },
+          region: { enabled: false },
+          'scrollable-region-focusable': { enabled: false }
        }
      }
    );
--- a/cypress/integration/ui/clipboard.js
+++ b/cypress/integration/ui/clipboard.js
@@ -11,13 +11,13 @@ describe('UI - Clipboard', function () {
    cy.get('#tool_source').click();

    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">
   <g class="layer">
    <title>Layer 1</title>
    <circle cx="100" cy="100" r="50" fill="#FF0000" id="testCircle" stroke="#000000" stroke-width="5"/>
   </g>
-  </svg>`, {force: true, parseSpecialCharSequences: false});
+  </svg>`, { force: true, parseSpecialCharSequences: false });
    cy.get('#tool_source_save').click();
    cy.get('#testCircle').should('exist');
    cy.get('#svg_1').should('not.exist');
@@ -25,20 +25,20 @@ describe('UI - Clipboard', function () {

    // Copy.
    cy.get('#testCircle').click().rightclick();
-    cy.get('#cmenu_canvas a[href="#copy"]').click({force: true});
+    cy.get('#cmenu_canvas a[href="#copy"]').click({ force: true });

    // Paste.
    // Scrollbars fail to recenter in Cypress test.  Works fine in reality.
    // Thus forcing click is needed since workspace is mostly offscreen.
-    cy.get('#svgroot').rightclick({force: true});
-    cy.get('#cmenu_canvas a[href="#paste"]').click({force: true});
+    cy.get('#svgroot').rightclick({ force: true });
+    cy.get('#cmenu_canvas a[href="#paste"]').click({ force: true });
    cy.get('#testCircle').should('exist');
    cy.get('#svg_1').should('exist');
    cy.get('#svg_2').should('not.exist');

    // Cut.
    cy.get('#testCircle').click().rightclick();
-    cy.get('#cmenu_canvas a[href="#cut"]').click({force: true});
+    cy.get('#cmenu_canvas a[href="#cut"]').click({ force: true });
    cy.get('#testCircle').should('not.exist');
    cy.get('#svg_1').should('exist');
    cy.get('#svg_2').should('not.exist');
@@ -46,17 +46,17 @@ describe('UI - Clipboard', function () {
    // Paste.
    // Scrollbars fail to recenter in Cypress test.  Works fine in reality.
    // Thus forcing click is needed since workspace is mostly offscreen.
-    cy.get('#svgroot').rightclick({force: true});
-    cy.get('#cmenu_canvas a[href="#paste"]').click({force: true});
+    cy.get('#svgroot').rightclick({ force: true });
+    cy.get('#cmenu_canvas a[href="#paste"]').click({ force: true });
    cy.get('#testCircle').should('not.exist');
    cy.get('#svg_1').should('exist');
    cy.get('#svg_2').should('exist');

    // Delete.
    cy.get('#svg_2').click().rightclick();
-    cy.get('#cmenu_canvas a[href="#delete"]').click({force: true});
+    cy.get('#cmenu_canvas a[href="#delete"]').click({ force: true });
    cy.get('#svg_1').click().rightclick();
-    cy.get('#cmenu_canvas a[href="#delete"]').click({force: true});
+    cy.get('#cmenu_canvas a[href="#delete"]').click({ force: true });
    cy.get('#svg_1').should('not.exist');
    cy.get('#svg_2').should('not.exist');
  });
--- a/cypress/integration/ui/control-points.js
+++ b/cypress/integration/ui/control-points.js
@@ -11,23 +11,23 @@ describe('UI - Control Points', function () {
    const randomOffset = () => 2 + Math.round(10 + Math.random() * 40);
    cy.get('#tool_source').click();
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">
   <g class="layer">
    <title>Layer 1</title>
    <path d="m187,194a114,62 0 1 0 219,2" id="svg_1" fill="#FF0000" stroke="#000000" stroke-width="5"/>
   </g>
-  </svg>`, {force: true, parseSpecialCharSequences: false});
-    cy.get('#tool_source_save').click({force: true});
+  </svg>`, { force: true, parseSpecialCharSequences: false });
+    cy.get('#tool_source_save').click({ force: true });

-    cy.get('#svg_1').click({force: true}).click({force: true});
+    cy.get('#svg_1').click({ force: true }).click({ force: true });

-    cy.get('#pathpointgrip_0').trigger('mousedown', {which: 1, force: true})
-      .trigger('mousemove', randomOffset(), randomOffset(), {force: true})
-      .trigger('mouseup', {force: true});
-    cy.get('#pathpointgrip_1').trigger('mousedown', {which: 1, force: true})
-      .trigger('mousemove', randomOffset(), randomOffset(), {force: true})
-      .trigger('mouseup', {force: true});
+    cy.get('#pathpointgrip_0').trigger('mousedown', { which: 1, force: true })
+      .trigger('mousemove', randomOffset(), randomOffset(), { force: true })
+      .trigger('mouseup', { force: true });
+    cy.get('#pathpointgrip_1').trigger('mousedown', { which: 1, force: true })
+      .trigger('mousemove', randomOffset(), randomOffset(), { force: true })
+      .trigger('mouseup', { force: true });

    cy.get('#svg_1[d]').should('not.contain', 'NaN');
  });
--- a/cypress/integration/ui/export.js
+++ b/cypress/integration/ui/export.js
@@ -14,7 +14,7 @@ describe('UI - Export tests', function () {

  it('Editor - No parameters: Export button clicking; dialog opens', () => {
    openMainMenu();
-    cy.get('#tool_export').click({force: true});
+    cy.get('#tool_export').click({ force: true });
    cy.get('#dialog_content select');
  });
 });
--- a/cypress/integration/ui/issues/issue-359.js
+++ b/cypress/integration/ui/issues/issue-359.js
@@ -11,13 +11,13 @@ describe('Fix issue 359', function () {
  it('can undo without throwing', function () {
    cy.get('#tool_source').click();
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">
      <g class="layer">
       <title>Layer 1</title>
        <rect fill="#ffff00" height="70" width="165" x="179.5" y="146.5"/>
      </g>
-     </svg>`, {parseSpecialCharSequences: false, force: true});
+     </svg>`, { parseSpecialCharSequences: false, force: true });
    cy.get('#tool_source_save').click();
    cy.get('#tool_undo').click();
    cy.get('#tool_redo').click(); // test also redo to make the test more comprehensive
--- a/cypress/integration/ui/issues/issue-407.js
+++ b/cypress/integration/ui/issues/issue-407.js
@@ -11,7 +11,7 @@ describe('Fix issue 407', function () {
  it('can enter edit on text child', function () {
    cy.get('#tool_source').click();
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg">
      <g class="layer">
       <title>Layer 1</title>
@@ -20,16 +20,16 @@ describe('Fix issue 407', function () {
        <text fill="#000000" id="a_text" text-anchor="middle" x="260.5" xml:space="preserve" y="192.5">hello</text>
       </g>
      </g>
-     </svg>`, {force: true, parseSpecialCharSequences: false});
+     </svg>`, { force: true, parseSpecialCharSequences: false });
    cy.get('#tool_source_save').click();
    cy.get('#svg_1').click().dblclick();
    cy.get('#a_text').should('exist');
    cy.get('#a_text')
-      .trigger('mousedown', {which: 1, force: true})
-      .trigger('mouseup', {force: true})
-      .dblclick({force: true});
+      .trigger('mousedown', { which: 1, force: true })
+      .trigger('mouseup', { force: true })
+      .dblclick({ force: true });
    // svgedit use the #text text field to capture the text
-    cy.get('#text').type('1234', {force: true});
+    cy.get('#text').type('1234', { force: true });
    cy.get('#a_text').should('have.text', 'he1234llo');
  });
 });
--- a/cypress/integration/ui/issues/issue-408.js
+++ b/cypress/integration/ui/issues/issue-408.js
@@ -11,7 +11,7 @@ describe('Fix issue 408', function () {
  it('should not throw when showing/saving svg content', function () {
    cy.get('#tool_source').click();
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
      <g class="layer">
       <title>Layer 1</title>
@@ -20,7 +20,7 @@ describe('Fix issue 408', function () {
        <circle cx="117.5" cy="87.5" fill="#ffff00" r="19.84943" stroke="#000000" />
       </g>
      </g>
-     </svg>`, {force: true, parseSpecialCharSequences: false});
+     </svg>`, { force: true, parseSpecialCharSequences: false });
    cy.get('#tool_source_save').click();
    cy.get('#svg_6').click().dblclick(); // change context
    cy.get('#tool_source').click(); // reopen tool_source
--- a/cypress/integration/ui/issues/issue-423.js
+++ b/cypress/integration/ui/issues/issue-423.js
@@ -11,7 +11,7 @@ describe('Fix issue 423', function () {
  it('should not throw when undoing the move', function () {
    cy.get('#tool_source').click();
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="300" height="300" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
      <g class="layer">
       <title>Layer 1</title>
@@ -22,12 +22,12 @@ describe('Fix issue 423', function () {
        <rect clip-path="url(#svg_2)" fill="#0033b5" height="174.9" id="TANK1" width="78" x="77.5" y="29"/>
       </g>
      </g>
-     </svg>`, {parseSpecialCharSequences: false, force: true});
-    cy.get('#tool_source_save').click({force: true});
+     </svg>`, { parseSpecialCharSequences: false, force: true });
+    cy.get('#tool_source_save').click({ force: true });
    cy.get('#TANK1')
-      .trigger('mousedown', {force: true})
-      .trigger('mousemove', 50, 0, {force: true})
-      .trigger('mouseup', {force: true});
-    cy.get('#tool_undo').click({force: true});
+      .trigger('mousedown', { force: true })
+      .trigger('mousemove', 50, 0, { force: true })
+      .trigger('mouseup', { force: true });
+    cy.get('#tool_undo').click({ force: true });
  });
 });
--- a/cypress/integration/ui/scenario.js
+++ b/cypress/integration/ui/scenario.js
@@ -12,97 +12,97 @@ describe('use various parts of svg-edit', function () {
  });

  it('check tool_source', function () {
-    cy.get('#tool_source').click({force: true});
+    cy.get('#tool_source').click({ force: true });
    cy.get('#svg_source_textarea')
-      .type('{selectall}', {force: true})
+      .type('{selectall}', { force: true })
      .type(`<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
      <g class="layer">
       <title>Layer 1</title>
        <rect id="rect" fill="#FF0000" height="70" stroke="#000000" stroke-width="5" width="94" x="69.5" y="51.5"/>
       </g>
-     </svg>`, {force: true, parseSpecialCharSequences: false});
-    cy.get('#tool_source_save').click({force: true});
+     </svg>`, { force: true, parseSpecialCharSequences: false });
+    cy.get('#tool_source_save').click({ force: true });
    testSnapshot();
  });
  it('check tool_fhpath', function () {
    cy.get('#tool_fhpath')
-      .click({force: true});
+      .click({ force: true });
    cy.get('#rect')
-      .trigger('mousemove', 200, 200, {force: true})
-      .trigger('mousedown', 200, 200, {force: true})
-      .trigger('mousemove', 20, 20, {force: true})
-      .trigger('mouseup', {force: true});
+      .trigger('mousemove', 200, 200, { force: true })
+      .trigger('mousedown', 200, 200, { force: true })
+      .trigger('mousemove', 20, 20, { force: true })
+      .trigger('mouseup', { force: true });
    cy.get('#svgcontent').toMatchSnapshot();
  });
  it('check tool_text', function () {
    cy.get('#tool_text')
-      .click({force: true});
+      .click({ force: true });
    cy.get('#rect')
-      .trigger('mousedown',  46, 35, {force: true})
-      .trigger('mouseup', {force: true});
+      .trigger('mousedown',  46, 35, { force: true })
+      .trigger('mouseup', { force: true });
    // svgedit use the #text text field to capture the text
-    cy.get('#text').type('AB', {force: true});
+    cy.get('#text').type('AB', { force: true });
    testSnapshot();
  });

  it('check tool_clone', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_clone')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_italic', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_italic')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_bold', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_bold')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check change color', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('[data-rgb="#ffff00"]')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_text_anchor_start', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_text_anchor_start')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_text_anchor_middle', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_text_anchor_middle')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_text_anchor_end', function () {
-    cy.get('#svg_1').click({force: true});
+    cy.get('#svg_1').click({ force: true });
    cy.get('#tool_text_anchor_end')
-      .click({force: true});
+      .click({ force: true });
    testSnapshot();
  });
  it('check tool_star', function () {
    cy.get('#tool_star')
-      .click({force: true});
+      .click({ force: true });
    cy.get('#svgcontent')
-      .trigger('mousedown', 300, 150, {force: true})
-      .trigger('mousemove', 300, 250, {force: true})
-      .trigger('mouseup', {force: true});
+      .trigger('mousedown', 300, 150, { force: true })
+      .trigger('mousemove', 300, 250, { force: true })
+      .trigger('mouseup', { force: true });
    testSnapshot();
  });
  it('check tool_polygon', function () {
    cy.get('#tool_polygon')
-      .click({force: true});
+      .click({ force: true });
    cy.get('#svgcontent')
-      .trigger('mousedown', 350, 250, {force: true})
-      .trigger('mousemove', 350, 370, {force: true})
-      .trigger('mouseup', {force: true});
+      .trigger('mousedown', 350, 250, { force: true })
+      .trigger('mousemove', 350, 370, { force: true })
+      .trigger('mouseup', { force: true });
    testSnapshot();
  });
 });
--- a/cypress/integration/ui/tool-selection.js
+++ b/cypress/integration/ui/tool-selection.js
@@ -11,7 +11,7 @@ describe('UI - Tool selection', function () {
    cy.get('#tools_rect')
      .should('not.have.attr', 'pressed');
    cy.get('#tools_rect')
-      .trigger('click', {force: true})
+      .trigger('click', { force: true })
      .should('have.attr', 'pressed');
  });
 });
--- a/cypress/integration/unit/contextmenu.js
+++ b/cypress/integration/unit/contextmenu.js
@@ -19,26 +19,26 @@ describe('contextmenu', function () {

  it('Test svgedit.contextmenu does not add invalid menu item', function () {
    assert.throws(
-      () => contextmenu.add({id: 'justanid'}),
+      () => contextmenu.add({ id: 'justanid' }),
      null, null,
      'menu item with just an id is invalid'
    );

    assert.throws(
-      () => contextmenu.add({id: 'idandlabel', label: 'anicelabel'}),
+      () => contextmenu.add({ id: 'idandlabel', label: 'anicelabel' }),
      null, null,
      'menu item with just an id and label is invalid'
    );

    assert.throws(
-      () => contextmenu.add({id: 'idandlabel', label: 'anicelabel', action: 'notafunction'}),
+      () => contextmenu.add({ id: 'idandlabel', label: 'anicelabel', action: 'notafunction' }),
      null, null,
      'menu item with action that is not a function is invalid'
    );
  });

  it('Test svgedit.contextmenu adds valid menu item', function () {
-    const validItem = {id: 'valid', label: 'anicelabel', action () { /* empty fn */ }};
+    const validItem = { id: 'valid', label: 'anicelabel', action () { /* empty fn */ } };
    contextmenu.add(validItem);

    assert.ok(contextmenu.hasCustomHandler('valid'), 'Valid menu item is added.');
@@ -46,8 +46,8 @@ describe('contextmenu', function () {
  });

  it('Test svgedit.contextmenu rejects valid duplicate menu item id', function () {
-    const validItem1 = {id: 'valid', label: 'anicelabel', action () { /* empty fn */ }};
-    const validItem2 = {id: 'valid', label: 'anicelabel', action () { /* empty fn */ }};
+    const validItem1 = { id: 'valid', label: 'anicelabel', action () { /* empty fn */ } };
+    const validItem2 = { id: 'valid', label: 'anicelabel', action () { /* empty fn */ } };
    contextmenu.add(validItem1);

    assert.throws(
--- a/cypress/integration/unit/coords.js
+++ b/cypress/integration/unit/coords.js
@@ -1,6 +1,6 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
 import * as coords from '../../../instrumented/svgcanvas/coords.js';

--- a/cypress/integration/unit/draw.js
+++ b/cypress/integration/unit/draw.js
@@ -1,6 +1,6 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as draw from '../../../instrumented/svgcanvas/draw.js';
 import * as units from '../../../instrumented/common/units.js';

@@ -61,7 +61,7 @@ describe('draw.Drawing', function () {
   */
  function createSVGElement (jsonMap) {
    const elem = document.createElementNS(NS.SVG, jsonMap.element);
-    Object.entries(jsonMap.attr).forEach(([attr, value]) => {
+    Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
      elem.setAttribute(attr, value);
    });
    return elem;
@@ -86,7 +86,7 @@ describe('draw.Drawing', function () {
    layer3.append(layer3Title);
    svgElem.append(layer3);

-    return [layer1, layer2, layer3];
+    return [ layer1, layer2, layer3 ];
  };

  const createSomeElementsInGroup = function (group) {
@@ -101,11 +101,11 @@ describe('draw.Drawing', function () {
      // }),
      createSVGElement({
        element: 'rect',
-        attr: {x: '0', y: '1', width: '5', height: '10'}
+        attr: { x: '0', y: '1', width: '5', height: '10' }
      }),
      createSVGElement({
        element: 'line',
-        attr: {x1: '0', y1: '1', x2: '5', y2: '6'}
+        attr: { x1: '0', y1: '1', x2: '5', y2: '6' }
      })
    );

@@ -115,7 +115,7 @@ describe('draw.Drawing', function () {
    });
    g.append(createSVGElement({
      element: 'rect',
-      attr: {x: '0', y: '1', width: '5', height: '10'}
+      attr: { x: '0', y: '1', width: '5', height: '10' }
    }));
    group.append(g);
    return 4;
--- a/cypress/integration/unit/history.js
+++ b/cypress/integration/unit/history.js
@@ -1,6 +1,6 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as transformlist from '../../../instrumented/svgcanvas/svgtransformlist.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
 import * as hstory from '../../../instrumented/svgcanvas/history.js';
@@ -402,7 +402,7 @@ describe('history', function () {
  it('Test ChangeElementCommand', function () {
    this.div1.setAttribute('title', 'new title');
    let change = new hstory.ChangeElementCommand(this.div1,
-      {title: 'old title', class: 'foo'});
+      { title: 'old title', class: 'foo' });
    assert.ok(change.unapply);
    assert.ok(change.apply);
    assert.equal(typeof change.unapply, typeof function () { /* empty fn */ });
@@ -418,7 +418,7 @@ describe('history', function () {

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

    change.unapply();
    assert.ok(!this.div1.textContent);
@@ -428,7 +428,7 @@ describe('history', function () {

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

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

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

    justCalled = null;
@@ -472,7 +472,7 @@ describe('history', function () {

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

    assert.ok(change.unapply);
    assert.ok(change.apply);
--- a/cypress/integration/unit/math.js
+++ b/cypress/integration/unit/math.js
@@ -1,6 +1,6 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as math from '../../../instrumented/svgcanvas/math.js';

 describe('math', function () {
@@ -17,7 +17,7 @@ describe('math', function () {
  });

  it('Test svgedit.math.transformPoint() function', function () {
-    const {transformPoint} = math;
+    const { transformPoint } = math;

    const m = svg.createSVGMatrix();
    m.a = 1; m.b = 0;
@@ -51,7 +51,7 @@ describe('math', function () {

  it('Test svgedit.math.matrixMultiply() function', function () {
    const mult = math.matrixMultiply;
-    const {isIdentity} = math;
+    const { isIdentity } = math;

    // translate there and back
    const tr1 = svg.createSVGMatrix().translate(100, 50),
@@ -84,7 +84,7 @@ describe('math', function () {
  });

  it('Test svgedit.math.transformBox() function', function () {
-    const {transformBox} = math;
+    const { transformBox } = math;

    const m = svg.createSVGMatrix();
    m.a = 1; m.b = 0;
--- a/cypress/integration/unit/path.js
+++ b/cypress/integration/unit/path.js
@@ -3,11 +3,11 @@ import 'pathseg';

 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
 import * as pathModule from '../../../instrumented/svgcanvas/path.js';
-import {Path, Segment} from '../../../instrumented/svgcanvas/path-method.js';
-import {init as unitsInit} from '../../../instrumented/common/units.js';
+import { Path, Segment } from '../../../instrumented/svgcanvas/path-method.js';
+import { init as unitsInit } from '../../../instrumented/common/units.js';

 describe('path', function () {
  /**
@@ -48,7 +48,7 @@ describe('path', function () {
    const path = document.createElementNS(NS.SVG, 'path');
    path.setAttribute('d', 'M0,0 L10,11 L20,21Z');

-    const [mockPathContext, mockUtilitiesContext] = getMockContexts();
+    const [ mockPathContext, mockUtilitiesContext ] = getMockContexts();
    pathModule.init(mockPathContext);
    utilities.init(mockUtilitiesContext);
    new Path(path); // eslint-disable-line no-new
@@ -57,7 +57,7 @@ describe('path', function () {
    assert.equal(path.pathSegList.getItem(1).x, 10);
    assert.equal(path.pathSegList.getItem(1).y, 11);

-    pathModule.replacePathSeg(SVGPathSeg.PATHSEG_LINETO_REL, 1, [30, 31], path);
+    pathModule.replacePathSeg(SVGPathSeg.PATHSEG_LINETO_REL, 1, [ 30, 31 ], path);

    assert.equal(path.pathSegList.getItem(1).pathSegTypeAsLetter, 'l');
    assert.equal(path.pathSegList.getItem(1).x, 30);
@@ -68,7 +68,7 @@ describe('path', function () {
    const path = document.createElementNS(NS.SVG, 'path');
    path.setAttribute('d', 'M0,0 L10,11 L20,21Z');

-    const [mockPathContext, mockUtilitiesContext] = getMockContexts();
+    const [ mockPathContext, mockUtilitiesContext ] = getMockContexts();
    pathModule.init(mockPathContext);
    utilities.init(mockUtilitiesContext);
    new Path(path); // eslint-disable-line no-new
@@ -78,7 +78,7 @@ describe('path', function () {
    assert.equal(path.pathSegList.getItem(1).y, 11);

    const segment = new Segment(1, path.pathSegList.getItem(1));
-    segment.setType(SVGPathSeg.PATHSEG_LINETO_REL, [30, 31]);
+    segment.setType(SVGPathSeg.PATHSEG_LINETO_REL, [ 30, 31 ]);
    assert.equal(segment.item.pathSegTypeAsLetter, 'l');
    assert.equal(segment.item.x, 30);
    assert.equal(segment.item.y, 31);
@@ -96,7 +96,7 @@ describe('path', function () {
    path.setAttribute('d', 'M0,0 C11,12 13,14 15,16 Z');
    svg.append(path);

-    const [mockPathContext, mockUtilitiesContext] = getMockContexts(svg);
+    const [ mockPathContext, mockUtilitiesContext ] = getMockContexts(svg);
    pathModule.init(mockPathContext);
    utilities.init(mockUtilitiesContext);
    const segment = new Segment(1, path.pathSegList.getItem(1));
@@ -110,7 +110,7 @@ describe('path', function () {
    assert.equal(path.pathSegList.getItem(1).x, 15);
    assert.equal(path.pathSegList.getItem(1).y, 16);

-    segment.setType(SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, [30, 31, 32, 33, 34, 35]);
+    segment.setType(SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, [ 30, 31, 32, 33, 34, 35 ]);
    assert.equal(path.pathSegList.getItem(1).pathSegTypeAsLetter, 'c');
    assert.equal(path.pathSegList.getItem(1).x1, 32);
    assert.equal(path.pathSegList.getItem(1).y1, 33);
@@ -124,7 +124,7 @@ describe('path', function () {
    const path = document.createElementNS(NS.SVG, 'path');
    path.setAttribute('d', 'M0,0 L10,11 L20,21Z');

-    const [mockPathContext, mockUtilitiesContext] = getMockContexts();
+    const [ mockPathContext, mockUtilitiesContext ] = getMockContexts();
    pathModule.init(mockPathContext);
    utilities.init(mockUtilitiesContext);
    new Path(path); // eslint-disable-line no-new
@@ -144,7 +144,7 @@ describe('path', function () {
    const path = document.createElementNS(NS.SVG, 'path');
    path.setAttribute('d', 'M0,0 C11,12 13,14 15,16 Z');

-    const [mockPathContext, mockUtilitiesContext] = getMockContexts();
+    const [ mockPathContext, mockUtilitiesContext ] = getMockContexts();
    pathModule.init(mockPathContext);
    utilities.init(mockUtilitiesContext);
    new Path(path); // eslint-disable-line no-new
--- a/cypress/integration/unit/sanitize.js
+++ b/cypress/integration/unit/sanitize.js
@@ -1,6 +1,6 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as sanitize from '../../../instrumented/svgcanvas/sanitize.js';

 describe('sanitize', function () {
--- a/cypress/integration/unit/select.js
+++ b/cypress/integration/unit/select.js
@@ -1,7 +1,7 @@
 import '../../../instrumented/editor/jquery.min.js';

 import * as select from '../../../instrumented/svgcanvas/select.js';
-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';

 describe('select', function () {
  const sandbox = document.createElement('div');
@@ -10,7 +10,7 @@ describe('select', function () {
  let svgroot;
  let svgcontent;
  const mockConfig = {
-    dimensions: [640, 480]
+    dimensions: [ 640, 480 ]
  };
  const dataStorage = {
    _storage: new WeakMap(),
@@ -33,7 +33,7 @@ describe('select', function () {
      }
      return ret;
    }
-  };  
+  };

  /**
  * @implements {module:select.SVGFactory}
@@ -41,7 +41,7 @@ describe('select', function () {
  const mockFactory = {
    createSVGElement (jsonMap) {
      const elem = document.createElementNS(NS.SVG, jsonMap.element);
-      Object.entries(jsonMap.attr).forEach(([attr, value]) => {
+      Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
        elem.setAttribute(attr, value);
      });
      return elem;
@@ -58,11 +58,11 @@ describe('select', function () {
  beforeEach(() => {
    svgroot = mockFactory.createSVGElement({
      element: 'svg',
-      attr: {id: 'svgroot'}
+      attr: { id: 'svgroot' }
    });
    svgcontent = mockFactory.createSVGElement({
      element: 'svg',
-      attr: {id: 'svgcontent'}
+      attr: { id: 'svgcontent' }
    });

    svgroot.append(svgcontent);
--- a/cypress/integration/unit/svgtransformlist.js
+++ b/cypress/integration/unit/svgtransformlist.js
@@ -1,8 +1,8 @@
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as transformlist from '../../../instrumented/svgcanvas/svgtransformlist.js';
-import {disableSupportsNativeTransformLists} from '../../../instrumented/common/browser.js';
+import { disableSupportsNativeTransformLists } from '../../../instrumented/common/browser.js';

 import almostEqualsPlugin from '../../support/assert-almostEquals.js';
 import expectOutOfBoundsExceptionPlugin from '../../support/assert-expectOutOfBoundsException.js';
--- a/cypress/integration/unit/test1.js
+++ b/cypress/integration/unit/test1.js
@@ -34,14 +34,14 @@ describe('Basic Module', function () {
    workarea.append(svgcanvas);
    const toolsLeft = document.createElement('div');
    toolsLeft.id = 'tools_left';
- 
+
    svgEditor.append(workarea, toolsLeft);
    document.body.append(svgEditor);

    svgCanvas = new SvgCanvas(
      document.getElementById('svgcanvas'), {
        canvas_expansion: 3,
-        dimensions: [640, 480],
+        dimensions: [ 640, 480 ],
        initFill: {
          color: 'FF0000', // solid red
          opacity: 1
@@ -55,7 +55,7 @@ describe('Basic Module', function () {
        imgPath: '../editor/images/',
        langPath: 'locale/',
        extPath: 'extensions/',
-        extensions: ['ext-arrows.js', 'ext-connector.js', 'ext-eyedropper.js'],
+        extensions: [ 'ext-arrows.js', 'ext-connector.js', 'ext-eyedropper.js' ],
        initTool: 'select',
        wireframe: false
      }
--- a/cypress/integration/unit/units.js
+++ b/cypress/integration/unit/units.js
@@ -51,7 +51,7 @@ describe('units', function () {
    assert.ok(units.shortFloat);
    assert.equal(typeof units.shortFloat, typeof function () { /* empty fn */ });

-    const {shortFloat} = units;
+    const { shortFloat } = units;
    assert.equal(shortFloat(0.00000001), 0);
    assert.equal(shortFloat(1), 1);
    assert.equal(shortFloat(3.45678), 3.4568);
@@ -63,7 +63,7 @@ describe('units', function () {
    assert.ok(units.isValidUnit);
    assert.equal(typeof units.isValidUnit, typeof function () { /* empty fn */ });

-    const {isValidUnit} = units;
+    const { isValidUnit } = units;
    assert.ok(isValidUnit('0'));
    assert.ok(isValidUnit('1'));
    assert.ok(isValidUnit('1.1'));
--- a/cypress/integration/unit/utilities-bbox.js
+++ b/cypress/integration/unit/utilities-bbox.js
@@ -3,7 +3,7 @@ import 'pathseg';

 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
 import * as transformlist from '../../../instrumented/svgcanvas/svgtransformlist.js';
 import * as math from '../../../instrumented/svgcanvas/math.js';
@@ -20,7 +20,7 @@ describe('utilities bbox', function () {
   */
  function mockCreateSVGElement (jsonMap) {
    const elem = document.createElementNS(NS.SVG, jsonMap.element);
-    Object.entries(jsonMap.attr).forEach(([attr, value]) => {
+    Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
      elem.setAttribute(attr, value);
    });
    return elem;
@@ -55,7 +55,7 @@ describe('utilities bbox', function () {
        const type = seg.pathSegType;
        if (type === 1) { continue; }
        const pts = [];
-        ['', 1, 2].forEach(function (n) {
+        [ '', 1, 2 ].forEach(function (n) {
          const x = seg['x' + n], y = seg['y' + n];
          if (x !== undefined && y !== undefined) {
            const pt = math.transformPoint(x, y, m);
@@ -82,7 +82,7 @@ describe('utilities bbox', function () {

    svgroot = mockCreateSVGElement({
      element: 'svg',
-      attr: {id: 'svgroot'}
+      attr: { id: 'svgroot' }
    });
    sandbox.append(svgroot);

@@ -101,41 +101,41 @@ describe('utilities bbox', function () {
  });

  it('Test getBBoxWithTransform and no transform', function () {
-    const {getBBoxWithTransform} = utilities;
+    const { getBBoxWithTransform } = utilities;

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 L2,3'}
+      attr: { id: 'path', d: 'M0,1 L2,3' }
    });
    svgroot.append(elem);
    let bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 2, height: 2});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 2, height: 2 });
    assert.equal(mockaddSVGElementFromJsonCallCount, 0);
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    assert.equal(mockaddSVGElementFromJsonCallCount, 0);
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6'}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6' }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 5});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 5 });
    assert.equal(mockaddSVGElementFromJsonCallCount, 0);
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    const g = mockCreateSVGElement({
      element: 'g',
@@ -144,17 +144,17 @@ describe('utilities bbox', function () {
    g.append(elem);
    svgroot.append(g);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    assert.equal(mockaddSVGElementFromJsonCallCount, 0);
    g.remove();
  });

  it.skip('Test getBBoxWithTransform and a rotation transform', function () {
-    const {getBBoxWithTransform} = utilities;
+    const { getBBoxWithTransform } = utilities;

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M10,10 L20,20', transform: 'rotate(45 10,10)'}
+      attr: { id: 'path', d: 'M10,10 L20,20', transform: 'rotate(45 10,10)' }
    });
    svgroot.append(elem);
    let bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -166,7 +166,7 @@ describe('utilities bbox', function () {

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '10', y: '10', width: '10', height: '20', transform: 'rotate(90 15,20)'}
+      attr: { id: 'rect', x: '10', y: '10', width: '10', height: '20', transform: 'rotate(90 15,20)' }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -177,12 +177,12 @@ describe('utilities bbox', function () {
    assert.equal(mockaddSVGElementFromJsonCallCount, 1);
    elem.remove();

-    const rect = {x: 10, y: 10, width: 10, height: 20};
+    const rect = { x: 10, y: 10, width: 10, height: 20 };
    const angle = 45;
-    const origin = {x: 15, y: 20}; // eslint-disable-line no-shadow
+    const origin = { x: 15, y: 20 }; // eslint-disable-line no-shadow
    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect2', x: rect.x, y: rect.y, width: rect.width, height: rect.height, transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ')'}
+      attr: { id: 'rect2', x: rect.x, y: rect.y, width: rect.width, height: rect.height, transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ')' }
    });
    svgroot.append(elem);
    mockaddSVGElementFromJsonCallCount = 0;
@@ -198,11 +198,11 @@ describe('utilities bbox', function () {
    // Same as previous but wrapped with g and the transform is with the g.
    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect3', x: rect.x, y: rect.y, width: rect.width, height: rect.height}
+      attr: { id: 'rect3', x: rect.x, y: rect.y, width: rect.width, height: rect.height }
    });
    const g = mockCreateSVGElement({
      element: 'g',
-      attr: {transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ')'}
+      attr: { transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ')' }
    });
    g.append(elem);
    svgroot.append(g);
@@ -217,7 +217,7 @@ describe('utilities bbox', function () {

    elem = mockCreateSVGElement({
      element: 'ellipse',
-      attr: {id: 'ellipse1', cx: '100', cy: '100', rx: '50', ry: '50', transform: 'rotate(45 100,100)'}
+      attr: { id: 'ellipse1', cx: '100', cy: '100', rx: '50', ry: '50', transform: 'rotate(45 100,100)' }
    });
    svgroot.append(elem);
    mockaddSVGElementFromJsonCallCount = 0;
@@ -232,7 +232,7 @@ describe('utilities bbox', function () {
  });

  it.skip('Test getBBoxWithTransform with rotation and matrix transforms', function () {
-    const {getBBoxWithTransform} = utilities;
+    const { getBBoxWithTransform } = utilities;

    let tx = 10; // tx right
    let ty = 10; // tx down
@@ -241,7 +241,7 @@ describe('utilities bbox', function () {
    let matrix = 'matrix(1,0,0,1,' + txInRotatedSpace + ',' + tyInRotatedSpace + ')';
    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M10,10 L20,20', transform: 'rotate(45 10,10) ' + matrix}
+      attr: { id: 'path', d: 'M10,10 L20,20', transform: 'rotate(45 10,10) ' + matrix }
    });
    svgroot.append(elem);
    let bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -256,7 +256,7 @@ describe('utilities bbox', function () {
    matrix = 'matrix(1,0,0,1,' + txInRotatedSpace + ',' + tyInRotatedSpace + ')';
    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '10', y: '10', width: '10', height: '20', transform: 'rotate(90 15,20) ' + matrix}
+      attr: { id: 'rect', x: '10', y: '10', width: '10', height: '20', transform: 'rotate(90 15,20) ' + matrix }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -266,9 +266,9 @@ describe('utilities bbox', function () {
    assert.close(bbox.height, 10, EPSILON);
    elem.remove();

-    const rect = {x: 10, y: 10, width: 10, height: 20};
+    const rect = { x: 10, y: 10, width: 10, height: 20 };
    const angle = 45;
-    const origin = {x: 15, y: 20}; // eslint-disable-line no-shadow
+    const origin = { x: 15, y: 20 }; // eslint-disable-line no-shadow
    tx = 10; // tx right
    ty = 10; // tx down
    txInRotatedSpace = Math.sqrt(tx * tx + ty * ty); // translate in rotated 45 space.
@@ -276,7 +276,7 @@ describe('utilities bbox', function () {
    matrix = 'matrix(1,0,0,1,' + txInRotatedSpace + ',' + tyInRotatedSpace + ')';
    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect2', x: rect.x, y: rect.y, width: rect.width, height: rect.height, transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ') ' + matrix}
+      attr: { id: 'rect2', x: rect.x, y: rect.y, width: rect.width, height: rect.height, transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ') ' + matrix }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -290,11 +290,11 @@ describe('utilities bbox', function () {
    // Same as previous but wrapped with g and the transform is with the g.
    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect3', x: rect.x, y: rect.y, width: rect.width, height: rect.height}
+      attr: { id: 'rect3', x: rect.x, y: rect.y, width: rect.width, height: rect.height }
    });
    const g = mockCreateSVGElement({
      element: 'g',
-      attr: {transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ') ' + matrix}
+      attr: { transform: 'rotate(' + angle + ' ' + origin.x + ',' + origin.y + ') ' + matrix }
    });
    g.append(elem);
    svgroot.append(g);
@@ -307,7 +307,7 @@ describe('utilities bbox', function () {

    elem = mockCreateSVGElement({
      element: 'ellipse',
-      attr: {id: 'ellipse1', cx: '100', cy: '100', rx: '50', ry: '50', transform: 'rotate(45 100,100) ' + matrix}
+      attr: { id: 'ellipse1', cx: '100', cy: '100', rx: '50', ry: '50', transform: 'rotate(45 100,100) ' + matrix }
    });
    svgroot.append(elem);
    bbox = getBBoxWithTransform(elem, mockaddSVGElementFromJson, mockPathActions);
@@ -320,39 +320,39 @@ describe('utilities bbox', function () {
  });

  it('Test getStrokedBBox with stroke-width 10', function () {
-    const {getStrokedBBox} = utilities;
+    const { getStrokedBBox } = utilities;

    const strokeWidth = 10;
    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 L2,3', 'stroke-width': strokeWidth}
+      attr: { id: 'path', d: 'M0,1 L2,3', 'stroke-width': strokeWidth }
    });
    svgroot.append(elem);
-    let bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 2 + strokeWidth, height: 2 + strokeWidth});
+    let bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 2 + strokeWidth, height: 2 + strokeWidth });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': strokeWidth}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': strokeWidth }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 10 + strokeWidth});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 10 + strokeWidth });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6', 'stroke-width': strokeWidth}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6', 'stroke-width': strokeWidth }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 5 + strokeWidth});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 5 + strokeWidth });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': strokeWidth}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': strokeWidth }
    });
    const g = mockCreateSVGElement({
      element: 'g',
@@ -360,44 +360,44 @@ describe('utilities bbox', function () {
    });
    g.append(elem);
    svgroot.append(g);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 10 + strokeWidth});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0 - strokeWidth / 2, y: 1 - strokeWidth / 2, width: 5 + strokeWidth, height: 10 + strokeWidth });
    g.remove();
  });

  it("Test getStrokedBBox with stroke-width 'none'", function () {
-    const {getStrokedBBox} = utilities;
+    const { getStrokedBBox } = utilities;

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 L2,3', 'stroke-width': 'none'}
+      attr: { id: 'path', d: 'M0,1 L2,3', 'stroke-width': 'none' }
    });
    svgroot.append(elem);
-    let bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 2, height: 2});
+    let bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 2, height: 2 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': 'none'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': 'none' }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6', 'stroke-width': 'none'}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6', 'stroke-width': 'none' }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 5});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 5 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': 'none'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10', 'stroke-width': 'none' }
    });
    const g = mockCreateSVGElement({
      element: 'g',
@@ -405,44 +405,44 @@ describe('utilities bbox', function () {
    });
    g.append(elem);
    svgroot.append(g);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    g.remove();
  });

  it('Test getStrokedBBox with no stroke-width attribute', function () {
-    const {getStrokedBBox} = utilities;
+    const { getStrokedBBox } = utilities;

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 L2,3'}
+      attr: { id: 'path', d: 'M0,1 L2,3' }
    });
    svgroot.append(elem);
-    let bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 2, height: 2});
+    let bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 2, height: 2 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6'}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6' }
    });
    svgroot.append(elem);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 5});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 5 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    const g = mockCreateSVGElement({
      element: 'g',
@@ -450,8 +450,8 @@ describe('utilities bbox', function () {
    });
    g.append(elem);
    svgroot.append(g);
-    bbox = getStrokedBBox([elem], mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    bbox = getStrokedBBox([ elem ], mockaddSVGElementFromJson, mockPathActions);
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    g.remove();
  });

@@ -473,7 +473,7 @@ describe('utilities bbox', function () {
   */
  function rotatePoint (point, angle, origin) { // eslint-disable-line no-shadow
    if (!origin) {
-      origin = {x: 0, y: 0};
+      origin = { x: 0, y: 0 };
    }
    const x = point.x - origin.x;
    const y = point.y - origin.y;
@@ -491,10 +491,10 @@ describe('utilities bbox', function () {
   * @returns {module:utilities.BBoxObject}
   */
  function rotateRect (rect, angle, origin) { // eslint-disable-line no-shadow
-    const tl = rotatePoint({x: rect.x, y: rect.y}, angle, origin);
-    const tr = rotatePoint({x: rect.x + rect.width, y: rect.y}, angle, origin);
-    const br = rotatePoint({x: rect.x + rect.width, y: rect.y + rect.height}, angle, origin);
-    const bl = rotatePoint({x: rect.x, y: rect.y + rect.height}, angle, origin);
+    const tl = rotatePoint({ x: rect.x, y: rect.y }, angle, origin);
+    const tr = rotatePoint({ x: rect.x + rect.width, y: rect.y }, angle, origin);
+    const br = rotatePoint({ x: rect.x + rect.width, y: rect.y + rect.height }, angle, origin);
+    const bl = rotatePoint({ x: rect.x, y: rect.y + rect.height }, angle, origin);

    const minx = Math.min(tl.x, tr.x, bl.x, br.x);
    const maxx = Math.max(tl.x, tr.x, bl.x, br.x);
--- a/cypress/integration/unit/utilities-performance.js
+++ b/cypress/integration/unit/utilities-performance.js
@@ -2,7 +2,7 @@
 import 'pathseg';
 import '../../../instrumented/editor/jquery.min.js';

-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
 import * as transformlist from '../../../instrumented/svgcanvas/svgtransformlist.js';
 import * as math from '../../../instrumented/svgcanvas/math.js';
@@ -82,7 +82,7 @@ describe('utilities performance', function () {
   */
  function mockCreateSVGElement (jsonMap) {
    const elem = document.createElementNS(NS.SVG, jsonMap.element);
-    Object.entries(jsonMap.attr).forEach(([attr, value]) => {
+    Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
      elem.setAttribute(attr, value);
    });
    return elem;
@@ -111,7 +111,7 @@ describe('utilities performance', function () {
      const clone = elem.cloneNode(true); // t: deep clone
      // Make sure you set a unique ID like a real document.
      clone.setAttribute('id', elemId + index);
-      const {parentNode} = elem;
+      const { parentNode } = elem;
      parentNode.append(clone);
    }
  }
@@ -135,7 +135,7 @@ describe('utilities performance', function () {
          continue;
        }
        const pts = [];
-        ['', 1, 2].forEach(function (n) {
+        [ '', 1, 2 ].forEach(function (n) {
          const x = seg['x' + n],
            y = seg['y' + n];
          if (x !== undefined && y !== undefined) {
@@ -183,8 +183,8 @@ describe('utilities performance', function () {
  //   Pass2 svgCanvas.getStrokedBBox total ms    17, ave ms 0.2,   min/max 0 23

  it('Test svgCanvas.getStrokedBBox() performance with matrix transforms', function () {
-    const {getStrokedBBox} = utilities;
-    const {children} = currentLayer;
+    const { getStrokedBBox } = utilities;
+    const { children } = currentLayer;

    let lastTime, now,
      min = Number.MAX_VALUE,
@@ -200,7 +200,7 @@ describe('utilities performance', function () {
    // Skip the first child which is the title.
    for (let index = 1; index < count; index++) {
      const child = children[index];
-      /* const obj = */ getStrokedBBox([child], mockaddSVGElementFromJson, mockPathActions);
+      /* const obj = */ getStrokedBBox([ child ], mockaddSVGElementFromJson, mockPathActions);
      now = Date.now(); const delta = now - lastTime; lastTime = now;
      total += delta;
      min = Math.min(min, delta);
@@ -220,7 +220,7 @@ describe('utilities performance', function () {
        // Skip the first child which is the title.
        for (let index = 1; index < ct; index++) {
          const child = children[index];
-          /* const obj = */ getStrokedBBox([child], mockaddSVGElementFromJson, mockPathActions);
+          /* const obj = */ getStrokedBBox([ child ], mockaddSVGElementFromJson, mockPathActions);
          now = Date.now(); const delta = now - lastTime; lastTime = now;
          total += delta;
          min = Math.min(min, delta);
--- a/cypress/integration/unit/utilities.js
+++ b/cypress/integration/unit/utilities.js
@@ -3,7 +3,7 @@ import '../../../instrumented/editor/jquery.min.js';

 import * as browser from '../../../instrumented/common/browser.js';
 import * as utilities from '../../../instrumented/svgcanvas/utilities.js';
-import {NS} from '../../../instrumented/common/namespaces.js';
+import { NS } from '../../../instrumented/common/namespaces.js';

 describe('utilities', function () {
  /**
@@ -13,7 +13,7 @@ describe('utilities', function () {
   */
  function mockCreateSVGElement (jsonMap) {
    const elem = document.createElementNS(NS.SVG, jsonMap.element);
-    Object.entries(jsonMap.attr).forEach(([attr, value]) => {
+    Object.entries(jsonMap.attr).forEach(([ attr, value ]) => {
      elem.setAttribute(attr, value);
    });
    return elem;
@@ -28,7 +28,7 @@ describe('utilities', function () {
    svgroot.append(elem);
    return elem;
  }
-  const mockPathActions = {resetOrientation () { /* empty fn */ }};
+  const mockPathActions = { resetOrientation () { /* empty fn */ } };
  let mockHistorySubCommands = [];
  const mockHistory = {
    BatchCommand: class {
@@ -92,7 +92,7 @@ describe('utilities', function () {
    svg = document.createElementNS(NS.SVG, 'svg');
    svgroot = mockCreateSVGElement({
      element: 'svg',
-      attr: {id: 'svgroot'}
+      attr: { id: 'svgroot' }
    });
    sandbox.append(svgroot);
    document.body.append(sandbox);
@@ -105,7 +105,7 @@ describe('utilities', function () {
  });

  it('Test svgedit.utilities.toXml() function', function () {
-    const {toXml} = utilities;
+    const { toXml } = utilities;

    assert.equal(toXml('a'), 'a');
    assert.equal(toXml('ABC_'), 'ABC_');
@@ -116,7 +116,7 @@ describe('utilities', function () {
  });

  it('Test svgedit.utilities.fromXml() function', function () {
-    const {fromXml} = utilities;
+    const { fromXml } = utilities;

    assert.equal(fromXml('a'), 'a');
    assert.equal(fromXml('ABC_'), 'ABC_');
@@ -127,7 +127,7 @@ describe('utilities', function () {
  });

  it('Test svgedit.utilities.encode64() function', function () {
-    const {encode64} = utilities;
+    const { encode64 } = utilities;

    assert.equal(encode64('abcdef'), 'YWJjZGVm');
    assert.equal(encode64('12345'), 'MTIzNDU=');
@@ -136,7 +136,7 @@ describe('utilities', function () {
  });

  it('Test svgedit.utilities.decode64() function', function () {
-    const {decode64} = utilities;
+    const { decode64 } = utilities;

    assert.equal(decode64('YWJjZGVm'), 'abcdef');
    assert.equal(decode64('MTIzNDU='), '12345');
@@ -151,7 +151,7 @@ describe('utilities', function () {
  });

  it('Test svgedit.utilities.bboxToObj() function', function () {
-    const {bboxToObj} = utilities;
+    const { bboxToObj } = utilities;

    const rect = svg.createSVGRect();
    rect.x = 1;
@@ -188,38 +188,38 @@ describe('utilities', function () {
  });

  it('Test getPathDFromSegments', function () {
-    const {getPathDFromSegments} = utilities;
+    const { getPathDFromSegments } = utilities;

    const doc = utilities.text2xml('<svg></svg>');
    const path = doc.createElementNS(NS.SVG, 'path');
    path.setAttribute('d', 'm0,0l5,0l0,5l-5,0l0,-5z');
    let d = getPathDFromSegments([
-      ['M', [1, 2]],
-      ['Z', []]
+      [ 'M', [ 1, 2 ] ],
+      [ 'Z', [] ]
    ]);
    assert.equal(d, 'M1,2 Z');

    d = getPathDFromSegments([
-      ['M', [1, 2]],
-      ['M', [3, 4]],
-      ['Z', []]
+      [ 'M', [ 1, 2 ] ],
+      [ 'M', [ 3, 4 ] ],
+      [ 'Z', [] ]
    ]);
    assert.equal(d, 'M1,2 M3,4 Z');

    d = getPathDFromSegments([
-      ['M', [1, 2]],
-      ['C', [3, 4, 5, 6]],
-      ['Z', []]
+      [ 'M', [ 1, 2 ] ],
+      [ 'C', [ 3, 4, 5, 6 ] ],
+      [ 'Z', [] ]
    ]);
    assert.equal(d, 'M1,2 C3,4 5,6 Z');
  });

  it('Test getPathDFromElement', function () {
-    const {getPathDFromElement} = utilities;
+    const { getPathDFromElement } = utilities;

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 Z'}
+      attr: { id: 'path', d: 'M0,1 Z' }
    });
    svgroot.append(elem);
    assert.equal(getPathDFromElement(elem), 'M0,1 Z');
@@ -227,7 +227,7 @@ describe('utilities', function () {

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    svgroot.append(elem);
    assert.equal(getPathDFromElement(elem), 'M0,1 L5,1 L5,11 L0,11 L0,1 Z');
@@ -235,7 +235,7 @@ describe('utilities', function () {

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'roundrect', x: '0', y: '1', rx: '2', ry: '3', width: '10', height: '11'}
+      attr: { id: 'roundrect', x: '0', y: '1', rx: '2', ry: '3', width: '10', height: '11' }
    });
    svgroot.append(elem);
    const closeEnough = /M0,13 C0,2.3\d* 0.9\d*,1 02,1 L8,1 C9.0\d*,1 10,2.3\d* 10,13 L10,9 C10,10.6\d* 9.08675799086758,12 8,12 L02,12 C0.9\d*,12 0,10.6\d* 0,9 L0,13 Z/;
@@ -244,7 +244,7 @@ describe('utilities', function () {

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6'}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6' }
    });
    svgroot.append(elem);
    assert.equal(getPathDFromElement(elem), 'M0,1L5,6');
@@ -252,7 +252,7 @@ describe('utilities', function () {

    elem = mockCreateSVGElement({
      element: 'circle',
-      attr: {id: 'circle', cx: '10', cy: '11', rx: '5', ry: '10'}
+      attr: { id: 'circle', cx: '10', cy: '11', rx: '5', ry: '10' }
    });
    svgroot.append(elem);
    assert.equal(getPathDFromElement(elem), 'M5,11 C5,5.475138121546961 7.237569060773481,1 10,1 C102.7624309392265194,1 105,5.475138121546961 105,11 C105,115.524861878453039 102.7624309392265194,1110 10,1110 C7.237569060773481,1110 5,115.524861878453039 5,11 Z');
@@ -260,13 +260,13 @@ describe('utilities', function () {

    elem = mockCreateSVGElement({
      element: 'polyline',
-      attr: {id: 'polyline', points: '0,1 5,1 5,11 0,11'}
+      attr: { id: 'polyline', points: '0,1 5,1 5,11 0,11' }
    });
    svgroot.append(elem);
    assert.equal(getPathDFromElement(elem), 'M0,1 5,1 5,11 0,11');
    elem.remove();

-    assert.equal(getPathDFromElement({tagName: 'something unknown'}), undefined);
+    assert.equal(getPathDFromElement({ tagName: 'something unknown' }), undefined);
  });

  it('Test getBBoxOfElementAsPath', function () {
@@ -281,36 +281,36 @@ describe('utilities', function () {

    let elem = mockCreateSVGElement({
      element: 'path',
-      attr: {id: 'path', d: 'M0,1 Z'}
+      attr: { id: 'path', d: 'M0,1 Z' }
    });
    svgroot.append(elem);
    let bbox = getBBoxOfElementAsPath(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 0, height: 0});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 0, height: 0 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    svgroot.append(elem);
    bbox = getBBoxOfElementAsPath(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 10});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 10 });
    elem.remove();

    elem = mockCreateSVGElement({
      element: 'line',
-      attr: {id: 'line', x1: '0', y1: '1', x2: '5', y2: '6'}
+      attr: { id: 'line', x1: '0', y1: '1', x2: '5', y2: '6' }
    });
    svgroot.append(elem);
    bbox = getBBoxOfElementAsPath(elem, mockaddSVGElementFromJson, mockPathActions);
-    assert.deepEqual(bbox, {x: 0, y: 1, width: 5, height: 5});
+    assert.deepEqual(bbox, { x: 0, y: 1, width: 5, height: 5 });
    elem.remove();

    // TODO: test element with transform. Need resetOrientation above to be working or mock it.
  });

  it('Test convertToPath rect', function () {
-    const {convertToPath} = utilities;
+    const { convertToPath } = utilities;
    const attrs = {
      fill: 'red',
      stroke: 'white',
@@ -320,7 +320,7 @@ describe('utilities', function () {

    const elem = mockCreateSVGElement({
      element: 'rect',
-      attr: {id: 'rect', x: '0', y: '1', width: '5', height: '10'}
+      attr: { id: 'rect', x: '0', y: '1', width: '5', height: '10' }
    });
    svgroot.append(elem);
    const path = convertToPath(elem, attrs, mockaddSVGElementFromJson, mockPathActions, mockClearSelection, mockAddToSelection, mockHistory, mockAddCommandToHistory);
@@ -337,7 +337,7 @@ describe('utilities', function () {
  });

  it('Test convertToPath unknown element', function () {
-    const {convertToPath} = utilities;
+    const { convertToPath } = utilities;
    const attrs = {
      fill: 'red',
      stroke: 'white',