DataDog / dd-sdk-reactnative

Datadog SDK for ReactNative
Apache License 2.0
122 stars 42 forks source link

Run Datadog on Xcode16 with react-native 0.67.5 #733

Open nunoliveira12 opened 1 month ago

nunoliveira12 commented 1 month ago

Stack trace

ReferenceError: Property 'BigInt' doesn't exist, js engine: hermes

Reproduction steps

Not able to run package version 2.3.6 on Xcode 16 made me install the new version.

After Installing latest version of dd-sdk-reactnative (2.4.4) I have errors of BigInt since I think (?) that RN <0.70 does not support it.

I have the errors as soon as I import anything from Datadog packages.

Volume

100

Affected SDK versions

2.4.4

Latest working SDK version

2.3.6

Does the crash manifest in the latest SDK version?

Yes

React Native Version

0.67.5

Package.json Contents

No response

iOS Setup

No response

Android Setup

No response

Device Information

No response

Other relevant information

No response

marco-saia-datadog commented 1 month ago

Hi @nunoliveira12,

We have introduced a polyfill for addressing this issue, but the current conditions for which it applies are not precise, and in some setups like yours the problem still occurs. We will introduce an official fix for this problem.

In the meantime, if this is a blocker for you, I believe you could use the following workaround:

1. Install patch-package and big-integer in your project.

2. Configure patch-package by adding this script to your package.json:

 "scripts": {
+  "postinstall": "patch-package"
 }

3. Create a folder named patches in your project root directory

4. Create a file ./patches/@datadog+mobile-react-native+2.4.4.patch with the following content:

diff --git a/node_modules/@datadog/mobile-react-native/src/polyfills.js b/node_modules/@datadog/mobile-react-native/src/polyfills.js
index 4391fe0..5204098 100644
--- a/node_modules/@datadog/mobile-react-native/src/polyfills.js
+++ b/node_modules/@datadog/mobile-react-native/src/polyfills.js
@@ -4,34 +4,4 @@
  * Copyright 2016-Present Datadog, Inc.
  */

-import { version as reactNativeVersion } from 'react-native/package.json';
-
-function applyBigIntPolyfill() {
-    const rnVersion = reactNativeVersion.split('.').map(Number);
-    const isRn63 = rnVersion[0] === 0 && rnVersion[1] === 63;
-
-    if (isRn63 && typeof BigInt === 'undefined') {
-        try {
-            // eslint-disable-next-line global-require, import/no-extraneous-dependencies
-            global.BigInt = require('big-integer');
-            console.warn(
-                'React Native 0.63 does not support BigInt, which is required starting from v2.4.0 of Datadog React Native SDK. ' +
-                    'The missing type has been polyfilled using `big-integer` to grant back-compatibility. ' +
-                    'We strongly suggest updating to a greater version of React Native (>= 0.64).'
-            );
-        } catch (e) {
-            if (e instanceof Error && e.code === 'MODULE_NOT_FOUND') {
-                throw new Error(
-                    'React Native 0.63 does not support BigInt, which is required starting from v2.4.0 of Datadog React Native SDK. ' +
-                        'We strongly suggest updating to a greater version of React Native (>= 0.64).\n\n' +
-                        'You can install `big-integer` to enable our polyfill that grants back-compatibility with RN 63:\n\n' +
-                        '`yarn add big-integer`\n\nOR\n\n`npm install --save big-integer`'
-                );
-            } else {
-                throw e;
-            }
-        }
-    }
-}
-
-applyBigIntPolyfill();
+global.BigInt = require('big-integer');

This should force the polyfill to always be applied, by explicitly and globally defining BigInt with the big-integer library.

Let me know if it works for you!

I will keep you posted on this matter, and notify you when the release with the fix is out.

Does that sound good to you? :)

nunoliveira12 commented 1 month ago

Hi @marco-saia-datadog , Thanks for the quick answer and the fix. I've tried myself adding the big-integer package, but was having some problems with it.

well, it did fix the problem, but now having the line:

config.firstPartyHosts =[...]

does break every request using fetch:

[Error: Invalid integer: NaN is not a valid exponent.]

I believe it is related with this as well and if I comment it it will work.

