Fork me on GitHub
#dirac
<
2018-02-25
>
tianshu16:02:37

@darwin Is it possible to use devtools or dirac in React Native development?

darwin16:02:20

it should be possible, but I’m not very familiar with that stack

darwin16:02:40

I tried it a few years back and in it was rough

tianshu16:02:25

just test devtools can work

tianshu16:02:08

devtools works, but dirac not.

tianshu16:02:47

looks like dirac use js/document

ReferenceError: document is not defined
    at Object.clojure.browser.repl.bootstrap.goog.writeScriptTag__ (repl.cljs?rel=1519577273852:149)
    at clojure.browser.repl.bootstrap.goog.writeScriptTag_ (repl.cljs?rel=1519577273852:165)
    at Object.goog.importScript_ (base.js:951)
    at Object.goog.writeScripts_ (base.js:1394)
    at goog.require (base.js:706)
    at figwheel-bridge.js:215
    at syncImportScripts (figwheel-bridge.js:134)
    at importJs (figwheel-bridge.js:148)
    at figwheel-bridge.js:210
    at syncImportScripts (figwheel-bridge.js:134)

tianshu16:02:19

however, this is not exist in react native.

darwin16:02:54

hmm, this callstack does not look like related to dirac

darwin16:02:07

it looks like figwheel

tianshu17:02:54

this is because to make figwheel work in react native there's a figwheel_bridge.js do a lot of shim work, so the error stack looks meaningless.

tianshu17:02:50

does dirac require the JS runtime which it works with, must be a browser environment?

darwin17:02:53

dirac can work with nodejs javascript environment for example

darwin17:02:31

^ this may be outdated, but it worked at some point

darwin17:02:20

I think you only need to instruct dirac to connect to javascript context in your React Native “shell”

darwin17:02:09

the problem could be that the shell has pretty old version, so the debugger protocol between dirac devtools (devtools) and shell does not match

darwin17:02:41

at least that was my problem when I tried it a few years ago, RN shell was 6+ months old

darwin17:02:21

because it was using electron-shell, which was behind

tianshu17:02:44

the shell stands for what?

tianshu17:02:05

some stuff run on the mobile?

darwin17:02:37

maybe terminology changed? I don’t know - back in the old days, electron-shell was that componet in electron which was wrapping chrome engine

tianshu17:02:34

that make sense

darwin17:02:15

electron is using it as “chrome engine”, it depends what version do you have

darwin17:02:44

you can easily detect it by asking for navigator.userAgent

darwin17:02:59

in javascript context inside your RN app

tianshu17:02:51

in react native, although you can open a devtool for logging and debugging, you can't evaluate javascript code, if you try to do alert, it will alert in the chrome, not the app. will this still be a problem for cljs repl, if dirac install success on RN?

tianshu17:02:45

the technology here looks really complex.

darwin17:02:24

I’m not surprised that alert shows in the browser instead of native app.

darwin17:02:48

I would guess you have to use RN-specific apis to affect state of your native app

darwin17:02:03

I’m sorry I have never used RN seriously. I cannot help here.

darwin17:02:40

In general you want run javascript context in your RN app with remote debugging enabled and then connect to it with dirac (running in your browser as extension). If both RN js context and dirac versions roughly match, then they should be able to talk and you should be able to issue cljs commands which will compile to javascript which exectutes in your RN js context. This will allow you to do everything javascript code can do in that context.,

tianshu17:02:13

okay, tomorrow i will try to use dirac without figwheel. maybe will get more useful information. and devtools satisfies me at this moment.

tianshu17:02:29

thanks for all the help!!

darwin17:02:36

good luck!