React-native: java.lang.String cannot be cast to com.facebook.react.uimanager.AccessibilityDelegateUtil$AccessibilityRole - on 0.57.3

[Ananlabs]

Environment

  React Native Environment Info:
    System:
      OS: Windows 10
      CPU: x64 Intel(R) Core(TM) i5-5200U CPU @ 2.20GHz
      Memory: 1.04 GB / 5.92 GB
    Binaries:
      Yarn: 1.10.1 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
      npm: 5.6.0 - C:\Program Files\nodejs\npm.CMD
    IDEs:
      Android Studio: Version  3.0.0.0 AI-171.4443003

Description

java.lang.String cannot be cast to com.facebook.react.uimanager.AccessibilityDelegateUtil$AccessibilityRole
setDelegate
    AccessibilityDelegateUtil.java:93
updateViewAccessibility
    BaseViewManager.java:260
onAfterUpdateTransaction
    BaseViewManager.java:266
updateProperties
    ViewManager.java:33
createView
    NativeViewHierarchyManager.java:269
execute
    UIViewOperationQueue.java:200
run
    UIViewOperationQueue.java:888
flushPendingBatches
    UIViewOperationQueue.java:1001
access$2400
    UIViewOperationQueue.java:46
doFrameGuarded
    UIViewOperationQueue.java:1061
doFrame
    GuardedFrameCallback.java:29
doFrame
    ReactChoreographer.java:134
doFrame
    ChoreographerCompat.java:105
run
    Choreographer.java:856
doCallbacks
    Choreographer.java:670
doFrame
    Choreographer.java:603
run
    Choreographer.java:844
handleCallback
    Handler.java:739
dispatchMessage
    Handler.java:95
loop
    Looper.java:148
main
    ActivityThread.java:5417
invoke
    Method.java
run
    ZygoteInit.java:726
main
    ZygoteInit.java:616

Dependencies

  "dependencies": {
    "axios": "^0.18.0",
    "native-base": "^2.8.1",
    "react": "16.6.0-alpha.8af6728",
    "react-native": "0.57.3",
    "react-navigation": "^2.18.0",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  }

[diggis00]

Same problem

[anastely]

Same !!

[hemadriDasari1990]

Same issue. Please find issue posted in SO

https://stackoverflow.com/questions/52784633/i-have-some-error-when-add-button-to-my-react-native-app?noredirect=1#comment92491686_52784633

[bwpAj]

Same !! Why ???????????????????????????????????????????
By the way ,Yesterday I had no problem with the following configuration.

{
  "name": "AwesomeProject",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.5.0",
    "react-native": "^0.57.3"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.48.1",
    "react-test-renderer": "16.5.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

[farisdewantoro]

same !! please fix it :(

[jiangpenggithub]

same!!!!!

[chornos13]

same!!!!!

[rago4]

Same here, in my case it occurs when I want to use <Button title="String" /> component.

Environment

  React Native Environment Info:
    System:
      OS: Windows 10
      CPU: x64 Intel(R) Core(TM) i5-7200U CPU @ 2.50GHz
      Memory: 1.22 GB / 7.88 GB
    Binaries:
      Yarn: 1.10.1 - C:\Program Files\nodejs\yarn.CMD
      npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
    IDEs:
      Android Studio: Version  3.2.0.0 AI-181.5540.7.32.5056338

[chornos13]

Okay, i take a look on source code Button, and AccessibilityRole is using string, maybe this code outdated
https://github.com/facebook/react-native/blob/bbb6a0754ce4173e24d3c0b46a5350ff2a8690d3/Libraries/Components/Button.js

maybe currently the type is needed is enum AccessibilityRole

https://github.com/facebook/react-native/blob/c5186aeb461a6eafa582b0acba1b3cebfb83550b/ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityDelegateUtil.java

so for you guys using component Button I suggest change to Touchable component.

[peat-psuwit]

Here come the reproduction repo, and a potential fix.

---

Environment

  React Native Environment Info:
    System:
      OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
      CPU: x64 Intel(R) Core(TM) i7-5500U CPU @ 2.40GHz
      Memory: 712.19 MB / 3.77 GB
      Shell: 4.4.19 - /bin/bash
    Binaries:
      Node: 8.12.0 - /usr/bin/node
      Yarn: 1.10.1 - /usr/bin/yarn
      npm: 6.4.1 - /usr/bin/npm
    SDKs:
      Android SDK:
        Build Tools: 25.0.1, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 27.0.3, 28.0.2, 28.0.3
        API Levels: 23, 25, 26, 27, 28
    npmPackages:
      react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728 
      react-native: 0.57.3 => 0.57.3 

Description

React native crash with the following (native) stack trace under Android:

Exception in native call
java.lang.ClassCastException: java.lang.String cannot be cast to com.facebook.react.uimanager.AccessibilityDelegateUtil$AccessibilityRole
  at com.facebook.react.uimanager.AccessibilityDelegateUtil.setDelegate(AccessibilityDelegateUtil.java:93)
  at com.facebook.react.uimanager.BaseViewManager.updateViewAccessibility(BaseViewManager.java:260)
  at com.facebook.react.uimanager.BaseViewManager.onAfterUpdateTransaction(BaseViewManager.java:266)
  at com.facebook.react.uimanager.ViewManager.updateProperties(ViewManager.java:33)
  at com.facebook.react.uimanager.NativeViewHierarchyManager.createView(NativeViewHierarchyManager.java:269)
  at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute(UIViewOperationQueue.java:200)
  at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.dispatchPendingNonBatchedOperations(UIViewOperationQueue.java:1085)
  at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1056)
  at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
  at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:134)
  at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:105)
  at android.view.Choreographer$CallbackRecord.run(Choreographer.java:909)
  at android.view.Choreographer.doCallbacks(Choreographer.java:723)
  at android.view.Choreographer.doFrame(Choreographer.java:655)
  at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:897)
  at android.os.Handler.handleCallback(Handler.java:789)
  at android.os.Handler.dispatchMessage(Handler.java:98)
  at android.os.Looper.loop(Looper.java:164)
  at android.app.ActivityThread.main(ActivityThread.java:6673)
  at java.lang.reflect.Method.invoke(Native Method)
  at com.android.internal.os.Zygote$MethodAndArgsCaller.run(Zygote.java:240)
  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:769)