Also, even with that problem commented, I've tried to Archive the app and distribute it for testflight, just to see if it would work, but it does give me an error: Asset validation failed Invalid Executable. The executable 'x10.app/Frameworks/hermes.framework/hermes' contains bitcode. (ID: 0be0dc60-e610-43f7-af5d-454b2cf9fa57) I believe it is also somehow related with "big-integer" , since I could archive/run just before updating to 2.4.4 with your patch. Is there anything possible to fix this? Or just have to acknowledge I need to update the RN version for Datadog to work with Xcode16 ?

I might just downgrade XCode to 15.4, but would be nice to try to fix it

marco-saia-datadog commented 1 month ago

It would be helpful to see your package.json if you could share it here.

The second error seems to be unrelated, and actually caused by https://github.com/facebook/hermes/issues/1525.

With Xcode 16, Apple has deprecated bitcode for all platforms, meaning that builds with bitcode enabled are no longer accepted.

Xcode 16 was released in September 2024, while the RN version you are using is deprecated and was released 2 years ago.

You might have to implement a workaround to manually strip the bitcode or, if possible, I suggest upgrading your RN version to a recent supported version.

nunoliveira12 commented 1 month ago

Yes, I understand it is quite deprecated and probably migrating it to a new version would fix most of it. Either way, it is a somehow complex project using multiple native modules and that's why I'm delaying the migration for that reason.

I'll share the package.json to see if it can help on the first error regarding the requests / firstPartyHosts config.

Regarding the Xcode16 bitcode, I can see now that it might be a hard battle, better to update asap.

