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: src/v2/guide/unit-testing.md
+10-10
Original file line number
Diff line number
Diff line change
@@ -6,11 +6,11 @@ order: 23
6
6
7
7
## Outils et mise en place
8
8
9
-
N'importe quoi de compatible avec un module basé sur un système de build va fonctionner. Mais si vous hésitez sur le choix d'un outil en particulier, essayez le lanceur de tests [Karma](http://karma-runner.github.io). Il y a beaucoup de plugins communautaires, incluant le support de [webpack](https://github.com/webpack/karma-webpack) et [Browserify](https://github.com/Nikku/karma-browserify). Pour une mise en place détaillée, référez-vous à la documentation respective de chaque projet. Ces exemples de configuration de Karma pour [webpack](https://github.com/vuejs-templates/webpack/blob/master/template/test/unit/karma.conf.js) et [Browserify](https://github.com/vuejs-templates/browserify/blob/master/template/karma.conf.js) pourront vous aider à démarrer.
9
+
N'importe quoi de compatible avec un module basé sur un système de build basé sur les modules va fonctionner. Mais si vous cherchez une recommandation particulière, essayez le lanceur de tests [Karma](http://karma-runner.github.io). Il y a beaucoup de plugins communautaires, incluant le support de [webpack](https://github.com/webpack/karma-webpack) et [Browserify](https://github.com/Nikku/karma-browserify). Pour une mise en place détaillée, référez-vous à la documentation respective de chaque projet. Ces exemples de configuration de Karma pour [webpack](https://github.com/vuejs-templates/webpack/blob/master/template/test/unit/karma.conf.js) et [Browserify](https://github.com/vuejs-templates/browserify/blob/master/template/karma.conf.js) pourront vous aider à démarrer.
10
10
11
-
## De simples assertions
11
+
## Des assertions simples
12
12
13
-
En terme de structure de test de code, vous n'avez rien de spécial à faire dans vos composants pour les rendre testables. Exportez simplement son objet d'options :
13
+
En termes de structure de code pour les tests, vous n'avez rien de spécial à faire dans vos composants pour les rendre testables. Exportez juste les options en l'état :
14
14
15
15
```html
16
16
<template>
@@ -31,7 +31,7 @@ En terme de structure de test de code, vous n'avez rien de spécial à faire dan
31
31
</script>
32
32
```
33
33
34
-
Quand vous testez ce composant, tout ce que vous avez à faire est d'importer l'objet d'options avec un objet Vue pour faire des assertions communes :
34
+
Quand vous testez ce composant, tout ce que vous avez à faire est d'importer l'objet d'options aux côtés de Vue pour faire une série d'assertions communes :
35
35
36
36
```js
37
37
// Importer Vue et le composant à tester
@@ -71,7 +71,7 @@ describe('MyComponent', () => {
71
71
72
72
## Écrire des composants testables
73
73
74
-
Beaucoup de sortie de rendu de composants sont principalement déterminées selon les props que les composants reçoivent. En fait, si une sortie de rendu de composant dépend uniquement de ses props, il devient très rapide de le tester. Exactement de la même manière qu'on ferrait des assertions sur la valeur de retour d'une fonction standard avec différents arguments. Voici un exemple :
74
+
Une bonne partie du code en sortie du rendu d'un composant est principalement déterminé par les props qu'ils reçoivent. En fait, si le rendu d'un composant dépend uniquement de ses props, il devient assez facile à tester, de la même manière que l'on ferait une assertion sur la valeur de retour d'une fonction pure avec différents arguments. Voici un exemple :
75
75
76
76
```html
77
77
<template>
@@ -99,7 +99,7 @@ function getRenderedText (Component, propsData) {
99
99
}
100
100
101
101
describe('MyComponent', () => {
102
-
it('rendre correctement le message avec différentes props', () => {
102
+
it('donne un rendu correct avec différentes props', () => {
Parce que Vue [fait les mises à jour du DOM de manière asynchrone](reactivity.html#File-d’attente-de-mise-a-jour-asynchrone), les assertions sur les mises à jour du DOM dû à un changement d'état doivent être faites dans une fonction de rappel `Vue.nextTick` :
116
+
Parce que Vue [fait les mises à jour du DOM de manière asynchrone](reactivity.html#File-d’attente-de-mise-a-jour-asynchrone), les assertions sur les mises à jour du DOM résultant d'un changement d'état doivent être faites dans une fonction de rappel `Vue.nextTick` :
117
117
118
118
```js
119
119
// Inspecter le HTML généré après une mise à jour d'état
120
-
it('mettre à jour le message rendu quand `vm.message` est mis à jour', done=> {
120
+
it('met à jour le message rendu quand `vm.message` est mis à jour', done=> {
121
121
constvm=newVue(MyComponent).$mount()
122
122
vm.message='foo'
123
123
@@ -129,4 +129,4 @@ it('mettre à jour le message rendu quand `vm.message` est mis à jour', done =>
129
129
})
130
130
```
131
131
132
-
Nous avons planifié de travailler sur une collection de fonctions utilitaires de tests communs pour rendre encore plus simple les tests de composant de rendu avec différentes contraintes (par ex. des rendus peu profonds ignorant les composants enfants) et faire des assertions de leur sortie.
132
+
Nous prévoyons de travailler sur une collection de fonctions utilitaires de tests communs pour rendre encore plus simple le rendu de composants avec différentes contraintes (par ex. des rendus peu profonds ignorant les composants enfants) et faire des assertions sur le code en sortie.
0 commit comments