You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/en/guides/getting-started.md
+8-8Lines changed: 8 additions & 8 deletions
Original file line number
Diff line number
Diff line change
@@ -41,22 +41,22 @@ export default {
41
41
42
42
`vue-test-utils` teste les composants Vue en les isolants puis en les montant, il simule les entrées nécessaires (props, injections et événements utilisateur) et asserte les sorties (le rendu, les événements émis).
43
43
44
-
Les composants montés sont retournés sous un [Wrapper](./api/wrapper.md), qui expose en quantité des méthodes pour manipuler, traverser et interroger l'instance du composant Vue en question.
44
+
Les composants montés sont retournés dans un [Wrapper](./api/wrapper.md), qui expose en quantité des méthodes pour manipuler, traverser et interroger l'instance du composant Vue en question.
45
45
46
46
Vous pouvez créer des wrappers en utilisant la méthode `mount`. Créons un fichier nommé `test.js` :
47
47
48
48
```js
49
49
// test.js
50
50
51
-
// Importe la méthode mount() depuis test utils
51
+
// Importe la méthode `mount()` depuis test utils
52
52
// et le composant qu'on souhaite tester
53
53
import { mount } from'vue-test-utils'
54
54
importCounterfrom'./counter'
55
55
56
56
// On monte le composant et nous voilà avec un wrapper
57
57
constwrapper=mount(Counter)
58
58
59
-
// On accède à l'instance actuelle de Vue via wrapper.vm
59
+
// On accède à l'instance actuelle de Vue via `wrapper.vm`
60
60
constvm=wrapper.vm
61
61
62
62
// Pour inspecter le wrapper en profondeur, utilisez console
@@ -66,7 +66,7 @@ console.log(wrapper)
66
66
67
67
### Tester le contenu du rendu HTML d'un composant
68
68
69
-
Nous avons maintenant un wrapper, la première chose que l'on peut faire et de vérifier que le contenu du rendu HTML du composant correspond à ce qu'il est sensé être.
69
+
Nous avons maintenant un wrapper, la première chose que l'on peut faire est de vérifier que le contenu du rendu HTML du composant correspond à ce qu'il est censé être.
// c'est auss très simple de vérifier qu'un élement existe
83
+
// c'est aussi très simple de vérifier qu'un élement existe
84
84
it('a un bouton', () => {
85
85
expect(wrapper.contains('button')).toBe(true)
86
86
})
@@ -104,11 +104,11 @@ it('le clic sur le bouton devrait incrémenter le compteur', () => {
104
104
105
105
### Et quid de `nextTick` ?
106
106
107
-
Vue groupe les mises à jour du DOM en attentes puis les appliquent de façon asynchrone pour prévenir d'éventuel multiples rendus causé par de multiples mutations de données. C'est pourquoi en pratique, on a souvent à utiliser `Vue.nextTick` pour attendre que Vue modifie le DOM actuel après avoir lancé quelques changements d'état.
107
+
Vue groupe les mises à jour du DOM en attentes puis les appliquent de façon asynchrone pour prévenir d'éventuel multiples rendus causés par de multiples mutations de données. C'est pourquoi en pratique, on a souvent à utiliser `Vue.nextTick` pour attendre que Vue modifie le DOM actuel après avoir lancé quelques changements d'état.
108
108
109
-
Pour simplifier cela, `vue-test-utils` applique toutes les mises à jour de façon synchrone afin que vous n'ayez pas besin d'utiliser `Vue.nextTick` pour attendre des mises à jour du DOM dans vos tests.
109
+
Pour simplifier cela, `vue-test-utils` applique toutes les mises à jour de façon synchrone afin que vous n'ayez pas besoin d'utiliser `Vue.nextTick` pour attendre des mises à jour du DOM dans vos tests.
110
110
111
-
*Note : `nextTick` est encore nécessaire quand vous souhaitez explicitement faire avancer la boucle des événements, pour des opérations telles que des fonctions de rappel ou des résolutions de promise.*
111
+
*Note : `nextTick` est toujours nécessaire quand vous souhaitez explicitement faire avancer la boucle des événements, pour des opérations telles que des fonctions de rappel ou des résolutions de promesses.*
0 commit comments