@eclipse-glsp/client 0.9.0-rc-01 → 0.9.0

package/src/features/hints/type-hints.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019 EclipseSource and others.
+ * Copyright (c) 2019-2021 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -13,9 +13,9 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+import { Action, EdgeTypeHint, isSetTypeHintsAction, ShapeTypeHint, TypeHint } from '@eclipse-glsp/protocol';
 import { inject, injectable } from 'inversify';
 import {
-    Action,
     CommandExecutionContext,
     CommandReturn,
     Connectable,
@@ -28,12 +28,10 @@ import {
     moveFeature,
     SEdge,
     SModelElement,
-    SModelElementSchema,
     SModelRoot,
     SShapeElement,
     TYPES
 } from 'sprotty';
-
 import { GLSP_TYPES } from '../../base/types';
 import { getElementTypeId, hasCompatibleType } from '../../utils/smodel-util';
 import { resizeFeature } from '../change-bounds/model';
@@ -41,68 +39,6 @@ import { reconnectFeature } from '../reconnect/model';
 import { IFeedbackActionDispatcher } from '../tool-feedback/feedback-action-dispatcher';
 import { FeedbackCommand } from '../tool-feedback/model';
 import { Containable, containerFeature, reparentFeature } from './model';
-import { isSetTypeHintsAction } from './request-type-hints-action';
-
-export abstract class TypeHint {
-    /**
-    The id of the element.
-    */
-    readonly elementTypeId: string;
-
-    /**
-    * Specifies whether the element can be relocated.
-    */
-    readonly repositionable: boolean;
-
-    /**
-     * Specifices wheter the element can be deleted
-     */
-    readonly deletable: boolean;
-}
-
-export class ShapeTypeHint extends TypeHint {
-    /**
-     * Specifies whether the element can be resized.
-     */
-    readonly resizable: boolean;
-
-    /**
-     * Specifies whether the element can be moved to another parent
-     */
-    readonly reparentable: boolean;
-
-    /**
-     * The types of elements that can be contained by this element (if any)
-     */
-    readonly containableElementTypeIds?: string[];
-}
-
-export class EdgeTypeHint extends TypeHint {
-    /**
-     * Specifies whether the routing of this element can be changed.
-     */
-    readonly routable: boolean;
-
-    /**
-     * Allowed source element types for this edge type
-     */
-    readonly sourceElementTypeIds: string[];
-
-    /**
-    * Allowed targe element types for this edge type
-    */
-    readonly targetElementTypeIds: string[];
-
-    isAllowedSource(input: SModelElement | SModelElementSchema | string): boolean {
-        const type = getElementTypeId(input);
-        return this.sourceElementTypeIds.includes(type);
-
-    }
-    isAllowedTarget(input: SModelElement | SModelElementSchema | string): boolean {
-        const type = getElementTypeId(input);
-        return this.targetElementTypeIds.includes(type);
-    }
-}
 
 @injectable()
 export class ApplyTypeHintsAction implements Action {
@@ -111,7 +47,6 @@ export class ApplyTypeHintsAction implements Action {
 
 @injectable()
 export class ApplyTypeHintsCommand extends FeedbackCommand {
-
     public static KIND = 'applyTypeHints';
     public readonly priority = 10;
 
@@ -122,15 +57,13 @@ export class ApplyTypeHintsCommand extends FeedbackCommand {
     }
 
     execute(context: CommandExecutionContext): CommandReturn {
-        context.root.index.all()
-            .forEach(element => {
-                if (element instanceof SShapeElement || element instanceof SModelRoot) {
-                    this.applyShapeTypeHint(element);
-
-                } else if (element instanceof SEdge) {
-                    return this.applyEdgeTypeHint(element);
-                }
-            });
+        context.root.index.all().forEach(element => {
+            if (element instanceof SShapeElement || element instanceof SModelRoot) {
+                this.applyShapeTypeHint(element);
+            } else if (element instanceof SEdge) {
+                return this.applyEdgeTypeHint(element);
+            }
+        });
         return context.root;
     }
 
@@ -167,18 +100,14 @@ export class ApplyTypeHintsCommand extends FeedbackCommand {
 function createConnectable(validSourceEdges: string[], validTargetEdges: string[]): Connectable {
     return {
         canConnect: (routable, role) =>
-            role === 'source' ?
-                validSourceEdges.includes(routable.type) :
-                validTargetEdges.includes(routable.type)
+            role === 'source' ? validSourceEdges.includes(routable.type) : validTargetEdges.includes(routable.type)
     };
 }
 
 function createContainable(hint: ShapeTypeHint): Containable {
     return {
         isContainableElement: element =>
-            hint.containableElementTypeIds ?
-                hint.containableElementTypeIds.includes(getElementTypeId(element)) :
-                false
+            hint.containableElementTypeIds ? hint.containableElementTypeIds.includes(getElementTypeId(element)) : false
     };
 }
 
@@ -202,12 +131,11 @@ export interface ITypeHintProvider {
 
 @injectable()
 export class TypeHintProvider implements IActionHandler, ITypeHintProvider {
-
     @inject(GLSP_TYPES.IFeedbackActionDispatcher)
     protected feedbackActionDispatcher: IFeedbackActionDispatcher;
 
-    protected shapeHints: Map<string, ShapeTypeHint> = new Map;
-    protected edgeHints: Map<string, EdgeTypeHint> = new Map;
+    protected shapeHints: Map<string, ShapeTypeHint> = new Map();
+    protected edgeHints: Map<string, EdgeTypeHint> = new Map();
 
     handle(action: Action): ICommand | Action | void {
         if (isSetTypeHintsAction(action)) {
@@ -222,13 +150,19 @@ export class TypeHintProvider implements IActionHandler, ITypeHintProvider {
         if (role === 'source') {
             return Array.from(
                 Array.from(this.edgeHints.values())
-                    .filter(hint => hint.sourceElementTypeIds.some(sourceElementTypeId => hasCompatibleType(elementTypeId, sourceElementTypeId)))
-                    .map(hint => hint.elementTypeId));
+                    .filter(hint =>
+                        hint.sourceElementTypeIds.some(sourceElementTypeId => hasCompatibleType(elementTypeId, sourceElementTypeId))
+                    )
+                    .map(hint => hint.elementTypeId)
+            );
         } else {
             return Array.from(
                 Array.from(this.edgeHints.values())
-                    .filter(hint => hint.targetElementTypeIds.some(targetElementTypeId => hasCompatibleType(elementTypeId, targetElementTypeId)))
-                    .map(hint => hint.elementTypeId));
+                    .filter(hint =>
+                        hint.targetElementTypeIds.some(targetElementTypeId => hasCompatibleType(elementTypeId, targetElementTypeId))
+                    )
+                    .map(hint => hint.elementTypeId)
+            );
         }
     }
 
@@ -254,4 +188,3 @@ function getTypeHint<T extends TypeHint>(input: SModelElement | SModelElement |
     }
     return hint;
 }
-

package/src/features/hover/di.config.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2020 EclipseSource and others.
+ * Copyright (c) 2020-2021 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -30,7 +30,6 @@ import {
     TYPES
 } from 'sprotty';
 import { PopupPositionUpdater } from 'sprotty/lib/features/hover/popup-position-updater';
-
 import { FocusStateChangedAction } from '../../base/actions/focus-change-action';
 import { GlspHoverMouseListener } from './hover';
 

package/src/features/hover/hover.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2020 EclipseSource and others.
+ * Copyright (c) 2020-2021 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -13,27 +13,22 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
+import { Action, Bounds, RequestPopupModelAction, SetPopupModelAction } from '@eclipse-glsp/protocol';
 import { injectable } from 'inversify';
 import {
-    Action,
-    Bounds,
     EMPTY_ROOT,
     HoverMouseListener,
     PreRenderedElementSchema,
-    RequestPopupModelAction,
-    SetPopupModelAction,
     SIssueMarker,
     SIssueSeverity,
     SModelElement,
     SModelElementSchema,
     SModelRootSchema
 } from 'sprotty';
-
 import { GIssueMarker } from '../validation/issue-marker';
 
 @injectable()
 export class GlspHoverMouseListener extends HoverMouseListener {
-
     protected startMouseOverTimer(target: SModelElement, event: MouseEvent): Promise<Action> {
         this.stopMouseOverTimer();
         return new Promise(resolve => {

package/src/features/layout/di.config.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019 EclipseSource and others.
+ * Copyright (c) 2019-2021 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -14,13 +14,17 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 import { ContainerModule } from 'inversify';
-import { configureCommand } from 'sprotty';
-
+import { configureCommand, configureLayout, VBoxLayouter } from 'sprotty';
+import { FreeFormLayouter } from './freeform-layout';
 import { AlignElementsCommand, ResizeElementsCommand } from './layout-commands';
+import { VBoxLayouterExt } from './vbox-layout';
 
-const layoutCommandsModule = new ContainerModule((bind, _unbind, isBound) => {
+const layoutCommandsModule = new ContainerModule((bind, _unbind, isBound, rebind) => {
     configureCommand({ bind, isBound }, ResizeElementsCommand);
     configureCommand({ bind, isBound }, AlignElementsCommand);
+
+    rebind(VBoxLayouter).to(VBoxLayouterExt);
+    configureLayout({ bind, isBound }, FreeFormLayouter.KIND, FreeFormLayouter);
 });
 
 export default layoutCommandsModule;

package/src/features/layout/freeform-layout.ts

@@ -0,0 +1,133 @@
+/********************************************************************************
+ * Copyright (c) 2021 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+import { injectable } from 'inversify';
+import {
+    Bounds,
+    BoundsData,
+    Dimension,
+    isValidDimension,
+    LayoutContainer,
+    Point,
+    SChildElement,
+    SParentElement,
+    StatefulLayouter
+} from 'sprotty';
+import { AbstractLayout } from 'sprotty/lib/features/bounds/abstract-layout';
+import { AbstractLayoutOptions } from 'sprotty/lib/features/bounds/layout-options';
+
+/**
+ * Layouts children of a container with explit X/Y positions
+ */
+@injectable()
+export class FreeFormLayouter extends AbstractLayout<AbstractLayoutOptions> {
+    static KIND = 'freeform';
+
+    layout(container: SParentElement & LayoutContainer, layouter: StatefulLayouter): void {
+        const boundsData = layouter.getBoundsData(container);
+        const options = this.getLayoutOptions(container);
+        const childrenSize = this.getChildrenSize(container, options, layouter);
+
+        // The real size of the compartment will be determined by the parent node layout;
+        // we only need to compute the bounds required to layout the children.
+
+        const maxWidth = childrenSize.width > 0 ? childrenSize.width + options.paddingLeft + options.paddingRight : 0;
+        const maxHeight = childrenSize.height > 0 ? childrenSize.height + options.paddingTop + options.paddingBottom : 0;
+        if (maxWidth > 0 && maxHeight > 0) {
+            const offset = this.layoutChildren(container, layouter, options, maxWidth, maxHeight);
+            boundsData.bounds = this.getFinalContainerBounds(container, offset, options, maxWidth, maxHeight);
+            boundsData.boundsChanged = true;
+        } else {
+            boundsData.bounds = { x: boundsData.bounds!.x, y: boundsData.bounds!.y, width: 0, height: 0 };
+            boundsData.boundsChanged = true;
+        }
+    }
+
+    protected getChildrenSize(
+        container: SParentElement & LayoutContainer,
+        containerOptions: AbstractLayoutOptions,
+        layouter: StatefulLayouter
+    ): Dimension {
+        let maxX = 0;
+        let maxY = 0;
+        container.children.forEach(child => {
+            const bounds = layouter.getBoundsData(child).bounds;
+            if (bounds !== undefined && isValidDimension(bounds)) {
+                const childMaxX = bounds.x + bounds.width;
+                const childMaxY = bounds.y + bounds.height;
+                maxX = Math.max(maxX, childMaxX);
+                maxY = Math.max(maxY, childMaxY);
+            }
+        });
+        return {
+            width: maxX,
+            height: maxY
+        };
+    }
+
+    protected layoutChild(
+        child: SChildElement,
+        boundsData: BoundsData,
+        bounds: Bounds,
+        childOptions: AbstractLayoutOptions,
+        containerOptions: AbstractLayoutOptions,
+        currentOffset: Point,
+        maxWidth: number,
+        maxHeight: number
+    ): Point {
+        boundsData.bounds = {
+            x: (child as any).bounds.x,
+            y: (child as any).bounds.y,
+            width: bounds.width,
+            height: bounds.height
+        };
+        boundsData.boundsChanged = true;
+        return currentOffset;
+    }
+
+    protected getFinalContainerBounds(
+        container: SParentElement & LayoutContainer,
+        lastOffset: Point,
+        options: AbstractLayoutOptions,
+        maxWidth: number,
+        maxHeight: number
+    ): Bounds {
+        const result = {
+            x: container.bounds.x,
+            y: container.bounds.y,
+            width: Math.max(options.minWidth, maxWidth + options.paddingLeft + options.paddingRight),
+            height: Math.max(options.minHeight, maxHeight + options.paddingTop + options.paddingBottom)
+        };
+
+        return result;
+    }
+
+    protected getDefaultLayoutOptions(): AbstractLayoutOptions {
+        return {
+            resizeContainer: true,
+            paddingTop: 0,
+            paddingBottom: 0,
+            paddingLeft: 0,
+            paddingRight: 0,
+            paddingFactor: 1,
+            minWidth: 0,
+            minHeight: 0
+        };
+    }
+
+    protected spread(a: AbstractLayoutOptions, b: AbstractLayoutOptions): AbstractLayoutOptions {
+        return { ...a, ...b };
+    }
+}

package/src/features/layout/layout-commands.spec.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019 EclipseSource and others.
+ * Copyright (c) 2019-2021 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -14,19 +14,16 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 /* eslint-disable import/no-deprecated,no-unused-expressions */
-import 'mocha';
-import 'reflect-metadata';
-
+import { Action, Bounds, ChangeBoundsOperation, ElementAndBounds } from '@eclipse-glsp/protocol';
 import { expect } from 'chai';
 import { Container } from 'inversify';
+import 'mocha';
+import 'reflect-metadata';
 import {
-    Action,
     AnimationFrameSyncer,
-    Bounds,
     CommandExecutionContext,
     ConsoleLogger,
     defaultModule,
-    ElementAndBounds,
     ElementMove,
     FeatureSet,
     IActionDispatcher,
@@ -41,8 +38,6 @@ import {
     SModelRoot,
     TYPES
 } from 'sprotty';
-
-import { ChangeBoundsOperation } from '../../base/operations/operation';
 import { GLSP_TYPES } from '../../base/types';
 import { resizeFeature } from '../change-bounds/model';
 import { SelectionService } from '../select/selection-service';
@@ -58,7 +53,7 @@ import {
 } from './layout-commands';
 
 class MockActionDispatcher implements IActionDispatcher {
-    constructor(public dispatchedActions: Action[] = []) { }
+    constructor(public dispatchedActions: Action[] = []) {}
     dispatch(action: Action): Promise<void> {
         this.dispatchedActions.push(action);
         return Promise.resolve();
@@ -84,15 +79,18 @@ const selectionService = container.get<SelectionService>(GLSP_TYPES.SelectionSer
 const actionDispatcher = new MockActionDispatcher();
 
 const node1 = {
-    id: 'node1', type: 'node:circle',
+    id: 'node1',
+    type: 'node:circle',
     selected: true
 };
 const node2 = {
-    id: 'node2', type: 'node:circle',
+    id: 'node2',
+    type: 'node:circle',
     selected: true
 };
 const node3 = {
-    id: 'node3', type: 'node:circle',
+    id: 'node3',
+    type: 'node:circle',
     selected: true
 };
 const model = createModel();
@@ -123,7 +121,6 @@ const context: CommandExecutionContext = {
 const defaultSize = { height: 10, width: 10 };
 
 describe('AlignElementsCommand', () => {
-
     it('should align all elements left', () => {
         actionDispatcher.dispatchedActions = [];
         const newModel = initModel([
@@ -135,11 +132,13 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 111, y: 111, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 111, y: 222, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 111, y: 333, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 111, y: 111, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 111, y: 222, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 111, y: 333, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
 
     it('should align all elements right', () => {
@@ -153,11 +152,13 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 333, y: 111, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 333, y: 222, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 333, y: 333, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 333, y: 111, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 333, y: 222, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 333, y: 333, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
 
     it('should align all elements center', () => {
@@ -171,11 +172,13 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 222, y: 111, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 222, y: 222, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 222, y: 333, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 222, y: 111, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 222, y: 222, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 222, y: 333, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
 
     it('should align all elements top', () => {
@@ -189,11 +192,13 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 111, y: 111, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 222, y: 111, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 333, y: 111, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 111, y: 111, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 222, y: 111, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 333, y: 111, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
 
     it('should align all elements bottom', () => {
@@ -207,11 +212,13 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 111, y: 333, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 222, y: 333, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 333, y: 333, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 111, y: 333, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 222, y: 333, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 333, y: 333, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
 
     it('should align all elements middle', () => {
@@ -225,17 +232,17 @@ describe('AlignElementsCommand', () => {
         const command = new AlignElementsCommand(action, actionDispatcher, selectionService);
         command.execute(newContext(newModel));
 
-        assertAllBounds(new Map([
-            ['node1', { x: 111, y: 222, width: defaultSize.width, height: defaultSize.height }],
-            ['node2', { x: 222, y: 222, width: defaultSize.width, height: defaultSize.height }],
-            ['node3', { x: 333, y: 222, width: defaultSize.width, height: defaultSize.height }]
-        ]));
+        assertAllBounds(
+            new Map([
+                ['node1', { x: 111, y: 222, width: defaultSize.width, height: defaultSize.height }],
+                ['node2', { x: 222, y: 222, width: defaultSize.width, height: defaultSize.height }],
+                ['node3', { x: 333, y: 222, width: defaultSize.width, height: defaultSize.height }]
+            ])
+        );
     });
-
 });
 
 describe('ResizeElementsCommand', () => {
-
     it('should make same width as last', () => {
         actionDispatcher.dispatchedActions = [];
         const newModel = initModel([
@@ -248,11 +255,13 @@ describe('ResizeElementsCommand', () => {
         command.execute(newContext(newModel));
 
         // resize is keeping the center, so the X moves by diff / 2
-        assertAllBoundsInChangeBounds(new Map([
-            ['node1', { x: 90, y: 100, height: 10, width: 30 }],
-            ['node2', { x: 95, y: 200, height: 20, width: 30 }],
-            ['node3', { x: 100, y: 300, height: 30, width: 30 }]
-        ]));
+        assertAllBoundsInChangeBounds(
+            new Map([
+                ['node1', { x: 90, y: 100, height: 10, width: 30 }],
+                ['node2', { x: 95, y: 200, height: 20, width: 30 }],
+                ['node3', { x: 100, y: 300, height: 30, width: 30 }]
+            ])
+        );
     });
 
     it('should make same height as last', () => {
@@ -267,11 +276,13 @@ describe('ResizeElementsCommand', () => {
         command.execute(newContext(newModel));
 
         // resize is keeping the center, so the Y moves by diff / 2
-        assertAllBoundsInChangeBounds(new Map([
-            ['node1', { x: 100, y: 90, height: 30, width: 10 }],
-            ['node2', { x: 100, y: 195, height: 30, width: 20 }],
-            ['node3', { x: 100, y: 300, height: 30, width: 30 }]
-        ]));
+        assertAllBoundsInChangeBounds(
+            new Map([
+                ['node1', { x: 100, y: 90, height: 30, width: 10 }],
+                ['node2', { x: 100, y: 195, height: 30, width: 20 }],
+                ['node3', { x: 100, y: 300, height: 30, width: 30 }]
+            ])
+        );
     });
 
     it('should make same width and height as last', () => {
@@ -286,13 +297,14 @@ describe('ResizeElementsCommand', () => {
         command.execute(newContext(newModel));
 
         // resize is keeping the center, so the Y moves by diff / 2
-        assertAllBoundsInChangeBounds(new Map([
-            ['node1', { x: 90, y: 90, height: 30, width: 30 }],
-            ['node2', { x: 95, y: 195, height: 30, width: 30 }],
-            ['node3', { x: 100, y: 300, height: 30, width: 30 }]
-        ]));
+        assertAllBoundsInChangeBounds(
+            new Map([
+                ['node1', { x: 90, y: 90, height: 30, width: 30 }],
+                ['node2', { x: 95, y: 195, height: 30, width: 30 }],
+                ['node3', { x: 100, y: 300, height: 30, width: 30 }]
+            ])
+        );
     });
-
 });
 
 function initModel(elementAndBounds: ElementAndBounds[]): SModelRoot {
@@ -350,11 +362,17 @@ function getElementAndBoundsById(id: string, elementAndBounds: ElementAndBounds[
 }
 
 function dispatchedElementMoves(): ElementMove[] {
-    return actionDispatcher.dispatchedActions.filter(isMoveAction).map(a => a.moves).reduce((acc, val) => acc.concat(val), []);
+    return actionDispatcher.dispatchedActions
+        .filter(isMoveAction)
+        .map(a => a.moves)
+        .reduce((acc, val) => acc.concat(val), []);
 }
 
 function dispatchedChangeBounds(): ElementAndBounds[] {
-    return actionDispatcher.dispatchedActions.filter(isChangeBounds).map(a => a.newBounds).reduce((acc, val) => acc.concat(val), []);
+    return actionDispatcher.dispatchedActions
+        .filter(isChangeBounds)
+        .map(a => a.newBounds)
+        .reduce((acc, val) => acc.concat(val), []);
 }
 
 function isMoveAction(action: Action): action is MoveAction {