summaryrefslogtreecommitdiff
path: root/doc/development/fe_guide/vue.md
diff options
context:
space:
mode:
Diffstat (limited to 'doc/development/fe_guide/vue.md')
-rw-r--r--doc/development/fe_guide/vue.md8
1 files changed, 5 insertions, 3 deletions
diff --git a/doc/development/fe_guide/vue.md b/doc/development/fe_guide/vue.md
index 2a0556c6cda..58a8332589d 100644
--- a/doc/development/fe_guide/vue.md
+++ b/doc/development/fe_guide/vue.md
@@ -64,11 +64,11 @@ which will make the tests easier. See the following example:
```javascript
// haml
-.js-vue-app{ data: { endpoint: 'foo' }}
+#js-vue-app{ data: { endpoint: 'foo' }}
// index.js
document.addEventListener('DOMContentLoaded', () => new Vue({
- el: '.js-vue-app',
+ el: '#js-vue-app',
data() {
const dataset = this.$options.el.dataset;
return {
@@ -85,6 +85,8 @@ document.addEventListener('DOMContentLoaded', () => new Vue({
}));
```
+> When adding an `id` attribute to mount a Vue application, please make sure this `id` is unique across the codebase
+
#### Accessing the `gl` object
When we need to query the `gl` object for data that won't change during the application's life cycle, we should do it in the same place where we query the DOM.
@@ -283,7 +285,7 @@ describe('~/todos/app.vue', () => {
### Test the component's output
The main return value of a Vue component is the rendered output. In order to test the component we
-need to test the rendered output. [Vue](https://vuejs.org/v2/guide/unit-testing.html) guide's to unit test show us exactly that:
+need to test the rendered output. Visit the [Vue testing guide](https://vuejs.org/v2/guide/testing.html#Unit-Testing).
### Events