build: Configure deployment previews with Vega Editor

[hydrosquall]

Motivation

• A cloudflare-based take on developer-experience: deployment previews for pull requests #9276
• As discussed w/ @domoritz, Previewing the editor site is probably more useful than the docs site, so we're going after that first

Changes

• Use explicit packageManager version so Cloudflare doesn't autoupgrade to yarn 3 (breaks lockfile)
• Add a build script (originally this was a 1-liner in package.json but it was getting hard to read) that
  • Builds vega-lite
  • Clones vega/editor and links the local vega-lite in place of the full build
  • Install vega/editor without running the prepare script. (The CI device doesn't have rsync installed).
  • Makes empty index.json for vega / vega-lite examples.
  • Build editor with vite with / as the base URL (previously it was erroring due to thinking it was under the /editor subdomain). Technically this is an abstraction leak but fixing it would involve modifying the vega/editor repo too and I'd like to contain this change to 1 repo if possible.

Testing

• See Cloudflare comment below, confirm site loads

Notes

• For now only cameron.yick/* branches have the previews since the build script is WIP. It's using my personal Cloudflare account for testing. I'll open it up to all (non dependabot/*) PRs this change is confirmed.
• I've filed an request to https://blog.cloudflare.com/cloudflare-new-oss-sponsorships-program to see if we can get deployment previews sponsored (they also sponsor D3, yarn). If not, I'll plan to discuss on Slack whether to keep Cloudflare or switch the config to a different account.
• Free plan limits: 500 builds/ month: https://developers.cloudflare.com/pages/platform/limits/ .

[cloudflare-workers-and-pages]

Deploying vega-lite with    Cloudflare Pages

Latest commit:	566e4e8
Status:	✅  Deploy successful!
Preview URL:	https://8c3d6b88.vega-lite.pages.dev
Branch Preview URL:	https://cameron-yick-cloudflare-page.vega-lite.pages.dev

View logs

[domoritz]

What's the difference between preview and branch preview?

[hydrosquall]

What's the difference between preview and branch preview?

• Preview is per-commit, the URL changes each time I push a new commit
• branch preview is per-branch, the URL is constant for the lifetime of this PR.

Since we know that this is now working, I'm going to remove the "console.log" commit so the linter won't be bothered.

[domoritz]

I see. So the branch url will always give me the latest while the commit will always be the same snapshot. Looks good.

[hydrosquall]

Apologies for the reping @domoritz - just had to move the PR out of draft.

I haven't heard back from the Cloudflare team RE: open source sponsorship, but I'm OK with just using my plan's builds for the month so we get a napkin math sense of how many builds per month we'll need for our usual contribution volume.

[mattijn]

Will this trigger automatically on each PR and subsequent commits? I can imagine a PR on the docs don't require this preview. Would it be an idea to trigger it manually on request?

[domoritz]

For now only cameron.yick/* branches have the previews since the build script is WIP. It's using my personal Cloudflare account for testing. I'll open it up to all (non dependabot/*) PRs this change is confirmed.

I think you switched this over, right @hydrosquall? Can we exclude docs: ... as well?

Either way, for now I think we should merge this to see how it works out.

[domoritz]

🎉

[hydrosquall]

Will this trigger automatically on each PR and subsequent commits? I can imagine a PR on the docs don't require this preview.

Yes, good point. I can also ignore builds that only change files under a specific directory. I could set up a rule to ignore changes to the site/ and examples/ repos, but after inspecting it may be easiest to just build on changes to the src/ folder.

Would it be an idea to trigger it manually on request?

I don't see a straightforward way to do that yet. For now it'll just build on every commit.

I think you switched this over, right @hydrosquall? Can we exclude docs: ... as well?

Switching it over this evening! I'll have it exclude the docs/* path too