Skip to content

More VS Code Onboarding TPI Fixes #309673

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
eli-w-king wants to merge 4 commits into
base: release/1.116
Choose a base branch
from
+42 −2
Open

More VS Code Onboarding TPI Fixes #309673

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a3b880f
onboarding: include theme preview SVGs in build output
eli-w-king Apr 13, 2026
f4e87d9
onboarding: trigger chat setup after sign-in to resolve entitlements
eli-w-king Apr 13, 2026
7fc1b05
onboarding: add Extension Marketplace keybinding tip to extensions step
eli-w-king Apr 13, 2026
9d2bda2
onboarding: screenreader accessibility fixes
eli-w-king Apr 13, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions build/gulpfile.vscode.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ const vscodeResourceIncludes = [

// Welcome
'out-build/vs/workbench/contrib/welcomeGettingStarted/common/media/**/*.{svg,png}',
'out-build/vs/workbench/contrib/welcomeOnboarding/browser/media/*.svg',

// Sessions
'out-build/vs/sessions/contrib/chat/browser/media/*.svg',
Expand Down
1 change: 1 addition & 0 deletions build/gulpfile.vscode.web.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,7 @@ export const vscodeWebResourceIncludes = [

// Welcome
'out-build/vs/workbench/contrib/welcomeGettingStarted/common/media/**/*.{svg,png}',
'out-build/vs/workbench/contrib/welcomeOnboarding/browser/media/*.svg',

// Extensions
'out-build/vs/workbench/contrib/extensions/browser/media/{theme-icon.png,language-icon.svg}',
Expand Down
42 changes: 40 additions & 2 deletions src/vs/workbench/contrib/welcomeOnboarding/browser/onboardingVariationA.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,9 @@ import { IQuickInputService } from '../../../../platform/quickinput/common/quick
import { IFileService } from '../../../../platform/files/common/files.js';
import { IPathService } from '../../../services/path/common/pathService.js';
import { ITelemetryService } from '../../../../platform/telemetry/common/telemetry.js';
import { InstallChatEvent, InstallChatClassification } from '../../chat/browser/chatSetup/chatSetup.js';
import { InstallChatEvent, InstallChatClassification, ChatSetupStrategy } from '../../chat/browser/chatSetup/chatSetup.js';
import { ICommandService } from '../../../../platform/commands/common/commands.js';
import { IAccessibilityService } from '../../../../platform/accessibility/common/accessibility.js';
import {
OnboardingStepId,
ONBOARDING_STEPS,
Expand Down Expand Up @@ -135,6 +137,8 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
@IFileService private readonly fileService: IFileService,
@IPathService private readonly pathService: IPathService,
@ITelemetryService private readonly telemetryService: ITelemetryService,
@ICommandService private readonly commandService: ICommandService,
@IAccessibilityService private readonly accessibilityService: IAccessibilityService,
) {
super();

Expand Down Expand Up @@ -365,6 +369,8 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
this._renderAgentSessionsSubtitle(this.subtitleEl);
} else if (stepId === OnboardingStepId.Personalize) {
this._renderPersonalizeSubtitle(this.subtitleEl);
} else if (stepId === OnboardingStepId.Extensions) {
this._renderExtensionsSubtitle(this.subtitleEl);
} else {
this.subtitleEl.textContent = getOnboardingStepSubtitle(stepId);
}
Expand Down Expand Up @@ -561,6 +567,11 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
if (account) {
this._userSignedIn = true;
this.telemetryService.publicLog2<InstallChatEvent, InstallChatClassification>('commandCenter.chatInstall', { installResult: 'installed', installDuration: watch.elapsed(), signUpErrorCode: undefined, provider });
// Run chat setup in the background (sign-up, extension install, entitlement resolution)
this.commandService.executeCommand('workbench.action.chat.triggerSetup', undefined, {
disableChatViewReveal: true,
setupStrategy: ChatSetupStrategy.DefaultSetup,
});
this._nextStep();
}
} catch (error) {
Expand Down Expand Up @@ -592,6 +603,10 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
if (account) {
this._userSignedIn = true;
this.telemetryService.publicLog2<InstallChatEvent, InstallChatClassification>('commandCenter.chatInstall', { installResult: 'installed', installDuration: watch.elapsed(), signUpErrorCode: undefined, provider });
this.commandService.executeCommand('workbench.action.chat.triggerSetup', undefined, {
disableChatViewReveal: true,
setupStrategy: ChatSetupStrategy.DefaultSetup,
});
this._nextStep();
}
} catch (error) {
Expand Down Expand Up @@ -743,6 +758,7 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
}
pill.classList.add('selected');
pill.setAttribute('aria-checked', 'true');
this.accessibilityService.alert(localize('onboarding.keymap.selected.alert', "{0} keyboard mapping selected", keymap.label));
}));
}
const selectedKeymapIndex = keymapOptions.findIndex(k => k.id === this.selectedKeymapId);
Expand All @@ -765,6 +781,20 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
);
}

