sessions: fix: guard chat grid neighbor lookup before layout

src/vs/sessions/browser/parts/chatGroupsView.ts

@@ -102,6 +102,7 @@ export class ChatGroupsView extends Themable {
 	private _lastSessionActiveChatId: string | undefined;
 
 	private _lastLayout: { readonly width: number; readonly height: number; readonly top: number; readonly left: number } | undefined;
+	private _gridDidLayout = false;
 
 	constructor(
 		@IThemeService themeService: IThemeService,
@@ -129,6 +130,7 @@ export class ChatGroupsView extends Themable {
 		this._groupDisposables.clearAndDisposeAll();
 		this._currentSessionStore = store;
 		this._grid = undefined;
+		this._gridDidLayout = false;
 		this._groups = [];
 		this._activeGroup = undefined;
 		this._restoreAssignment = undefined;
@@ -163,7 +165,6 @@ export class ChatGroupsView extends Themable {
 		store.add(this._instantiationService.createInstance(ChatGroupDropTarget, this.element, dropDelegate));
 
 		store.add(autorun(reader => this._reconcile(reader)));
-
 		this._applyLayout();
 	}
 
@@ -560,7 +561,7 @@ export class ChatGroupsView extends Themable {
 	}
 
 	private _findAdjacentGroup(reference: IGroupEntry): IGroupEntry | undefined {
-		if (this._grid && this._lastLayout) {
+		if (this._grid && this._gridDidLayout) {
 			for (const direction of [Direction.Right, Direction.Left, Direction.Down, Direction.Up]) {
 				const neighbor = this._grid.getNeighborViews(reference.view, direction)[0];
 				const group = neighbor && this._groups.find(candidate => candidate.view === neighbor);
@@ -829,7 +830,10 @@ export class ChatGroupsView extends Themable {
 		}
 		const { width, height, top, left } = this._lastLayout;
 		size(this.element, width, height);
-		this._grid?.layout(width, height, top, left);
+		if (this._grid) {
+			this._grid.layout(width, height, top, left);
+			this._gridDidLayout = true;
+		}
 	}
 
 	private get _separatorBorder(): Color {

src/vs/sessions/test/browser/chatGroupsView.test.ts

@@ -25,6 +25,7 @@ import { IActiveSession, ISessionsManagementService } from '../../services/sessi
 
 class TestChatView extends AbstractChatView {
 	private readonly _focusTarget = mainWindow.document.createElement('button');
+	layoutCount = 0;
 
 	constructor(readonly kind: ChatViewKind) {
 		super();
@@ -36,20 +37,30 @@ class TestChatView extends AbstractChatView {
 		return {};
 	}
 
-	protected doLayout(): void { }
+	protected doLayout(): void {
+		this.layoutCount++;
+	}
 
 	focus(): void {
 		this._focusTarget.focus();
 	}
 }
 
 class TestChatViewFactory extends mock<IChatViewFactory>() {
+	readonly views: TestChatView[] = [];
+
 	override createNewChatView(isNewChatInSession: boolean): AbstractChatView {
-		return new TestChatView(isNewChatInSession ? 'newChatInSession' : 'newSession');
+		return this._createView(isNewChatInSession ? 'newChatInSession' : 'newSession');
 	}
 
 	override createChatView(): AbstractChatView {
-		return new TestChatView('chat');
+		return this._createView('chat');
+	}
+
+	private _createView(kind: ChatViewKind): TestChatView {
+		const view = new TestChatView(kind);
+		this.views.push(view);
+		return view;
 	}
 }
 
@@ -137,14 +148,16 @@ class TestSessionsService extends mock<ISessionsService>() {
 interface IChatGroupsHarness {
 	readonly instantiationService: TestInstantiationService;
 	readonly sessionsService: TestSessionsService;
+	readonly chatViewFactory: TestChatViewFactory;
 	readonly view: ChatGroupsView;
 }
 
 function createHarness(disposables: Pick<DisposableStore, 'add'>): IChatGroupsHarness {
 	const store = disposables.add(new DisposableStore());
 	const instantiationService = workbenchInstantiationService(undefined, store);
 	const sessionsService = new TestSessionsService();
-	instantiationService.stub(IChatViewFactory, new TestChatViewFactory());
+	const chatViewFactory = new TestChatViewFactory();
+	instantiationService.stub(IChatViewFactory, chatViewFactory);
 	instantiationService.stub(ISessionsService, sessionsService);
 	instantiationService.stub(ISessionsManagementService, new class extends mock<ISessionsManagementService>() {
 		override readonly onDidChangeSessions = Event.None;
@@ -158,13 +171,46 @@ function createHarness(disposables: Pick<DisposableStore, 'add'>): IChatGroupsHa
 	const view = store.add(instantiationService.createInstance(ChatGroupsView));
 	mainWindow.document.body.appendChild(view.element);
 	store.add(toDisposable(() => view.element.remove()));
-	return { instantiationService, sessionsService, view };
+	return { instantiationService, sessionsService, chatViewFactory, view };
 }
 
 suite('Sessions - ChatGroupsView', () => {
 	const disposables = ensureNoDisposablesAreLeakedInTestSuite();
 	const options = { renderSessionTypePickerInControls: constObservable(false) };
 
+	test('opens a session with an active child chat after initial layout', () => {
+		const { view, chatViewFactory } = createHarness(disposables);
+		const main = createChat('main');
+		const child = createChat('child', SessionStatus.Completed, main.resource);
+		const session = new TestActiveSession([main, child]);
+		session.activeChat.set(child, undefined);
+		view.layout(800, 600, 0, 0);
+
+		view.setSession(session, options);
+		view.focus();
+
+		const renderedView = view.element.querySelector<HTMLElement>('.chat-view');
+		const renderedChatView = chatViewFactory.views.find(createdView => createdView.kind === 'chat');
+		const transientComposerView = chatViewFactory.views.find(createdView => createdView.kind === 'newChatInSession');
+		assert.deepStrictEqual({
+			renderedKind: renderedView?.dataset.kind,
+			renderedWidth: renderedView?.style.width,
+			renderedLayoutCount: renderedChatView?.layoutCount,
+			transientLayoutCount: transientComposerView?.layoutCount ?? 0,
+			focusedKind: view.element.ownerDocument.activeElement?.closest<HTMLElement>('.chat-view')?.dataset.kind,
+			activeTab: view.element.querySelector<HTMLElement>('.chat-composite-bar-tab.active')?.dataset.chatResource,
+			tabs: Array.from(view.element.querySelectorAll<HTMLElement>('.chat-composite-bar-tab')).map(tab => tab.dataset.chatResource),
+		}, {
+			renderedKind: 'chat',
+			renderedWidth: '800px',
+			renderedLayoutCount: 1,
+			transientLayoutCount: 0,
+			focusedKind: 'chat',
+			activeTab: child.resource.toString(),
+			tabs: [main.resource.toString(), child.resource.toString()],
+		});
+	});
+
 	test('focusing another group updates the session active chat', () => {
 		const { sessionsService, view } = createHarness(disposables);
 		const main = createChat('main');