microsoft / microsoft/react-native-windows
Hyperlink embedded into Text content does not render
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
Problem Description
Have a Text component with other components embedded into the text flow. A plain Text works, but anything else (like a hyperlink component) does not.
Steps To Reproduce
<Link url='https://platform.openai.com/account/api-keys' content='https://platform.openai.com/account/api-keys'/>
<Text style={styles.text}>
Get your API key at{' '}
<Link url='https://platform.openai.com/account/api-keys' content='https://platform.openai.com/account/api-keys'/>
{' '}and configure it using the settings menu (...) below.
</Text>
<Text style={styles.text}>
Get your API key at{' '}
<Text style={{ color: 'blue', textDecorationLine: 'underline' }}>https://platform.openai.com/account/api-keys</Text>
{' '}and configure it using the settings menu (...) below.
</Text>
<Text style={styles.text}>
Get your API key at{' '}
<View><Text style={{ color: 'blue', textDecorationLine: 'underline' }}>https://platform.openai.com/account/api-keys</Text></View>
{' '}and configure it using the settings menu (...) below.
</Text>
See how the embedded non-Text components occupy space (and can be clicked!) but do not render.
Expected Results
Embedded elements render.
CLI version
19.1.1
Environment
System:
OS: Windows 11 10.0.27944
CPU: "(24) x64 AMD Ryzen Threadripper PRO 3945WX 12-Cores "
Memory: 36.79 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.22621.0
- 10.0.26100.0
IDEs:
Android Studio: Not Found
Visual Studio:
- 17.14.36408.4 (Visual Studio Community 2022)
Languages:
Java: Not Found
Ruby: Not Found
npmPackages:
"@react-native-community/cli":
installed: 19.1.1
wanted: 19.1.1
react:
installed: 19.1.0
wanted: 19.1.0
react-native:
installed: 0.80.2
wanted: 0.80.2
react-native-windows:
installed: 0.80.0-preview.6
wanted: 0.80.0-preview.6
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Community Modules
None
Target React Native Architecture
New Architecture (WinAppSDK) Only
Target Platform Version
None
Visual Studio Version
None
Build Configuration
None
Snack, code example, screenshot, or link to a repository
https://github.com/chrisglein/artificial-chat/pull/171/files
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the issue with the Text and Link components in the provided example on React Native Windows 0.80.0 with the New Architecture enabled, then review the referenced artificial-chat pull request. Done means embedded non-Text elements render visibly within Text content while retaining their clickable behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- cpp, react-native
- Domain
- desktop, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100