bugfix for sizer rectangle handles growing on click

src/mxgraph/editor/mxDefaultPopupMenu.js

@@ -294,7 +294,7 @@ class mxDefaultPopupMenu {
     conditions.nocell = cell == null;
     conditions.ncells = editor.graph.getSelectionCount() > 1;
     conditions.notRoot =
-      model.getRoot() != model.getParent(editor.graph.getDefaultParent());
+      model.getRoot() !== model.getParent(editor.graph.getDefaultParent());
     conditions.cell = cell != null;
 
     const isCell = cell != null && editor.graph.getSelectionCount() === 1;

src/mxgraph/editor/mxEditor.js

@@ -29,6 +29,9 @@ import mxEvent from '../util/mxEvent';
 import mxRootChange from '../model/atomic_changes/mxRootChange';
 import mxValueChange from '../model/atomic_changes/mxValueChange';
 import mxCellAttributeChange from '../model/atomic_changes/mxCellAttributeChange';
+import mxPrintPreview from "../view/mxPrintPreview";
+import mxClipboard from "../util/mxClipboard";
+import mxLog from "../util/mxLog";
 
 /**
  * Installs the required language resources at class
@@ -1729,9 +1732,9 @@ class mxEditor extends mxEventSource {
         if (
           change instanceof mxRootChange ||
           (change instanceof mxValueChange &&
-            change.cell == this.graph.model.root) ||
+            change.cell === this.graph.model.root) ||
           (change instanceof mxCellAttributeChange &&
-            change.cell == this.graph.model.root)
+            change.cell === this.graph.model.root)
         ) {
           this.fireEvent(new mxEventObject(mxEvent.ROOT));
           break;

src/mxgraph/handler/mxCellMarker.js

@@ -402,7 +402,7 @@ class mxCellMarker extends mxEventSource {
    *
    * Destroys the handler and all its resources and DOM nodes.
    */
-  destroy = () => {
+  destroy() {
     this.graph.getView().removeListener(this.resetHandler);
     this.graph.getModel().removeListener(this.resetHandler);
     this.highlight.destroy();

src/mxgraph/handler/mxCellTracker.js

@@ -3,6 +3,7 @@
  * Copyright (c) 2006-2015, Gaudenz Alder
  * Updated to ES9 syntax by David Morrissey 2021
  */
+import mxCellMarker from "./mxCellMarker";
 
 class mxCellTracker extends mxCellMarker {
   /**
@@ -123,7 +124,7 @@ class mxCellTracker extends mxCellMarker {
       this.destroyed = true;
 
       this.graph.removeMouseListener(this);
-      destroy.apply(this);
+      super.destroy();
     }
   };
 }

src/mxgraph/handler/mxConnectionHandler.js

@@ -913,7 +913,7 @@ class mxConnectionHandler extends mxEventSource {
         this.constraintHandler.currentConstraint !== null) ||
       (this.previous !== null &&
         this.error === null &&
-        (this.icons === null || (this.icons !== null && this.icon !== null)))
+        (this.icons === null || this.icon !== null))
     );
   };
 
@@ -923,7 +923,7 @@ class mxConnectionHandler extends mxEventSource {
    * Handles the event by initiating a new connection.
    */
   mouseDown = (sender, me) => {
-    this.mouseDownCounter++;
+    this.mouseDownCounter += 1;
 
     if (
       this.isEnabled() &&
@@ -1627,7 +1627,7 @@ class mxConnectionHandler extends mxEventSource {
       );
       const rad = -theta * (Math.PI / 180);
 
-      if (theta != 0) {
+      if (theta !== 0) {
         next = mxUtils.getRotatedPoint(
           new mxPoint(next.x, next.y),
           Math.cos(rad),
@@ -1644,7 +1644,7 @@ class mxConnectionHandler extends mxEventSource {
       );
 
       if (tmp != null) {
-        if (theta != 0) {
+        if (theta !== 0) {
           tmp = mxUtils.getRotatedPoint(
             new mxPoint(tmp.x, tmp.y),
             Math.cos(-rad),
@@ -1696,7 +1696,7 @@ class mxConnectionHandler extends mxEventSource {
    * Adds the waypoint for the given event to <waypoints>.
    */
   addWaypointForEvent = me => {
-    const point = mxUtils.convertPoint(
+    let point = mxUtils.convertPoint(
       this.graph.container,
       me.getX(),
       me.getY()
@@ -1714,7 +1714,7 @@ class mxConnectionHandler extends mxEventSource {
       }
 
       const { scale } = this.graph.view;
-      const point = new mxPoint(
+      point = new mxPoint(
         this.graph.snap(me.getGraphX() / scale) * scale,
         this.graph.snap(me.getGraphY() / scale) * scale
       );
@@ -2010,7 +2010,7 @@ class mxConnectionHandler extends mxEventSource {
             model.setGeometry(edge, this.edgeState.cell.geometry);
           }
 
-          const parent = model.getParent(source);
+          parent = model.getParent(source);
 
           // Inserts edge before source
           if (this.isInsertBefore(edge, source, target, evt, dropTarget)) {

src/mxgraph/handler/mxConstraintHandler.js

@@ -223,7 +223,7 @@ class mxConstraintHandler {
     if (
       cell == null &&
       point != null &&
-      (me.getGraphX() != point.x || me.getGraphY() != point.y)
+      (me.getGraphX() !== point.x || me.getGraphY() !== point.y)
     ) {
       cell = this.graph.getCellAt(point.x, point.y);
     }

src/mxgraph/handler/mxEdgeHandler.js

@@ -1105,43 +1105,41 @@ class mxEdgeHandler {
     let overrideY = false;
 
     if (tt > 0 && this.isSnapToTerminalsEvent(me)) {
-      function snapToPoint(pt) {
+
+      const snapToPoint = pt => {
         if (pt != null) {
           const { x } = pt;
-
           if (Math.abs(point.x - x) < tt) {
             point.x = x;
             overrideX = true;
           }
 
           const { y } = pt;
-
           if (Math.abs(point.y - y) < tt) {
             point.y = y;
             overrideY = true;
           }
         }
-      }
+      };
 
       // Temporary function
-      function snapToTerminal(terminal) {
+      const snapToTerminal = terminal => {
         if (terminal != null) {
-          snapToPoint.call(
+          snapToPoint(
-            this,
             new mxPoint(
               view.getRoutingCenterX(terminal),
               view.getRoutingCenterY(terminal)
             )
           );
         }
-      }
+      };
 
-      snapToTerminal.call(this, this.state.getVisibleTerminalState(true));
+      snapToTerminal(this.state.getVisibleTerminalState(true));
-      snapToTerminal.call(this, this.state.getVisibleTerminalState(false));
+      snapToTerminal(this.state.getVisibleTerminalState(false));
 
       if (this.state.absolutePoints != null) {
         for (let i = 0; i < this.state.absolutePoints.length; i += 1) {
-          snapToPoint.call(this, this.state.absolutePoints[i]);
+          snapToPoint(this.state.absolutePoints[i]);
         }
       }
     }
@@ -1339,7 +1337,7 @@ class mxEdgeHandler {
               }
             }
 
-            function checkRemove(idx, tmp) {
+            const checkRemove = (idx, tmp) => {
               if (
                 idx > 0 &&
                 idx < abs.length - 1 &&
@@ -1355,7 +1353,7 @@ class mxEdgeHandler {
                 points.splice(idx - 1, 1);
                 result = points;
               }
-            }
+            };
 
             // LATER: Check if other points can be removed if a segment is made straight
             checkRemove(this.index, pt);

src/mxgraph/handler/mxEdgeSegmentHandler.js

@@ -210,7 +210,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
    */
   connect = (edge, terminal, isSource, isClone, me) => {
     const model = this.graph.getModel();
-    const geo = model.getGeometry(edge);
+    let geo = model.getGeometry(edge);
     let result = null;
 
     // Merges adjacent edge segments
@@ -240,7 +240,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
     model.beginUpdate();
     try {
       if (result != null) {
-        let geo = model.getGeometry(edge);
+        geo = model.getGeometry(edge);
 
         if (geo != null) {
           geo = geo.clone();
@@ -374,8 +374,8 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
 
         for (let i = 0; i < pts.length - 1; i += 1) {
           if (this.bends[i + 1] != null) {
-            const p0 = pts[i];
+            p0 = pts[i];
-            const pe = pts[i + 1];
+            pe = pts[i + 1];
             const pt = new mxPoint(
               p0.x + (pe.x - p0.x) / 2,
               p0.y + (pe.y - p0.y) / 2

src/mxgraph/handler/mxGraphHandler.js

@@ -834,12 +834,12 @@ class mxGraphHandler {
         return (
           state.cell != null &&
           ((!this.cloning && this.isCellMoving(state.cell)) ||
-            (state.cell != (this.target || parent) &&
+            (state.cell !== (this.target || parent) &&
               !ignore &&
               !connected.get(state) &&
               (this.target == null ||
                 this.graph.model.getChildCount(this.target) >= 2) &&
-              p != (this.target || parent)))
+              p !== (this.target || parent)))
         );
       };
     }
@@ -954,7 +954,7 @@ class mxGraphHandler {
    * Returns true if the given cell is a valid drop target.
    */
   isValidDropTarget = (target, me) => {
-    return this.graph.model.getParent(this.cell) != target;
+    return this.graph.model.getParent(this.cell) !== target;
   };
 
   /**
@@ -1040,7 +1040,7 @@ class mxGraphHandler {
         let highlight = false;
 
         if (state != null && (clone || this.isValidDropTarget(target, me))) {
-          if (this.target != target) {
+          if (this.target !== target) {
             this.target = target;
             this.setHighlightColor(mxConstants.DROP_TARGET_COLOR);
           }
@@ -1052,7 +1052,7 @@ class mxGraphHandler {
           if (
             this.connectOnDrop &&
             cell != null &&
-            this.cells.length == 1 &&
+            this.cells.length === 1 &&
             graph.getModel().isVertex(cell) &&
             graph.isCellConnectable(cell)
           ) {
@@ -1104,7 +1104,7 @@ class mxGraphHandler {
 
         this.checkPreview();
 
-        if (this.currentDx != delta.x || this.currentDy != delta.y) {
+        if (this.currentDx !== delta.x || this.currentDy !== delta.y) {
           this.currentDx = delta.x;
           this.currentDy = delta.y;
           this.updatePreview();
@@ -1198,7 +1198,7 @@ class mxGraphHandler {
             const realState = this.graph.view.getState(state.cell);
 
             // Checks if cell was removed or replaced
-            if (realState != state) {
+            if (realState !== state) {
               state.destroy();
 
               if (realState != null) {
@@ -1273,7 +1273,7 @@ class mxGraphHandler {
       }
 
       // Resets the handler if everything was removed
-      if (states.length == 0) {
+      if (states.length === 0) {
         this.reset();
       } else {
         // Redraws connected edges
@@ -1454,7 +1454,7 @@ class mxGraphHandler {
         if (
           state.control != null &&
           state.control.node != null &&
-          state.control.node.style.visibility == 'hidden'
+          state.control.node.style.visibility === 'hidden'
         ) {
           state.control.node.style.visibility = '';
         }
@@ -1487,7 +1487,7 @@ class mxGraphHandler {
    * force - Forces an update of the handler regardless of the last used value.
    */
   setHandlesVisibleForCells = (cells, visible, force) => {
-    if (force || this.handlesVisible != visible) {
+    if (force || this.handlesVisible !== visible) {
       this.handlesVisible = visible;
 
       for (let i = 0; i < cells.length; i += 1) {
@@ -1655,7 +1655,7 @@ class mxGraphHandler {
           mxUtils.getValue(pState.style, mxConstants.STYLE_ROTATION) || 0
         );
 
-        if (alpha != 0) {
+        if (alpha !== 0) {
           const cos = Math.cos(-alpha);
           const sin = Math.sin(-alpha);
           const cx = new mxPoint(pState.getCenterX(), pState.getCenterY());
@@ -1760,7 +1760,7 @@ class mxGraphHandler {
       (this.graph.model.isEdge(state.cell) ||
         this.graph.model.isVertex(state.cell)) &&
       this.graph.isCellDeletable(state.cell) &&
-      this.graph.model.getChildCount(state.cell) == 0 &&
+      this.graph.model.getChildCount(state.cell) === 0 &&
       this.graph.isTransparentState(state)
     );
   };

src/mxgraph/handler/mxHandle.js

@@ -10,6 +10,7 @@ import mxImageShape from "../shape/mxImageShape";
 import mxRectangle from "../util/mxRectangle";
 import mxRectangleShape from "../shape/mxRectangleShape";
 import mxConstants from "../util/mxConstants";
+import mxEvent from "../util/mxEvent";
 
 class mxHandle {
   /**

src/mxgraph/handler/mxVertexHandler.js

@@ -973,7 +973,7 @@ class mxVertexHandler {
     let dx = this.state.x + this.state.width / 2 - point.x;
     let dy = this.state.y + this.state.height / 2 - point.y;
     this.currentAlpha =
-      dx != 0 ? (Math.atan(dy / dx) * 180) / Math.PI + 90 : dy < 0 ? 180 : 0;
+      dx !== 0 ? (Math.atan(dy / dx) * 180) / Math.PI + 90 : dy < 0 ? 180 : 0;
 
     if (dx > 0) {
       this.currentAlpha -= 180;
@@ -1952,61 +1952,52 @@ class mxVertexHandler {
           );
           const cos = Math.cos(alpha);
           const sin = Math.sin(alpha);
-
           const da = Math.round((alpha * 4) / Math.PI);
 
           const ct = new mxPoint(s.getCenterX(), s.getCenterY());
           let pt = mxUtils.getRotatedPoint(new mxPoint(s.x, s.y), cos, sin, ct);
-
           this.moveSizerTo(this.sizers[0], pt.x, pt.y);
           this.sizers[0].setCursor(crs[mxUtils.mod(0 + da, crs.length)]);
 
           pt.x = cx;
           pt.y = s.y;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[1], pt.x, pt.y);
           this.sizers[1].setCursor(crs[mxUtils.mod(1 + da, crs.length)]);
 
           pt.x = r;
           pt.y = s.y;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[2], pt.x, pt.y);
           this.sizers[2].setCursor(crs[mxUtils.mod(2 + da, crs.length)]);
 
           pt.x = s.x;
           pt.y = cy;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[3], pt.x, pt.y);
           this.sizers[3].setCursor(crs[mxUtils.mod(7 + da, crs.length)]);
 
           pt.x = r;
           pt.y = cy;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[4], pt.x, pt.y);
           this.sizers[4].setCursor(crs[mxUtils.mod(3 + da, crs.length)]);
 
           pt.x = s.x;
           pt.y = b;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[5], pt.x, pt.y);
           this.sizers[5].setCursor(crs[mxUtils.mod(6 + da, crs.length)]);
 
           pt.x = cx;
           pt.y = b;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[6], pt.x, pt.y);
           this.sizers[6].setCursor(crs[mxUtils.mod(5 + da, crs.length)]);
 
           pt.x = r;
           pt.y = b;
           pt = mxUtils.getRotatedPoint(pt, cos, sin, ct);
-
           this.moveSizerTo(this.sizers[7], pt.x, pt.y);
           this.sizers[7].setCursor(crs[mxUtils.mod(4 + da, crs.length)]);
 

src/mxgraph/shape/mxShape.js

@@ -9,6 +9,17 @@ import mxConstants from '../util/mxConstants';
 import mxPoint from '../util/mxPoint';
 import mxSvgCanvas2D from '../util/mxSvgCanvas2D';
 import mxEvent from '../util/mxEvent';
+import mxClient from "../mxClient";
+
+const toBool = i => {
+  if (i === 0) return false;
+  if (i === 1) return true;
+  if (i === '0') return false;
+  if (i === '1') return true;
+  if (String(i).toLowerCase() === 'true') return true;
+  if (String(i).toLowerCase() === 'false') return false;
+  return !!i;
+};
 
 class mxShape {
   /**
@@ -151,7 +162,7 @@ class mxShape {
    * Allows to use the SVG bounding box in SVG. Default is false for performance
    * reasons.
    */
-  useSvgBoundingBox = false;
+  useSvgBoundingBox = true;
 
   /**
    * Class: mxShape
@@ -387,12 +398,12 @@ class mxShape {
     const pts = this.points;
 
     if (pts != null && pts.length > 0 && pts[0] != null) {
-      this.bounds = new mxRectangle(Number(pts[0].x), Number(pts[0].y), 1, 1);
+      this.bounds = new mxRectangle(Math.round(pts[0].x), Math.round(pts[0].y), 1, 1);
 
       for (let i = 1; i < this.points.length; i += 1) {
         if (pts[i] != null) {
           this.bounds.add(
-            new mxRectangle(Number(pts[i].x), Number(pts[i].y), 1, 1)
+            new mxRectangle(Math.round(pts[i].x), Math.round(pts[i].y), 1, 1)
           );
         }
       }
@@ -412,7 +423,7 @@ class mxShape {
       mxConstants.STYLE_DIRECTION,
       mxConstants.DIRECTION_EAST
     );
-    let bounds = rect;
+    let bounds = rect.clone();
 
     // Normalizes argument for getLabelMargins hook
     if (
@@ -423,18 +434,20 @@ class mxShape {
       this.state.text.isPaintBoundsInverted()
     ) {
       bounds = bounds.clone();
-      const tmp = bounds.width;
+      [bounds.width, bounds.height] = [bounds.height, bounds.width];
-      bounds.width = bounds.height;
-      bounds.height = tmp;
     }
 
-    const m = this.getLabelMargins(bounds);
+    let labelMargins = this.getLabelMargins(bounds);
 
-    if (m != null) {
+    if (labelMargins != null) {
-      let flipH =
+      labelMargins = labelMargins.copy();
-        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPH, false) == '1';
+
-      let flipV =
+      let flipH = toBool(
-        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPV, false) == '1';
+        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPH, false)
+      );
+      let flipV = toBool(
+        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPV, false)
+      );
 
       // Handles special case for vertical labels
       if (
@@ -442,20 +455,27 @@ class mxShape {
         this.state.text != null &&
         this.state.text.isPaintBoundsInverted()
       ) {
-        let tmp = m.x;
+        const tmp = labelMargins.x;
-        m.x = m.height;
+        labelMargins.x = labelMargins.height;
-        m.height = m.width;
+        labelMargins.height = labelMargins.width;
-        m.width = m.y;
+        labelMargins.width = labelMargins.y;
-        m.y = tmp;
+        labelMargins.y = tmp;
 
-        tmp = flipH;
+        [flipH, flipV] = [flipV, flipH];
-        flipH = flipV;
-        flipV = tmp;
       }
 
-      return mxUtils.getDirectedBounds(rect, m, this.style, flipH, flipV);
+      const r = mxUtils.getDirectedBounds(
+        rect,
+        labelMargins,
+        this.style,
+        flipH,
+        flipV
+      );
+      alert(JSON.stringify(r))
+      return r;
     }
 
+    alert(JSON.stringify(rect))
     return rect;
   };
 
@@ -477,14 +497,14 @@ class mxShape {
    */
   checkBounds = () => {
     return (
-      !isNaN(this.scale) &&
+      !Number.isNaN(this.scale) &&
-      isFinite(this.scale) &&
+      Number.isFinite(this.scale) &&
       this.scale > 0 &&
       this.bounds != null &&
-      !isNaN(this.bounds.x) &&
+      !Number.isNaN(this.bounds.x) &&
-      !isNaN(this.bounds.y) &&
+      !Number.isNaN(this.bounds.y) &&
-      !isNaN(this.bounds.width) &&
+      !Number.isNaN(this.bounds.width) &&
-      !isNaN(this.bounds.height) &&
+      !Number.isNaN(this.bounds.height) &&
       this.bounds.width > 0 &&
       this.bounds.height > 0
     );
@@ -506,7 +526,7 @@ class mxShape {
       this.paint(canvas);
       this.afterPaint(canvas);
 
-      if (this.node != canvas.root) {
+      if (this.node !== canvas.root) {
         // Forces parsing in IE8 standards mode - slow! avoid
         this.node.insertAdjacentHTML('beforeend', canvas.root.outerHTML);
       }
@@ -880,8 +900,9 @@ class mxShape {
       c.setDashed(
         this.isDashed,
         this.style != null
-          ? mxUtils.getValue(this.style, mxConstants.STYLE_FIX_DASH, false) ===
+          ? toBool(
-              1
+              mxUtils.getValue(this.style, mxConstants.STYLE_FIX_DASH, false)
+            )
           : false
       );
     }
@@ -952,8 +973,13 @@ class mxShape {
     if (
       !this.outline ||
       this.style == null ||
-      mxUtils.getValue(this.style, mxConstants.STYLE_BACKGROUND_OUTLINE, 0) ===
+      toBool(
-        0
+        mxUtils.getValue(
+          this.style,
+          mxConstants.STYLE_BACKGROUND_OUTLINE,
+          0
+        ) === false
+      )
     ) {
       c.setShadow(false);
       this.paintForeground(c, x, y, w, h);
@@ -989,9 +1015,7 @@ class mxShape {
   getArcSize = (w, h) => {
     let r = 0;
 
-    if (
+    if (toBool(mxUtils.getValue(this.style, mxConstants.STYLE_ABSOLUTE_ARCSIZE, 0))) {
-      mxUtils.getValue(this.style, mxConstants.STYLE_ABSOLUTE_ARCSIZE, 0) == '1'
-    ) {
       r = Math.min(
         w / 2,
         Math.min(
@@ -1004,12 +1028,13 @@ class mxShape {
         )
       );
     } else {
-      const f =
+      const f = parseFloat(
         mxUtils.getValue(
           this.style,
           mxConstants.STYLE_ARCSIZE,
           mxConstants.RECTANGLE_ROUNDING_FACTOR * 100
-        ) / 100;
+        ) / 100
+      );
       r = Math.min(w * f, h * f);
     }
 
@@ -1085,7 +1110,7 @@ class mxShape {
 
         if (
           rounded &&
-          (dx != 0 || dy != 0) &&
+          (dx !== 0 || dy !== 0) &&
           (exclude == null || mxUtils.indexOf(exclude, i - 1) < 0)
         ) {
           // Draws a line from the last point to the current
@@ -1131,7 +1156,7 @@ class mxShape {
         }
 
         pt = tmp;
-        i++;
+        i += 1;
       }
 
       if (close) {
@@ -1282,17 +1307,21 @@ class mxShape {
         mxConstants.STYLE_DIRECTION,
         this.direction
       );
-      this.flipH =
+      this.flipH = toBool(
-        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPH, 0) === 1;
+        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPH, 0)
-      this.flipV =
+      );
-        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPV, 0) === 1;
+      this.flipV = toBool(
+        mxUtils.getValue(this.style, mxConstants.STYLE_FLIPV, 0)
+      );
 
       // Legacy support for stencilFlipH/V
       if (this.stencil != null) {
-        this.flipH =
+        this.flipH = toBool(
-          mxUtils.getValue(this.style, 'stencilFlipH', 0) === 1 || this.flipH;
+          mxUtils.getValue(this.style, 'stencilFlipH', 0) || this.flipH
-        this.flipV =
+        );
-          mxUtils.getValue(this.style, 'stencilFlipV', 0) === 1 || this.flipV;
+        this.flipV =toBool(
+          mxUtils.getValue(this.style, 'stencilFlipV', 0) || this.flipV
+        );
       }
 
       if (
@@ -1304,35 +1333,37 @@ class mxShape {
         this.flipV = tmp;
       }
 
-      this.isShadow =
+      this.isShadow = toBool(
         mxUtils.getValue(
           this.style,
           mxConstants.STYLE_SHADOW,
           this.isShadow
-        ) === 1;
+        ));
-      this.isDashed =
+      this.isDashed = toBool(
         mxUtils.getValue(
           this.style,
           mxConstants.STYLE_DASHED,
           this.isDashed
-        ) === 1;
+        ));
-      this.isRounded =
+      this.isRounded = toBool(
         mxUtils.getValue(
           this.style,
           mxConstants.STYLE_ROUNDED,
           this.isRounded
-        ) === 1;
+        ));
-      this.glass =
+      this.glass = toBool(
-        mxUtils.getValue(this.style, mxConstants.STYLE_GLASS, this.glass) === 1;
+        mxUtils.getValue(
+          this.style,
+          mxConstants.STYLE_GLASS,
+          this.glass
+        ));
 
       if (this.fill === mxConstants.NONE) {
         this.fill = null;
       }
-
       if (this.gradient === mxConstants.NONE) {
         this.gradient = null;
       }
-
       if (this.stroke === mxConstants.NONE) {
         this.stroke = null;
       }
@@ -1415,7 +1446,7 @@ class mxShape {
         this.augmentBoundingBox(bbox);
         const rot = this.getShapeRotation();
 
-        if (rot != 0) {
+        if (rot !== 0) {
           bbox = mxUtils.getBoundingBox(bbox, rot);
         }
       }
@@ -1491,8 +1522,10 @@ class mxShape {
   getTextRotation = () => {
     let rot = this.getRotation();
 
-    if (mxUtils.getValue(this.style, mxConstants.STYLE_HORIZONTAL, 1) != 1) {
+    if (
-      rot += verticalTextRotation;
+      !toBool(mxUtils.getValue(this.style, mxConstants.STYLE_HORIZONTAL, 1))
+    ) {
+      rot += this.verticalTextRotation || -90;  // WARNING WARNING!!!! ===============================================================================================
     }
 
     return rot;
@@ -1561,7 +1594,7 @@ class mxShape {
         if (gradient != null) {
           gradient.mxRefCount = (gradient.mxRefCount || 0) - 1;
 
-          if (gradient.mxRefCount == 0 && gradient.parentNode != null) {
+          if (gradient.mxRefCount === 0 && gradient.parentNode != null) {
             gradient.parentNode.removeChild(gradient);
           }
         }