"Cannot read property 'instanceIdentifier' of undefined" Error while trying to call example function from web app

[betty-projects]

Hi everyone. I tried to implement the example callable function from the docs.(https://firebase.google.com/docs/functions/callable?hl=en)

I already have other background functions working correctly, therefore I believe that my firebase settings are correct.

This is the code of my function, in index.js (it is slightly changed with respect to the tutorial since I did not want to implement a "sanitize" function):

 // Saves a message to the Firebase Realtime Database but uppercase the text.

exports.writeMessage = functions.https.onCall((data, context) => {`

// Message text passed from the client.
const text = data.text;

// Checking attribute.
if (!(typeof text === 'string') || text.length === 0) {
  // Throwing an HttpsError so that the client gets the error details.
  throw new functions.https.HttpsError('invalid-argument', 'The function must be called with ' +
      'one arguments "text" containing the message text to add.');
}

// Saving the new message to the Realtime Database.
const upperCasedMessage = text.toUpperCase(); // uppercase the message.
return admin.firestore().collection("messages").push({
  text: upperCasedMessage
}).then(() => {
  console.log('New Message written');
  // Returning the uppercased message to the client.
  return { text: upperCasedMessage };
}).catch(error => {
  console.log("Write message error: ",error);
})

});

`

From my web app (a very simple one), the click of a button triggers this call:

`var writeMessage = firebase.functions().httpsCallable('writeMessage');

writeMessage({ text: "Secret Message" })
  .then((result) => {
    // Read result of the Cloud Function.
    var upperCasedMessage = result.data.text;
    console.log("upperCasedMessage: ",upperCasedMessage)
}).catch(error => {
  console.log("writeMessage error: ",error)
});`

The error I receive is the following:
provider.ts:108 Uncaught TypeError: Cannot read property 'instanceIdentifier' of undefined
at d.instanceFactory (config.ts:43)
at R.getOrInitializeService (provider.ts:194)
at R.getImmediate (provider.ts:95)
at J._getService (firebaseApp.ts:126)
at J.r.type.l. [as functions] (firebaseNamespaceCore.ts:228)
at Object.n [as functions] (firebaseNamespaceCore.ts:209)
at createTutorProfile (myfile.js:520)
at confirmTutorProfile (myfile.js:508)
at HTMLButtonElement.onclick (VM460 myfile.html:370)

I believe it triggers at the first line, before the callable function is actually called (on firebase console the function does not seem called).

I tried searching on other forums and I didn't find any error like that.
I'm using firebase hosting to test.

Thank you all.

[betty-projects]

I solved my problem. It appears that my callable function was deployed in usecentral-1 location, whilst my firebase configuration for the web app was set for europewest, therefore the call to getService failed.

Client side I set:

var functions = firebase.app().functions("us-central1");