microsoft / microsoft/vscode

Test: Rich GitHub reference previews in chat pills

Open Beginner friendly
#335,896 0 comments 0 reactions 0 assignees View on GitHub
testplan-item
Dominant language
TypeScript
Stars
193k
Forks
42.4k
PR merge metrics
PR metrics pending

Description

Refs: #335583, #335448

- [ ] anyOS

Complexity: 2

Authors: @chryw

[Create Issue](https://github.com/microsoft/vscode/issues/new?template=blank&body=Testing+%23335896%0A%0A&assignees=chryw)

---

GitHub issue and pull-request artifacts now show a compact preview from their reference pills. Focus on whether the preview gives enough context to understand and open the reference without becoming a full issue reader.

Related first-level title work: #335387, #335383.

## Setup

1. Use an Insiders build containing #335583.
2. Open the `microsoft/vscode` repository in an Agents Window.
3. Start a session against that workspace and submit:

```text
Use only the add_artifact_or_reference tool. Do not call shell, git, create_session, or any other tool. Call add_artifact_or_reference exactly once with this exact input:

{"items":[{"type":"issue","label":"Agent Window issue pill discards the recorded issue title","isArtifact":true,"link":"https://github.com/microsoft/vscode/issues/335383"},{"type":"issue","label":"Show rich GitHub issue previews with title and rendered body in hovers","isArtifact":true,"link":"https://github.com/microsoft/vscode/issues/335448"},{"type":"pullRequest","label":"sessions: preserve recorded GitHub titles in pills","isArtifact":true,"link":"https://github.com/microsoft/vscode/pull/335387"},{"type":"pullRequest","label":"sessions: add rich GitHub reference previews","isArtifact":true,"link":"https://github.com/microsoft/vscode/pull/335583"}]}

Do not repeat the URLs as Markdown links. After the tool succeeds, reply only: References recorded.
```

If #335583 is no longer open, use another open `microsoft/vscode` pull request to check live CI status.

## Testing

### Collections

1. Open the **2 Issues** and **2 Pull Requests** pills. First-level rows should be easy to scan and show the state icon, title, GitHub number, and Copy URL action.
2. Move through rows with Up/Down. The second-level preview should follow the selected row and show:
- repository/date, title/number, lifecycle state, a bounded readable description, and author;
- overall CI state and base/head branches for an open or draft pull request.
3. Compare the metadata with GitHub. Check **Open**, **Closed**, **Draft**, **Merged**, **Not planned**, **Duplicate**, **Checks pending**, **Checks passed**, and **Checks failed** when examples are available. Merged, closed, and no-check PRs should not show irrelevant CI.
4. Try the repository/number links, Copy URL action, and PR branch controls. They should open or copy the exact target.
5. Narrow the window. Long titles and descriptions should remain bounded, the number and actions should stay visible, and both popups should stay within the viewport.

### Keyboard and accessibility

6. From the chat input, use Shift+Tab and Left/Right to reach the reference pills. Enter/Space should open a collection and Up/Down should move its rows.
7. Tab through Copy URL → repository → number → PR base branch → PR head branch. Shift+Tab should follow the exact reverse order back to the list. Up/Down from a card control should resume list navigation, and Escape should return focus to the triggering pill.
8. In Screen Reader Optimized mode, verify that rows announce the resource type, number, full title, lifecycle state, and CI state when applicable. The detail dialog should read in visual order, without separately announcing decorative icons or the branch arrow.
9. Check dark, light, and high-contrast themes. Text, links, borders, semantic states, and keyboard focus should remain distinguishable without relying on color alone.

### Single references and editor-shell alignment

10. In new sessions, repeat the tool prompt with only one issue, then only one pull request. Each should render as a direct chip whose hover contains the same metadata as the collection preview; activating the chip should open the exact GitHub item.
11. Submit the collection prompt in the editor shell's panel/editor Chat UI. Compare it with the Agents Window: content order, terminology, iconography, actions, bounded text, keyboard behavior, and screen-reader information should align.
12. Host-specific outer chrome or density may differ, but neither chat surface should omit metadata or controls, and the overall visual hierarchy and spacing should feel consistent.

## Expected

Issue and pull-request references provide compact, accurate, and actionable GitHub context in both the Agents Window and editor-shell Chat UI. Collection and direct-chip previews remain aligned, keyboard and screen-reader accessible, theme-aware, and usable at narrow widths.

Please include the affected surface, GitHub URL/current state, theme, viewport size, keyboard sequence, and a screenshot or short recording with any failure.

Contributor guide

Open the contributing guide

Research direction

Use an Insiders build containing #335583, open microsoft/vscode in an Agents Window, and run the exact add_artifact_or_reference prompt from Setup. Follow the Collections, keyboard/accessibility, single-reference, and editor-shell checks, comparing metadata with GitHub. Done means issue and pull-request previews are accurate, bounded, actionable, accessible, theme-aware, and aligned across both chat surfaces.

Written by the indexing model from the issue text.

Assessment

Tech stack
github, typescript
Domain
accessibility, frontend, testing
Issue type
Feature
Difficulty
2/5
Estimated time
Half a day
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.