Cannot read properties of undefined (reading 'layout') (microsoft#213797)

Fixes microsoft#212235

Author: alexr00

src/vs/workbench/contrib/remote/browser/tunnelView.ts

@@ -750,7 +750,7 @@ export class TunnelPanel extends ViewPane {
 	static readonly TITLE: ILocalizedString = nls.localize2('remote.tunnel', "Ports");
 
 	private panelContainer: HTMLElement | undefined;
-	private table!: WorkbenchTable<ITunnelItem>;
+	private table: WorkbenchTable<ITunnelItem> | undefined;
 	private readonly tableDisposables: DisposableStore = this._register(new DisposableStore());
 	private tunnelTypeContext: IContextKey<TunnelType>;
 	private tunnelCloseableContext: IContextKey<boolean>;
@@ -830,7 +830,7 @@ export class TunnelPanel extends ViewPane {
 				updateActions();
 				this.registerPrivacyActions();
 				this.createTable();
-				this.table.layout(this.height, this.width);
+				this.table?.layout(this.height, this.width);
 			}
 		}));
 	}
@@ -913,7 +913,7 @@ export class TunnelPanel extends ViewPane {
 		this.tableDisposables.add(this.table.onDidFocus(() => this.tunnelViewFocusContext.set(true)));
 		this.tableDisposables.add(this.table.onDidBlur(() => this.tunnelViewFocusContext.set(false)));
 
-		const rerender = () => this.table.splice(0, Number.POSITIVE_INFINITY, this.viewModel.all);
+		const rerender = () => this.table?.splice(0, Number.POSITIVE_INFINITY, this.viewModel.all);
 
 		rerender();
 		let lastPortCount = this.portCount;
@@ -927,7 +927,7 @@ export class TunnelPanel extends ViewPane {
 		}));
 
 		this.tableDisposables.add(this.table.onMouseClick(e => {
-			if (this.hasOpenLinkModifier(e.browserEvent)) {
+			if (this.hasOpenLinkModifier(e.browserEvent) && this.table) {
 				const selection = this.table.getSelectedElements();
 				if ((selection.length === 0) ||
 					((selection.length === 1) && (selection[0] === e.element))) {
@@ -959,11 +959,11 @@ export class TunnelPanel extends ViewPane {
 				widgetContainer.classList.add('highlight');
 				if (!e) {
 					// When we are in editing mode for a new forward, rather than updating an existing one we need to reveal the input box since it might be out of view.
-					this.table.reveal(this.table.indexOf(this.viewModel.input));
+					this.table?.reveal(this.table.indexOf(this.viewModel.input));
 				}
 			} else {
 				if (e && (e.tunnel.tunnelType !== TunnelType.Add)) {
-					this.table.setFocus(this.lastFocus);
+					this.table?.setFocus(this.lastFocus);
 				}
 				this.focus();
 			}
@@ -983,7 +983,7 @@ export class TunnelPanel extends ViewPane {
 
 	override focus(): void {
 		super.focus();
-		this.table.domFocus();
+		this.table?.domFocus();
 	}
 
 	private onFocusChanged(event: ITableEvent<ITunnelItem>) {
@@ -1045,7 +1045,7 @@ export class TunnelPanel extends ViewPane {
 		const node: TunnelItem | undefined = event.element;
 
 		if (node) {
-			this.table.setFocus([this.table.indexOf(node)]);
+			this.table?.setFocus([this.table.indexOf(node)]);
 			this.tunnelTypeContext.set(node.tunnelType);
 			this.tunnelCloseableContext.set(!!node.closeable);
 			this.tunnelPrivacyContext.set(node.privacy.id);
@@ -1062,7 +1062,7 @@ export class TunnelPanel extends ViewPane {
 		this.contextMenuService.showContextMenu({
 			menuId: MenuId.TunnelContext,
 			menuActionOptions: { shouldForwardArgs: true },
-			contextKeyService: this.table.contextKeyService,
+			contextKeyService: this.table?.contextKeyService,
 			getAnchor: () => event.anchor,
 			getActionViewItem: (action) => {
 				const keybinding = this.keybindingService.lookupKeybinding(action.id);
@@ -1073,7 +1073,7 @@ export class TunnelPanel extends ViewPane {
 			},
 			onHide: (wasCancelled?: boolean) => {
 				if (wasCancelled) {
-					this.table.domFocus();
+					this.table?.domFocus();
 				}
 			},
 			getActionsContext: () => node?.strip(),
@@ -1093,7 +1093,7 @@ export class TunnelPanel extends ViewPane {
 		this.height = height;
 		this.width = width;
 		super.layoutBody(height, width);
-		this.table.layout(height, width);
+		this.table?.layout(height, width);
 	}
 }