🐛 [firebase_database] `onValue` with Tabs throws `Bad state: Stream has already been listened to` and `MissingPluginException` errors

[tmthecoder]

Bug report

Describe the bug
When using the onValue listener with a TabController as the parent view (I had two listeners each on a separate tab), and navigating from tabs and back, Bad state: Stream has already been listened to. is thrown.

Also on a separate note, I came across this bug while dealing with another on onValue streams, where a No implementation found for method cancel on channel usage-counter/moOmk97GjEV1QMaQ2HiVz6y82sl1-[DEFAULT]-null-DatabaseEventType.value-[]#6 is thrown when navigating in the TabView on a separate app. I was unable to replicate this, but I wonder if it's a similar issue, so I'll include it here. Sorry if it isn't and this information is redundant. I cannot share the code for the application that threw this exception, but will share the one with the Stream listen error.

Steps to reproduce

Steps to reproduce the behavior:

1. Open the Sample Repo
2. Run the Code
3. Go back and forth between tabs
4. See the thrown StateError

Expected behavior

The StreamController should continue to function across tab navigation

Sample project

https://github.com/tmthecoder/database_stream_bug

Additional context

None except the mention about the other error I received. In the case this is a lower priority issue, I can work on a fix if an issue is found. I couldn't seem to pinpoint it myself when looking through the firebase_database implementation.

---

Flutter doctor

Run flutter doctor and paste the output below:

Click To Expand

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.8.0, on macOS 12.0.1 21A559 darwin-x64, locale
    en-US)
[!] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for
      more details.
[✓] Xcode - develop for iOS and macOS (Xcode 13.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2020.3)
[✓] IntelliJ IDEA Ultimate Edition (version 2021.2.1)
[✓] IntelliJ IDEA Ultimate Edition (version 2021.2.1)
[✓] Connected device (3 available)

! Doctor found issues in 1 category.

---

Flutter dependencies

Run flutter pub deps -- --style=compact and paste the output below:

Click To Expand

Dart SDK 2.15.0
Flutter SDK 2.8.0
firebase_database_bug_sample 1.0.0+1

dependencies:
- cupertino_icons 1.0.4
- firebase_core 1.10.5 [firebase_core_platform_interface firebase_core_web flutter meta]
- firebase_database 9.0.3 [firebase_core firebase_core_platform_interface firebase_database_platform_interface firebase_database_web flutter]
- flutter 0.0.0 [characters collection meta typed_data vector_math sky_engine]

dev dependencies:
- flutter_lints 1.0.4 [lints]
- flutter_test 0.0.0 [flutter test_api path fake_async clock stack_trace vector_math async boolean_selector characters charcode collection matcher meta source_span stream_channel string_scanner term_glyph typed_data]

transitive dependencies:
- async 2.8.2 [collection meta]
- boolean_selector 2.1.0 [source_span string_scanner]
- characters 1.2.0
- charcode 1.3.1
- clock 1.1.0
- collection 1.15.0
- fake_async 1.2.0 [clock collection]
- firebase_core_platform_interface 4.2.2 [collection flutter meta plugin_platform_interface]
- firebase_core_web 1.5.2 [firebase_core_platform_interface flutter flutter_web_plugins js meta]
- firebase_database_platform_interface 0.2.0+2 [collection firebase_core flutter meta plugin_platform_interface]
- firebase_database_web 0.2.0+2 [firebase_core firebase_core_web firebase_database_platform_interface flutter flutter_web_plugins js]
- flutter_web_plugins 0.0.0 [flutter js characters collection meta typed_data vector_math]
- js 0.6.3
- lints 1.0.1
- matcher 0.12.11 [stack_trace]
- meta 1.7.0
- path 1.8.0
- plugin_platform_interface 2.0.2 [meta]
- sky_engine 0.0.99
- source_span 1.8.1 [collection path term_glyph]
- stack_trace 1.10.0 [path]
- stream_channel 2.1.0 [async]
- string_scanner 1.1.0 [charcode source_span]
- term_glyph 1.2.0
- test_api 0.4.3 [async boolean_selector collection meta source_span stack_trace stream_channel string_scanner term_glyph matcher]
- typed_data 1.3.0 [collection]
- vector_math 2.1.1

---

[darshankawar]

@tmthecoder
Thanks for the report. Although I get the same exception Bad state: Stream has already been listened to., I think it may not be occurring due to database plugin, but could be the way StreamBuilder is implemented.

It seems that TabBarView is maintaining the child (StreamBuilder) state and reusing it.
Can you try to wrap StreamBuilder with a Builder to ensure that a new instance of the Stream is called and not the state version in memory from TabBarView ?

[tmthecoder]

@darshankawar Upon using a builder, the listener works temporarily then does no longer work in live-time. You can test this with the second-to-latest commit to the repo above, clicking back snd forth between tabs and changing values works initially but after some back and forth between tabs, it no longer updates in live-time, and after a few back and forth, the app on my emulator crashed.

