Outline styles aren't parsed in React Native
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 65/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- javascript, react-native
- Domain
- mobile-dev
Research direction
Start with packages/react-strict-dom/src/native/css/isAllowedStyleKey.js around the outline-related logic, then compare it with the outline support statement in packages/website/docs/api/02-css/index.md. Check how version.experimental affects parsing in React Native 0.84. Done means outline styles either parse without that condition or the documentation clearly states the required experimental setup.
Written by the indexing model from the issue text.
Description
Describe the issue
The documentation states that outline* style props should be supported (and have built-in React Native support) - https://github.com/facebook/react-strict-dom/blob/05226645531de66ae8d0f06c48c10e0526dfd438/packages/website/docs/api/02-css/index.md?plain=1#L202-L205
In reality in React Native, they're properly parsed only if criteria for version.experimental are met: https://github.com/facebook/react-strict-dom/blob/05226645531de66ae8d0f06c48c10e0526dfd438/packages/react-strict-dom/src/native/css/isAllowedStyleKey.js#L170-L175
Expected behavior
outline* styles are correctly parsed as they're long-present functionality of RN (available since 0.77) or alternatively documentation provides correct information and specifies how to turn on the experimental support
Steps to reproduce
RSD version: 0.0.55
React Native version: 0.84.0
React version: 19.2.3
Browser: Google Chrome
- Define CSS styles using outline properties:
const styles = css.create({
test: {
outlineColor: "#000000",
outlineWidth: 1,
outlineStyle: "solid",
});
- Apply them to a component:
<html.div style={styles.test}>...</html.div>
-
Render the component in a React Native app and observe how the styles are rendered
-
(Optionally) console.log the resolved styles - the outline properties will be excluded
Test case
No response
Additional comments
No response
- Dominant language
- JavaScript
- Stars
- 3.6k
- Forks
- 206
- PR merge metrics
- No merged PRs in 30d
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.
More from react/react-strict-dom
-
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
react/react-strict-dom#465 · 2 comments ·
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
react/react-strict-dom#520 ·
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 35/100
react/react-strict-dom#505 · 2 reactions ·
-
bug
Difficulty 3/5 1-2 days Newbie friendliness 62/100
react/react-strict-dom#491 · 4 comments ·
-
Difficulty 3/5 1-2 days Newbie friendliness 45/100
react/react-strict-dom#482 · 1 comment ·
All issues in react/react-strict-dom
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
-
Difficulty 1/5 Under an hour Newbie friendliness 90/100
TheOdinProject/curriculum#31423 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
WGBH-MLA/dream-aapb#69 ·
-
Difficulty 1/5 1-3 hours Newbie friendliness 78/100
Mintplex-Labs/anything-llm#6490 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 86/100
openlayers/ol-cesium#1364 ·