Maya-Kai ( மாய கை )
A way to mirror gestures and user interactions in ReactNative applications. Useful for testing apps on devices with different screen sizes at the same time - just interact with one device and all other devices follow the interactions. Can also be used for recording and then replaying user interactions.
ReactNative uses React's EventPluginHub and this module adds an additional plugin to listen to events and send them to a server. The server broadcasts these events to all other connected clients, enabling mirroring of gestures.
Install the package using
npm install maya-kaiinside your ReactNative applications.If you are running React-Native@0.46, you may need to patch ReactNative. Run
node ./node_modules/maya-kai/patch.jsto expose the functions needed for listening to events.
_Server _- Start the server at port 8082 using
node_modules/.bin/maya-kai-server. Note that this server should be accessible to the device and you may need to do
adb reverse tcp:8082 tcp:8082for Android.
Client - Import and start this module in the ReactNative application's start file - like
- Start the ReactNative application on multiple devices. The application should now be able to connect to the server and start sending events.
API / Options
By default the server starts on localhost on port 8082, this can be changed by using the
node_modules/.bin/maya-kai-server -s myserver.com -p 8088
If the server is started on a different server or port, it can be passed to the ReactNative application using
The second parameter to
MK.start is an options object, that can takae the following keys
ignoredEvents: An array to
topLevelEventitems that should be ignored and NOT sent to other devices. By default,
topLayoutis ignored and not sent to other devices. To send ALL events, simply set
If you see a "Yellow BOX" warning on the ReactNative application, it means that the app was not able to connect to the Maya-Kai server. Check if you have run
adb reverse, or are able to access the server URL from a browser on the device.
Note that gesture sync between iOS and Android may be buggy since the internal implementation may not always create the exact Object tree and elements may not be present on one of the platforms.
This modules comes with a set of utilities
This is a client that lets you record and play back the gestures at a later time. To run this, start the server, add the client code to as described in the usage section. Start the ReactNative app.
node_modules/maya-kai/src/clients/record.js [_actions.log]. Perform actions on the ReactNative app and once you are done, hit
Ctrl+C on the
Then reload the ReactNative app and run
node_modules/maya-kai/src/clients/replay.js [_actions.log]. The replay process will read the actions and send them back to the application.
The echo client listens to events, and send them back to the same app after a 5 second delay. Can be used to test actions like counters, etc. Typically useful to see if the setup works.