Additionally, if I leave one of the tabs as it was before, and wrap one around in a builder, the MissingPluginException I referred to before comes up. If one is wrapped in builder (let's say 1st tab), click the button a few times and see live-time updates. Then go to the second tab and click buttons a few time there and see 2nd live-time update. Once you go back to the first, it will no longer live update, and going back to the second gives two different exceptions: StateError and MissingPluginException. This can be seen by the latest commit to the repo.

The stack trace for the second paragraph is here:

======== Exception caught by widgets library =======================================================
The following StateError was thrown building KeyedSubtree-[<1>]:
Bad state: Stream has already been listened to.

The relevant error-causing widget was: 
  TabBarView-[GlobalKey#983c7] TabBarView:file:///Users/tejasmehta/Desktop/Development/test/firebase_database_bug_sample/lib/main.dart:64:13
When the exception was thrown, this was the stack: 
#6      _StreamBuilderBaseState._subscribe (package:flutter/src/widgets/async.dart:134:38)
#7      _StreamBuilderBaseState.initState (package:flutter/src/widgets/async.dart:108:5)
#8      StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4728:57)
#9      ComponentElement.mount (package:flutter/src/widgets/framework.dart:4561:5)
#10     Element.inflateWidget (package:flutter/src/widgets/framework.dart:3631:14)
#11     MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6261:36)
#12     MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6272:32)
...     Normal element mounting (42 frames)
#54     Element.inflateWidget (package:flutter/src/widgets/framework.dart:3631:14)
#55     Element.updateChild (package:flutter/src/widgets/framework.dart:3383:18)
#56     SliverMultiBoxAdaptorElement.updateChild (package:flutter/src/widgets/sliver.dart:1243:37)
#57     SliverMultiBoxAdaptorElement.createChild.<anonymous closure> (package:flutter/src/widgets/sliver.dart:1228:20)
#58     BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2531:19)
#59     SliverMultiBoxAdaptorElement.createChild (package:flutter/src/widgets/sliver.dart:1221:12)
#60     RenderSliverMultiBoxAdaptor._createOrObtainChild.<anonymous closure> (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:349:23)
#61     RenderObject.invokeLayoutCallback.<anonymous closure> (package:flutter/src/rendering/object.dart:1962:59)
#62     PipelineOwner._enableMutationsToDirtySubtrees (package:flutter/src/rendering/object.dart:910:15)
#63     RenderObject.invokeLayoutCallback (package:flutter/src/rendering/object.dart:1962:14)
#64     RenderSliverMultiBoxAdaptor._createOrObtainChild (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:338:5)
#65     RenderSliverMultiBoxAdaptor.insertAndLayoutChild (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:484:5)
#66     RenderSliverFixedExtentBoxAdaptor.performLayout (package:flutter/src/rendering/sliver_fixed_extent_list.dart:250:17)
#67     RenderObject.layout (package:flutter/src/rendering/object.dart:1852:7)
#68     RenderSliverEdgeInsetsPadding.performLayout (package:flutter/src/rendering/sliver_padding.dart:137:12)
#69     _RenderSliverFractionalPadding.performLayout (package:flutter/src/widgets/sliver_fill.dart:167:11)
#70     RenderObject.layout (package:flutter/src/rendering/object.dart:1852:7)
#71     RenderViewportBase.layoutChildSequence (package:flutter/src/rendering/viewport.dart:510:13)
#72     RenderViewport._attemptLayout (package:flutter/src/rendering/viewport.dart:1580:12)
#73     RenderViewport.performLayout (package:flutter/src/rendering/viewport.dart:1489:20)
#74     RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1707:7)
#75     PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:879:18)
#76     RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:497:19)
#77     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:883:13)
#78     RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:363:5)
#79     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1145:15)
#80     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
#81     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:996:5)
#85     _invoke (dart:ui/hooks.dart:150:10)
#86     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:270:5)
#87     _drawFrame (dart:ui/hooks.dart:114:31)
(elided 9 frames from dart:async)
====================================================================================================

======== Exception caught by services library ======================================================
The following MissingPluginException was thrown while de-activating platform stream on channel test-val-[DEFAULT]-null-DatabaseEventType.value-[]#2:
MissingPluginException(No implementation found for method cancel on channel test-val-[DEFAULT]-null-DatabaseEventType.value-[]#2)

When the exception was thrown, this was the stack: 
#0      MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:165:7)
<asynchronous suspension>
#1      EventChannel.receiveBroadcastStream.<anonymous closure> (package:flutter/src/services/platform_channel.dart:518:9)
<asynchronous suspension>
====================================================================================================

[darshankawar]

@tmthecoder
Thanks for the update. Looking at the exception you are getting related to Bad state: Stream has already been listened to, it seems to be coming from flutter:

`#6      _StreamBuilderBaseState._subscribe (package:flutter/src/widgets/async.dart:134:38)
#7      _StreamBuilderBaseState.initState (package:flutter/src/widgets/async.dart:108:5)
#8      StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4728:57)
#9      ComponentElement.mount (package:flutter/src/widgets/framework.dart:4561:5)
#10     Element.inflateWidget (package:flutter/src/widgets/framework.dart:3631:14)
#11     MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6261:36)
#12     MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6272:32)`

Is there a way for you to narrow it down without the database plugin and just keep framework code which will be enough to replicate the exception ?

[tmthecoder]

@darshankawar I wasn't able to replicate this bug with any other tabbed Stream setup, or StreamBuilder setup, so I'm not sure what else I can do to narrow down the issue.

As of now, my thoughts were that the second exception I listed (MissingPluginException) seems to be related to, if not causing, the stream issue. That issue is clearly database related given the error lists the database listened Native Stream.