Skip to content

Commit cf7b020

Browse files
skahacknecolas
authored andcommitted
[fix] set textShadow if only blur and color provided
Mirrors a recent fix to React Native. Close #1182
1 parent 49edcb2 commit cf7b020

File tree

2 files changed

+7
-3
lines changed

2 files changed

+7
-3
lines changed

packages/react-native-web/src/exports/StyleSheet/__tests__/createReactDOMStyle-test.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -284,7 +284,10 @@ describe('StyleSheet/createReactDOMStyle', () => {
284284
});
285285

286286
test('textShadowColor and textShadowRadius only', () => {
287-
expect(createReactDOMStyle({ textShadowColor: 'red', textShadowRadius: 5 })).toEqual({});
287+
expect(createReactDOMStyle({ textShadowColor: 'red', textShadowRadius: 0 })).toEqual({});
288+
expect(createReactDOMStyle({ textShadowColor: 'red', textShadowRadius: 5 })).toEqual({
289+
textShadow: '0px 0px 5px rgba(255,0,0,1.00)'
290+
});
288291
});
289292

290293
test('textShadowColor, textShadowOffset, textShadowRadius', () => {

packages/react-native-web/src/exports/StyleSheet/createReactDOMStyle.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -106,12 +106,13 @@ const resolveTextDecoration = (resolvedStyle, style) => {
106106
const resolveTextShadow = (resolvedStyle, style) => {
107107
const { textShadowColor, textShadowOffset, textShadowRadius } = style;
108108
const { height, width } = textShadowOffset || defaultOffset;
109+
const radius = textShadowRadius || 0;
109110
const offsetX = normalizeValue(null, width);
110111
const offsetY = normalizeValue(null, height);
111-
const blurRadius = normalizeValue(null, textShadowRadius || 0);
112+
const blurRadius = normalizeValue(null, radius);
112113
const color = normalizeColor(textShadowColor);
113114

114-
if (color && (height !== 0 || width !== 0)) {
115+
if (color && (height !== 0 || width !== 0 || radius !== 0)) {
115116
resolvedStyle.textShadow = `${offsetX} ${offsetY} ${blurRadius} ${color}`;
116117
}
117118
};

0 commit comments

Comments
 (0)