skip to content
Andrei Calazans

React Native Weekly - W4 2022

/ 5 min read

react-native , react-native-weekly

Welcome to the 41st edition of React Native Weekly.

This week covers updates from January 18th to January 24th 2022.

Highlights

  • Fix Alert’s dismiss UI blocker bug
  • Fix RedBox displaying error with LogBox
  • Added menu to test-manual-e2e script
  • pointerEvents support on Android ScrollView

Improvements to MapBuffer

Andrei Shikov ashikov@fb.com introduced a few improvements like 1, 2, 3, 4 to the MapBuffer which is a data type for transferring props between C++ and other VMs.

Fix NPE in ScrollView due to JS error [Android]

Joshua Gross joshuagross@fb.com fixed a null expection error crash happening in the ScrollView that would happen a consequence of an error happening from JavaScript, this NPE would hide the real reason of the crash - the JS error.

Auto-label PR opened against release branches

Gabriel Donadel Dall’Agnol donadeldev@gmail.com added this life of quality improvement by using Danger, see the commit if you are interested on this works.

Fix Alert’s dismiss UI blocker [iOS]

Issue 32304 calls out an bug with IOS 15 runtime where dismissing the Alert blocked user interaction because the Alert’s underlying UIWindow was left behind after the dismissal.

For instance, calling Alert.alert as below than dismissing it.

    InteractionManager.runAfterInteractions(() => {
      Alert.alert('Delete this post?', 'Are you sure you want to permanently delete this?', [
        {
          text: 'Cancel',
          style: 'cancel',
        },
        {
          onPress: () => someFunction(),
          text: 'Delete',
          style: 'destructive',
        },
      ])
    })

Asaf Korem asaf.korem@gmail.com fixes the underlying method by using the appropriate API for dismissing: setHidden:YES

Fix hitSlop to be set with a single value [IOS]

Pieter De Baets pieterdb@fb.com fixed an iOS only issue where hitSlop was not set with a single value.

It was interesting to see how in Fabric this was already fixed because of the shared logic for all platforms.

Fix failure to reload App on JS bundle load error [Android]

Issue 32898 described an bug in Android’s dev environment where on connecting a JS bundle and having it fail the user would see a blank screen after reloading the JS bundle with the fix.

This commit by Sam Kline samkline@users.noreply.github.com fixes the issue by appropriately resetting ReactInstanceManager’s state when createReactContext has an issue - this allows it to correctly restart.

// Reset state and bail out. This lets us try again later.
+                  mHasStartedCreatingInitialContext = false;
+                  mCreateReactContextThread = null;

Fix RedBox displaying with LogBox on logged errors [IOS]

This commit by Liam Jones liam@stardive.co.uk fixes an issue where calling console.error caused the RedBox to appear alongside the LogBox.

Migrate ScreenshotManager from NativeModule to TurboModule in RNTester

Paige Sun paigesun@fb.com added a patch to migrate the ScreenshotManager to use its TurboModule version.

While this is a simple change, what caught my attention was her comment that states how in “Bridgeless” mode using NativeModules.<module> will throw an error, it made me wonder if this means that TurboModules are backwards compatible, maybe not?

Add platformConfig to the Animated API

Eric Rozell ericroz@fb.com added a way to pass an extra config object called platformConfig to the Animated API which can be helpful to optimize and experiment with different behaviors on different platforms, he gives the example of react-native-windows.

The ability to pass an additional property bag to further configure NativeAnimated is useful for a few reasons, e.g., experimentation with multiple implementations of the NativeAnimated module.

Remove Detox

Lorenzo Sciandra notkelset@kelset.dev removed Detox since was not being used in the core repo. At least for now until it is decided that it is needed again.

Add vendor/bundle into .gitignore template

Commit

Add menu to test-manual-e2e script

Gabriel Donadel Dall’Agnol donadeldev@gmail.com extended the test-manual-e2e script in the core repo to have a menu for you to choose which test you want to run. This script is specially useful to run things in the core repo like running the RNTester app or starting a template app.

Continue work on matching SVC and NVCs

Ramanpreet Nara ramanpreet@fb.com continued the work of making the Static View Configs match the Native View Configs and vice-versa. Learn more about this in last weeek’s post.

Fix race condition in Websocket’s implementation [IOS]

Michelle Laurenti asmeikal@me.com fixed an where a race condition caused the WebSocket frame payloads to be processed incorrectly.

According to the commit message:

This can cause errors on RFC6455 compliant WebSocket servers:

  • the server sends a ping frame with no payload
  • the server sends a text frame with a payload longer than 125 bytes
  • the client answers the ping with a pong frame echoing back the contents of the text frame This is caused by concurrent modification of the current frame contents, that is passed by reference to the handlers. The concurrent modification happens here.

Add pointerEvents prop support [Android]

With Xin Chen xch@fb.com patch, Android’s ScrollView now supports pointerEvents prop.

Updated doc to disable Fabric in the RNTester

Commit

Package Bumps

React Native H2 2021 Recap Blog

Nicola Corti wrote the H2 2021 recap where he mention the repo health, community contributions, the multi-platform vision, and how 2022 will the year of the new architecture roll out to OSS. One thing he stressed in this blog was the importance of community feedback to the new releases.

Community

Done

If you want to see more checkout the previous week’s posts here. Subscribe to get notified when new posts are out = )

Partners

  • TypeScript Weekly: The best TypeScript links every week, right in your inbox.
  • This Week In React: the best of React & React Native news. Sebastien filters the noise, and you save time!
  • ES.next News: learn about the latest in JavaScript and cross-platform tools.
  • Tailwind Weekly: all things Tailwind CSS, new issue every Saturday.