Hallway Hangout: Let’s chat about using Replay.io in the FSE Outreach Program


This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance:

@annezazu @paaljoachim @bassgang @dealbuquerque Jason from Replay.io and Dig (no further info).

Video Recording:

Notes:

For broader context, this is a hallway hangout building off of the initial effort to gather volunteers to help test Replay.io in the FSE Outreach Program as a way to consider possible ways of including the tool more broadly in the project. Replay has a big OSS commitment, including free support, which allows the FSE Outreach Program to explore using it ahead of potential broader use.

Quick introductions

We started with some quick introductions to get a sense of who was on the call, how we’re connected to the WordPress project, and what drew folks to help with testing replay.io:

  • Oliver: Sponsored by replay, been in WordPress community since 2017, used to work for Google where he worked on their first WordPress plugin (site kit).
  • Paul: from Germany, self employed web developer, passion for automation and previously led a QA team.
  • Jason: used to be the tech lead for firefox devtools, worked on etsy with a big focus on their PHP work, big fan of WordPress and PHP. 
  • Paal: from Norway, helps a ton with testing and design, used to be a teacher and enjoys being a regular user, looking for sponsorship.
  • Anne: sponsored by Automattic for Core & Test teams, runs the FSE Outreach Program.

What is replay.io?

Replay,io is a “time travel debugger”. It’s just like a video where you can pause, fast forward, rewind but the entire browser session is recorded. Replay is free for open source communities so we’re trying to see if it’ll make a difference in how the community reports bugs and maintainers solve them. Oliver and Jason shared some additional details including a case study from Pantheon.

Examples

We briefly went through some examples with TechCrunch as an initial overview followed by an example from @paaljoachim.

Feedback on Replay.io

At a high level, there have been various notes around the Site Editor loading slowly in the Replay browser from folks using the tool. Since the Replay browser isn’t something to aim to get widespread compatibility with, the Replay team is going to dig in to see what might be causing the problem and how we can resolve that in order for a better experience in testing. This will be a huge help since the Site Editor is an obvious thing we want to be testing regularly. @franz00 kindly provided some examples of this (replay recording 1, replay recording 2) while trying to replicate a current issue.

From there, @paaljoachim gave some UI feedback around using replay and setting up bookmarks. After the call, he recorded the following video and passed along the following notes:

  • Adding a preview button/icon. To view the video before deciding to save or discard.
  • Adding all the icons for Viewer and DevTools at the same time in the left sidebar. Using a separator between these. Reasoning is that the left sidebar icons are easier to notice compared to clicking the Viewer and DevTools buttons top right.
  • Editing/cutting in the video timeline. 

Oliver and Jason shared a link to Replay’s discord and GitHub repo for folks to continue to share feedback.

Test automation

We briefly covered test automation where you can write your playwright tests and debug with Replay. There’s an effort in the WordPress project to switch to Playwright so it would be neat to explore more once the Replay Playwright integration is in a better spot.

Next steps

  • Replay to look into slow performing replays.
  • Replay to reproduce the GitHub issue we discussed on the call.

#fse-hallway-hangout, #fse-outreach-program