Firebase.database.ServerValue.TIMESTAMP - Flow error property `TIMESTAMP` (Property not found in object literal)

Question

I keep getting the error

[flow] property TIMESTAMP (Property not found in object literal)

on the following block of code:

firebase
  .database()
  .ref(`${Config.ROOT}/transactions/${parentId}/`)
  .push({
    credits,
    date: moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
    serverTimestamp: firebase.database.ServerValue.TIMESTAMP,   // <- here
    params: {
      value: euros,
    },
    type: 'topUp',
    details: transactionStatus,
  })

However, if I hover my mouse over the ServerValue property, even the lint config in my browser confirms that the property TIMESTAMP exists in ServerValue.

What am I missing to make flow accept this block of code?

Answer 1

I might be wrong, but flow seems to be interpreting the ServerValue as a union type . The message says that the ServerValue has two possibilities:

{
    TIMESTAMP: any | {}
}

or

{} //Empty

So TIMESTAMP may or may not exist. You probably need to throw an existence check around it. Maybe something like:

const {TIMESTAMP} = firebase.database.ServerValue
if (TIMESTAMP != null) {
  firebase
    .database()
    .ref(`${Config.ROOT}/transactions/${parentId}/`)
    .push({
    credits,
    date: moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
    serverTimestamp: TIMESTAMP, // No longer null
    params: {
      value: euros,
    },
    type: 'topUp',
    details: transactionStatus,
  })
} else {
  throw new Error("Missing TIMESTAMP");
}

Answer 2

Firebase database TIMESTAMP is documented as a non-null object, and this seems inconsistent with flows understanding, as any would include null (what would the point of any | {} as any would include an object?).

I'd look into where flow is getting its types for firebase, is it using the firebase code in node_modules or is the project using flow-typed, or your own definitions? The definition shown at the top of the screenshot seems correct, but not the one at the bottom. I don't recognise your linter UI to be able to advise on why that might be.

Also, does the code actually work? If necessary, you might be able to use a $FlowFixMe comment to suppress the error if its erroneous.

I'd avoid using a type refinement, as it doesn't document that you are using it to suppress an incorrect flow type annotation.

Here's how you could use $FlowFixMe :

firebase
  .database()
  .ref(`${Config.ROOT}/transactions/${parentId}/`)
  .push({
    credits,
    date: moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
    // $FlowFixMe: TIMESTAMP incorrectly defined as potentially null
    serverTimestamp: firebase.database.ServerValue.TIMESTAMP,
    params: {
      value: euros,
    },
    type: 'topUp',
    details: transactionStatus,
  })