how to watch firebase traffic from desktop chrome inspector

Viewed 4099

I have a JavaScript app running in my desktop Chrome browser which is reading and writing to Firebase. I'd like to get a sense of how much traffic it uses (vs any local caching) and I figured I could just watch in the Chrome Inspector.

I'm not seeing any such traffic. I assume I need to tweak some Inspector setting, but it looks like I have everything turned on and nothing filtered.

How can I see this traffic? (For my current simple needs, I'd much rather do so in Chrome, and not have to fire up WireShark)

2 Answers

Firebase uses a websocket to communicate with clients. In the devtool's networking tab, filter by "WS" (websocket) and you should see the connection that Firebase is using.

There is a great extension for Chrome called 'GTM/GA Debug' that has a readout for Firebase hits. When using the extension in Chrome Dev Tools, look at the tab named GA4F (Google Analytics for Firebase). It is very helpful for debugging.

Related