react-native-progress icon indicating copy to clipboard operation
react-native-progress copied to clipboard

[Android Only] Error while updating property 'd' in shadow node of type: ARTShape

Open kaueDM opened this issue 6 years ago • 5 comments

Description

I got the following error when i run my project in an Android device. Works as expected in iOS emulator.

Error while updating property 'd' in shadow node of type: ARTShape

Expected Behavior

While the timer runs the progress will be increased, like what happens in the iOS emulator running the same project.

Device

Moto G4 Plus, Android 7.0

Code

Component

<Progress.Circle
        size={200}
        direction="counter-clockwise"
        progress={this.state.percentage > 1 ? 1 : this.state.percentage}
        thickness={10}
        unfilledProgress="gray"
        color={this.state.elapsed <= this.props.initial ? "blue" : "red"}
 />

Initial state

state = {
        elapsed: 0,
        current: 0,
        percentage: 1, //min:0 max:1
        status: 'idle',
        interval: null,
        task: 'task_1', //test only
        user: 'user_1' //test only
    }

componentWillMount hook

componentWillMount() {
        this.props.getInitial(this.state.task);
        this.props.checkOpenTasks(this.state.task)
            .then((r) => {
                if (r.action === 'play') {
                    this.setState({ elapsed: r.extra, status: 'running' });
                    let interval = setInterval(this.calcProgress, 1000);
                    this.setState({ interval });
                } else {
                    const c = r.initial - r.elapsed;
                    this.setState({
                        elapsed: r.elapsed,
                        status: 'idle',
                        current: c < 0 ? c * -1 : c,
                        percentage: ((100 / (r.initial - 1000)) * r.elapsed) / 100
                    })
                }
            })
            .catch((e) => console.log(e));
    }

package.json

I'm using create-react-native-app

{
  "name": "code",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-native-scripts": "1.3.0",
    "jest-expo": "~20.0.0",
    "react-test-renderer": "16.0.0-alpha.12"
  },
  "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": "node node_modules/jest/bin/jest.js --watch"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/vector-icons": "^5.2.0",
    "expo": "^20.0.0",
    "firebase": "^4.3.1",
    "lodash": "^4.17.4",
    "moment": "^2.18.1",
    "native-base": "^2.3.1",
    "prop-types": "^15.5.10",
    "react": "16.0.0-alpha.12",
    "react-native": "^0.47.0",
    "react-native-circular-progress": "0.0.8",
    "react-native-progress": "^3.4.0",
    "react-native-simple-gauge": "^0.1.4",
    "react-navigation": "^1.0.0-beta.11",
    "redux-persist": "^4.9.1",
    "redux-thunk": "^2.2.0"
  }

kaueDM avatar Sep 13 '17 19:09 kaueDM

Getting the same here

jenni-divvito avatar Nov 03 '17 03:11 jenni-divvito

Getting the same issue when using data stored with persistStore. Works fine when data are not keep from one session to another.

alanlanglois avatar Dec 20 '17 11:12 alanlanglois

I've found the reason is probably that the component receives a NaN value, as it doesn't know how to draw it's progress path, it crashes.

KingDr avatar Dec 25 '17 01:12 KingDr

Also seeing this error.

Relevant debugger output:

props = {ReactStylesDiffMap@8656} "{ ReactStylesDiffMap: { NativeMap: {"d":[0,21,2.5,2,null,null]} } }"
t = {InvocationTargetException@8657} "java.lang.reflect.InvocationTargetException"
 target = {UnexpectedNativeTypeException@8680} "com.facebook.react.bridge.UnexpectedNativeTypeException: 
TypeError: expected dynamic type `double', but had type `null'"

adamski avatar Apr 27 '18 13:04 adamski

I also found this was due to the progress prop receiving NaN. I had to check it beforehand using isNaN(n) Would be good if this could be checked for in the component before it passes the value on.

adamski avatar Apr 27 '18 14:04 adamski