Akita: DevTools with React Native setup

Created on 23 May 2019  路  10Comments  路  Source: datorama/akita

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[x] Support request
[ ] Other... Please describe:

Current behavior

I build a sample application in ReactNative that mimics the behaviour outlined in this blogpost
https://engineering.datorama.com/oop-and-rxjs-managing-state-in-react-with-akita-de981e09307

I can add one item and my query properly downstreams the change, for some reason adding another item doesn't work. It just doesn't show up in the UI and I can see that the query isn't triggered at all.

I wanted to debug this problem by adding akita-ngdevtools, but I'm kinda stuck there. After intializing it in my App.tsx and starting a remote debugging session in my iOS simulator, I was expecting to see results in Chrome when debugging my application.

That's not the case, help very much appreciated.

Expected behavior

That I can somehow debug the React Native application and it's store.

Minimal reproduction of the problem with instructions

I can zip a sample project if that's needed.

What is the motivation / use case for changing the behavior?

Environment


"@datorama/akita": "^3.11.1",
"react": "16.8.3",
"react-native": "0.59.8",

Browser:
- [ ] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX

For Tooling issues:
- Node version: v10.15.0
- Platform: Mac

Others:

Most helpful comment

I have followed this article, and it works.

- brew update && brew cask install react-native-debugger
- open "rndebugger://set-debugger-loc?host=localhost&port=8081"
- cmd + d and Allow Remote JS Debugging

https://github.com/jhen0409/react-native-debugger/blob/master/docs/getting-started.md

All 10 comments

I'm not familiar with Reactive native. Can you share the code that doesn't work for you, please?

I got the code to work, store updates properly now, thanks for coming back to me so quickly.

The remaining question would be on how to use akita-ngdevtools with it, but I guess since you're not familiar with ReactNative you won't be able to help.

I guess it should be the same as using Redux dev-tools. We are using the same underline library.

That was my assumption too, interestingly it can't find a store when I open Redux Devtools in Chrome.

Can you save me some time and provide me with instructions to upload the app and investigate, please?

I uploaded a sample project, you can get it from
https://github.com/gekitz/react-native-akita-todo-sample

Is there anything else I can assist you with?

I will check it on Sunday, thanks.

image

I have followed this article, and it works.

- brew update && brew cask install react-native-debugger
- open "rndebugger://set-debugger-loc?host=localhost&port=8081"
- cmd + d and Allow Remote JS Debugging

https://github.com/jhen0409/react-native-debugger/blob/master/docs/getting-started.md

Awesome, thank you so much for your help. Seems like I used the wrong debugger 馃槥

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jvitor83 picture jvitor83  路  3Comments

adraax picture adraax  路  4Comments

eitanfr picture eitanfr  路  4Comments

stephencarr picture stephencarr  路  4Comments

NathanAlcantara picture NathanAlcantara  路  4Comments