Vscode merge (#4582)

* Merge from vscode 37cb23d3dd4f9433d56d4ba5ea3203580719a0bd

* fix issues with merges

* bump node version in azpipe

* replace license headers

* remove duplicate launch task

* fix build errors

* fix build errors

* fix tslint issues

* working through package and linux build issues

* more work

* wip

* fix packaged builds

* working through linux build errors

* wip

* wip

* wip

* fix mac and linux file limits

* iterate linux pipeline

* disable editor typing

* revert series to parallel

* remove optimize vscode from linux

* fix linting issues

* revert testing change

* add work round for new node

* readd packaging for extensions

* fix issue with angular not resolving decorator dependencies

src/vs/workbench/browser/parts/panel/panelActions.ts

@@ -12,9 +12,10 @@ import { Registry } from 'vs/platform/registry/common/platform';
 import { SyncActionDescriptor, MenuId, MenuRegistry } from 'vs/platform/actions/common/actions';
 import { IWorkbenchActionRegistry, Extensions as WorkbenchExtensions } from 'vs/workbench/common/actions';
 import { IPanelService } from 'vs/workbench/services/panel/common/panelService';
-import { IPartService, Parts, Position } from 'vs/workbench/services/part/common/partService';
+import { IWorkbenchLayoutService, Parts, Position } from 'vs/workbench/services/layout/browser/layoutService';
 import { ActivityAction } from 'vs/workbench/browser/parts/compositeBarActions';
 import { IActivity } from 'vs/workbench/common/activity';
+import { IEditorGroupsService } from 'vs/workbench/services/editor/common/editorGroupsService';
 
 export class ClosePanelAction extends Action {
 
@@ -24,14 +25,14 @@ export class ClosePanelAction extends Action {
 	constructor(
 		id: string,
 		name: string,
-		@IPartService private readonly partService: IPartService
+		@IWorkbenchLayoutService private readonly layoutService: IWorkbenchLayoutService
 	) {
 		super(id, name, 'hide-panel-action');
 	}
 
 	run(): Promise<any> {
-		this.partService.setPanelHidden(true);
-		return Promise.resolve(null);
+		this.layoutService.setPanelHidden(true);
+		return Promise.resolve();
 	}
 }
 
@@ -43,14 +44,14 @@ export class TogglePanelAction extends Action {
 	constructor(
 		id: string,
 		name: string,
-		@IPartService private readonly partService: IPartService
+		@IWorkbenchLayoutService private readonly layoutService: IWorkbenchLayoutService
 	) {
-		super(id, name, partService.isVisible(Parts.PANEL_PART) ? 'panel expanded' : 'panel');
+		super(id, name, layoutService.isVisible(Parts.PANEL_PART) ? 'panel expanded' : 'panel');
 	}
 
 	run(): Promise<any> {
-		this.partService.setPanelHidden(this.partService.isVisible(Parts.PANEL_PART));
-		return Promise.resolve(null);
+		this.layoutService.setPanelHidden(this.layoutService.isVisible(Parts.PANEL_PART));
+		return Promise.resolve();
 	}
 }
 
@@ -63,7 +64,7 @@ class FocusPanelAction extends Action {
 		id: string,
 		label: string,
 		@IPanelService private readonly panelService: IPanelService,
-		@IPartService private readonly partService: IPartService
+		@IWorkbenchLayoutService private readonly layoutService: IWorkbenchLayoutService
 	) {
 		super(id, label);
 	}
@@ -71,9 +72,9 @@ class FocusPanelAction extends Action {
 	run(): Promise<any> {
 
 		// Show panel
-		if (!this.partService.isVisible(Parts.PANEL_PART)) {
-			this.partService.setPanelHidden(false);
-			return Promise.resolve(null);
+		if (!this.layoutService.isVisible(Parts.PANEL_PART)) {
+			this.layoutService.setPanelHidden(false);
+			return Promise.resolve();
 		}
 
 		// Focus into active panel
@@ -82,7 +83,7 @@ class FocusPanelAction extends Action {
 			panel.focus();
 		}
 
-		return Promise.resolve(null);
+		return Promise.resolve();
 	}
 }
 
@@ -99,28 +100,29 @@ export class TogglePanelPositionAction extends Action {
 	constructor(
 		id: string,
 		label: string,
-		@IPartService private readonly partService: IPartService,
+		@IWorkbenchLayoutService private readonly layoutService: IWorkbenchLayoutService,
+		@IEditorGroupsService editorGroupsService: IEditorGroupsService
 	) {
-		super(id, label, partService.getPanelPosition() === Position.RIGHT ? 'move-panel-to-bottom' : 'move-panel-to-right');
+		super(id, label, layoutService.getPanelPosition() === Position.RIGHT ? 'move-panel-to-bottom' : 'move-panel-to-right');
 
 		this.toDispose = [];
 
 		const setClassAndLabel = () => {
-			const positionRight = this.partService.getPanelPosition() === Position.RIGHT;
+			const positionRight = this.layoutService.getPanelPosition() === Position.RIGHT;
 			this.class = positionRight ? 'move-panel-to-bottom' : 'move-panel-to-right';
 			this.label = positionRight ? TogglePanelPositionAction.MOVE_TO_BOTTOM_LABEL : TogglePanelPositionAction.MOVE_TO_RIGHT_LABEL;
 		};
 
-		this.toDispose.push(partService.onEditorLayout(() => setClassAndLabel()));
+		this.toDispose.push(editorGroupsService.onDidLayout(() => setClassAndLabel()));
 
 		setClassAndLabel();
 	}
 
 	run(): Promise<any> {
-		const position = this.partService.getPanelPosition();
+		const position = this.layoutService.getPanelPosition();
 
-		this.partService.setPanelPosition(position === Position.BOTTOM ? Position.RIGHT : Position.BOTTOM);
-		return Promise.resolve(null);
+		this.layoutService.setPanelPosition(position === Position.BOTTOM ? Position.RIGHT : Position.BOTTOM);
+		return Promise.resolve();
 	}
 
 	dispose(): void {
@@ -143,26 +145,27 @@ export class ToggleMaximizedPanelAction extends Action {
 	constructor(
 		id: string,
 		label: string,
-		@IPartService private readonly partService: IPartService
+		@IWorkbenchLayoutService private readonly layoutService: IWorkbenchLayoutService,
+		@IEditorGroupsService editorGroupsService: IEditorGroupsService
 	) {
-		super(id, label, partService.isPanelMaximized() ? 'minimize-panel-action' : 'maximize-panel-action');
+		super(id, label, layoutService.isPanelMaximized() ? 'minimize-panel-action' : 'maximize-panel-action');
 
 		this.toDispose = [];
 
-		this.toDispose.push(partService.onEditorLayout(() => {
-			const maximized = this.partService.isPanelMaximized();
+		this.toDispose.push(editorGroupsService.onDidLayout(() => {
+			const maximized = this.layoutService.isPanelMaximized();
 			this.class = maximized ? 'minimize-panel-action' : 'maximize-panel-action';
 			this.label = maximized ? ToggleMaximizedPanelAction.RESTORE_LABEL : ToggleMaximizedPanelAction.MAXIMIZE_LABEL;
 		}));
 	}
 
 	run(): Promise<any> {
-		if (!this.partService.isVisible(Parts.PANEL_PART)) {
-			this.partService.setPanelHidden(false);
+		if (!this.layoutService.isVisible(Parts.PANEL_PART)) {
+			this.layoutService.setPanelHidden(false);
 		}
 
-		this.partService.toggleMaximizedPanel();
-		return Promise.resolve(null);
+		this.layoutService.toggleMaximizedPanel();
+		return Promise.resolve();
 	}
 
 	dispose(): void {
@@ -184,7 +187,7 @@ export class PanelActivityAction extends ActivityAction {
 	run(event: any): Promise<any> {
 		this.panelService.openPanel(this.activity.id, true);
 		this.activate();
-		return Promise.resolve(null);
+		return Promise.resolve();
 	}
 }
 
@@ -202,17 +205,19 @@ export class SwitchPanelViewAction extends Action {
 		const pinnedPanels = this.panelService.getPinnedPanels();
 		const activePanel = this.panelService.getActivePanel();
 		if (!activePanel) {
-			return Promise.resolve(null);
+			return Promise.resolve();
 		}
-		let targetPanelId: string;
+		let targetPanelId: string | undefined;
 		for (let i = 0; i < pinnedPanels.length; i++) {
 			if (pinnedPanels[i].id === activePanel.getId()) {
 				targetPanelId = pinnedPanels[(i + pinnedPanels.length + offset) % pinnedPanels.length].id;
 				break;
 			}
 		}
-		this.panelService.openPanel(targetPanelId, true);
-		return Promise.resolve(null);
+		if (typeof targetPanelId === 'string') {
+			this.panelService.openPanel(targetPanelId, true);
+		}
+		return Promise.resolve();
 	}
 }
 
@@ -247,7 +252,7 @@ export class NextPanelViewAction extends SwitchPanelViewAction {
 		super(id, name, panelService);
 	}
 
-	public run(): Promise<any> {
+	run(): Promise<any> {
 		return super.run(1);
 	}
 }

src/vs/workbench/browser/parts/panel/panelPart.ts

@@ -5,19 +5,19 @@
 
 import 'vs/css!./media/panelpart';
 import { IAction } from 'vs/base/common/actions';
-import { Event, Emitter } from 'vs/base/common/event';
+import { Event } from 'vs/base/common/event';
 import { Registry } from 'vs/platform/registry/common/platform';
 import { ActionsOrientation } from 'vs/base/browser/ui/actionbar/actionbar';
-import { IPanel } from 'vs/workbench/common/panel';
+import { IPanel, ActivePanelContext, PanelFocusContext } from 'vs/workbench/common/panel';
 import { CompositePart, ICompositeTitleLabel } from 'vs/workbench/browser/parts/compositePart';
 import { Panel, PanelRegistry, Extensions as PanelExtensions, PanelDescriptor } from 'vs/workbench/browser/panel';
 import { IPanelService, IPanelIdentifier } from 'vs/workbench/services/panel/common/panelService';
-import { IPartService, Parts, Position } from 'vs/workbench/services/part/common/partService';
+import { IWorkbenchLayoutService, Parts, Position } from 'vs/workbench/services/layout/browser/layoutService';
 import { IStorageService, StorageScope, IWorkspaceStorageChangeEvent } from 'vs/platform/storage/common/storage';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
-import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IInstantiationService, ServiceIdentifier } from 'vs/platform/instantiation/common/instantiation';
 import { ClosePanelAction, TogglePanelPositionAction, PanelActivityAction, ToggleMaximizedPanelAction, TogglePanelAction } from 'vs/workbench/browser/parts/panel/panelActions';
 import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
 import { PANEL_BACKGROUND, PANEL_BORDER, PANEL_ACTIVE_TITLE_FOREGROUND, PANEL_INACTIVE_TITLE_FOREGROUND, PANEL_ACTIVE_TITLE_BORDER, PANEL_DRAG_AND_DROP_BACKGROUND } from 'vs/workbench/common/theme';
@@ -29,56 +29,58 @@ import { INotificationService } from 'vs/platform/notification/common/notificati
 import { Dimension, trackFocus } from 'vs/base/browser/dom';
 import { localize } from 'vs/nls';
 import { IDisposable } from 'vs/base/common/lifecycle';
-import { RawContextKey, IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+import { IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 import { isUndefinedOrNull } from 'vs/base/common/types';
 import { ILifecycleService, LifecyclePhase } from 'vs/platform/lifecycle/common/lifecycle';
-import { ISerializableView } from 'vs/base/browser/ui/grid/grid';
 import { LayoutPriority } from 'vs/base/browser/ui/grid/gridview';
-
-export const ActivePanelContext = new RawContextKey<string>('activePanel', '');
-export const PanelFocusContext = new RawContextKey<boolean>('panelFocus', false);
+import { registerSingleton } from 'vs/platform/instantiation/common/extensions';
 
 interface ICachedPanel {
 	id: string;
 	pinned: boolean;
-	order: number;
+	order?: number;
 	visible: boolean;
 }
 
-export class PanelPart extends CompositePart<Panel> implements IPanelService, ISerializableView {
+export class PanelPart extends CompositePart<Panel> implements IPanelService {
 
 	static readonly activePanelSettingsKey = 'workbench.panelpart.activepanelid';
 
 	private static readonly PINNED_PANELS = 'workbench.panel.pinnedPanels';
 	private static readonly MIN_COMPOSITE_BAR_WIDTH = 50;
 
-	_serviceBrand: any;
+	_serviceBrand: ServiceIdentifier<any>;
+
+	//#region IView
+
+	readonly minimumWidth: number = 300;
+	readonly maximumWidth: number = Number.POSITIVE_INFINITY;
+	readonly minimumHeight: number = 77;
+	readonly maximumHeight: number = Number.POSITIVE_INFINITY;
+
+	readonly snapSize: number = 50;
+	readonly priority: LayoutPriority = LayoutPriority.Low;
+
+	//#endregion
+
+	get onDidPanelOpen(): Event<{ panel: IPanel, focus: boolean }> { return Event.map(this.onDidCompositeOpen.event, compositeOpen => ({ panel: compositeOpen.composite, focus: compositeOpen.focus })); }
+	get onDidPanelClose(): Event<IPanel> { return this.onDidCompositeClose.event; }
 
 	private activePanelContextKey: IContextKey<string>;
 	private panelFocusContextKey: IContextKey<boolean>;
-	private blockOpeningPanel: boolean;
+
 	private compositeBar: CompositeBar;
 	private compositeActions: { [compositeId: string]: { activityAction: PanelActivityAction, pinnedAction: ToggleCompositePinnedAction } } = Object.create(null);
+
+	private blockOpeningPanel: boolean;
 	private dimension: Dimension;
 
-	element: HTMLElement;
-	minimumWidth: number = 300;
-	maximumWidth: number = Number.POSITIVE_INFINITY;
-	minimumHeight: number = 77;
-	maximumHeight: number = Number.POSITIVE_INFINITY;
-	snapSize: number = 50;
-	priority: LayoutPriority = LayoutPriority.Low;
-
-	private _onDidChange = new Emitter<{ width: number; height: number; }>();
-	readonly onDidChange = this._onDidChange.event;
-
 	constructor(
-		id: string,
 		@INotificationService notificationService: INotificationService,
 		@IStorageService storageService: IStorageService,
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IContextMenuService contextMenuService: IContextMenuService,
-		@IPartService partService: IPartService,
+		@IWorkbenchLayoutService layoutService: IWorkbenchLayoutService,
 		@IKeybindingService keybindingService: IKeybindingService,
 		@IInstantiationService instantiationService: IInstantiationService,
 		@IThemeService themeService: IThemeService,
@@ -90,7 +92,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 			storageService,
 			telemetryService,
 			contextMenuService,
-			partService,
+			layoutService,
 			keybindingService,
 			instantiationService,
 			themeService,
@@ -99,8 +101,8 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 			Registry.as<PanelRegistry>(PanelExtensions.Panels).getDefaultPanelId(),
 			'panel',
 			'panel',
-			null,
-			id,
+			undefined,
+			Parts.PANEL_PART,
 			{ hasTitle: true }
 		);
 
@@ -116,10 +118,10 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 				this.instantiationService.createInstance(TogglePanelAction, TogglePanelAction.ID, localize('hidePanel', "Hide Panel"))
 			],
 			getDefaultCompositeId: () => Registry.as<PanelRegistry>(PanelExtensions.Panels).getDefaultPanelId(),
-			hidePart: () => this.partService.setPanelHidden(true),
+			hidePart: () => this.layoutService.setPanelHidden(true),
 			compositeSize: 0,
 			overflowActionSize: 44,
-			colors: theme => ({
+			colors: (theme: ITheme) => ({
 				activeBackgroundColor: theme.getColor(PANEL_BACKGROUND), // Background color for overflow action
 				inactiveBackgroundColor: theme.getColor(PANEL_BACKGROUND), // Background color for overflow action
 				activeBorderBottomColor: theme.getColor(PANEL_ACTIVE_TITLE_BORDER),
@@ -141,25 +143,13 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		this.registerListeners();
 	}
 
-	create(parent: HTMLElement): void {
-		this.element = parent;
-
-		super.create(parent);
-
-		const focusTracker = trackFocus(parent);
-
-		focusTracker.onDidFocus(() => {
-			this.panelFocusContextKey.set(true);
-		});
-		focusTracker.onDidBlur(() => {
-			this.panelFocusContextKey.set(false);
-		});
-	}
-
 	private registerListeners(): void {
-		this._register(this.onDidPanelOpen(({ panel }) => this._onDidPanelOpen(panel)));
-		this._register(this.onDidPanelClose(this._onDidPanelClose, this));
 
+		// Panel open/close
+		this._register(this.onDidPanelOpen(({ panel }) => this.onPanelOpen(panel)));
+		this._register(this.onDidPanelClose(this.onPanelClose, this));
+
+		// Panel register/deregister
 		this._register(this.registry.onDidRegister(panelDescriptor => this.compositeBar.addComposite(panelDescriptor)));
 		this._register(this.registry.onDidDeregister(panelDescriptor => {
 			this.compositeBar.hideComposite(panelDescriptor.id);
@@ -175,17 +165,18 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		// Deactivate panel action on close
 		this._register(this.onDidPanelClose(panel => this.compositeBar.deactivateComposite(panel.getId())));
 
+		// State
 		this.lifecycleService.when(LifecyclePhase.Eventually).then(() => {
 			this._register(this.compositeBar.onDidChange(() => this.saveCachedPanels()));
 			this._register(this.storageService.onDidChangeStorage(e => this.onDidStorageChange(e)));
 		});
 	}
 
-	private _onDidPanelOpen(panel: IPanel): void {
+	private onPanelOpen(panel: IPanel): void {
 		this.activePanelContextKey.set(panel.getId());
 	}
 
-	private _onDidPanelClose(panel: IPanel): void {
+	private onPanelClose(panel: IPanel): void {
 		const id = panel.getId();
 
 		if (this.activePanelContextKey.get() === id) {
@@ -193,12 +184,14 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		}
 	}
 
-	get onDidPanelOpen(): Event<{ panel: IPanel, focus: boolean }> {
-		return Event.map(this._onDidCompositeOpen.event, compositeOpen => ({ panel: compositeOpen.composite, focus: compositeOpen.focus }));
-	}
+	create(parent: HTMLElement): void {
+		this.element = parent;
 
-	get onDidPanelClose(): Event<IPanel> {
-		return this._onDidCompositeClose.event;
+		super.create(parent);
+
+		const focusTracker = this._register(trackFocus(parent));
+		this._register(focusTracker.onDidFocus(() => this.panelFocusContextKey.set(true)));
+		this._register(focusTracker.onDidBlur(() => this.panelFocusContextKey.set(false)));
 	}
 
 	updateStyles(): void {
@@ -209,38 +202,40 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		container.style.borderLeftColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder);
 
 		const title = this.getTitleArea();
-		title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder);
+		if (title) {
+			title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder);
+		}
 	}
 
-	openPanel(id: string, focus?: boolean): Panel {
+	openPanel(id: string, focus?: boolean): Panel | null {
 		if (this.blockOpeningPanel) {
 			return null; // Workaround against a potential race condition
 		}
 
 		// First check if panel is hidden and show if so
-		if (!this.partService.isVisible(Parts.PANEL_PART)) {
+		if (!this.layoutService.isVisible(Parts.PANEL_PART)) {
 			try {
 				this.blockOpeningPanel = true;
-				this.partService.setPanelHidden(false);
+				this.layoutService.setPanelHidden(false);
 			} finally {
 				this.blockOpeningPanel = false;
 			}
 		}
 
-		return this.openComposite(id, focus);
+		return this.openComposite(id, focus) || null;
 	}
 
 	showActivity(panelId: string, badge: IBadge, clazz?: string): IDisposable {
 		return this.compositeBar.showActivity(panelId, badge, clazz);
 	}
 
-	private getPanel(panelId: string): IPanelIdentifier {
+	private getPanel(panelId: string): IPanelIdentifier | undefined {
 		return this.getPanels().filter(p => p.id === panelId).pop();
 	}
 
 	getPanels(): PanelDescriptor[] {
 		return Registry.as<PanelRegistry>(PanelExtensions.Panels).getPanels()
-			.sort((v1, v2) => v1.order - v2.order);
+			.sort((v1, v2) => typeof v1.order === 'number' && typeof v2.order === 'number' ? v1.order - v2.order : NaN);
 	}
 
 	getPinnedPanels(): PanelDescriptor[] {
@@ -257,7 +252,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		];
 	}
 
-	getActivePanel(): IPanel {
+	getActivePanel(): IPanel | null {
 		return this.getActiveComposite();
 	}
 
@@ -286,41 +281,31 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		};
 	}
 
-	layout(dimension: Dimension): Dimension[];
-	layout(width: number, height: number): void;
-	layout(dim1: Dimension | number, dim2?: number): Dimension[] | void {
-		if (!this.partService.isVisible(Parts.PANEL_PART)) {
-			if (dim1 instanceof Dimension) {
-				return [dim1];
-			}
-
+	layout(width: number, height: number): void {
+		if (!this.layoutService.isVisible(Parts.PANEL_PART)) {
 			return;
 		}
 
-		const { width, height } = dim1 instanceof Dimension ? dim1 : { width: dim1, height: dim2 };
-
-		if (this.partService.getPanelPosition() === Position.RIGHT) {
-			// Take into account the 1px border when layouting
-			this.dimension = new Dimension(width - 1, height);
+		if (this.layoutService.getPanelPosition() === Position.RIGHT) {
+			this.dimension = new Dimension(width - 1, height!); // Take into account the 1px border when layouting
 		} else {
-			this.dimension = new Dimension(width, height);
+			this.dimension = new Dimension(width, height!);
 		}
 
-		const sizes = super.layout(this.dimension.width, this.dimension.height);
+		// Layout contents
+		super.layout(this.dimension.width, this.dimension.height);
+
+		// Layout composite bar
 		this.layoutCompositeBar();
-
-		if (dim1 instanceof Dimension) {
-			return sizes;
-		}
 	}
 
 	private layoutCompositeBar(): void {
 		if (this.dimension) {
 			let availableWidth = this.dimension.width - 40; // take padding into account
 			if (this.toolBar) {
-				// adjust height for global actions showing
-				availableWidth = Math.max(PanelPart.MIN_COMPOSITE_BAR_WIDTH, availableWidth - this.getToolbarWidth());
+				availableWidth = Math.max(PanelPart.MIN_COMPOSITE_BAR_WIDTH, availableWidth - this.getToolbarWidth()); // adjust height for global actions showing
 			}
+
 			this.compositeBar.layout(new Dimension(availableWidth, this.dimension.height));
 		}
 	}
@@ -334,6 +319,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 			};
 			this.compositeActions[compositeId] = compositeActions;
 		}
+
 		return compositeActions;
 	}
 
@@ -345,8 +331,10 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 				compositeActions.pinnedAction.dispose();
 				delete this.compositeActions[compositeId];
 			}
+
 			return true;
 		}
+
 		return false;
 	}
 
@@ -355,6 +343,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 		if (!activePanel) {
 			return 0;
 		}
+
 		return this.toolBar.getItemsWidth();
 	}
 
@@ -393,30 +382,35 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService, IS
 
 	private saveCachedPanels(): void {
 		const state: ICachedPanel[] = [];
+
 		const compositeItems = this.compositeBar.getCompositeBarItems();
 		for (const compositeItem of compositeItems) {
 			state.push({ id: compositeItem.id, pinned: compositeItem.pinned, order: compositeItem.order, visible: compositeItem.visible });
 		}
+
 		this.cachedPanelsValue = JSON.stringify(state);
 	}
 
 	private getCachedPanels(): ICachedPanel[] {
-		const storedStates = <Array<string | ICachedPanel>>JSON.parse(this.cachedPanelsValue);
 		const registeredPanels = this.getPanels();
+
+		const storedStates = <Array<string | ICachedPanel>>JSON.parse(this.cachedPanelsValue);
 		const cachedPanels = <ICachedPanel[]>storedStates.map(c => {
 			const serialized: ICachedPanel = typeof c === 'string' /* migration from pinned states to composites states */ ? <ICachedPanel>{ id: c, pinned: true, order: undefined, visible: true } : c;
 			const registered = registeredPanels.some(p => p.id === serialized.id);
 			serialized.visible = registered ? isUndefinedOrNull(serialized.visible) ? true : serialized.visible : false;
 			return serialized;
 		});
+
 		return cachedPanels;
 	}
 
-	private _cachedPanelsValue: string;
+	private _cachedPanelsValue: string | null;
 	private get cachedPanelsValue(): string {
 		if (!this._cachedPanelsValue) {
 			this._cachedPanelsValue = this.getStoredCachedPanelsValue();
 		}
+
 		return this._cachedPanelsValue;
 	}
 
@@ -509,3 +503,5 @@ registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
 		`);
 	}
 });
+
+registerSingleton(IPanelService, PanelPart);