App unresponsive/crashing when dispatch interaction state without corresponding state mapping

[arendlagendijk]

🐛 Bug Report

Dispatching an interaction state from a styled component that has no corresponding state mapping defined makes app unresponsive and finally results in a crash.

Looks the issue is caused by an infinite loop in withStyledProps method of StyleConsumerService. In case state mapping is missing for dispatched interaction state, the getGeneratedStyleMapping returns undefined, this makes the withStyledProps method calling itself but with same values for interaction param.

react-native-ui-kitten/src/components/theme/style/styleConsumer.service.ts

Line 63 in 0eeba5e

public withStyledProps<P extends object>(source: P,

To Reproduce

Steps to reproduce the behavior:

1. Create new app with UI Kitten 4 or 5
2. Create styled component with custom component mapping, include mapping definition for one state (e.g. focused)
3. Dispatch interaction state other then the mapped one (e.g. active).

Expected behavior

Dispatching an interaction state without a corresponding mapping shouldn't make app unresponsive nor crash. Non-mapped interaction state should be ignored during style calculation.

Link to runnable example or repository

https://github.com/arendlagendijk/uik-dispatch-nonmapped-interactionstate-issue

UI Kitten and Eva version

Package	Version
@eva-design/eva	1.4.0
@ui-kitten/components	4.4.1 / 5.0.0-alpha.1

Environment information

  System:
    OS: Windows 10 10.0.18362
    CPU: (8) x64 Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz
  Binaries:
    Node: 12.16.2 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
  npmPackages:
    react: ~16.9.0 => 16.9.0
    react-native: https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz => 0.61.4

[artyorsh]

@arendlagendijk thanks for reporting and giving a detailed description.
It looks like it's a super-minor for the library itself, because dispatching wrong states is a first of all a user issue. Is it blocking your app somehow?

Non-mapped interaction state should be ignored

Yes, and it's actually what it does for the other cases, giving you a warning and falling back to the default config. Seems like states is the part that couldn't be handled same way, so I guess it would be nice if we can handle it with an additional warning.

[arendlagendijk]

@artyorsh

It looks like it's a super-minor for the library itself, because dispatching wrong states is a first of all a user issue.

Agree, only debugging to find cause is quite hard when app goes into unresponsive state. That's the main reason to report the issue and to make the library even better of course.

Is it blocking your app somehow?

No it isn't, at least not after discovering what caused the issue. Just have to be careful when working on styles components and make sure mappings for dispatched states do exist.

Seems like states is the part that couldn't be handled same way, so I guess it would be nice if we can handle it with an additional warning.

Yes that would definitely do it. Checked the fix you implemented, works like a charm! Thanks.