Realtime Database doesn't receive live updates if ref has no children

[Golosay]

Hello all! There is an issue when I use the listVal() function with the ref that currently has no children. It will return an empty array on subscription, but later, after adding children, it will not emit updates.

The real-time update works as expected when you call the same code with existing children.

Version info

Angular: 13.3.2 Firebase: 9.9.2 AngularFire: 7.4.1 Other (e.g. Ionic/Cordova, Node, browser, operating system): Node v16.13.0, Mac OS Monterey

How to reproduce these conditions

// Call it when stories has no children
listVal(ref(this.db, 'stories'), { keyField: 'key' })
      .subscribe((stories) => {
        console.log('Stories', stories); // Will be called once with []
      });

push(ref(this.db, 'stories'), {name: 'test'});

// console.log('Stories', stories);  will not be called

Debug output

Errors in the JavaScript console No errors

Output from firebase.database().enableLogging(true);

[2022-08-08T13:45:12.328Z]  @firebase/database: 0: set {"path":"/stories/-N8xgwy0SpF6eryoEif3","value":{"name":"Test","startDate":"2022-08-08T13:45:12.328Z"},"priority":null} 

[2022-08-08T13:45:12.329Z]  @firebase/database: p:0: {"r":20,"a":"p","b":{"p":"/stories/-N8xgwy0SpF6eryoEif3","d":{"name":"Test","startDate":"2022-08-08T13:45:12.328Z"}}} 

[2022-08-08T13:45:12.491Z]  @firebase/database: p:0: from server: {"r":20,"b":{"s":"ok","d":""}} 

[2022-08-08T13:45:12.492Z]  @firebase/database: p:0: p response {"s":"ok","d":""} 

Expected behavior

You can subscribe to the empty parent and receive update when first child is added. It works correctly with objectVal() and AngularList from the compat version.

Actual behavior

It doesn't emit updates if you subscribed to the empty parent.

Looks like the issue is with list function in database, that returns Observable of empty array.

[Golosay]

Am I the only one with this issue?

[rtcimi]

No, u are not, i've just realised the same. ... But it is working using objectVal + Object.values()

[boseidel]

Same thing happening to me, any work arounds for this?

[DanielTerrific]

any update or workaround?

[Golosay]

No updates. It seems AngularFire (No commits for 4+ months) and expire (no commits for the 1+ year) dropped support.

[Golosay]

My workaround is to clone rxfire repo, remove these lines from the list function. And use own cloned package.

[zanozbot]

I'm wondering how is this still not resolved.

Anyways, here's a simple workaround (thanks @rtcimi).

objectVal<Map<string, Story>>(
  query(
    ref(this.db, 'stories')
  ),
  { keyField: 'key' }
).pipe(
  map(value => Object.values(value ?? {}))
);

[davideast]

A fix has been merged into RxFire and we're working on adding it to AngularFire right now.