Skip to content

Commit a8166bd

Browse files
mym0404facebook-github-bot
authored andcommitted
Fix crash by conditional value of aspectRatio style value (#35858) (#35859)
Summary: fix #35858 ## Changelog 1. Handle not `number` | `string` value passed to `aspectRatio` 2. Add some tests <!-- Help reviewers and the release process by writing your own changelog entry. Pick one each for the category and type tags: [GENERAL] [FIXED] - Message For more details, see: https://reactnative.dev/contributing/changelogs-in-pull-requests --> Pull Request resolved: #35859 Test Plan: ## Sample [Sample Repository](https://github.com/mym0404/rn-aspect-ratio-crash-sample) Video ![1](https://user-images.githubusercontent.com/33388801/212956921-94b21cda-d841-4588-a05a-d604a82e204c.gif) Reviewed By: necolas Differential Revision: D42575942 Pulled By: NickGerleman fbshipit-source-id: 2f7f46e6e3af85146e4042057477cb6d63b3b279
1 parent 4628150 commit a8166bd

File tree

3 files changed

+35
-5
lines changed

3 files changed

+35
-5
lines changed
Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,13 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`processAspectRatio should not accept invalid formats 1`] = `"aspectRatio must either be a number, a ratio or \`auto\`. You passed: 0a"`;
3+
exports[`processAspectRatio should not accept invalid formats 1`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: 0a"`;
44

5-
exports[`processAspectRatio should not accept invalid formats 2`] = `"aspectRatio must either be a number, a ratio or \`auto\`. You passed: 1 / 1 1"`;
5+
exports[`processAspectRatio should not accept invalid formats 2`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: 1 / 1 1"`;
66

7-
exports[`processAspectRatio should not accept invalid formats 3`] = `"aspectRatio must either be a number, a ratio or \`auto\`. You passed: auto 1/1"`;
7+
exports[`processAspectRatio should not accept invalid formats 3`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: auto 1/1"`;
8+
9+
exports[`processAspectRatio should not accept non string truthy types 1`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: function () {}"`;
10+
11+
exports[`processAspectRatio should not accept non string truthy types 2`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: 1,2,3"`;
12+
13+
exports[`processAspectRatio should not accept non string truthy types 3`] = `"aspectRatio must either be a number, a ratio string or \`auto\`. You passed: [object Object]"`;

Libraries/StyleSheet/__tests__/processAspectRatio-test.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,4 +47,18 @@ describe('processAspectRatio', () => {
4747
expect(() => processAspectRatio('1 / 1 1')).toThrowErrorMatchingSnapshot();
4848
expect(() => processAspectRatio('auto 1/1')).toThrowErrorMatchingSnapshot();
4949
});
50+
51+
it('should ignore non string falsy types', () => {
52+
const invalidThings = [undefined, null, false];
53+
invalidThings.forEach(thing => {
54+
expect(processAspectRatio(thing)).toBe(undefined);
55+
});
56+
});
57+
58+
it('should not accept non string truthy types', () => {
59+
const invalidThings = [() => {}, [1, 2, 3], {}];
60+
invalidThings.forEach(thing => {
61+
expect(() => processAspectRatio(thing)).toThrowErrorMatchingSnapshot();
62+
});
63+
});
5064
});

Libraries/StyleSheet/processAspectRatio.js

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,20 @@
1212

1313
const invariant = require('invariant');
1414

15-
function processAspectRatio(aspectRatio: number | string): ?number {
15+
function processAspectRatio(aspectRatio?: number | string): ?number {
1616
if (typeof aspectRatio === 'number') {
1717
return aspectRatio;
1818
}
19+
if (typeof aspectRatio !== 'string') {
20+
if (__DEV__) {
21+
invariant(
22+
!aspectRatio,
23+
'aspectRatio must either be a number, a ratio string or `auto`. You passed: %s',
24+
aspectRatio,
25+
);
26+
}
27+
return;
28+
}
1929

2030
const matches = aspectRatio.split('/').map(s => s.trim());
2131

@@ -34,7 +44,7 @@ function processAspectRatio(aspectRatio: number | string): ?number {
3444
if (__DEV__) {
3545
invariant(
3646
!hasNonNumericValues && (matches.length === 1 || matches.length === 2),
37-
'aspectRatio must either be a number, a ratio or `auto`. You passed: %s',
47+
'aspectRatio must either be a number, a ratio string or `auto`. You passed: %s',
3848
aspectRatio,
3949
);
4050
}

0 commit comments

Comments
 (0)