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

TypeError: mentionUserString.replaceAll is not a function. After update to 5.18.1 #2253

Closed
1 of 5 tasks
hotaryuzaki opened this issue Oct 10, 2023 · 10 comments · Fixed by #2271
Closed
1 of 5 tasks

TypeError: mentionUserString.replaceAll is not a function. After update to 5.18.1 #2253

hotaryuzaki opened this issue Oct 10, 2023 · 10 comments · Fixed by #2271

Comments

@hotaryuzaki
Copy link

Issue

after update to 5.18.1 there is an error when open the chat home (channel list)

TypeError: mentionUserString.replaceAll is not a function. (In 'mentionUserString.replaceAll(/[.*+?^${}()|[\]\\]/g, '\\$&')', 'mentionUserString.replaceAll' is undefined)

then we downgraded to 5.16.0 and the issue was gone.

Steps to reproduce

update from 5.16.0 to 5.18.0

Environment

Click To Expand

package.json:

{
  "scripts": {
    "start": "expo start --dev-client",
    "restart": "expo start --dev-client --clear",
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "test": "node ./node_modules/jest/bin/jest.js --watchAll",
    "postinstall": "patch-package"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/samples": "2.1.1",
    "@expo/vector-icons": "^13.0.0",
    "@fawazahmed/react-native-read-more": "^3.0.2",
    "@gorhom/bottom-sheet": "^4.4.5",
    "@react-native-async-storage/async-storage": "~1.17.11",
    "@react-native-camera-roll/camera-roll": "^5.7.2",
    "@react-native-clipboard/clipboard": "^1.11.1",
    "@react-native-community/netinfo": "^9.3.7",
    "@react-native-firebase/analytics": "^18.3.2",
    "@react-native-firebase/app": "^18.3.2",
    "@react-native-firebase/messaging": "^18.3.2",
    "@react-native-google-signin/google-signin": "^9.0.2",
    "@react-native-picker/picker": "~2.4.8",
    "@react-native-seoul/masonry-list": "^1.4.1",
    "@react-navigation/bottom-tabs": "^6.5.7",
    "@react-navigation/native": "^6.1.6",
    "@react-navigation/native-stack": "^6.9.12",
    "@shopify/flash-list": "~1.4.0",
    "@stream-io/flat-list-mvcp": "^0.10.3",
    "@twotalltotems/react-native-otp-input": "^1.3.11",
    "axios": "^0.26.1",
    "date-fns": "^2.29.2",
    "deprecated-react-native-prop-types": "^4.0.0",
    "expo": "^48.0.20",
    "expo-asset": "~8.9.1",
    "expo-constants": "~14.2.1",
    "expo-font": "~11.1.1",
    "expo-image-manipulator": "~11.1.1",
    "expo-image-picker": "~14.1.1",
    "expo-linear-gradient": "~12.1.2",
    "expo-linking": "~4.0.1",
    "expo-location": "~15.1.1",
    "expo-media-library": "~15.2.3",
    "expo-print": "~12.2.1",
    "expo-splash-screen": "~0.18.1",
    "expo-status-bar": "~1.4.4",
    "expo-updates": "~0.16.3",
    "expo-web-browser": "~12.1.1",
    "firebase": "8.2.3",
    "immutability-helper": "^3.0.0",
    "native-base": "^3.4.25",
    "patch-package": "^6.5.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.71.4",
    "react-native-autocomplete-input": "^5.2.0",
    "react-native-calendars": "^1.1300.0",
    "react-native-collapsible": "^1.6.0",
    "react-native-collapsible-tab-view": "^6.2.1",
    "react-native-compressor": "^1.6.1",
    "react-native-countdown-component": "github:brambang/react-native-countdown-component#master",
    "react-native-device-info": "^0.26.1",
    "react-native-document-picker": "^8.1.3",
    "react-native-easy-grid": "^0.2.2",
    "react-native-fast-image": "^8.6.3",
    "react-native-fbsdk-next": "^11.2.1",
    "react-native-fit-image": "^1.5.4",
    "react-native-fs": "^2.20.0",
    "react-native-gesture-handler": "^2.9.0",
    "react-native-gifted-chat": "https://github.com/hotaryuzaki/react-native-gifted-chat.git",
    "react-native-global-props": "^1.1.5",
    "react-native-haptic-feedback": "^1.14.0",
    "react-native-highlight-words": "^1.0.1",
    "react-native-image-crop-picker": "^0.39.0",
    "react-native-image-picker": "^5.3.1",
    "react-native-image-resizer": "^1.4.5",
    "react-native-image-zoom-viewer": "^3.0.1",
    "react-native-in-app-review": "^3.2.2",
    "react-native-inviewport": "github:brambang/react-native-inviewport#master",
    "react-native-modal": "^13.0.1",
    "react-native-onesignal": "^4.5.0",
    "react-native-pager-view": "^6.2.1",
    "react-native-paper": "^5.10.1",
    "react-native-platform-touchable": "^1.1.1",
    "react-native-popup-menu": "^0.15.13",
    "react-native-progress": "^5.0.0",
    "react-native-reanimated": "^2.14.4",
    "react-native-reanimated-carousel": "^3.1.5",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "4.5.0",
    "react-native-screens": "~3.20.0",
    "react-native-set-soft-input-mode": "^1.1.0",
    "react-native-share": "^8.2.0",
    "react-native-shimmer-placeholder": "^2.0.9",
    "react-native-simple-radio-button": "github:brambang/react-native-simple-radio-button#master",
    "react-native-smooth-pincode-input": "^1.0.9",
    "react-native-snap-carousel": "^3.9.1",
    "react-native-sticky-parallax-header": "^0.4.2",
    "react-native-svg": "13.4.0",
    "react-native-timeline-flatlist": "^0.8.0",
    "react-native-uuid": "^2.0.1",
    "react-native-video": "^5.2.1",
    "react-native-web": "~0.18.7",
    "react-native-webview": "11.26.0",
    "react-native-youtube-iframe": "^2.2.1",
    "rn-fetch-blob": "^0.12.0",
    "socket.io-client": "^2.5.0",
    "stream-chat-react-native": "^5.16.0"
  },
  "devDependencies": {
    "@babel/core": "^7.19.3",
    "@babel/helper-get-function-arity": "^7.16.7",
    "babel-jest": "~25.2.6",
    "babel-plugin-transform-remove-console": "^6.9.4",
    "babel-preset-expo": "^9.3.0",
    "eslint": "^8.1.0",
    "jest": "^29.2.1",
    "jest-expo": "^48.0.2",
    "react-native-console-time-polyfill": "^1.2.3"
  },
  "private": true,
  "name": "expo-rn-upgrade39",
  "version": "1.0.0",
  "resolutions": {
    "native-base@^3.4.25": "patch:native-base@npm%3A3.4.28#./.yarn/patches/native-base-npm-3.4.28-a8ecceae4d.patch"
  }
}

