Mobile Replay Kilo Issue 🪨

[pauldambra]

One smaller than Mega is Kilo 🏋️

This issue acts as a tracking place of the to-do list to get Mobile replay ready for beta release

What's the minimum we can add so we can start getting real user feedback

• integration testing - we rely on the fact that we use replay for our websites for quick production feedback but we don't have an app
  • we can use local file export & playback for testing/dev
• correct alignment between absolute positioning and viewport
• larger set of components
  • Generic Placeholders
  • Scrollview
  • Toggle/Switch https://developer.android.com/develop/ui/views/components/togglebutton (feat: proper toggle wireframe #19279)
  • CalendarView
  • Webview/video view - at least we set a place folder
  • RatingBar
  • Progress bar (horizontal/circular)
• Replay title (inferred from href) always leads to Recording not found
• Filter by events but no results message have 2 sentences that don't apply to Mobile (ad blocker prevented recording/domain not authorized), we can probably hide them for Mobile (stretch?)
  • Same for the message "Events have to have a Session ID to be used to filter recordings. This is added automatically by the Web SDK", we can append the Mobile SDK docs as well

FE Config (stretch)

• Capture console logs flag is specific to the Browser, we can make the text more generic or add a new config for Mobile logs.

Needed but probably don't block...

• When Authorized domains are enabled, the session replay feature flag always returns false, workaround is to have it disabled.
• can we split mobile and web recordings in pricing/usage
• Hide/Clarify Explore DOM feature, we have virtual views, this won't make sense for Mobile
• header & payload capture (stretch?)

See also:

• PoC Session Replay - Android with wireframes posthog-android#69
• Track some more info in Replays to be less reliant on Events #16792
• Android Session Recordings #13267
• React Native Session Recordings #13269
• iOS Session Recordings #12344
• Indicate keyboard is likely open for mobile session recordings #12054
• Capture network requests and responses in session replay #16410
• Team Replay Q4 2023 Mega Issue 🤘 #17803
• https://github.com/PostHog/product-internal/issues/519

[pauldambra]

Hide Explore DOM feature, we have virtual views, this won't make sense for Mobile

I'm going to add a note when a recording is mobile for any portion and then we can also add the view tree as an option.

While we won't offer it, someone could pass session id from mobile app to website and stitch a recording between device types, in a similar way to cookies allowing cross sub-domain recording. So, it'll be trickier but we should anticipate things working for web, mobile, or web+mobile recordings

[pauldambra]

More like a question, since we have synthetic IDs, what if the removed/updated wireframe is a synthetic ID? Would that work the way how it is implemented? I believe the synthetic IDs are just the nested components right?

For example, a button on Mobile is a div and a nested text, if I remove or update the button, is the whole div and text correctly mutated?

from #19567 (comment)

---

For now I'm hoping this works without much effort but we will need to review to make sure that we're tagging the ID at the right level so that clean-up works. Or be able to walk the DOM tree to clean up synthetic nodes periodically too

[pauldambra]

we started getting user feedback.... let's have a follow-up kilo issue for release