Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix createAnimatedStyle when providing undefined transform style #41176

Conversation

gabrieldonadel
Copy link
Collaborator

Summary:

#35198 introduced a regression where if an {transform: undefined} style is provided to an Animated View a Cannot read property 'map' of undefined type error is thrown

Changelog:

[GENERAL] [FIXED] - Fix createAnimatedStyle when providing an undefined transform style

Test Plan:

Render an `Animated.View` passing `style={{transform: undefined}}`

E.g.

const UndefinedTransform = () => {
  return (
    <View>
      <Animated.View style={{transform: undefined}} />
    </View>
  );
}; 

RNTester

  1. Open the RNTester app and navigate to the Animated page
  2. Navigate to the Transform Styles page
  3. App should not throw any errors
BeforeAfter
Screen.Recording.2023-10-24.at.14.29.12.mov
Screen.Recording.2023-10-24.at.14.30.30.mov

@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. p: Expo Partner: Expo Partner Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. labels Oct 24, 2023
@facebook-github-bot
Copy link
Contributor

@javache has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@github-actions
Copy link

This pull request was successfully merged by @gabrieldonadel in 7e26e02.

When will my fix make it into a release? | Upcoming Releases

@github-actions github-actions bot added the Merged This PR has been merged. label Oct 25, 2023
@gabrieldonadel gabrieldonadel deleted the fix-create-animated-style-transform-undefined branch October 25, 2023 13:42
Othinn pushed a commit to Othinn/react-native that referenced this pull request Oct 30, 2023
…acebook#41176)

Summary:
facebook#35198 introduced a regression where if an `{transform: undefined}` style is provided to an Animated View a `Cannot read property 'map' of undefined` type error is thrown

<img src="https://github.com/facebook/react-native/assets/11707729/bb87781e-1ba7-40ec-879d-a57cef3e10d9" height="200" />

## Changelog:

[GENERAL] [FIXED] - Fix `createAnimatedStyle` when providing an undefined transform style

Pull Request resolved: facebook#41176

Test Plan:
<details>
  <summary>Render an `Animated.View` passing `style={{transform: undefined}}`</summary>

E.g.

```
const UndefinedTransform = () => {
  return (
    <View>
      <Animated.View style={{transform: undefined}} />
    </View>
  );
};
```
</details>

### RNTester
1. Open the RNTester app and navigate to the Animated page
2. Navigate to the Transform Styles page
3. App should not throw any errors

<table>
    <tr><th>Before</th><th>After</th></tr>
    <tr>
        <td><video src="https://github.com/facebook/react-native/assets/11707729/92ba9c3b-60b0-4805-8080-0e7fb7c00345"/></td>
        <td><video src="https://github.com/facebook/react-native/assets/11707729/80e2bba8-6ff6-4cf5-bcb8-26de0b869036"/></td>
    </tr>
</table>

Reviewed By: fabriziocucci

Differential Revision: D50638415

Pulled By: javache

fbshipit-source-id: 0ee949f019a77b8bef557888694e0e8404810105
lunaleaps pushed a commit that referenced this pull request Nov 3, 2023
…41176)

Summary:
#35198 introduced a regression where if an `{transform: undefined}` style is provided to an Animated View a `Cannot read property 'map' of undefined` type error is thrown

<img src="https://github.com/facebook/react-native/assets/11707729/bb87781e-1ba7-40ec-879d-a57cef3e10d9" height="200" />

## Changelog:

[GENERAL] [FIXED] - Fix `createAnimatedStyle` when providing an undefined transform style

Pull Request resolved: #41176

Test Plan:
<details>
  <summary>Render an `Animated.View` passing `style={{transform: undefined}}`</summary>

E.g.

```
const UndefinedTransform = () => {
  return (
    <View>
      <Animated.View style={{transform: undefined}} />
    </View>
  );
};
```
</details>

### RNTester
1. Open the RNTester app and navigate to the Animated page
2. Navigate to the Transform Styles page
3. App should not throw any errors

<table>
    <tr><th>Before</th><th>After</th></tr>
    <tr>
        <td><video src="https://github.com/facebook/react-native/assets/11707729/92ba9c3b-60b0-4805-8080-0e7fb7c00345"/></td>
        <td><video src="https://github.com/facebook/react-native/assets/11707729/80e2bba8-6ff6-4cf5-bcb8-26de0b869036"/></td>
    </tr>
</table>

Reviewed By: fabriziocucci

Differential Revision: D50638415

Pulled By: javache

fbshipit-source-id: 0ee949f019a77b8bef557888694e0e8404810105
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged. p: Expo Partner: Expo Partner Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants