Resolves #3829 Improve codespaces debugging

[jimmyli97]

Fix #3829

Description

• Adds desktop environment to codespaces so tests can be viewed in browser
• Fix setup issues with nvm and rbenv
• Rewrite dockerfile to use apt-get and noninteractive
• Adds debug gem to gemfile to allow attaching to live server using Shopify
• Adds additional documentation on debugging using VSCode Shopify extension

Motivation

I think it's safe to close #3829 with these fixes because I've been doing all my development in codespaces with this setup recently and it's working great.

• bin/start didn't work out of the box due to failed javascript runtime and rbenv, fixed to install node and rbenv init (I don't know when this stopped working because it did work before)
• Much easier to write tests when you can view them running in browser
• apt-get and noninteractive are best practice for dockerfiles
• I like using Shopify's debugger because I find setting breakpoints much easier with a GUI

Dependencies

gem "debug", ">= 1.0.0"

Type of change

• New feature (non-breaking change which adds functionality)
• This change requires a documentation update
• Documentation update

How Has This Been Tested?

• Full rebuild of codespace, bin/start works out of the box
• NOT_HEADLESS=true bundle exec rspec spec/system/partner_system_spec.rb running in Codespaces is visible over noVNC on localhost:6080
• Ran Shopify Ruby LSP debugger and attached to the server as per documentation in VSCode and in Codespaces.

Screenshots

[awwaiid]

Interestingly, I've never had to do this step and was able to visit the URL without issue. Is this an optional step maybe?

[jimmyli97]

I tried again today and now the private port is working after a workaround so I think it is a bug in the VSCode Codespaces extension. Yesterday I tried to view the app at 127.0.0.1:3000 after port forwarding with visibility set to private and couldn't figure out why it wasn't working, I just got "ERR_EMPTY_RESPONSE". The server was up and running and I could curl to it just fine in the Codespace terminal, so I really couldn't figure out what was wrong. There was another contributor in Slack who ran into this issue also.

I removed the doc about public ports in commit 377cf8e

[awwaiid]

This works. Still takes a long time to start, and I didn't verify the VNC-browser bit. I think I liked it a bit more when the ports popped up instead of me needing to go click them, but I'll merge this in for the other improvements and we'll wait for general feedback. Thank you!

[jimmyli97]

@awwaiid

Looks like speeding up the container build is possible with a Github action prebuilding and pushing to ghcr.io, which is free storage for public repos, following this guide (https://containers.dev/guide/prebuild), I might be able to look into it when I have a chance

(previous comment before edit)
probably the best way to speed it up is with [codespace prebuilds] (https://docs.github.com/en/codespaces/prebuilding-your-codespaces/configuring-prebuilds#configuring-prebuilds), which takes up billable storage in the organization repo, and has to be done by someone with admin access, and moving the post-create.sh to updateContentCommand so the prebuild builds it. I can open an issue for that if you want, not sure if that's something you have the storage or the time for.

[GitHub Actions]

@jimmyli97: Your PR Resolves #3829 Improve codespaces debugging is part of today's Human Essentials production release: 2024.08.11.
Thank you very much for your contribution!