{
  "name": "",
  "version": "1.3.10",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "lint": "tslint -c tslint.json 'src/**/*.{ts,tsx}'",
    "doctor": "react-native doctor",
    "prettier": "prettier 'src/**/*.{js,jsx,tx,tsx,json,md,scss,yaml,yml,mdx}' --write",
    "postinstall": "yarn patch-package",
    "detox-prepare": "MY_APP_MODE=mocked yarn start",
    "detox-build": "detox build -c ios",
    "detox-test": "detox test -c ios",
    "bundle:android": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle",
    "release:android": "cd android && ./gradlew bundleRelease",
  },
  "dependencies": {
    "@codler/react-native-keyboard-aware-scroll-view": "^2.0.0",
    "@datadog/mobile-react-native": "2.4.4",
    "@datadog/mobile-react-navigation": "2.4.4",
    "@gorhom/bottom-sheet": "^4.6.3",
    "@haskkor/react-native-recaptchav3": "^1.2.1",
    "@invertase/react-native-apple-authentication": "^2.1.0",
    "@notifee/react-native": "^7.1.0",
    "@react-native-community/async-storage": "^1.6.2",
    "@react-native-community/masked-view": "^0.1.6",
    "@react-native-community/netinfo": "^9.3.0",
    "@react-native-firebase/analytics": "^17.4.3",
    "@react-native-firebase/app": "^17.4.3",
    "@react-native-firebase/crashlytics": "^17.4.3",
    "@react-native-firebase/messaging": "^17.4.3",
    "@react-native-firebase/perf": "^17.4.3",
    "@react-native-google-signin/google-signin": "^11.0.1",
    "@react-navigation/drawer": "^6.5.8",
    "@react-navigation/native": "^6.1.3",
    "@react-navigation/native-stack": "^6.9.9",
    "abab": "^2.0.4",
    "cbor-js": "^0.1.0",
    "compare-versions": "^6.1.1",
    "d3-array": "^2.8.0",
    "d3-time-format": "^3.0.0",
    "immer": "^9.0.6",
    "lodash": "^4.17.20",
    "lottie-ios": "^3.2.3",
    "lottie-react-native": "^4.1.3",
    "react": "17.0.2",
    "react-native": "0.67.5",
    "react-native-android-location-enabler": "^1.2.2",
    "react-native-ble-plx": "^2.0.3",
    "react-native-bluetooth-state-manager": "^1.3.4",
    "react-native-chart-kit": "6.6.1",
    "react-native-code-push": "^7.1.0",
    "react-native-device-info": "^10.13.1",
    "react-native-dropdown-picker": "^3.8.0",
    "react-native-geolocation-service": "^5.2.0",
    "react-native-gesture-handler": "^2.9.0",
    "react-native-launch-arguments": "^3.1.2",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-localize": "2.2.6",
    "react-native-markdown-display": "^5.1.0",
    "react-native-permissions": "^3.6.1",
    "react-native-progress": "^5.0.0",
    "react-native-reanimated": "^2.14.4",
    "react-native-redash": "^18.1.0",
    "react-native-round-flags": "^1.0.4",
    "react-native-safe-area-context": "^3.4.1",
    "react-native-screens": "3.32.0",
    "react-native-sensitive-info": "^6.0.0-alpha.9",
    "react-native-status-bar-height": "^2.6.0",
    "react-native-svg": "^13.7.0",
    "react-native-vector-icons": "^9.2.0",
    "react-native-version-check": "^3.4.7",
    "react-native-webview": "^11.23.1",
    "react-redux": "^7.2.1",
    "redux": "^4.1.1",
    "redux-persist": "^6.0.0",
    "redux-saga": "^1.1.3",
    "reselect": "^4.0.0",
    "rn-material-ui-textfield": "^1.0.2",
    "spacetime": "^6.10.0"
  },
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@babel/preset-typescript": "^7.15.0",
    "@babel/runtime": "^7.8.4",
    "@react-native-community/eslint-config": "^1.1.0",
    "@testing-library/jest-native": "^3.3.0",
    "@testing-library/react-native": "^7.0.2",
    "@types/d3-array": "^2.5.0",
    "@types/d3-time-format": "^3.0.0",
    "@types/jest": "^26.0.13",
    "@types/lodash": "^4.14.161",
    "@types/react": "^16.9.48",
    "@types/react-native": "^0.63.10",
    "@types/react-native-vector-icons": "^6.4.5",
    "@types/react-native-version-check": "^3.4.8",
    "@types/react-redux": "^7.1.4",
    "@types/react-test-renderer": "^16.9.3",
    "appcenter-cli": "^3.0.0",
    "babel-jest": "^26.3.0",
    "babel-plugin-inline-import": "^3.0.0",
    "babel-plugin-module-resolver": "^4.0.0",
    "babel-plugin-transform-inline-environment-variables": "^0.4.3",
    "babel-plugin-transform-remove-console": "^6.9.4",
    "detox": "^20.6.0",
    "eslint-plugin-detox": "^1.0.0",
    "jest": "^29.5.0",
    "jest-fetch-mock": "^3.0.3",
    "lint-staged": ">=8",
    "metro-react-native-babel-preset": "^0.59.0",
    "patch-package": "^6.4.7",
    "prettier": "^1.16.4",
    "react-native-codegen": "^0.0.8",
    "react-test-renderer": "16.13.1",
    "ts-jest": "^26.3.0",
    "tslint": "^5.13.1",
    "tslint-config-prettier": "^1.18.0",
    "tslint-react": "^4.1.0",
    "tslint-react-native": "^0.0.7",
    "typescript": "^4.0.2"
  },
  "lint-staged": {
    "*.{ts,tsx,js,css,json,md}": [
      "yarn prettier --write",
      "git add"
    ]
  }
}
uriStolar commented 1 month ago

Thanks for sharing this patch @marco-saia-datadog 👍🏼

JavanHuang commented 1 week ago

Hi!

My team encountered this issue as the react-native version we use on our project is currently at 0.69.12. There are upcoming plans to upgrade react-native to 0.72.x but we are planning to roll out the Datadog monitoring first before we upgrade react-native.

After 1-2 days of trying to figure out which version of @datadog/mobile-react-native still works with 0.69.12 of react-native, I found out that it's still compatible to 1.9.0 versions of @datadog/mobile-react-native, @datadog/mobile-react-native-code-push and @datadog/mobile-react-navigation.

[EDIT: Any versions above 1.9.0 paired together with react-native version 0.69.x doesn't really work on iOS due to this error: "Type 'UIApplication' does not conform to protocol 'UIKitAppBackgroundTaskCoordinator'"]

So if you're unable to wait for the fix, an suggestion would be to use 2.2.0 if the react-native version is below 0.70. However, I would also like to check on the timeline for the release of this fix as well if that is possible for your team.

Thank you once again for the patch-package solution also!