Reproducible Demo

Build and run this application on Android: https://github.com/peat-psuwit/react-native-button-crash-demo

Additional info

From stack trace and git blame, I believe that 677f1de is the reason for the crash because I think the "cast" in the commit is not correct.

[peat-psuwit]

Turns out, it happens because incomplete cherry-pick from master. Branch 0.57-stable (which I believe is where 0.57.x releases are cut from) has d3f2f96 cherry-picked (which becomes 677f1de) along with a few accessibility commits without its pre-requisites, 139559f and 1f96ff6.

https://github.com/peat-psuwit/react-native/tree/0.57-stable_android-accessibility-role_v2 contains my attempt to cherry-pick those commits. I have to revert an incorrect attempt to "Update bad method", then cherry-pick 2 aforementioned commits. I've tested this branch with my reproduction repository in the previous comment and it doesn't crash. So, I guess that should fix this bug. However, I haven't run a full test yet. And I guess I'm not supposed to send a PR to a stable branch, am I?

[Dev-Manny]

Okay, i take a look on source code Button, and AccessibilityRole is using string, maybe this code outdated
https://github.com/facebook/react-native/blob/bbb6a0754ce4173e24d3c0b46a5350ff2a8690d3/Libraries/Components/Button.js

maybe currently the type is needed is enum AccessibilityRole

https://github.com/facebook/react-native/blob/c5186aeb461a6eafa582b0acba1b3cebfb83550b/ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityDelegateUtil.java

so for you guys using component Button I suggest change to Touchable component.

How do I go about the changes please?

[RevoluPowered]

@peat-psuwit "And I guess I'm not supposed to send a PR to a stable branch, am I?"
My two cents, I know this is bad practice, but something like a hot-fix should be fine to merge with master if the basic functionality / core is broken surely? (after testing ofc) - Git rules can be broken in some cases, if others agree.

Especially if a cherry pick messed up master I'd merge the fix only with master, nothing else.

I'm experiencing this issue too, please if you could, merge it asap as it would make me able to finish something I'm working on for work.

[RevoluPowered]

Temporary workaround found:
https://github.com/xotahal/react-native-material-ui/blob/master/docs/GettingStarted.md

https://github.com/xotahal/react-native-material-ui/blob/master/docs/Button.md

Just tested their buttons out and they work

[RedHotMan]

I was using a button component first, then I had this same issue.
I used Touchable Opacity component instead, and it works just fine.

[kelset]

Thanks @peat-psuwit for the detailed explanation, we'll cherry pick those two commits in the next 0.57.4 to fix this.

@grabbou I think this was related to your local commit https://github.com/facebook/react-native/commit/1592a8d42411d1f91c8ceb738c0533c1cee73f71, can you confirm? 🤔

[peat-psuwit]

@kelset It's simply that 1592a8d is duplicating a small amount of 1f96ff6. So, I just revert that commit to avoid conflict.

[doomsower]

While 0.57.4 is not released, could someone post a patch diff here, so people like me can monkey-patch 0.57.3 with patch-package?

[juliandik]

Same issue when adding title to Button.

[deslee]

