Invalid UIAccessibilitys 'tablist' error after installing react-native-vector-icons and running pod update on ios - ios

I tried to install react-native-vector-icons and ran pod update and got the following error:
https://i.stack.imgur.com/FcVr0.jpg
now this pops up but I can build and run the app just fine.
is this ok? and how can I fix this ?
after this started happening I unlinked react-native-vector-icons and uninstalled it
but for some reason I still get this error, now I tried debugging it and it seems to have some thing to do with "#react-navigation/bottom-tabs" package.
my package.json:
},
"dependencies": {
"#eva-design/eva": "^2.1.1",
"#react-navigation/bottom-tabs": "^6.2.0",
"#react-navigation/native": "^6.0.8",
"#react-navigation/native-stack": "^6.5.0",
"#ui-kitten/components": "^5.1.1",
"#viro-community/react-viro": "^2.20.2",
"react": "17.0.2",
"react-native": "0.65.1",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.11.1",
"react-native-svg": "^12.1.1",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"fsevents": "^2.3.2"
},
"devDependencies": {
"#babel/core": "^7.15.0",
"#babel/runtime": "^7.15.3",
"#react-native-community/eslint-config": "^3.0.0",
"babel-jest": "^27.0.6",
"eslint": "^7.32.0",
"jest": "^27.0.6",
"metro-react-native-babel-preset": "^0.66.2",
"react-native-codegen": "^0.0.7",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
would appreciate any help :)

I am facing the same issue. And I resolved it.
Go to node_modules -> #react-navigation -> bottom-tabs.
Find all accessibilityRole (in file BottomTabBar and BottomTabItem -> it is located at bottom-tabs/lib/commonjs/views and bottom-tabs/lib/module/views and bottom-tabs/src/views) and change it to none.
I changed accessibilityRole="tablist" to accessibilityRole="none"
And change accessibilityRole: Platform.select({ ios: 'button', default: 'tab' }) to accessibilityRole: Platform.select({ ios: 'button', default: 'none' })
This issue will be resolved. But when you install new package, you must do it again :))

This is definitely a problem with the built-in react-navigation tabs, but the issue went away when I created a custom tab bar.

Related

In my react native project, how do configure it to interpret jsi instead of jsc?

When trying to run the ios version of my react-native project I keep running into an
error. The error I keep getting is: /Users/me/Desktop/Popper/node_modules/react-native/ReactCommon/jsc/JSCRuntime.h /Users/me/Desktop/Popper/node_modules/react-native/ReactCommon/jsc/JSCRuntime.h: No such file or directory
The command I use to run ios is npx react-native run-ios
I have run it in xCode and it produces the same error.
When I go through that path, I notice that the JSCRuntime.h is located under a folder called jsi instead of jsc which does not exist. How do I reroute the builder to /jsi/JSCRuntime.h instead of /jsc/JSCRuntime.h?
My dependencies are the following:
"dependencies": {
"#react-native-async-storage/async-storage": "^1.17.11",
"#react-native-firebase/app": "^16.5.0",
"#react-native-firebase/auth": "^16.5.0",
"#react-native-firebase/firestore": "^16.5.0",
"#react-navigation/bottom-tabs": "^6.5.3",
"#react-navigation/material-top-tabs": "^6.5.2",
"#react-navigation/native": "^6.1.2",
"#react-navigation/native-stack": "^6.9.8",
"expo": "~47.0.9",
"expo-splash-screen": "~0.17.5",
"expo-status-bar": "~1.4.2",
"font-awesome": "^4.7.0",
"react": "18.1.0",
"react-native": "^0.70.5",
"react-native-onboarding-swiper": "^1.2.0",
"react-native-pager-view": "^6.1.2",
"react-native-safe-area-context": "^4.4.1",
"react-native-screens": "^3.19.0",
"react-native-tab-view": "^3.3.4",
"react-native-vector-icons": "^9.2.0",
"react-navigation": "^4.4.4"
},
When running the android version of my app, it compiles, builds, and runs properly. Furthermore, the project was generated using expo bare-minimum workflow.

Missing node module error even though it's installed on a webdriverio/electron project. (ts-node)

