@eclipse-glsp/client 0.9.0-next.f54fd689 → 0.9.0

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
@@ -13,19 +13,17 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import "mocha";
-import "reflect-metadata";
-
-import { expect } from "chai";
-import { Container } from "inversify";
+/* eslint-disable import/no-deprecated,no-unused-expressions */
+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,
@@ -39,13 +37,11 @@ import {
     SGraphFactory,
     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";
-import { FeedbackActionDispatcher } from "../tool-feedback/feedback-action-dispatcher";
+} from 'sprotty';
+import { GLSP_TYPES } from '../../base/types';
+import { resizeFeature } from '../change-bounds/model';
+import { SelectionService } from '../select/selection-service';
+import { FeedbackActionDispatcher } from '../tool-feedback/feedback-action-dispatcher';
 import {
     AlignElementsAction,
     AlignElementsCommand,
@@ -54,10 +50,10 @@ import {
     ResizeDimension,
     ResizeElementsAction,
     ResizeElementsCommand
-} from "./layout-commands";
+} 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();
@@ -67,7 +63,7 @@ class MockActionDispatcher implements IActionDispatcher {
         return Promise.resolve();
     }
     request<Res extends ResponseAction>(action: RequestAction<Res>): Promise<Res> {
-        throw new Error("Method not implemented.");
+        throw new Error('Method not implemented.');
     }
 }
 
@@ -83,20 +79,23 @@ 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();
 
-function createModel() {
+function createModel(): SModelRoot {
     const root = graphFactory.createRoot({
         id: 'model1',
         type: 'graph',
@@ -106,7 +105,7 @@ function createModel() {
     return root;
 }
 
-function applyFeature(element: SChildElement, feature: symbol) {
+function applyFeature(element: SChildElement, feature: symbol): void {
     (element.features as FeatureSet & Set<symbol>).add(feature);
 }
 
@@ -122,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([
@@ -134,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', () => {
@@ -152,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', () => {
@@ -170,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', () => {
@@ -188,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', () => {
@@ -206,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', () => {
@@ -224,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([
@@ -247,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', () => {
@@ -266,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', () => {
@@ -285,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 {
@@ -300,7 +313,7 @@ function initModel(elementAndBounds: ElementAndBounds[]): SModelRoot {
     return setBoundsCommand.execute(context) as SModelRoot;
 }
 
-function newContext(root: SModelRoot) {
+function newContext(root: SModelRoot): CommandExecutionContext {
     return {
         root: root,
         modelFactory: graphFactory,
@@ -311,27 +324,27 @@ function newContext(root: SModelRoot) {
     };
 }
 
-function assertAllBounds(allBounds: Map<string, Bounds>) {
+function assertAllBounds(allBounds: Map<string, Bounds>): void {
     allBounds.forEach((bounds, nodeId) => assertBounds(nodeId, bounds));
 }
 
-function assertAllBoundsInChangeBounds(allBounds: Map<string, Bounds>) {
+function assertAllBoundsInChangeBounds(allBounds: Map<string, Bounds>): void {
     allBounds.forEach((bounds, nodeId) => assertBoundsInChangeBoundsActions(nodeId, bounds));
 }
 
-function assertBounds(nodeId: string, bounds: Bounds) {
+function assertBounds(nodeId: string, bounds: Bounds): void {
     assertBoundsInMoves(nodeId, bounds);
     assertBoundsInChangeBoundsActions(nodeId, bounds);
 }
 
-function assertBoundsInMoves(nodeId: string, bounds: Bounds) {
+function assertBoundsInMoves(nodeId: string, bounds: Bounds): void {
     const moves = dispatchedElementMoves();
     const move = getMoveById(nodeId, moves);
     expect(move.toPosition.x).to.be.equal(bounds.x);
     expect(move.toPosition.y).to.be.equal(bounds.y);
 }
 
-function assertBoundsInChangeBoundsActions(nodeId: string, bounds: Bounds) {
+function assertBoundsInChangeBoundsActions(nodeId: string, bounds: Bounds): void {
     const allChangeBounds = dispatchedChangeBounds();
     const changeBounds = getElementAndBoundsById(nodeId, allChangeBounds);
     expect(changeBounds.newPosition!.x).to.be.equal(bounds.x);
@@ -340,20 +353,26 @@ function assertBoundsInChangeBoundsActions(nodeId: string, bounds: Bounds) {
     expect(changeBounds.newSize!.width).to.be.equal(bounds.width);
 }
 
-function getMoveById(id: string, moves: ElementMove[]) {
+function getMoveById(id: string, moves: ElementMove[]): ElementMove {
     return moves.filter(m => m.elementId === id)[0];
 }
 
-function getElementAndBoundsById(id: string, elementAndBounds: ElementAndBounds[]) {
+function getElementAndBoundsById(id: string, elementAndBounds: ElementAndBounds[]): ElementAndBounds {
     return elementAndBounds.filter(m => m.elementId === id)[0];
 }
 
-function dispatchedElementMoves() {
-    return actionDispatcher.dispatchedActions.filter(isMoveAction).map(a => a.moves).reduce((acc, val) => acc.concat(val), []);
+function dispatchedElementMoves(): ElementMove[] {
+    return actionDispatcher.dispatchedActions
+        .filter(isMoveAction)
+        .map(a => a.moves)
+        .reduce((acc, val) => acc.concat(val), []);
 }
 
-function dispatchedChangeBounds() {
-    return actionDispatcher.dispatchedActions.filter(isChangeBounds).map(a => a.newBounds).reduce((acc, val) => acc.concat(val), []);
+function dispatchedChangeBounds(): ElementAndBounds[] {
+    return actionDispatcher.dispatchedActions
+        .filter(isChangeBounds)
+        .map(a => a.newBounds)
+        .reduce((acc, val) => acc.concat(val), []);
 }
 
 function isMoveAction(action: Action): action is MoveAction {

package/src/features/layout/layout-commands.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,34 +13,27 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { inject, injectable, optional } from "inversify";
+import { Action, ChangeBoundsOperation, ElementAndBounds } from '@eclipse-glsp/protocol';
+import { inject, injectable, optional } from 'inversify';
 import {
-    Action,
     Command,
     CommandExecutionContext,
     CommandReturn,
-    ElementAndBounds,
     ElementMove,
     IActionDispatcher,
     MoveAction,
     SetBoundsAction,
     SModelElement,
     TYPES
-} from "sprotty";
-
-import { ChangeBoundsOperation } from "../../base/operations/operation";
-import { GLSP_TYPES } from "../../base/types";
-import {
-    toValidElementAndBounds,
-    toValidElementMove,
-    WriteableElementAndBounds,
-    WriteableElementMove
-} from "../../utils/layout-utils";
-import { BoundsAwareModelElement } from "../../utils/smodel-util";
-import { isBoundsAwareMoveable, isResizable } from "../change-bounds/model";
-import { IMovementRestrictor } from "../change-bounds/movement-restrictor";
-import { SelectionService } from "../select/selection-service";
-
+} from 'sprotty';
+import { GLSP_TYPES } from '../../base/types';
+import { toValidElementAndBounds, toValidElementMove, WriteableElementAndBounds, WriteableElementMove } from '../../utils/layout-utils';
+import { BoundsAwareModelElement } from '../../utils/smodel-util';
+import { isBoundsAwareMoveable, isResizable } from '../change-bounds/model';
+import { IMovementRestrictor } from '../change-bounds/movement-restrictor';
+import { SelectionService } from '../select/selection-service';
+
+// eslint-disable-next-line no-shadow
 export enum ResizeDimension {
     Width,
     Height,
@@ -83,10 +76,11 @@ export class ResizeElementsAction implements Action {
          * Function to reduce the dimension to a target dimension value, see Reduce.* for potential functions.
          */
         public readonly reductionFunction: (...values: number[]) => number,
-        public readonly kind: string = ResizeElementsCommand.KIND) {
-    }
+        public readonly kind: string = ResizeElementsCommand.KIND
+    ) {}
 }
 
+// eslint-disable-next-line no-shadow
 export enum Alignment {
     Left,
     Center,
@@ -97,20 +91,19 @@ export enum Alignment {
 }
 
 export namespace Select {
-    export function all(elements: BoundsAwareModelElement[]) {
+    export function all(elements: BoundsAwareModelElement[]): BoundsAwareModelElement[] {
         return elements;
     }
 
-    export function first(elements: BoundsAwareModelElement[]) {
+    export function first(elements: BoundsAwareModelElement[]): BoundsAwareModelElement[] {
         return [elements[0]];
     }
 
-    export function last(elements: BoundsAwareModelElement[]) {
+    export function last(elements: BoundsAwareModelElement[]): BoundsAwareModelElement[] {
         return [elements[elements.length - 1]];
     }
 }
 
-
 export class AlignElementsAction implements Action {
     constructor(
         /**
@@ -125,16 +118,18 @@ export class AlignElementsAction implements Action {
          * Function to selected elements that are considered during alignment calculation, see Select.* for potential functions.
          */
         public readonly selectionFunction: (elements: BoundsAwareModelElement[]) => BoundsAwareModelElement[] = Select.all,
-        public readonly kind = AlignElementsCommand.KIND) {
-    }
+        public readonly kind = AlignElementsCommand.KIND
+    ) {}
 }
 
 @injectable()
 abstract class LayoutElementsCommand extends Command {
-    constructor(@inject(TYPES.Action) protected action: ResizeElementsAction | AlignElementsAction,
+    constructor(
+        @inject(TYPES.Action) protected action: ResizeElementsAction | AlignElementsAction,
         @inject(TYPES.IActionDispatcher) protected actionDispatcher: IActionDispatcher,
         @inject(GLSP_TYPES.SelectionService) protected selectionService: SelectionService,
-        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor) {
+        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor
+    ) {
         super();
     }
 
@@ -157,11 +152,11 @@ abstract class LayoutElementsCommand extends Command {
 
     protected abstract isActionElement(element: SModelElement): element is BoundsAwareModelElement;
 
-    dispatchAction(action: Action) {
+    dispatchAction(action: Action): void {
         this.actionDispatcher.dispatch(action);
     }
 
-    dispatchActions(actions: Action[]) {
+    dispatchActions(actions: Action[]): void {
         this.actionDispatcher.dispatchAll(actions);
     }
 }
@@ -170,10 +165,12 @@ abstract class LayoutElementsCommand extends Command {
 export class ResizeElementsCommand extends LayoutElementsCommand {
     static readonly KIND = 'layout:resize';
 
-    constructor(@inject(TYPES.Action) protected action: ResizeElementsAction,
+    constructor(
+        @inject(TYPES.Action) protected action: ResizeElementsAction,
         @inject(TYPES.IActionDispatcher) protected actionDispatcher: IActionDispatcher,
         @inject(GLSP_TYPES.SelectionService) protected selectionService: SelectionService,
-        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor) {
+        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor
+    ) {
         super(action, actionDispatcher, selectionService, movementRestrictor);
     }
 
@@ -199,7 +196,7 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
         return context.root;
     }
 
-    resizeWidth(elements: BoundsAwareModelElement[]) {
+    resizeWidth(elements: BoundsAwareModelElement[]): void {
         const targetWidth = this.action.reductionFunction(...elements.map(element => element.bounds.width));
         this.dispatchResizeActions(elements, (element, bounds) => {
             // resize around center
@@ -209,7 +206,7 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
         });
     }
 
-    resizeHeight(elements: BoundsAwareModelElement[]) {
+    resizeHeight(elements: BoundsAwareModelElement[]): void {
         const targetHeight = this.action.reductionFunction(...elements.map(element => element.bounds.height));
         this.dispatchResizeActions(elements, (element, bounds) => {
             // resize around middle
@@ -219,7 +216,7 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
         });
     }
 
-    resizeWidthAndHeight(elements: BoundsAwareModelElement[]) {
+    resizeWidthAndHeight(elements: BoundsAwareModelElement[]): void {
         const targetWidth = this.action.reductionFunction(...elements.map(element => element.bounds.width));
         const targetHeight = this.action.reductionFunction(...elements.map(element => element.bounds.height));
         this.dispatchResizeActions(elements, (element, bounds) => {
@@ -233,7 +230,10 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
         });
     }
 
-    dispatchResizeActions(elements: BoundsAwareModelElement[], change: (element: BoundsAwareModelElement, bounds: WriteableElementAndBounds) => void) {
+    dispatchResizeActions(
+        elements: BoundsAwareModelElement[],
+        change: (element: BoundsAwareModelElement, bounds: WriteableElementAndBounds) => void
+    ): void {
         const elementAndBounds: ElementAndBounds[] = []; // client- and server-side resize
         elements.forEach(element => {
             const elementChange = this.createElementAndBounds(element, change);
@@ -245,7 +245,10 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
         this.dispatchActions([new SetBoundsAction(elementAndBounds), new ChangeBoundsOperation(elementAndBounds)]);
     }
 
-    createElementAndBounds(element: BoundsAwareModelElement, change: (element: BoundsAwareModelElement, bounds: WriteableElementAndBounds) => void) {
+    createElementAndBounds(
+        element: BoundsAwareModelElement,
+        change: (_element: BoundsAwareModelElement, _bounds: WriteableElementAndBounds) => void
+    ): WriteableElementAndBounds | undefined {
         const bounds: WriteableElementAndBounds = {
             elementId: element.id,
             newPosition: {
@@ -276,10 +279,12 @@ export class ResizeElementsCommand extends LayoutElementsCommand {
 export class AlignElementsCommand extends LayoutElementsCommand {
     static readonly KIND = 'layout:align';
 
-    constructor(@inject(TYPES.Action) protected action: AlignElementsAction,
+    constructor(
+        @inject(TYPES.Action) protected action: AlignElementsAction,
         @inject(TYPES.IActionDispatcher) protected actionDispatcher: IActionDispatcher,
         @inject(GLSP_TYPES.SelectionService) protected selectionService: SelectionService,
-        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor) {
+        @inject(GLSP_TYPES.IMovementRestrictor) @optional() readonly movementRestrictor?: IMovementRestrictor
+    ) {
         super(action, actionDispatcher, selectionService, movementRestrictor);
     }
 
@@ -314,49 +319,52 @@ export class AlignElementsCommand extends LayoutElementsCommand {
         return context.root;
     }
 
-    alignLeft(elements: BoundsAwareModelElement[]) {
+    alignLeft(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const minX = calculationElements.map(element => element.bounds.x).reduce((a, b) => Math.min(a, b));
-        this.dispatchAlignActions(elements, (_, move) => move.toPosition.x = minX);
+        this.dispatchAlignActions(elements, (_, move) => (move.toPosition.x = minX));
     }
 
-    alignCenter(elements: BoundsAwareModelElement[]) {
+    alignCenter(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const minX = calculationElements.map(element => element.bounds.x).reduce((a, b) => Math.min(a, b));
         const maxX = calculationElements.map(element => element.bounds.x + element.bounds.width).reduce((a, b) => Math.max(a, b));
         const diffX = maxX - minX;
         const centerX = minX + 0.5 * diffX;
-        this.dispatchAlignActions(elements, (element, move) => move.toPosition.x = centerX - 0.5 * element.bounds.width);
+        this.dispatchAlignActions(elements, (element, move) => (move.toPosition.x = centerX - 0.5 * element.bounds.width));
     }
 
-    alignRight(elements: BoundsAwareModelElement[]) {
+    alignRight(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const maxX = calculationElements.map(element => element.bounds.x + element.bounds.width).reduce((a, b) => Math.max(a, b));
-        this.dispatchAlignActions(elements, (element, move) => move.toPosition.x = maxX - element.bounds.width);
+        this.dispatchAlignActions(elements, (element, move) => (move.toPosition.x = maxX - element.bounds.width));
     }
 
-    alignTop(elements: BoundsAwareModelElement[]) {
+    alignTop(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const minY = calculationElements.map(element => element.bounds.y).reduce((a, b) => Math.min(a, b));
-        this.dispatchAlignActions(elements, (_, move) => move.toPosition.y = minY);
+        this.dispatchAlignActions(elements, (_, move) => (move.toPosition.y = minY));
     }
 
-    alignMiddle(elements: BoundsAwareModelElement[]) {
+    alignMiddle(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const minY = calculationElements.map(element => element.bounds.y).reduce((a, b) => Math.min(a, b));
         const maxY = calculationElements.map(element => element.bounds.y + element.bounds.height).reduce((a, b) => Math.max(a, b));
         const diffY = maxY - minY;
         const middleY = minY + 0.5 * diffY;
-        this.dispatchAlignActions(elements, (element, move) => move.toPosition.y = middleY - 0.5 * element.bounds.height);
+        this.dispatchAlignActions(elements, (element, move) => (move.toPosition.y = middleY - 0.5 * element.bounds.height));
     }
 
-    alignBottom(elements: BoundsAwareModelElement[]) {
+    alignBottom(elements: BoundsAwareModelElement[]): void {
         const calculationElements = this.action.selectionFunction(elements);
         const maxY = calculationElements.map(element => element.bounds.y + element.bounds.height).reduce((a, b) => Math.max(a, b));
-        this.dispatchAlignActions(elements, (element, move) => move.toPosition.y = maxY - element.bounds.height);
+        this.dispatchAlignActions(elements, (element, move) => (move.toPosition.y = maxY - element.bounds.height));
     }
 
-    dispatchAlignActions(elements: BoundsAwareModelElement[], change: (element: BoundsAwareModelElement, move: WriteableElementMove) => void) {
+    dispatchAlignActions(
+        elements: BoundsAwareModelElement[],
+        change: (element: BoundsAwareModelElement, move: WriteableElementMove) => void
+    ): void {
         const moves: ElementMove[] = []; // client-side move
         const elementAndBounds: ElementAndBounds[] = []; // server-side move
         elements.forEach(element => {
@@ -371,7 +379,10 @@ export class AlignElementsCommand extends LayoutElementsCommand {
         this.dispatchActions([new MoveAction(moves), new ChangeBoundsOperation(elementAndBounds)]);
     }
 
-    createElementMove(element: BoundsAwareModelElement, change: (element: BoundsAwareModelElement, move: WriteableElementMove) => void) {
+    createElementMove(
+        element: BoundsAwareModelElement,
+        change: (_element: BoundsAwareModelElement, _move: WriteableElementMove) => void
+    ): WriteableElementMove | undefined {
         const move: WriteableElementMove = {
             elementId: element.id,
             fromPosition: {