Skip to content

Pop-ups of Xaml controls need positioning and dismissal #15557

@sundaramramaswamy

Description

@sundaramramaswamy

Problem Description

In the Xaml-based Picker component example app we see that

  1. Scrolling the app window leads to drop-down list of the combo box showing with wrong offsets
  2. This issue can occur even without scrolling (init)
  3. Popups don't get soft dismissed upon mouse wheel scroll

These need to be fixed in RNW core for Xaml-based 3P modules to work well.

Steps To Reproduce

  1. Clone Picker Fabric PR
  2. Run app under //example
yarn install
cd example
yarn install
yarn react-native run-windows
  1. Scroll app window randomly
  2. Click on picker controls to see popup having random offset

Expected Results

Popups should show up at the centre of the parent control. If this isn't feasible -- parent control is at window border -- then at top/bottom edge of parent.

CLI version

20.0.0

Environment

System:
  OS: Windows 11 10.0.26200
  CPU: (12) arm64 Snapdragon(R) X 12-core X1E80100 @ 3.40 GHz
  Memory: 39.84 GB / 63.49 GB
Binaries:
  Node:
    version: 25.3.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 3.6.1
    path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
  npm:
    version: 11.6.2
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    AllowAllTrustedApps: Enabled
    Versions:
      - 10.0.19041.0
      - 10.0.22621.0
      - 10.0.26100.0
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 18.2.11408.102 (Visual Studio Enterprise 2026)
    - 17.14.36908.2 (Visual Studio Enterprise 2022)
Languages:
  Java: Not Found
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 20.0.0
    wanted: 20.0.0
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.81.5
    wanted: 0.81.5
  react-native-windows:
    installed: 0.0.0-canary.1020
    wanted: 0.0.0-canary.1020
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: false
  newArchEnabled: false
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Community Modules

Picker

Target React Native Architecture

New Architecture (WinAppSDK) Only

Target Platform Version

10.0.19041

Visual Studio Version

Visual Studio 2022

Build Configuration

None

Snack, code example, screenshot, or link to a repository

No response

Metadata

Metadata

Assignees

Labels

Needs: Triage 🔍New issue that needs to be reviewed by the issue management team (label applied by bot)bug

Type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions