@@ -655,6 +655,51 @@ For other libraries you can use, please see [Loaders section of **vuejs/awesome-
655655Use ` npm run dev-vuex ` , ` npm run dev-vue ` or ` npm run dev-wrap ` commands.
656656for running examples locally.
657657
658+ ## ✔ Testing components
659+
660+ You can test components using ` vue-wait ` but it requires configuration. Let's take a basic component for instance:
661+
662+ ``` vue
663+ <v-wait for="loading">
664+ <Spinner slot="waiting" />
665+ <ul class="suggestions">
666+ <li v-for="suggestion in suggestions">{{ suggestion.Name }}</li>
667+ </ul>
668+ </v-wait>
669+ ```
670+
671+ ``` js
672+ const localVue = createLocalVue ();
673+ localVue .use (Vuex); // optionally when you use Vuex integration
674+
675+ it (' uses vue-wait component' , () => {
676+ const wrapper = shallowMount (Suggestions, { localVue });
677+ expect (wrapper .find (' .suggestions' ).exists ()).toBe (true );
678+ });
679+ ```
680+
681+ ` vue-test-utils ` will replace ` v-wait ` component with an empty ` div ` , making it difficult to test correctly.
682+
683+ First, make your local Vue instance use ` vue-wait ` ,
684+
685+ ``` js
686+ const localVue = createLocalVue ();
687+ localVue .use (Vuex); // optionally when you use Vuex integration
688+ localVue .use (VueWait);
689+ ```
690+
691+ Then inject the ` wait ` property using ` VueWait ` constructor,
692+
693+ ``` js
694+ it (' uses vue-wait component' , () => {
695+ const wrapper = shallowMount (SuggestedAddresses, {
696+ localVue,
697+ wait: new VueWait ()
698+ });
699+ expect (wrapper .find (' .suggestions' ).exists ()).toBe (true ); // it works!
700+ });
701+ ```
702+
658703## 🎯 Contributors
659704
660705 - Fatih Kadir Akın, (creator)
0 commit comments