I cannot figure out why I am getting the below error. I'm trying to set up webdriver-io for an existing electron project.
node:internal/errors:465
ErrorCaptureStackTrace(err);
^
Error [ERR_MODULE_NOT_FOUND]: Cannot find module 'C:\Users\user\automation\product\src\product.client\
node_modules\ts-node\esm\transpile-only' imported from C:\Users\user\automation\product\src\product.client\
at new NodeError (node:internal/errors:372:5)
at finalizeResolution (node:internal/modules/esm/resolve:437:11)
at moduleResolve (node:internal/modules/esm/resolve:1009:10)
at defaultResolve (node:internal/modules/esm/resolve:1218:11)
at ESMLoader.resolve (node:internal/modules/esm/loader:580:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18)
at ESMLoader.import (node:internal/modules/esm/loader:380:22)
at initializeLoader (node:internal/process/esm_loader:74:49)
at loadESM (node:internal/process/esm_loader:87:11)
at runMainESM (node:internal/modules/run_main:51:21) {
code: 'ERR_MODULE_NOT_FOUND'
}
I have been through the google desert. Of course I understand it's not found. But I can't figure out why it's not found? ts-node is installed. My package.json is below:
"devDependencies": {
"#types/chalk": "^2.2.0",
"#types/chart.js": "^2.9.34",
"#types/command-line-args": "^5.0.0",
"#types/execa": "^2.0.0",
"#types/node": "^14.6.0",
"#types/request": "^2.48.7",
"#typescript-eslint/eslint-plugin": "^2.18.0",
"#typescript-eslint/parser": "^2.18.0",
"#wdio/cli": "^8.3.3",
"#wdio/devtools-service": "^7.16.14",
"chalk": "^4.1.0",
"command-line-args": "^5.1.1",
"cross-env": "^7.0.2",
"electron-chromedriver": "^13.0.0",
"electron-packager": "^15.2.0",
"electron-wix-msi": "^3.2.0",
"eslint": "^6.8.0",
"eslint-plugin-import": "^2.20.0",
"execa": "^4.0.3",
"rimraf": "^3.0.2",
"ts-node": "^8.10.2",
"typescript": "^4.9.5",
"wdio-electron-service": "^3.5.1",
"webdriverio": "^7.7.4",
"yarn-run-all": "^3.1.1"
},
"dependencies": {
"chart.js": "2.9.4",
"electron": "^23.0.0",
"react-number-format": "^4.8.0"
}
}
Can any kind soul help me figure out what it's looking for or how to get around it? I'm very frustrated.
I don’t know if you already figured it out or not but I had the exact same error and it was a problem with the version of ts-node. So basically install a newer version of ts-node the one I installed was 10+. Hope this helps.

React/RCTDefines.h file not found in RCTBridgeModule.h

