Why isn't my cloud function returning my map correctly?

Question

I have the following function, an I am trying to return an array of maps to my flutter app

export const usersFromContacts = functions.region('europe-west1').https.onCall(async (data, context) => {
    Authentication.authenticate(context);
    const phonenumbers = Validator.validateArray<string>('phonenumbers', data['phonenumbers']);

    const privateDataPromises = [];
    for (let i = 0; i < phonenumbers.length; i++)
        privateDataPromises.push(...(await firestore.collectionGroup('userPrivateData')
            .where('phonenumber', '==', phonenumbers[i]).get()).docs);
    const userSnapshots = await Promise.all(privateDataPromises);

    const userPromises = [];
    for (let i = 0; i < userSnapshots.length; i++) {
        const userID = privateDataPromises[i].id;
        userPromises.push(userCollection.doc(userID).get());
    }

    const returnValue = (await Promise.all(userPromises)).map((document) => UserModel.fromFirestoreDocumentData(document).toMap());
    console.log(returnValue);
    return returnValue;
});

If I log the test field to the cloud functions console I get the correct array of maps with the correct data in the maps.

[ Map {
    'id' => 'ID',
    'displayName' => 'Name',
    'phoneNumber' => 'Phonenumber',
    'photoUrl' => 'PhotoUrl' } ]

Is what I get back in the firebase functions console. Where I replaced the values ofc.

Then inside flutter I do

  Future<HttpsCallableResult> _callCloudFunction(String functionName, {Map<String, dynamic> data}) async {
    final cloudFunction = api.getHttpsCallable(functionName: functionName);
    try {
      final httpCallable = await cloudFunction.call(data).timeout(Duration(seconds: timeout));
      print(httpCallable.data); // this prints [{}] an empty array of maps?
      return httpCallable;
    } on CloudFunctionsException catch (error) {
      throw new UserFriendlyException(error.code, error.message);
    } on TimeoutException catch (error) {
      throw new UserFriendlyException('Operation Failed', error.message);
    } catch (error) {
      throw new UserFriendlyException('Operation Failed', 'There was a problem with with executing the operation');
    }
  }

And I get an empty array of maps? What am I doing wrong?

I'm pretty sure the call is correct because if I return the documents directly I do get them in my front-end so am I returning the values in the wrong way from the function?

Answer 1

You are trying to serialize an ES6 Map object from the function to the client. That's not going to work the way you want.

Cloud Functions callable function only support serializing plain JavaScript objects, arrays, and primitive values. Instead of passing a Map, pass a normal JS object. This is the code you will have to change:

UserModel.fromFirestoreDocumentData(document).toMap()

You will have to get inside that toMap function and change it, or convert its output to normal JS objects for serialization.