chore: add `play` script #1327

angeloashmore · 2024-03-29T04:03:00Z

Context

We often need a running Slice Machine instance complete with a Prismic repository. We have projects in the e2e-projects directory to serve that purpose, but they have the following limitations:

Tied to a specific Prismic repository.
Require access to the Prismic repository.
Are version controlled.
Are stateful since they are paired to a real Prismic repository.

The Solution

We can use a script to quickly generate new projects with their own Prismic repositories. Projects are generated using Prismic's minimal starters, just like customers would use.

These projects are called "playgrounds" since they allow us to play with Slice Machine while developing.

This PR introduces a new yarn play command. The CLI looks like this:

# Start the most recent playground or create one if none exist.
yarn play

# Start an existing playground or create one if it doesn't exist.
yarn play my-playground-name

# Force create a new playground
yarn play --new
yarn play --new my-playground-name

# Specify a framework (default: next)
yarn play -f sveltekit
yarn play --framework sveltekit

# If `-f` is passed with a playground name and the playground
# already exists, halt. If the playground does not exist, create
# a new one with that framework.
yarn play -f sveltekit my-playground-name

# Don't start the project
yarn play --no-start

# Dry run
yarn play -n
yarn play --dry-run

Both Slice Machine and the playground project are started automatically (unless disabled via --no-start).

Impact / Dependencies

This should make it easier to develop features. It could also streamline how we run end-to-end tests with Playwright.

Checklist before requesting a review

I hereby declare my code ready for review.
If it is a critical feature, I have added tests.
The CI is successful.
If there could backward compatibility issues, it has been discussed and planned.

vercel · 2024-03-29T04:03:06Z

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

Name	Status	Preview	Updated (UTC)
slice-machine	✅ Ready (Inspect)	Visit Preview	Apr 4, 2024 1:22am

scripts/play.ts

bapmrl

Quick incomplete review as this is still a draft ^^ Thanks for starting this highly useful work!

scripts/utils/commandUtils.ts

scripts/play.ts

playgrounds/package.json

scripts/play.ts

bapmrl

This is a really nice advancement to easily work on Slice Machine! Thank you Angelo 😊

⚠️ I just had the following error when trying to access localhost:9999 in Chrome:

play-tall-semla-02707b3 [slicemachine] 
play-tall-semla-02707b3 [slicemachine] > play-tall-semla-02707b3@0.1.0 slicemachine
play-tall-semla-02707b3 [slicemachine] > ../../packages/start-slicemachine/bin/start-slicemachine.js
play-tall-semla-02707b3 [slicemachine] 
play-tall-semla-02707b3 [next] 
play-tall-semla-02707b3 [next] > play-tall-semla-02707b3@0.1.0 next:dev
play-tall-semla-02707b3 [next] > next dev --port=8001
play-tall-semla-02707b3 [next] 
play-tall-semla-02707b3 [next]    ▲ Next.js 14.1.4
play-tall-semla-02707b3 [next]    - Local:        http://localhost:8001
play-tall-semla-02707b3 [next] 
play-tall-semla-02707b3 [slicemachine] [HPM] Proxy created: /  -> http://localhost:3000
play-tall-semla-02707b3 [slicemachine] 
play-tall-semla-02707b3 [slicemachine]  Slice Machine v1.26.0  → Running at http://localhost:9999
play-tall-semla-02707b3 [slicemachine] 
play-tall-semla-02707b3 [next]  ✓ Ready in 1431ms
play-tall-semla-02707b3 [slicemachine] [HPM] Error occurred while proxying request localhost:9999/ to http://localhost:3000/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)
play-tall-semla-02707b3 [slicemachine] [HPM] Error occurred while proxying request localhost:9999/favicon.ico to http://localhost:3000/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)
play-tall-semla-02707b3 [next]  ○ Compiling / ...
play-tall-semla-02707b3 [next]  ✓ Compiled / in 1237ms (854 modules)
play-tall-semla-02707b3 [next]  ○ Compiling /icon.png ...
play-tall-semla-02707b3 [next]  ✓ Compiled /icon.png in 509ms (541 modules)
play-tall-semla-02707b3 [slicemachine] [HPM] Error occurred while proxying request localhost:9999/ to http://localhost:3000/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)
play-tall-semla-02707b3 [slicemachine] [HPM] Error occurred while proxying request localhost:9999/favicon.ico to http://localhost:3000/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)

scripts/play.ts

playgrounds/package.json

scripts/play.ts

bapmrl · 2024-04-02T15:31:09Z

package.json

⚠️ Is there a way to add the generated playgrounds to the clean script?

We could, but I wonder if we should ask for confirmation before deleting all playgrounds. It's possible a playground could contain a lot of work or a specific set up, and I wouldn't want someone to accidentally lose it all.

Maybe we could create a simple custom scripts/clean.ts with a prompt?

Oh, you're right. We'll probably have changes we don't want to lose.

Consequently, I think we can either:

Keep it simple and not change anything.

Update the clean script so that it only deletes well known build/cache directories in the playgrounds. For example, it could delete the nested .next directories. Of course, it shouldn't accidentally delete content in the playgrounds/node_modules directory or other configuration files.

To expedite merging this PR, let's not change the clean script for now. We can revisit it in a future PR. I like the second idea, perhaps in addition to the ability to delete playgrounds.

angeloashmore · 2024-04-02T22:43:37Z

@bapmrl: ⚠️ I just had the following error when trying to access localhost:9999 in Chrome…

You may not have had the Slice Machine development server running. You need to run yarn dev in a separate terminal in order to run the playground.

I considered running yarn dev into the yarn play script, but I wasn't sure if that added complexity was worth it. What do you think?

bapmrl · 2024-04-03T13:08:14Z

