feat: add UI tests to `create fuels` template

[Dhaiwat10]

• Closes #3024

Release notes

In this release, we:

• Added UI tests to the create fuels template app

Summary

After this PR, the create fuels template app will ship with a baked-in UI testing setup.

While adding this setup, I spotted a possible improvement in our current UI tests for the create fuels template that we run in the CI so I made some improvements there as well.

Checklist

• [x] All changes are covered by tests (or not applicable)
• [x] All changes are documented (or not applicable)
• [x] I reviewed the entire PR myself (preferably, on GH UI)
• [x] I described all Breaking Changes (or there's none)

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
create-fuels-template	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 11, 2024 6:06pm
ts-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 11, 2024 6:06pm

1 Skipped Deployment

| Name | Status | Preview | Comments | Updated (UTC) | | :--- | :----- | :------ | :------- | :------ | | **create-fuels-counter-example** | ⬜️ Ignored ([Inspect](https://vercel.com/fuel-labs/create-fuels-counter-example/FiCmXvdBg8FQDLq2bN4MKaR3Nhhy)) | | | Sep 11, 2024 6:06pm |

[danielbate]

I wonder if we should add a simple bash script to generate those files for the templates so that one doesn't need to manually update it everywhere each time.

This is a great point @maschad , been thinking more around template generation recently rather than copy pasta, will spin an issue up @Dhaiwat10.

[arboleya]

@danielbate @maschad On one hand, I agree, and this is similar to what I did here — you can see there's a template and a shell script that duplicates things, etc.:

• https://github.com/FuelLabs/fuel-vm/tree/master/.npm

Did I like it? Partially, although it is very DRY, it adds a substantial amount of abstraction that can become hard to maintain. I'm not saying it is or isn't a good path to walk, but I am sharing again this idea that abstractions are always a double-edged sword. We must ponder them carefully.

[danielbate]

Mentioned here but I think extending the playwright web server config may be a good move here so we aren't growing the ui script too much, and unecessarily.

[github-actions[bot]]

Coverage Report:

Lines	Branches	Functions	Statements
78.87%(+0%)	71.64%(-0.11%)	77.19%(+0%)	78.95%(+0%)

Changed Files:

| Ok | File (✨=New File) | Lines | Branches | Functions | Statements | | -- | ------------------------------------------------------------------------------------------ | --------------- | ----------- | --------------- | --------------- | | 🔴 | ✨ apps/create-fuels-counter-guide/playwright.config.ts | 100%
(+100%) | 0%
(+0%) | 100%
(+100%) | 100%
(+100%) |