WIP test setup

[jasonLaster]

Messing around to see how easy it would be to record the e2e + smoke tests with Replay.

What is Replay? Good question! Will be hopping on the community call next week, but the short version is that Replay is a time-travel debugger which means you can debug the tests after the fact. Like all good time travelers, when you replay the test, there really is a browser running that really does think that it is running for the first time. This is how you're able to inspect the React Components, add print statements, the whole works.

Here's a loom of me looking at Redwood's router for the first time 😄 https://www.loom.com/share/7cc52fd9988342569078ac446ff6446e

[nx-cloud[bot]]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 4a4863a93685e01b25049ce9d5bd36dd17ee0595. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

---

✅ Successfully ran 14 targets

• cli run test --concurrency 2 -- --colors --maxWorkers 2
• cli run test --concurrency 2 -- --colors --maxWorkers 2
• cli run test --concurrency 2 -- --colors --maxWorkers 2
• cli run build
• cli run build
• cli run test --concurrency 2 -- --colors --maxWorkers 2
• cli run build
• cli run build
• cli run build
• cli run build
• cli run build
• cli run build
• cli run build
• cli run build

---

Sent with 💌 from NxCloud.

[netlify[bot]]

✅ Deploy Preview for redwoodjs-docs ready!

Name	Link
🔨 Latest commit	4a4863a93685e01b25049ce9d5bd36dd17ee0595
🔍 Latest deploy log	https://app.netlify.com/sites/redwoodjs-docs/deploys/62fcf66b4943ab00082aab8f
😎 Deploy Preview	https://deploy-preview-6173--redwoodjs-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[noire-munich]

Thank you for this @jasonLaster ! Looks like something promising, I wish I could get your intervention from the next community call.

Would you mind adding the proper link to the issue? https://docs.replay.io/docs There's https://replay.js.org/, not to be confused with.

[ryanjduffy]

@jtoar - I think the Replay integration started here is very close to ready to merge. We're seeing parity on results between chromium and Replay and little to no overhead. It'd be great to enable workflows for this PR so we can verify everything behaves.

Here's a replay of one of the auth tests with some comments I left exploring how it all works. I can't resist digging into a new code base!

https://app.replay.io/recording/useauth-hook-auth-redirects-checks--2f813a40-7a99-4e1f-a02c-c8be7f6891d3

[jtoar]

@ryanjduffy the way you used comments in that replay to annotate it as if it was a video (it is I guess! But obviously it seems like so much more than that) is pretty slick. I'll do that in the future.

I just enabled workflows it. I noticed that the yarn.lock has a lot of changes despite only adding one dependency:

I rebuilt it starting from main with dependency change in this PR and it looks better! I also kept @playwright/test at v1.25.1. If it needs to be v1.19.2 let me know and happy to change it back, just wasn't sure.

I'll also keep an eye on checks to make sure all the other ones (build, lint, test) are working so that we can see the smoke test run.

[jtoar]

Ah I'm actually not sure if I can push to this branch because it's from an organization. I can make a copy of this with the commit I wanted to add and you could cherrypick it maybe?

[jtoar]

Tests are passing on the ubuntu runners! 🚀 But failing on windows because it says chromium isn't supported there: https://github.com/redwoodjs/redwood/runs/8243292334?check_suite_focus=true#step:8:60

[ryanjduffy]

@ryanjduffy the way you used comments in that replay to annotate it as if it was a video (it is I guess! But obviously it seems like so much more than that) is pretty slick. I'll do that in the future.

Thanks! I think comments are an underrated feature of Replay since they really unlock the collaborative nature of debugging. Plus, they're a handy second brain so you can pick up where you left off in a debugging session.

I rebuilt it starting from main with dependency change in this PR and it looks better! I also kept @playwright/test at v1.25.1. If it needs to be v1.19.2 let me know and happy to change it back, just wasn't sure.

I commented this on the new PR as well but wanted to note for anyone else following along that we only officially support playwright 1.19 right now because that's the newest that our Firefox fork supports. That'll improve soon now that the next Firefox ESR (102) has been released to which we'll be updating our fork soon.

@jasonLaster - You can close this PR out and we'll work through any remaining issues in the new one.

[jtoar]

Thanks again @ryanjduffy! closing this one as housekeeping since https://github.com/redwoodjs/redwood/pull/6361 was merged.