private _renderExtensionsSubtitle(container: HTMLElement): void {
clearNode(container);
const modifier = isMacintosh ? 'Cmd' : 'Ctrl';
container.append(
localize('onboarding.extensions.subtitle.prefix', "Install extensions to enhance your workflow. Press "),
this._createKbd(localize({ key: 'onboarding.extensions.subtitle.modifier', comment: ['Keyboard modifier key'] }, "{0}", modifier)),
'+',
this._createKbd(localize('onboarding.extensions.subtitle.shift', "Shift")),
'+',
this._createKbd(localize('onboarding.extensions.subtitle.x', "X")),
localize('onboarding.extensions.subtitle.suffix', " to browse the Extension Marketplace."),
);
}

private _createThemeCard(parent: HTMLElement, theme: IOnboardingThemeOption, allCards: HTMLElement[]): void {
const card = this._registerStepFocusable(append(parent, $('div.onboarding-a-theme-card')));
allCards.push(card);
Expand Down Expand Up @@ -795,6 +825,7 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
}
card.classList.add('selected');
card.setAttribute('aria-checked', 'true');
this.accessibilityService.alert(localize('onboarding.theme.selected.alert', "{0} theme selected", theme.label));
}));

this.stepDisposables.add(addDisposableListener(card, EventType.KEY_DOWN, (e: KeyboardEvent) => {
Expand Down Expand Up @@ -841,6 +872,7 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
const installBtn = this._registerStepFocusable(append(row, $<HTMLButtonElement>('button.onboarding-a-ext-install')));
installBtn.type = 'button';
installBtn.textContent = localize('onboarding.ext.install', "Install");
installBtn.setAttribute('aria-label', localize('onboarding.ext.install.aria', "Install {0}", ext.name));

this.stepDisposables.add(addDisposableListener(installBtn, EventType.CLICK, () => {
this._logAction('installExtension', undefined, ext.id);
Expand All @@ -850,6 +882,8 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
() => {
installBtn.textContent = localize('onboarding.ext.installed', "Installed");
installBtn.classList.add('installed');
installBtn.setAttribute('aria-label', localize('onboarding.ext.installed.aria', "{0} installed", ext.name));
this.accessibilityService.alert(localize('onboarding.ext.installed.alert', "{0} has been installed", ext.name));
},
() => {
installBtn.textContent = localize('onboarding.ext.install', "Install");
Expand Down Expand Up @@ -1068,6 +1102,7 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
c.setAttribute('aria-checked', c.dataset.id === option.id ? 'true' : 'false');
}
this._applyAiPreference(option.id);
this.accessibilityService.alert(localize('onboarding.aiPref.selected.alert', "{0} selected", option.label));
}));
}
const selectedAiIndex = ONBOARDING_AI_PREFERENCE_OPTIONS.findIndex(o => o.id === this.selectedAiMode);
Expand Down Expand Up @@ -1148,7 +1183,10 @@ export class OnboardingVariationA extends Disposable implements IOnboardingServi
}

private _createFeatureCard(parent: HTMLElement, icon: ThemeIcon, title: string, description?: string): HTMLElement {
const card = append(parent, $('div.onboarding-a-feature-card'));
const card = this._registerStepFocusable(append(parent, $('div.onboarding-a-feature-card')));
card.setAttribute('tabindex', '0');
card.setAttribute('role', 'group');
card.setAttribute('aria-label', title);
const iconCol = append(card, $('div.onboarding-a-feature-icon'));
iconCol.appendChild(renderIcon(icon));
const textCol = append(card, $('div.onboarding-a-feature-text'));
Expand Down
Loading