feat: add Playwright for end-to-end testing

[mxschmitt]

Hello, 👋
Playwright is getting more and more traction over the last years and we should provide users an easy integration with the Vue ecosystem so users benefit from it.
This Pull Request adds Playwright as an end-to-end testing solution like it's done for Cypress. It might make sense to throw an error if the user selects both variants for e2e testing.

We'll follow-up once the component testing story with Playwright and Vite is ready.

Thank you

cc @sodatea

[haoqunjiang]

The CI is failing. I think we need to also skip playwright tests in scripts/test.mjs since it requires different environment.

[mxschmitt]

Applied the review feedback, sorry for the late response! Not sure if we should skip it inside the integration tests or run them - with my new implementation we run them.

(Would also be awesome if you could "lax" the GitHub Action permissions a big, so you don't have to approve all the time here)

[haoqunjiang]

Sorry for the late review.

I've tried the PR locally and it's quite a joy to test it.
Just a few nitpicks that needs to be improved.

[haoqunjiang]

Why changing this line?

[mxschmitt]

Otherwise vitest tries to process the playwright test files as well, this won't work and lead to errors. Maybe there is a better way of handling that?

[ptrgast]

Hello! It seems that this addition introduces a problem. When running Vitest it tries to create a results.json inside its cache directory. This directory is defined as resolve(root, slash(dir || 'node_modules/.vitest')). This means that with --root src/ added, Vitest creates the results.json inside the <project_root>/src/node_modules/.vitest instead of the actual node_modules directory (<project_root>/node_modules/.vitest).

[mxschmitt]

Sorry for the late review.

I've tried the PR locally and it's quite a joy to test it. Just a few nitpicks that needs to be improved.

No worries, was out of office myself so I did not notice at all. Applied the suggestions. Lets see what results the CI will give us.

[stefnotch]

Out of curiosity, what's the current status on this? Playwright definitely is an interesting alternative to Cypress, so having it in there as an easy-to-access option seems lovely.

[sand4rt]

@mxschmitt I wonder why this PR is closed?😕

[mxschmitt]

@sodatea sorry for the huge delay, I was partially ooo back then and then I forgot about it.

Would be nice if you could enable GitHub Actions for contributors, this makes me easier to ensure its all green instead of having to wait for a maintainer to click approve.

I hope I addressed the comments, if not, please let me know!

The updates Playground PR are here: vuejs/create-vue-templates#1

---

@sand4rt I rebased it!

[haoqunjiang]

It looks good to me now.
Thank you for putting so much effort into this PR!

I'm merging the PR today.

But FYI, before cutting the next release, I'd like to make some adjustments to the workflow of this repo, the tsconfigs, and the CLI prompts, which would take some time.
So I expect this feature to be included in the October release.