Repository navigation
Make DevTools property headers expandable and announce current values - #1178
Chiara Mooney (chiaramooney) wants to merge 4 commits into
Conversation
Chiara Mooney (chiaramooney)
added
the
agent-preparing
There was a problem hiding this comment.
🔵 Needs a closer look
Successful live desktop verification is still needed to confirm the central pointer, keyboard, focus, and accessibility behavior.
No open issues 🎉
What changed in this PR
This PR makes DevTools property headers a single expandable control and includes the displayed value in their accessible names, addressing #1156 and #1154.
Changes:
- Replaces separate header buttons with a WinUI Expander, keeping editors outside the toggle area.
- Updates accessible names after edits and live property changes while preserving AutomationIds.
- Adds interaction and accessibility checks, documents keyboard navigation, and splits generated XAML literals for VS2022 compatibility.
| File | Description |
|---|---|
| src/winapp-devtools/test/window-runtime-tests.cpp | Tests value announcements, stable identities, and expansion state. |
| src/winapp-devtools/test/toolbar-tests.cpp | Updates layout and read-only editor assertions. |
| src/winapp-devtools/native/WinApp.DevTools.Native/xaml-window/window-shell.xaml | Introduces the full-width Expander header and simplifies content padding. |
| src/winapp-devtools/native/WinApp.DevTools.Native/DevToolsWindow.PaneRows.inc | Handles expansion events and synchronizes saved state. |
| src/winapp-devtools/native/WinApp.DevTools.Native/DevToolsWindow.LiveProps.inc | Refreshes accessible header names on live changes. |
| src/winapp-devtools/native/WinApp.DevTools.Native/DevToolsWindow.Expansion.inc | Refreshes names after commits and removes automatic editor focus. |
| src/winapp-devtools/native/WinApp.DevTools.Native/DevToolsWindow.Editors.inc | Builds value-aware accessible names and registers expansion handlers. |
| src/winapp-devtools/gen-xaml-resources.ps1 | Emits bounded C++ literals and tests their round-trip content. |
| scripts/test-e2e-winui-ui.ps1 | Checks accessible names after live Height changes. |
| scripts/test-devtools-binding-owners.ps1 | Adds desktop pointer, keyboard, focus, and editing checks. |
| docs/guides/devtools.md | Documents header expansion and keyboard navigation. |
Review effort: Balanced
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com> Copilot-Session: c32ad7f9-745f-4dc4-ba1a-f5fdfff52ea3
Build Metrics ReportValidation did not pass. Artifacts were uploaded before validation finished; check the workflow run before using them. Binary Sizes
.NET Test Results (TRX reports)Other suites are reflected in the overall validation status above. ✅ 10669 passed, 43 skipped out of 10712 tests in 2090.4s (+36.1s vs. baseline) Test Coverage✅ 87.4% line coverage, 81.5% branch coverage · ✅ no change vs. baseline CLI Startup Time54ms median (x64, Try This BuildInstalls the MSIX for your architecture, replacing any previously installed build. Needs the GitHub CLI — the command offers to install it and sign you in if it is missing. & ([scriptblock]::Create((irm https://raw.githubusercontent.com/microsoft/winappCli/main/scripts/winapp-pr.ps1))) 1178Switching between builds often?Put the tool on your PATH once: & ([scriptblock]::Create((irm https://raw.githubusercontent.com/microsoft/winappCli/main/scripts/winapp-pr.ps1))) -AddToPathThen this build is just: winapp-pr 1178Run Updated 2026-10-23 22:03:19 UTC · commit |
What and why
Click anywhere on a DevTools property header to expand or collapse its editor and details. The header uses the standard WinUI Expander, with one Tab stop, Enter/Space support, and an accessible expanded/collapsed state. Expanded content has 8 pixels of padding without the old inner blue bar or shaded frame.
Accessible names now include the displayed value, for example
Height, Auto, and update after edits and live property changes. Existing AutomationIds remain unchanged.Fixes #1156
Fixes #1154
Before / after
Before (reported in the issues): the value and chevron are separate click targets. A property displaying
Height Autohas a focused value button namedHeight value.After (observed in a disposable WinUI app on ARM64 Windows): clicking the property name, value, empty header space, or chevron expands and collapses the row. Tab/Shift+Tab finds one header target, Enter/Space toggles it, and Tab enters its editors. Editing leaves the row expanded.
Actual UI Automation observations from
winapp ui get-property "Opacity value" -w <inspector-hwnd> --json:Height names followed
Height, Auto->Height, 120->Height, Auto. Empty text announcedText, (empty). Expanded-state screenshots were inspected locally to confirm padding and the absence of the old inner blue frame; no baseline screenshot is available for a paired comparison.Not tested / risks
Actual Narrator speech, High Contrast, and the full CLI/sample suites were not tested locally. Live checks ran on ARM64 Windows. Latest-head CI is pending after correcting the desktop test's click coordinates for WinUI's clipped-content bounds.
Checklist
plugins/winapp/skills/updated if user-facing behavior changedNotes for reviewers
The generator emits adjacent bounded C++ string literals so the embedded XAML builds with VS2022. A collapsed WinUI Expander can report bounds that include clipped content above the visible header; the desktop test targets the visible header and checks compact sizing before its first expansion.
Local validation:
.\scripts\build-cli.ps1 -SkipAll: passed for x64 and ARM64 atf017308b; the subsequent commit changes only desktop test geometry. Packaging and full test suites skipped.$env:CL='/wd4127'; .\scripts\test-native-units.ps1 -VcVars 'C:\Program Files (x86)\Microsoft Visual Studio\2022\BuildTools\VC\Auxiliary\Build\vcvarsamd64_arm64.bat': passed before the main-branch merge. The process-local suppression covers existing constant-condition warnings in unchanged code..\src\winapp-devtools\test\bin\window-runtime-tests.exe: passed, 112 checks, before the padding-only XAML/assertion change and main-branch merge..\src\winapp-devtools\gen-xaml-resources.ps1 -SelfTest: passed before the main-branch merge.git -c core.whitespace=blank-at-eol,blank-at-eof,space-before-tab,cr-at-eol diff --check: passed.