Skip to content

Commit 6e6888a

Browse files
authored
docs: follow-up fixes for the conditional rendering guide (#2744)
1 parent 12eb728 commit 6e6888a

File tree

3 files changed

+11
-14
lines changed

3 files changed

+11
-14
lines changed

docs/fr/guide/essentials/conditional-rendering.md

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -38,13 +38,13 @@ Nous pouvons vérifier le contenu du lien de profil en utilisant `get()` :
3838

3939
```js
4040
test('affiche le lien du profil', () => {
41-
const wrapper = mount(Nav);
41+
const wrapper = mount(Nav)
4242

4343
// Ici, nous vérifions implicitement que l'élément #profile existe.
44-
const profileLink = wrapper.get('#profile');
44+
const profileLink = wrapper.get('#profile')
4545

46-
expect(profileLink.text()).toEqual('Mon Profil');
47-
});
46+
expect(profileLink.text()).toEqual('Mon Profil')
47+
})
4848
```
4949

5050
Si `get()` ne retourne pas un élément correspondant au sélecteur, il enverra une erreur et votre test échouera. `get()` retourne un `DOMWrapper` si un élément est trouvé. Un `DOMWrapper` est une fine enveloppe autour de l'élément DOM qui implémente l'[API Wrapper](/fr/api/#Methodes-de-Wrapper) - c'est pourquoi nous pouvons exécuter `profileLink.text()` et accéder au texte. Vous pouvez accéder à l'élément brut en utilisant la propriété `element`.
@@ -58,12 +58,12 @@ Il existe un autre type d'enveloppe - un `VueWrapper` - qui est retourné par [`
5858
Pour ce faire, nous utilisons plutôt `find()` et `exists()`. Le prochain test vérifie que si `admin` est `false` (ce qui est par défaut), le lien administrateur ne sera pas présent :
5959

6060
```js
61-
test('n\'affiche pas le lien admin', () => {
62-
const wrapper = mount(Nav);
61+
test("n'affiche pas le lien admin", () => {
62+
const wrapper = mount(Nav)
6363

6464
// Utiliser `wrapper.get` renverrait une erreur et ferait échouer le test.
65-
expect(wrapper.find('#admin').exists()).toBe(false);
66-
});
65+
expect(wrapper.find('#admin').exists()).toBe(false)
66+
})
6767
```
6868

6969
Remarquez que nous appelons `exists()` sur la valeur retournée par `.find()`. `find()`, comme `mount()`, retourne également un `wrapper`. `mount()` a quelques méthodes supplémentaires, car il enveloppe un composant Vue, et `find()` ne retourne qu'un nœud DOM standard, mais de nombreuses méthodes sont partagées entre les deux. D'autres méthodes incluent `classes()` qui retournera les classes qu'un nœud DOM a, ou encore `trigger()`, qui simulera une interaction utilisateur. Vous pouvez trouver une liste des méthodes prises en charge [ici](../../api/#Methodes-de-Wrapper).
@@ -108,15 +108,14 @@ Les tests pour les scénarios utilisant `v-show` ressembleront à ceci :
108108

109109
```js
110110
test("n'affiche pas le menu déroulant de l'utilisateur", () => {
111-
const wrapper = mount(Nav);
111+
const wrapper = mount(Nav)
112112

113-
expect(wrapper.get('#user-dropdown').isVisible()).toBe(false);
114-
});
113+
expect(wrapper.get('#user-dropdown').isVisible()).toBe(false)
114+
})
115115
```
116116

117117
## Conclusion
118118

119119
- Utilisez `find()` avec `exists()` pour vérifier si un élément est dans le DOM.
120120
- Utilisez `get()` si vous vous attendez à ce que l'élément soit dans le DOM.
121-
- L'option de `mount()` `data` peut être utilisée pour définir des valeurs par défaut sur un composant.
122121
- Utilisez `get()` avec `isVisible()` pour vérifier la visibilité d'un élément qui est dans le DOM.

docs/guide/essentials/conditional-rendering.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -119,5 +119,4 @@ test('does not show the user dropdown', () => {
119119

120120
- Use `find()` along with `exists()` to verify whether an element is in the DOM.
121121
- Use `get()` if you expect the element to be in the DOM.
122-
- The `data` mounting option can be used to set default values on a component.
123122
- Use `get()` with `isVisible()` to verify the visibility of an element that is in the DOM

docs/zh/guide/essentials/conditional-rendering.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,5 +118,4 @@ test('does not show the user dropdown', () => {
118118

119119
- 使用 `find()` 结合 `exists()` 验证元素是否在于 DOM 中。
120120
- 如果你确认元素存在于 DOM 中,就使用 `get()`
121-
- 可以使用 `data` 挂载选项设置组件的默认值。
122121
- 使用 `get()``isVisible()` 验证在 DOM 中元素的可见性。

0 commit comments

Comments
 (0)