Devtools for swift applications

[bolismauro]

Hi everyone,
First of all, this project is amazing :)

I'm one of the creators of a Swift version of React+Redux named Katana.

I'm planning to create a dev tools similar to this one but for Katana.
I was wondering if it is possible to avoid to create a brand new software and use instead this project.
I saw that React Native is supported too, so I guess that is should be doable. What do you think? Can you suggest to me some directions on how to approach the problem?

[zalmoxisus]

Hi and thanks for the interest!

Sure, AFAIK, there are integrations already with F#, Python, and Closure. So it's more than possible.

You just have to send data via sockets to remotedev-server and subscribe to messages (to interpret monitor actions).

I've posted a draft of the API you can follow. Basically, you need a client for socketcluster. You could adapt the one for Objective-C. Or write a similar one for Swift, which would be much appreciated by the community.

Let me know if you need any further information.

[bolismauro]

So basically I'd have

• Browser with the UI
• Remote/Local server that uses remotedev-server
• The app written in Swift

The app sends messages to the browser using sockets and the remote/local dev-server is used to a the "master server" for the socket connection. Is it correct?

[zalmoxisus]

Exactly. It can interact with Redux Extension or with other monitor apps listed here. All of them (including this extension) have remotedev-app as a core lib.

The bridge server (remotedev-server) can be started together with Webpack's dev server, from cli, or from the electron app.

[bolismauro]

Amazing, I'll take a look as soon as I have some free time :)

[bolismauro]

I'm trying to implement this in Objc (I'm using that library for now..)

socket.emit('login', 'master', (error, channelName) => {
  if (error) { console.log(error); return; }
  channel = socket.subscribe(channelName);
  channel.watch(handleMessages);
  socket.on(channelName, handleMessages);
});

    self.client = SCSocket.client()
    self.client.initWithHost("localhost", onPort: 8000, securely: false)
    self.client.delegate = self
    self.client.connect()

    let message = SCMessage.init(eventName: "login", andData: "master".data(using: .utf8))
    message.send(success: {
      print($0)
    }, withFail: {
      print($0)
    })

I've the remove-dev server running in my console

Test|⇒ node index.js
[RemoteDev] Start server...
--------------------------------------------------------------------------------

   [Busy] Launching SocketCluster
   [Active] SocketCluster started
            Version: 5.2.1
            Environment: dev
            WebSocket engine: uws
            Port: 8000
            Master PID: 82596
            Worker count: 1
            Broker count: 1

   [Done] Migrations are finished

But nothing happens.. I've also http://remotedev.io/local/ in a tab in my chrome

[zalmoxisus]

As far as I see, you didn't send anything to the monitor yet.

Whether you use http://remotedev.io/local/ or other app, you should click on Settings button and check Use custom local server (by default it uses remotedev.io).

Here's a simple snippet from NodeJS I've tried recently: zalmoxisus/remotedev-server#34 (comment). Unfortunately, I don't know much about ObjectiveC.

[zalmoxisus]

I guess we need more advanced logs for remotedev-server so you could see the connected clients and received messages right in the console.

[bolismauro]

Uhm yes, that would be useful.
I know for sure that there is a sort of connection because otherwise in the logs of the app I see errors.
Just to make sure I'm doing the right thing: I'm emitting a message "login" with data "master".
Is it correct?

[zalmoxisus]

Yes, right. You should get the channel name as a response.

[bolismauro]

It seems that the problem is the connection

print(self.client.getState() == SOCKET_STATE_CLOSED)

prints true (it is evaluated a couple of seconds after connect)

It is so weird

[zalmoxisus]

So, you get that error even with just

    self.client = SCSocket.client()
    self.client.initWithHost("localhost", onPort: 8000, securely: false)
    self.client.delegate = self
    self.client.connect()

Maybe @abpopov or @jondubois could tell if that lib can be used with socketcluster-server@5?

[bolismauro]

Alright I found the problem
the ws url has /socketcluster/ in the url and I didn't added it. Actually from the interface I haven't found a way. I've patched the project right now. There are some crashes but I'm solving them.
Let's see

EDIT: this one I don't know how to fix it :D
It seems that when I send a message I can only send dictionary data and not a string like you do with "master". This is weird

[zalmoxisus]

That's confusing indeed, added a note in zalmoxisus/remotedev-server@0c007bc.

[bolismauro]

Success!

For future reference

let message = SCMessage.init(eventName: "login", andData: ["data": "master"])

I'll continue to experiment. If it makes sense to use this monitor I think we will create a swift implementation of ws library
Many thanks for the help!

[bolismauro]

@zalmoxisus Your note (without patching the library as I did) leads to this URL

ws://localhost/socketcluster/:8000/?transport=websocket

Which doesn't work. I haven't found a way to create the proper url without changing the lib

[zalmoxisus]

Weird, according to the example from there, it should work.

[bolismauro]

It may be that I'm doing something wrong..

[jondubois]

Personally, I haven't used the native iOS client and I don't manage that repo.

@bolismauro Feel free to fork the repo and makes changes if there are any issues - Then I guess you can make a PR for @abpopov to review.

[bolismauro]

Hi.. I didn't have much time to work on this project.. But I finally managed to create a proof of concept :D
https://github.com/bolismauro/katanaMonitor-lib-swift

Thanks for your help guys :)

[zalmoxisus]

@bolismauro looks great. Feel free to submit a PR to add it to the integrations links.