[fix] Convert 'aspectRatio' style value to string

The RN value is a number and the CSS value must be a string.

Close #2038
This commit is contained in:
Petr Bela
2021-06-01 13:11:23 -06:00
committed by Nicolas Gallagher
parent 17d8b12299
commit 3a0cc734cb
4 changed files with 13 additions and 4 deletions
@@ -39,6 +39,12 @@ describe('StyleSheet/createReactDOMStyle', () => {
expect(createReactDOMStyle(style)).toMatchSnapshot();
});
test('aspectRatio', () => {
expect(createReactDOMStyle({ aspectRatio: 9 / 16 })).toEqual({
aspectRatio: '0.5625'
});
});
describe('flexbox styles', () => {
test('flex: -1', () => {
expect(createReactDOMStyle({ flex: -1 })).toEqual({
@@ -87,6 +87,11 @@ const createReactDOMStyle = (style) => {
break;
}
case 'aspectRatio': {
resolvedStyle[prop] = value.toString();
break;
}
// TODO: remove once this issue is fixed
// https://github.com/rofrischmann/inline-style-prefixer/issues/159
case 'backgroundClip': {
@@ -10,6 +10,7 @@
const unitlessNumbers = {
animationIterationCount: true,
aspectRatio: true,
borderImageOutset: true,
borderImageSlice: true,
borderImageWidth: true,
+1 -4
View File
@@ -154,6 +154,7 @@ export type LayoutStyles = {|
| 'stretch',
alignItems?: ?('baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch'),
alignSelf?: ?('auto' | 'baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch'),
aspectRatio?: ?number,
backfaceVisibility?: ?VisiblilityValue,
borderWidth?: ?DimensionValue,
borderBottomWidth?: ?DimensionValue,
@@ -216,10 +217,6 @@ export type LayoutStyles = {|
visibility?: ?VisiblilityValue,
width?: ?DimensionValue,
zIndex?: ?number,
/**
* @platform unsupported
*/
aspectRatio?: ?number,
/**
* @platform web
*/