fix: scope workspace-creation-project tour target to project picker only

Move the tour target attribute from the outer project section to an inner
wrapper around just the combobox and its messages, excluding the header
label and "Add project" button. Update tests to verify the narrower scope.
This commit is contained in:
Jinjing
2026-09-03 14:30:34 -07:00
parent 28cd145fa5
commit cce7bb41f1
2 changed files with 46 additions and 32 deletions
@@ -190,9 +190,18 @@ const pnpmInstallSetupConfig = {
}
const vmRecipeHostOptions: ProjectHostSetupOption[] = [
{ kind: 'ready', id: 'setup-local', label: 'Local Mac', path: '/Users/alice/orca' },
{ kind: 'ready', id: 'setup-builder', label: 'Builder', path: '/workspace/orca' }
] as never
localReadyHostOption,
{
kind: 'ready',
id: 'setup-builder',
projectId: 'project-group:platform',
hostId: 'ssh:builder',
repoId: 'repo-a',
label: 'Builder',
detail: 'Orca',
path: '/workspace/orca'
}
]
function findConnectButton(label: string): HTMLButtonElement | undefined {
const item = findRunTargetItem(label)
@@ -317,7 +326,7 @@ function unmountCurrent(): void {
}
function findWaitSwitch(container: HTMLElement): HTMLButtonElement | null {
return container.querySelector(
return container.querySelector<HTMLButtonElement>(
'[role="switch"][aria-label="Wait for setup to complete before starting agent"]'
)
}
@@ -404,6 +413,9 @@ describe('NewWorkspaceComposerCard folder task source mode', () => {
expect(projectTourTarget?.querySelector('[data-project-combobox-root="true"]')).toBeTruthy()
expect(projectTourTarget?.querySelector('[data-run-target-combobox-root="true"]')).toBeNull()
expect(projectTourTarget?.textContent).not.toContain('Run on')
expect(projectTourTarget?.querySelector('label')).toBeNull()
expect(projectTourTarget?.querySelector('[aria-label="Add project"]')).toBeNull()
expect(current.container.querySelector('[aria-label="Add project"]')).toBeTruthy()
const runTargetPicker = current.container.querySelector(
'div[data-run-target-combobox-root="true"]'
@@ -81,7 +81,7 @@ export function NewWorkspaceComposerProjectSection({
}: NewWorkspaceComposerProjectSectionProps): React.JSX.Element {
return (
<div className="space-y-1">
<div className="space-y-1" data-contextual-tour-target="workspace-creation-project">
<div className="space-y-1">
<div className="flex items-center justify-between gap-2">
<label className="text-xs font-medium text-muted-foreground">
{projectLabel ??
@@ -110,33 +110,35 @@ export function NewWorkspaceComposerProjectSection({
</Tooltip>
) : null}
</div>
<ProjectCombobox
options={projectOptions}
value={selectedProjectId}
onValueChange={onProjectChange}
onValueSelected={focusNameInput}
onAddProject={onAddProject}
placeholder={
projectPlaceholder ??
translate('auto.components.NewWorkspaceComposerCard.dccd26d4e4', 'Choose project')
}
triggerClassName="h-9 w-full border-input text-sm focus:border-ring focus:ring-[3px] focus:ring-ring/50"
invalid={Boolean(projectError)}
describedBy={projectDescriptionId}
/>
{projectError ? (
<p id={projectDescriptionId} className="text-[11px] text-destructive">
{projectError}
</p>
) : projectOptions.length === 0 ? (
<p id={projectDescriptionId} className="text-[11px] text-muted-foreground">
{emptyProjectMessage ??
translate(
'auto.components.NewWorkspaceComposerCard.addProjectBeforeWorkspace',
'Add a project before creating a workspace.'
)}
</p>
) : null}
<div className="space-y-1" data-contextual-tour-target="workspace-creation-project">
<ProjectCombobox
options={projectOptions}
value={selectedProjectId}
onValueChange={onProjectChange}
onValueSelected={focusNameInput}
onAddProject={onAddProject}
placeholder={
projectPlaceholder ??
translate('auto.components.NewWorkspaceComposerCard.dccd26d4e4', 'Choose project')
}
triggerClassName="h-9 w-full border-input text-sm focus:border-ring focus:ring-[3px] focus:ring-ring/50"
invalid={Boolean(projectError)}
describedBy={projectDescriptionId}
/>
{projectError ? (
<p id={projectDescriptionId} className="text-[11px] text-destructive">
{projectError}
</p>
) : projectOptions.length === 0 ? (
<p id={projectDescriptionId} className="text-[11px] text-muted-foreground">
{emptyProjectMessage ??
translate(
'auto.components.NewWorkspaceComposerCard.addProjectBeforeWorkspace',
'Add a project before creating a workspace.'
)}
</p>
) : null}
</div>
</div>
{shouldShowRunTargetPicker ? (
<div className="space-y-1 pt-3">