nuxt/cli

Proposal: init test setup with Nuxi

Opened this issue · 4 comments

One thing I'm really missing from nuxi is a way to quickly initialise a test setup.

My proposal is that after people have initialised a project with nuxi init, they can run a command like nuxi add tests or nuxi tests init which will start a small wizard to set up everything related to testing.

Running this command will:

  • install vitest, @nuxt/test-utils vitest-environment-nuxt
  • adds a vitest.config.ts
  • Asks to add @vue/test-utils or @testing-library/vue for unit testing
  • Asks to add happy-dom or jsdom
  • Asks to add playwright for e2e testing
  • Sets up vitest.config accordingly

I'd be down to contribute with a PR, but first I'm interested in some feedback! What do you think of this?

pi0 commented

Hi. I think it is a nice idea. I think we can move it forward in two directions:

  1. A new app-test template in nuxt/starter that can initialize /test directory. Using nuxi init -t test --install can achieve (almost) the same result
  2. Later integrate it with upcoming scaffolding tooling to allow defining the above steps without the need of a template (old tracker: #57)
  • A new app-test template in nuxt/starter that can initialize /test directory. Using nuxi init -t test --install can achieve (almost) the same result

I am not super familiar with the starter templates, but will this allow for a wizard like approach like asking for playwright etc, or can this only create a project from a template without any options?

I'm assuming this allows to only create a starter template with tests, and not a combination of module and tests? I feel that this is too limiting, as in the ideal world it should be easy to add tests anywhere in a nuxt project. For instance, I'm creating Layers often, it would be really nice to have one command take care of it all.

My vision is that testing Nuxt applications (and with that, setting up testing) should be just as easy and fun as it is to work with the other aspects of Nuxt. That is why your second suggestion:

  • Later integrate it with upcoming scaffolding tooling to allow defining the above steps without the need of a template (old tracker: #57)

sounds like the ideal solution. If there is any way I can help making this a reality, let's have a chat.

pi0 commented

I am not super familiar with the starter templates, but will this allow for a wizard-like approach like asking for a playwright, etc, or can this only create a project from a template without any options?

We need to make multiple starters (check branches). It is a current limitation that will be solvable with (2) indeed.

I will keep you/this issue posted on any progress but i think adding a starter template for app testing even if limited might be a good start wdyt?

I will keep you/this issue posted on any progress but i think adding a starter template for app testing even if limited might be a good start wdyt?

thanks for keeping us posted!

I'm a bit on the fence if I think the starter template is a good start, my reasonings being:

For my personal situation, I rarely need e2e tests. This would mean I'd have to manually remove e2e tests, or, there should be the following branches:

  • test-unit
  • test-e2e
  • test-e2e-unit

Personally, I prefer @testing-library, but of course this feature is not for me alone - another person might prefer @vue/test-utils, so then we'd have to branch out more. Or, we keep things very simple, but that would mean having to go back in the code and remove or change packages - which at that point is as much work as just initialising the tests yourself.

If i'd have to go back in the code and change things every time I would just be annoyed by the feature and probably not use it at all. But having this feature does mean having all these branches, and keeping them up to date, and having the docs to make people aware this exists.

With that, I really think it's better to wait when we can build something which works really well!