@bapmrl: ⚠️ I just had the following error when trying to access localhost:9999 in Chrome…

You may not have had the Slice Machine development server running. You need to run yarn dev in a separate terminal in order to run the playground.

I considered running yarn dev into the yarn play script, but I wasn't sure if that added complexity was worth it. What do you think?

You're right. I forgot to run yarn dev and doing it automatically in the play script would make it too complex. Let's keep it this way. It's perfect!

bapmrl

❤️ This is truly excellent and will greatly help us!

I'm approving as there are just 4 comments remaining. Don't forget the little suggestion for the exec function ^^

scripts/play.ts

angeloashmore added 6 commits March 7, 2024 14:15

feat: add initial playground script

1c56c66

chore: rebuild yarn.lock without playground deps

7282e6a

refactor: script

66cb48b

feat: try to make playgrounds isolated

669033f

Merge branch 'main' into aa/playground-script

d75188f

feat: add play CLI

65e35df

vercel bot deployed to Preview March 29, 2024 04:04 View deployment

fix: pass dry run arg to updateJSONFile

1a715a2

vercel bot deployed to Preview March 29, 2024 04:13 View deployment

lihbr reviewed Mar 29, 2024

View reviewed changes

scripts/play.ts Outdated Show resolved Hide resolved

bapmrl reviewed Mar 29, 2024

View reviewed changes

angeloashmore added 3 commits March 29, 2024 10:10

fix: ignore yarn.lock

b216ced

refactor: review

fe7fb5b

fix: rename playgroundRoot to playgroundDir

875cb28

vercel bot deployed to Preview March 29, 2024 22:13 View deployment

angeloashmore marked this pull request as ready for review March 30, 2024 00:52

xrutayisire reviewed Apr 1, 2024

View reviewed changes

scripts/play.ts Outdated Show resolved Hide resolved

xrutayisire reviewed Apr 1, 2024

View reviewed changes

scripts/play.ts Outdated Show resolved Hide resolved

angeloashmore added 2 commits April 1, 2024 15:01

feat: support --stage=<stage>

7986cc1

feat: support Nuxt

ab16e49

vercel bot deployed to Preview April 2, 2024 02:00 View deployment

angeloashmore added 2 commits April 1, 2024 16:29

fix: use a hardcoded api endpoint in nuxt websites

49e053d

feat: add playground name to output

bfb737b

vercel bot deployed to Preview April 2, 2024 02:44 View deployment

bapmrl requested changes Apr 2, 2024

View reviewed changes

bapmrl reviewed Apr 2, 2024

View reviewed changes

angeloashmore added 3 commits April 2, 2024 09:57

fix: use more compatible prefix styling

78eff12

fix: use shorter generated names

8486926

fix: rename --stage to --environment

c19f3ab

angeloashmore added 5 commits April 2, 2024 10:51

feat: add -e alias for --environment

df727d7

refactor: use an explicit default framework value

b50ba5c

fix: per review

ef47bbf

fix: remove unused .yarnrc.yml mention

55c535f

fix: remove origin from playground and commit changes

1dbcfbe

vercel bot deployed to Preview April 2, 2024 22:47 View deployment

bapmrl approved these changes Apr 3, 2024

View reviewed changes

scripts/play.ts Outdated Show resolved Hide resolved

angeloashmore added 3 commits April 3, 2024 15:14

refactor: simplify exec overload

e34cc87

feat: use the local @slicemachine/init

ce650e6

fix: use constants everywhere (I forgot some)

a9ae332

vercel bot deployed to Preview April 4, 2024 01:22 View deployment

angeloashmore merged commit 91b4fb5 into main Apr 4, 2024
33 checks passed

angeloashmore deleted the aa/playground-script branch April 4, 2024 01:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore: add `play` script #1327

chore: add `play` script #1327

angeloashmore commented Mar 29, 2024 •

edited

Loading

vercel bot commented Mar 29, 2024 •

edited

Loading

bapmrl left a comment

bapmrl left a comment •

edited

Loading

bapmrl Apr 2, 2024 •

edited

Loading

angeloashmore Apr 2, 2024

angeloashmore Apr 2, 2024

bapmrl Apr 3, 2024 •

edited

Loading

angeloashmore Apr 4, 2024

angeloashmore commented Apr 2, 2024 •

edited

Loading

bapmrl commented Apr 3, 2024

bapmrl left a comment

chore: add play script #1327

chore: add play script #1327

Conversation

angeloashmore commented Mar 29, 2024 • edited Loading

Context

The Solution

Impact / Dependencies

Checklist before requesting a review

vercel bot commented Mar 29, 2024 • edited Loading

bapmrl left a comment

Choose a reason for hiding this comment

bapmrl left a comment • edited Loading

Choose a reason for hiding this comment

bapmrl Apr 2, 2024 • edited Loading

Choose a reason for hiding this comment

angeloashmore Apr 2, 2024

Choose a reason for hiding this comment

angeloashmore Apr 2, 2024

Choose a reason for hiding this comment

bapmrl Apr 3, 2024 • edited Loading

Choose a reason for hiding this comment

angeloashmore Apr 4, 2024

Choose a reason for hiding this comment

angeloashmore commented Apr 2, 2024 • edited Loading

bapmrl commented Apr 3, 2024

bapmrl left a comment

Choose a reason for hiding this comment

chore: add `play` script #1327

chore: add `play` script #1327

angeloashmore commented Mar 29, 2024 •

edited

Loading

vercel bot commented Mar 29, 2024 •

edited

Loading

bapmrl left a comment •

edited

Loading

bapmrl Apr 2, 2024 •

edited

Loading

bapmrl Apr 3, 2024 •

edited

Loading

angeloashmore commented Apr 2, 2024 •

edited

Loading