Rename test to match components for simple referencing

[travis5491811]

Hello,
I came here through https://testing-library.com/docs/vue-testing-library/examples because I was trying to see how good this might be for use with vue or nuxt. There were only 2 examples on the page and neither used props and the docs said to look at the examples in the repo for more.

While looking at the examples in the repo, I started by exploring components in https://github.com/testing-library/vue-testing-library/tree/master/src/__tests__/components and then once i found a component that had the structure I wanted to test, I went back looking for that component in the test folder, but the test names don't match the names of the components they are testing.

For example this test (simple-button.js) is for this button (Button.vue). Is there some reasoning behind not using naming conventions (button.js, Button.vue, fetch.js, Fetch.vue or fetch-axios-mock, Fetch.vue instead of axios-mock.js, Fetch.vue) that will make it straight forward for people new to the project to follow the examples?

[afontcu]

Hi! Thank you for your feedback! There's no reasoning other than examples, tests, and components have been evolving differently and without clear structure :)

Form your comment, I see two main quick wins:

1. Add some props to the main examples of testing-library.com. It is quite a common use case.
2. Improve naming, and make sure test files match Vue components. This won't be so easy, because some dummy components are used in two different test files. Now, we could simply duplicate them.

Fancy to open up a PR fixing up some of these issues? :)

[travis5491811]

@afontcu Yes, no problem. PR's added for 1 and 2.

[afontcu]

Closing as this as names are already updated :) thanks!