react-native info output:

System:
    OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (12) x64 AMD Ryzen 5 3600 6-Core Processor
    Memory: 2.90 GB / 15.56 GB
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 18.9.0 - ~/.nvm/versions/node/v18.9.0/bin/node
    Yarn: 3.6.4 - ~/.nvm/versions/node/v18.9.0/bin/yarn
    npm: 8.19.1 - ~/.nvm/versions/node/v18.9.0/bin/npm
    Watchman: 20220123.190932.0 - /usr/local/bin/watchman
  SDKs:
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
  Languages:
    Java: 11.0.20.1 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.2.0 => 18.2.0 
    react-native: 0.71.4 => 0.71.4 
  npmGlobalPackages:
    *react-native*: Not Found
  • Platform that you're experiencing the issue on:
    • iOS
    • Android
    • iOS but have not tested behavior on Android
    • Android but have not tested behavior on iOS
    • Both
  • stream-chat-react-native version you're using that has this issue:
    • 5.18.1

@vishalnarkhede
Copy link
Contributor

hmm could be related to this PR - https://github.com/GetStream/stream-chat-react-native/pull/2229/files

But curious why won't replaceAll be available.

@hotaryuzaki hotaryuzaki changed the title [🐛] Bug Report Title - CHANGE ME TypeError: mentionUserString.replaceAll is not a function. After update to 5.18.1 Oct 10, 2023
@vishalnarkhede
Copy link
Contributor

vishalnarkhede commented Oct 10, 2023

@hotaryuzaki Could you try adding some .replaceAll function in your local environment (app), just to check if its available?

@hotaryuzaki
Copy link
Author

hmm could be related to this PR - https://github.com/GetStream/stream-chat-react-native/pull/2229/files

But curious why won't replaceAll be available.

oh you are right, that is from 5.18.0

i don't knows why replaceAll is not available, we are using node 18.
and we just upgraded to yarn 3.

@hotaryuzaki
Copy link
Author

@hotaryuzaki Could you try adding some .replaceAll function in your local environment (app), just to check if its available?

yes it would get the same error.
so, what is the issue??
we are still using V8 engine in react native, maybe because of this?

@vishalnarkhede
Copy link
Contributor

Yeah I am not sure. As far as I understand, all the js engines support this function. Do you see this error when you are debugging with chrome debugger? Or do you see it even when you disable debugger?

@vishalnarkhede
Copy link
Contributor

I am open to investigating more if we receive more complains about this. But here I would just recommend adding some polyfill to get unblocked - https://vanillajstoolkit.com/polyfills/stringreplaceall/

It could be some older version of js engine configured on native level, on your app (just a guess)

@hotaryuzaki
Copy link
Author

Yeah I am not sure. As far as I understand, all the js engines support this function. Do you see this error when you are debugging with chrome debugger? Or do you see it even when you disable debugger?

i'm not using any debugger tools, i just start it in CLI and open the debug app in the real phone.
maybe you should change to replace function with global regex, it works the same way with replaceAll

@rohanvasishth
Copy link

I am also facing this issue after upgrading but I can't downgrade as I need 5.1.8 to fix this issue: #2235

@vishalnarkhede
Copy link
Contributor

@rohanvasishth what was the version before upgrade?

@vishalnarkhede
Copy link
Contributor

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants