React Native Expo Task Manager

Question

Eventually, I would like to be able to run background tasks in my React Native app (Axios fetch to get some fresh data at least once a day). I am struggling to make this work: https://docs.expo.io/versions/latest/sdk/task-manager/

import * as BackgroundFetch from 'expo-background-fetch';
import * as TaskManager from 'expo-task-manager';

const FETCH_TASKNAME = 'test_task'
const INTERVAL = 60

function test() {
  console.log('function is running')
}

export async function registerFetchTask() {
  TaskManager.defineTask(FETCH_TASKNAME, test());

  const status = await BackgroundFetch.getStatusAsync();
  switch (status) {
      case BackgroundFetch.Status.Restricted:
      case BackgroundFetch.Status.Denied:
          console.log("Background execution is disabled");
          return;

      default: {
          console.debug("Background execution allowed");

          let tasks = await TaskManager.getRegisteredTasksAsync();
          if (tasks.find(f => f.taskName === FETCH_TASKNAME) == null) {
              console.log("Registering task");
              await BackgroundFetch.registerTaskAsync(FETCH_TASKNAME);

              tasks = await TaskManager.getRegisteredTasksAsync();
              console.debug("Registered tasks", tasks);
          } else {
              console.log(`Task ${FETCH_TASKNAME} already registered, skipping`);
          }

          console.log("Setting interval to", INTERVAL);
          await BackgroundFetch.setMinimumIntervalAsync(INTERVAL);
      }
  }

}

and calling this in App.js

import { registerFetchTask } from './helpers/backgroundFetch'

registerFetchTask();

I am getting a console logs up to this point:

function is running
Background execution allowed
Registering task

But I am unfortunately also getting following errors:

TaskManager.defineTask must be called during the initialization phase!

I read also in the documentation and as per example code, I am running in App.js directly and not in the component class.

And I am getting the following warning:

[Unhandled promise rejection: Error: Task 'test_task' is not defined. You must define a task using TaskManager.defineTask before registering.]

Which I don't understand since it is defined at the very top and before registering.

It is only unfortunate there is no proper working example anywhere to be found. An example would save countless hours for people struggling with this. Is there maybe an easier way of making background tasks running in react native apps?

Thanks so much for your kind help.

Answer 1

I can spot a couple of problems:

1. When you define the task, pass in a reference to the function rather than calling it:

TaskManager.defineTask(FETCH_TASKNAME, test); // no parentheses

2. registerFetchTask() is async which means it returns a promise when called in App.js. That probably doesn't count as the "initialization phase" of the app so try removing async

I don't know whether these changes will solve the problem but they should help.