WaveIndicator Android P (9.0) crash

[evan0204]

Android: 9.0 crash, other version: normal IOS: normal

code: <WaveIndicator color="white" waveMode="outline" />

error message: cannot set 'scaleX' to float.NaN

[sagargulati]

+1

[sagargulati]

@n4kz any help?

[shivanshrajpoot]

@n4kz please help with this!

[El-Sy]

I found the error at wave-indicator/index.js

     let waveStyle = {
      height: size,
      width: size,
      borderRadius: size / 2,
      borderWidth: fill? 0 : Math.floor(size / 20),
      [fill? 'backgroundColor' : 'borderColor']: color,
      transform: [{
        scale: progress.interpolate({
          inputRange: [0, 1 - Math.pow(waveFactor, index), 1],
          outputRange: [0, 0, 1],
        }),
      }],
      opacity: progress.interpolate({
        inputRange: [0, 1 - Math.pow(waveFactor, index), 1],
        outputRange: [1, 1, 0],
      }),
    };

Somehow for Android 9 the input range cannot have the value of 0 for the result of 1 - Math.pow(waveFactor, index). So my hackish solution is

   // for Android 9 value cannot be 0
    let scaleVariable = 1 - Math.pow(waveFactor, index)
    scaleVariable = scaleVariable === 0 ? 0.001 : scaleVariable

    let waveStyle = {
      height: size,
      width: size,
      borderRadius: size / 2,
      borderWidth: fill? 0 : Math.floor(size / 20),
      [fill? 'backgroundColor' : 'borderColor']: color,
      transform: [{
        scale: progress.interpolate({
          inputRange: [0, scaleVariable, 1],
          outputRange: [0, 0, 1],
        }),
      }],
      opacity: progress.interpolate({
        inputRange: [0, 1 - Math.pow(waveFactor, index), 1],
        outputRange: [1, 1, 0],
      }),
    };

[kristfal]

@El-Sy we're seeing this issue in production across a subset of devices running Android 9. We're not using this package, and likely the issue is related to our own code, but we haven't been able to reproduce internally on any Android 9 device yet.

There are similar issues in both RN packages and Xamarin for Android 9, so it would be super to get a bit more info on this and if possible bake in a guard in RN against this crash.

Got a few questions if you don't mind:

1) Any idea what subset of devices or Android 9 versions that are affected? 2) Exactly what is the cause of the crash? Is it having the following input array?:

[0, 0, X]

or is it the mapping the input array above to the output array of [0, 0, X]

Does any of the following setups crash?:

input: [0, 0]
output: [0, 0]

input: [0, 1]
output: [0, 0]

input: [1, 0]
output: [0, 0]

input: [0, 0, 1]
output: [0, 0, 1]

input: [1, 1, 0]
output: [1, 1, 0]

Any other patterns you've found?

[Iskander508]

I had the same issue in my custom-made component, but reading this report helped me to fix it. Reproduced on Huawei P20. The issue was with input array of type: [0,0,X]. Output array seems to not be a problem when it has equal values next to each other.

[yasir-netlinks]

@El-Sy I just want to thank you, I spent almost 2 days looking for this issue after updating API level to 28.0.3 , Im wondering when this package going to be updated ??

[n4kz]

Thanks for issue and sorry for delayed reply. I've released fix in 0.14.0.