I was using Expo and I separated expo eject for module use.
And I tried pod install in iOS file. it was work.
Pod installation complete! There are 51 dependencies from the Pod file
and 63 total pods installed.
But An error occurred when the Xcode was opened and the build and run button was pressed.
package.json:
{
"name": "testgame",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-cli": "6.26.0",
"babel-plugin-module-resolver": "^3.1.1",
"babel-preset-es2015": "6.24.1",
"jest-expo": "27.0.0",
"react-native-scripts": "1.14.0",
"react-test-renderer": "16.3.1"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "jest"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"#expo/vector-icons": "^8.1.0",
"bignumber.js": "^8.1.1",
"crypto-browserify": "^3.12.0",
"eth-lightwallet": "^3.0.1",
"ethereumjs-tx": "^1.3.7",
"ethereumjs-util": "^6.0.0",
"ethereumjs-wallet-react-native": "^0.6.7",
"expo": "^30.0.0",
"expokit": "^1.8.0",
"formik": "^1.3.2",
"js-sha3": "^0.8.0",
"native-base": "^2.8.2",
"node-libs-browser": "2.1.0",
"react": "16.3.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-30.0.0.tar.gz",
"react-native-confirmation-code-input": "^1.0.4",
"react-native-fast-crypto": "^1.8.1",
"react-native-fetch-blob": "git+https://github.com/HCL-HO/react-native-fetch-blob-expo.git",
"react-native-fs": "^2.13.3",
"react-native-keychain": "^3.1.2",
"react-native-pin-view": "^2.2.1",
"react-native-secure-randombytes": "^3.0.0",
"react-native-touch-id": "^4.4.1",
"react-navigation": "3.0.4",
"web3": "1.0.0-beta.34",
"yup": "^0.26.6"
}
}
Xcode Version: 10.2.1
I've never used Xcode before, so I'm a beginner. Please explain it in detail. I'd appreciate it if you could explain it with a screenshot.
I made a podsec myself and solved it.
This is not in the official document and requires a fundamental solution from the module developer.
This solution creates a lot of Warning. There's nothing wrong with the code.
Remove react-native-secure-randombytes path from Header Search Path
Unlink react-native-secure-randombytes module - react-native unlink react-native-secure-randombytes
Added react-native-secure-randombytes.podspec from this link
Added next code into pod file:
pod 'react-native-secure-randombytes', :path =>
'../node_modules/react-native-secure-randombytes'
do `pod install'

React Navigation - "Cannot read property 'State' of undefined" even though gesture-handler is installed & linked

Problem
I get the error "Cannot read property 'State' of undefined" when trying to use a stack navigator in React Navigation. Switch and bottomTabNavs are working perfectly fine.
If anyone knows how to solve this problem that would be amazing!
What I've tried
I've already checked to make sure react-native-gesture-handler is installed and linked properly.
My Package.json:
{
"name": "app",
"version": "5.1.0",
"private": true,
"devDependencies": {
"babel-jest": "23.6.0",
"fs-extra": "^6.0.1",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.49.2",
"react-test-renderer": "16.7.0",
"reactotron-react-native": "^3.2.0",
"replace-in-file": "^3.4.2"
},
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios --simulator=\"iPhone X\"",
"apk": "cd android && ./gradlew assembleRelease",
"rename": "node ./bin/rename.js",
"start": "react-native start",
"test": "jest"
},
"jest": {
"preset": "react-native"
},
"dependencies": {
"axios": "^0.18.0",
"lodash": "^4.17.11",
"react": "16.6.3",
"react-native": "0.58.0-rc.2",
"react-native-firebase": "^5.2.0",
"react-native-gesture-handler": "^1.1.0",
"react-native-rate": "^1.1.6",
"react-native-sensitive-info": "5.2.9",
"react-native-splash-screen": "^3.2.0",
"react-native-status-bar-height": "^2.3.1",
"react-native-table-component": "^1.2.0",
"react-navigation": "^3.3.2"
}
}
The issue was that the pod file was not installed even though react-native link indicated the package was successfully linked.
To solve the issue follow these steps:
cd ios
Pod install
Clean ios folder
Run application

Rails/Webpacker is not working

I have a Rails/React project. It's using Rails/webpack 3.3.0.
To precompile react code, I executed:
rails assets:precompile RAILS_ENV=development
But I am getting this error:
[Webpacker] Compilation failed:
(node:47256) DeprecationWarning: Tapable.apply is deprecated.
Call apply on the plugin directly instead (node:47256)
DeprecationWarning:
Tapable.plugin is deprecated. Use new API on .hooks instead
TypeError: dep.getResourceIdentifier is not a function
Is this something you faced before? Would you like to help me to fix thsi problem?
Here is my package.json
{
"dependencies": {
"#rails/webpacker": "3.3.0",
"babel-core": "6",
"babel-loader": "^7.1.4",
"babel-preset-react": "^6.24.1",
"caniuse-lite": "^1.0.3000697",
"classnames": "^2.2.5",
"coffee-loader": "^0.9.0",
"coffeescript": "^2.2.2",
"debounce": "^1.1.0",
"es6-shim": "^0.35.3",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"mobile-detect": "^1.4.1",
"prop-types": "^15.6.1",
"react": "16.0.0",
"react-addons-css-transition-group": "^16.0.0-alpha.3",
"react-addons-update": "^15.6.2",
"react-bootstrap": "^0.32.1",
"react-dom": "^16.2.0",
"react-dom-factories": "^1.0.2",
"react_ujs": "^2.4.4",
"uglifyjs-webpack-plugin": "^1.2.5",
"webpack": "4.0.0"
},
"devDependencies": {
"webpack-cli": "^2.0.15",
"webpack-dev-server": "^3.1.0"
},
"license": "UNLICENSED",
"private": true
}
The version of Webpacker you are using isn't compatible with Webpack 4.
However, it looks like support is close, Webpack 4.x support has been merged:
https://github.com/rails/webpacker/pull/1316
And there's a Webpacker 4.x preview release:
https://rubygems.org/gems/webpacker
So I believe you want to use Webpack 3.x for the time being, or go bleeding edge and try the prerelease.
With that said, I'm going to give the prerelease a go, I've been waiting for Webpack 4.x support!

Resources