Is there a way for me to locally roll back to an earlier version of the package to get past the error?

edit: https://stackoverflow.com/a/52796919/2152216 helped me roll back

[denisviklov]

here is workaround if have no time to wait when "ninjas" fix their odd work
1) delete your node_modules directory (rm -rf node_modules/)
2) npm i -S [email protected]
3) npm add @babel/runtime
4) npm i [email protected] --save-dev
5) npm i

[robbiedh]

Same issue

[talaikis]

here is workaround if have no time to wait when "ninjas" fix their odd work

Thanks, it works!

[rumax]

Same issue for project created with react-native init:

"dependencies": {
    "react": "16.6.0-alpha.8af6728",
    "react-native": "0.57.3"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.48.1",
    "react-test-renderer": "16.6.0-alpha.8af6728"
  },

[blattmann]

The workaround of @denisviklov was resolving my headache ;)
Thanks @denisviklov ! You made my day!

[ithustle]

We need the update 0.57.4 ...

[blattmann]

The workaround of @denisviklov was resolving my headache ;)
Thanks @denisviklov ! You made my day!

It was working for a short period of time, now I am facing the same issue again - with the previously working solution. It's super frustrating! I hope v0.57.4 is coming soon!!!

[ithustle]

Yeah ... RN is so instable ... RN dev spend more time fixing bugs than properly coding

[Biplovkumar]

same here in new app which is created by react native init.

[merbin2012]

I hate React Native now. The basic functionality is not working what the worst team, don't you know test before release?

What I tried

import React, { Component } from 'react';
import { Button } from 'react-native';

export default class NewApp extends Component {

  render() {
    return (
      <Button title="I am sample button" />
    );
  }
}

[gluons]

Same here. Try to upgrade react-native to 0.57.3 but see this error. Then I back to previous version. 😨

Hope fix will be landed soon. 😦

Sorry for notification to all subscribers 😅

[Biplovkumar]

thanks @denisviklov, really nice, its working.

[Biplovkumar]

@merbin2012 ,many errors in 0.57.3 so u need to downgrade 0.57.1

Ref :- https://stackoverflow.com/questions/52784633/i-have-some-error-when-add-button-to-my-react-native-app

Solution :-

1.delete your node_modules directory (rm -rf node_modules/)
2.npm i -S [email protected] or yarn add [email protected]
3.npm add @babel/runtime or yarn add @babel/runtime
4.npm i [email protected] --save-dev or yarn add [email protected] --save-dev
5.npm i or yarn

[RevoluPowered]

I agree with the others that: The library is not stable if the default template doesn't work.

My thoughts on this are it might be easier for stability the components are in their own repository too, and maybe it's an idea to write tests for all the components, to make sure running Renders something, then if the test fails the CI rejects the build from being merged with master. (it should prevent this happening in future too)

It would mean showstoppers, e.g. components not working could be patched quicker, than the run-time library or vice versa (hot-fixes) and the original developers could focus on making the basics work then fix the crash bugs in the run-time.

Right now: (these figures are rough estimates)
120 issues related to 'potential quick fix' component issues,
400~ relate to other stuff like the run-time errors which requires a lot of digging

It means that the open source community could focus on fixing lots of layout/components. Which could potentially mean less work for them, because JS developers can handle the non-native device side of things, without having the hassle of building the library. _this is very useful if you have multiple run-time versions (stable, testing and beta)_

I'd like react to sort this out as I think they're overwhelmed by all the issues they are having, it's actually an okay problem to have as it means their library is getting used.

I think writing tests for the CI should be a must especially when the default template doesn't work.

Just sharing my two cents here as it helped a lot back when I worked on collaborative development work.

Anyway, _thanks to the react team for actually releasing React Native,_ and I hope they get this sorted soon.

TL;DR: Write tests please for all the components and don't let a release be sent to clients without a pass, make sure there is a test for every example from the documentation (implementation based and coverage based testing). Perhaps seperate the components into their own repository too, to seperate layout problems vs runtime issues

Sorry for the wall of text 👍

[esipavicius]

Always new releases with bugs... From 0.55 to 0.56 I spend 5hours on Windows and decided move to Linux. After this worked ~1hour. Now from 0.56 to 0.57.3 i spend 3hours and downgraded to 0.57.1. So wtf is this? ;D

[kelset]

Ok this issue is clearly getting out of hand so I'll lock it.

We test the releases before rolling out, and I would like to remember everyone that this is an Open Source project. The first way you can fix things is by submitting PRs to resolve your issues or fork it.

You are entitled to the support that you pay for, and that's zero. Being harsh has only the effect of making feel bad the people that spend their free time helping with this project.

[gengjiawen]

0.57.5 fix this issue, please upgrade.