React Native Android Module doesn't work

Question

I'm trying to run a background service in React-Native. From what I've heard I need to write it in native Java and connect it to the react-native code. I made a module and it throws no error, but it does nothing. I have tried changing my code to display a simple toast and it didn't even do that. Here's the code:

Service:

public class TestService extends Service {

double distance = 0.0;

@Override
public int onStartCommand(Intent intent, int flags, int startId) {

    Toast.makeText(getApplicationContext(), "Service started...", Toast.LENGTH_SHORT).show();
    final ReactContext reactContext = new ReactContext(getApplicationContext());
    new Timer().scheduleAtFixedRate(new TimerTask(){
        @Override
        public void run(){
            WritableMap params = Arguments.createMap();
            distance+= 0.7;
            params.putDouble("distance", distance);
            sendEvent(reactContext, "updateDistance", params);
        }
    },0,1000);
    return START_STICKY;
}

private void sendEvent(ReactContext reactContext, String eventName, @Nullable WritableMap params) {
    reactContext.getJSModule(DeviceEventManagerModule
            .RCTDeviceEventEmitter.class)
            .emit(eventName, params);
}

@Nullable
@Override
public IBinder onBind(Intent intent) {
    return null;
}
}

Module:

public class ServiceModule extends ReactContextBaseJavaModule {
ReactContext reactContext;

public ServiceModule(ReactApplicationContext reactContext) {
    super(reactContext);
    this.reactContext = reactContext;
}

@ReactMethod
public void startTrackingService() {
    Intent intent = new Intent(reactContext, TestService.class);
    reactContext.startService(intent);
    Toast.makeText(getReactApplicationContext(), "Starting service...", Toast.LENGTH_SHORT).show();
}

@Override
public String getName() {
    return "ServiceModule";
}
}

Package:

public class ServicePackage implements ReactPackage {
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
    List<NativeModule> modules = new ArrayList<>();
    modules.add(new ServiceModule(reactContext));
    return modules;
}

@Override
public List<Class<? extends JavaScriptModule>> createJSModules() {
    return Collections.emptyList();
}

@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
    return Collections.emptyList();
}
}

in MainApplication:

@Override
protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
      new ReactNativePushNotificationPackage(),
      new ServicePackage()
  );
}

And then in react-native code - ServiceModule.js:

import { NativeModules } from 'react-native';
module.exports = NativeModules.ServiceModule;

And in Tracking.js:

import ServiceModule from '../component/ServiceModule';
....
startTracking() {
    console.warn("Trying to start serivce");
    ServiceModule.startTrackingService;
}

componentWillMount() {
    DeviceEventEmitter.addListener('updateDistance', function(e: Event) {
        console.warn("got event");
        this.updateDistance(e.distance);
    });
}

updateDistance(newDistance) {
    this.setState({distance: newDistance});
}

console.warn("Trying to start service"); is displaying so the startTracking() method is definitely called;

Answer 1

startTracking() {
    console.warn("Trying to start serivce");
    ServiceModule.startTrackingService();
}