microsoft / microsoft/react-native-windows

Modal displays at a much larger size than I'd expect.

Open
#14,805 3 comments 0 reactions 1 assignee View on GitHub

Nobody has claimed this yet.

Area: Modal bug
Dominant language
C++
Stars
17.3k
Forks
1.2k
Avg merge
1d 13h
Merged PRs (30d)
33

Description

Problem Description

When using Modal on RNW 0.79 the dialog shows but is way too big.

https://github.com/user-attachments/assets/96113a49-733e-45ea-989f-314bc1ff8af4

Steps To Reproduce

See repo link below.
Essentially use the newly supported Modal component as a replacement for using the old Popup component.

Expected Results

No response

CLI version

18.0.0

Environment
info Fetching system and libraries information...
System:
  OS: Windows 11 10.0.26432
  CPU: "(24) x64 AMD Ryzen Threadripper PRO 3945WX 12-Cores     "
  Memory: 36.10 GB / 63.86 GB
Binaries:
  Node:
    version: 18.18.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 1.22.19
    path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
  npm:
    version: 9.8.1
    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.22000.0
      - 10.0.22621.0
      - 10.0.26100.0
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 17.14.36119.2 (Visual Studio Community 2022)
Languages:
  Java: Not Found
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 18.0.0
    wanted: 18.0.0
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.79.0
    wanted: 0.79.0
  react-native-windows:
    installed: 0.79.0
    wanted: 0.79.0
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

info React Native v0.80.0 is now available (your project is running on v0.79.0).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.80.0
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.79.0&to=0.80.0
info For more info, check out "https://reactnative.dev/docs/upgrading?os=windows".
Community Modules

"dependencies": {
"@react-native-async-storage/async-storage": "^2.2.0",
"patch-package": "^6.5.1",
"react": "19.0.0",
"react-native": "0.79.0",
"react-native-markdown-display": "^7.0.0-alpha.2",
"react-native-syntax-highlighter": "^2.1.0",
"react-native-windows": "0.79.0"
},

Target React Native Architecture

New Architecture (WinAppSDK) Only

Target Platform Version

None

Visual Studio Version

Visual Studio 2022

Build Configuration

Release

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

https://github.com/chrisglein/artificial-chat/tree/fabricOn79

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.