chore(TS): Add declare and remove useless methods from Object.

.vscode/settings.json

@@ -8,5 +8,7 @@
   "markdown.validate.ignoredLinks": [
     // github links
     "../../**"
-  ]
+  ],
+  "editor.formatOnSave": true,
+  "editor.formatOnPaste": true
 }

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## [next]
 
+\- chore(TS): Add declare in front of properties that are type definitions. [#8574](https://github.com/fabricjs/fabric.js/pull/8574)
 - refactor(Animation): BREAKING: Animation api reduction and semplification (byValue is removed, '+=' syntax is removed, callbacks fired 100%) [#8547](https://github.com/fabricjs/fabric.js/pull/8547)
 - feat(PolyControl): modify the shape of a poly with control points [#8556](https://github.com/fabricjs/fabric.js/pull/8556)
 - BREAKING: remove Object.stateful and Object.statefulCache [#8573](https://github.com/fabricjs/fabric.js/pull/8573)

index.js

@@ -161,6 +161,7 @@ import { removeFromArray } from './src/util/internals/removeFromArray';
 import { getRandomInt } from './src/util/internals/getRandomInt';
 import { wrapElement } from './src/util/dom_misc';
 import { request } from './src/util/dom_request';
+import { removeTransformMatrixForSvgParsing } from './src/util/transform_matrix_removal';
 import { parseFontDeclaration } from './src/parser/parseFontDeclaration';
 
 const util = {
@@ -253,6 +254,8 @@ const util = {
   requestAnimFrame,
   cancelAnimFrame,
   classRegistry,
+  // for test compatibility. We don't want to export it.
+  removeTransformMatrixForSvgParsing,
 };
 
 // CONTROLS UTILS

src/canvas/canvas.class.ts

@@ -159,7 +159,7 @@ export class SelectableCanvas<
    * @default
    * @since fabric 4.0 // changed name and default value
    */
-  uniformScaling: boolean;
+  declare uniformScaling: boolean;
 
   /**
    * Indicates which key switches uniform scaling.
@@ -173,7 +173,7 @@ export class SelectableCanvas<
    * @type ModifierKey
    * @default
    */
-  uniScaleKey: TOptionalModifierKey;
+  declare uniScaleKey: TOptionalModifierKey;
 
   /**
    * When true, objects use center point as the origin of scale transformation.
@@ -182,7 +182,7 @@ export class SelectableCanvas<
    * @type Boolean
    * @default
    */
-  centeredScaling: boolean;
+  declare centeredScaling: boolean;
 
   /**
    * When true, objects use center point as the origin of rotate transformation.
@@ -191,7 +191,7 @@ export class SelectableCanvas<
    * @type Boolean
    * @default
    */
-  centeredRotation: boolean;
+  declare centeredRotation: boolean;
 
   /**
    * Indicates which key enable centered Transform
@@ -202,7 +202,7 @@ export class SelectableCanvas<
    * @type ModifierKey
    * @default
    */
-  centeredKey: TOptionalModifierKey;
+  declare centeredKey: TOptionalModifierKey;
 
   /**
    * Indicates which key enable alternate action on corner
@@ -213,7 +213,7 @@ export class SelectableCanvas<
    * @type ModifierKey
    * @default
    */
-  altActionKey: TOptionalModifierKey;
+  declare altActionKey: TOptionalModifierKey;
 
   /**
    * Indicates that canvas is interactive. This property should not be changed.
@@ -227,7 +227,7 @@ export class SelectableCanvas<
    * @type Boolean
    * @default
    */
-  selection: boolean;
+  declare selection: boolean;
 
   /**
    * Indicates which key or keys enable multiple click selection
@@ -239,7 +239,7 @@ export class SelectableCanvas<
    * @type ModifierKey|ModifierKey[]
    * @default
    */
-  selectionKey: TOptionalModifierKey | ModifierKey[];
+  declare selectionKey: TOptionalModifierKey | ModifierKey[];
 
   /**
    * Indicates which key enable alternative selection
@@ -253,99 +253,99 @@ export class SelectableCanvas<
    * @type null|ModifierKey
    * @default
    */
-  altSelectionKey: TOptionalModifierKey;
+  declare altSelectionKey: TOptionalModifierKey;
 
   /**
    * Color of selection
    * @type String
    * @default
    */
-  selectionColor: string;
+  declare selectionColor: string;
 
   /**
    * Default dash array pattern
    * If not empty the selection border is dashed
    * @type Array
    */
-  selectionDashArray: number[];
+  declare selectionDashArray: number[];
 
   /**
    * Color of the border of selection (usually slightly darker than color of selection itself)
    * @type String
    * @default
    */
-  selectionBorderColor: string;
+  declare selectionBorderColor: string;
 
   /**
    * Width of a line used in object/group selection
    * @type Number
    * @default
    */
-  selectionLineWidth: number;
+  declare selectionLineWidth: number;
 
   /**
    * Select only shapes that are fully contained in the dragged selection rectangle.
    * @type Boolean
    * @default
    */
-  selectionFullyContained: boolean;
+  declare selectionFullyContained: boolean;
 
   /**
    * Default cursor value used when hovering over an object on canvas
    * @type CSSStyleDeclaration['cursor']
    * @default move
    */
-  hoverCursor: CSSStyleDeclaration['cursor'];
+  declare hoverCursor: CSSStyleDeclaration['cursor'];
 
   /**
    * Default cursor value used when moving an object on canvas
    * @type CSSStyleDeclaration['cursor']
    * @default move
    */
-  moveCursor: CSSStyleDeclaration['cursor'];
+  declare moveCursor: CSSStyleDeclaration['cursor'];
 
   /**
    * Default cursor value used for the entire canvas
    * @type String
    * @default default
    */
-  defaultCursor: CSSStyleDeclaration['cursor'];
+  declare defaultCursor: CSSStyleDeclaration['cursor'];
 
   /**
    * Cursor value used during free drawing
    * @type String
    * @default crosshair
    */
-  freeDrawingCursor: CSSStyleDeclaration['cursor'];
+  declare freeDrawingCursor: CSSStyleDeclaration['cursor'];
 
   /**
    * Cursor value used for disabled elements ( corners with disabled action )
    * @type String
    * @since 2.0.0
    * @default not-allowed
    */
-  notAllowedCursor: CSSStyleDeclaration['cursor'];
+  declare notAllowedCursor: CSSStyleDeclaration['cursor'];
 
   /**
    * Default element class that's given to wrapper (div) element of canvas
    * @type String
    * @default
    */
-  containerClass: string;
+  declare containerClass: string;
 
   /**
    * When true, object detection happens on per-pixel basis rather than on per-bounding-box
    * @type Boolean
    * @default
    */
-  perPixelTargetFind: boolean;
+  declare perPixelTargetFind: boolean;
 
   /**
    * Number of pixels around target pixel to tolerate (consider active) during object detection
    * @type Number
    * @default
    */
-  targetFindTolerance: number;
+  declare targetFindTolerance: number;
 
   /**
    * When true, target detection is skipped. Target detection will return always undefined.
@@ -356,7 +356,7 @@ export class SelectableCanvas<
    * @type Boolean
    * @default
    */
-  skipTargetFind: boolean;
+  declare skipTargetFind: boolean;
 
   /**
    * When true, mouse events on canvas (mousedown/mousemove/mouseup) result in free drawing.
@@ -366,39 +366,39 @@ export class SelectableCanvas<
    * @type Boolean
    * @default
    */
-  isDrawingMode: boolean;
+  declare isDrawingMode: boolean;
 
   /**
    * Indicates whether objects should remain in current stack position when selected.
    * When false objects are brought to top and rendered as part of the selection group
    * @type Boolean
    * @default
    */
-  preserveObjectStacking: boolean;
+  declare preserveObjectStacking: boolean;
 
   /**
    * Indicates if the right click on canvas can output the context menu or not
    * @type Boolean
    * @since 1.6.5
    * @default
    */
-  stopContextMenu: boolean;
+  declare stopContextMenu: boolean;
 
   /**
    * Indicates if the canvas can fire right click events
    * @type Boolean
    * @since 1.6.5
    * @default
    */
-  fireRightClick: boolean;
+  declare fireRightClick: boolean;
 
   /**
    * Indicates if the canvas can fire middle click events
    * @type Boolean
    * @since 1.7.8
    * @default
    */
-  fireMiddleClick: boolean;
+  declare fireMiddleClick: boolean;
 
   /**
    * Keep track of the subTargets for Mouse Events
@@ -411,7 +411,7 @@ export class SelectableCanvas<
    * @type FabricObject | null
    * @private
    */
-  _hoveredTarget?: FabricObject;
+  declare _hoveredTarget?: FabricObject;
 
   /**
    * hold the list of nested targets hovered
@@ -459,7 +459,7 @@ export class SelectableCanvas<
    * @type CanvasRenderingContext2D
    * @private
    */
-  contextCache: CanvasRenderingContext2D;
+  declare contextCache: CanvasRenderingContext2D;
 
   /**
    * During a mouse event we may need the pointer multiple times in multiple functions.
@@ -468,7 +468,7 @@ export class SelectableCanvas<
    * We do this because there are some HTML DOM inspection functions to get the actual pointer coordinates
    * @type {Point}
    */
-  protected _absolutePointer?: Point;
+  protected declare _absolutePointer?: Point;
 
   /**
    * During a mouse event we may need the pointer multiple times in multiple functions.
@@ -477,25 +477,25 @@ export class SelectableCanvas<
    * We do this because there are some HTML DOM inspection functions to get the actual pointer coordinates
    * @type {Point}
    */
-  protected _pointer?: Point;
+  protected declare _pointer?: Point;
 
   /**
    * During a mouse event we may need the target multiple times in multiple functions.
    * _target holds a reference to the target that is valid for the event
    * lifespan. Every fabricJS mouse event create and delete the cache every time
    * @type {FabricObject}
    */
-  protected _target?: FabricObject;
-
-  upperCanvasEl: HTMLCanvasElement;
-  contextTop: CanvasRenderingContext2D;
-  wrapperEl: HTMLDivElement;
-  cacheCanvasEl: HTMLCanvasElement;
-  protected _isCurrentlyDrawing: boolean;
-  freeDrawingBrush?: BaseBrush;
-  _activeObject?: FabricObject;
-  _hasITextHandlers?: boolean;
-  _iTextInstances: (IText | Textbox)[];
+  protected declare _target?: FabricObject;
+
+  declare upperCanvasEl: HTMLCanvasElement;
+  declare contextTop: CanvasRenderingContext2D;
+  declare wrapperEl: HTMLDivElement;
+  declare cacheCanvasEl: HTMLCanvasElement;
+  protected declare _isCurrentlyDrawing: boolean;
+  declare freeDrawingBrush?: BaseBrush;
+  declare _activeObject?: FabricObject;
+  declare _hasITextHandlers?: boolean;
+  declare _iTextInstances: (IText | Textbox)[];
   /**
    * Constructor
    * @param {HTMLCanvasElement | String} el canvas element to initialize instance on