feat: extend Vue with plugins for #5

Author: bahmutov

README.md

@@ -109,6 +109,23 @@ const extensions = {
 beforeEach(mountVue({ template, data }, { extensions }))
 ```
 
+See [Vue component docs](https://vuejs.org/v2/api/#Vue-component),
+[message-list-spec.js](cypress/integration/message-list-spec.js)
+
+* `use` - list of plugins
+
+```js
+const use = [MyPlugin]
+// extend Vue with plugins
+const extensions = {
+  use
+}
+beforeEach(mountVue({}, { extensions }))
+```
+
+See [Vue plugin docs](https://vuejs.org/v2/guide/plugins.html)
+and [plugin-spec.js](cypress/integrstion/plugin-spec.js)
+
 ### The intro example
 
 Take a look at the first Vue v2 example:

components/MyPlugin.js

@@ -0,0 +1,9 @@
+// https://vuejs.org/v2/guide/plugins.html
+export const MyPlugin = {
+  install (Vue, options) {
+    // 1. add global method or property
+    Vue.aPluginMethod = function () {
+      return 'foo'
+    }
+  }
+}

cypress/integration/plugin-spec.js

@@ -0,0 +1,21 @@
+import { MyPlugin } from '../../components/MyPlugin'
+const mountVue = require('../..')
+
+/* eslint-env mocha */
+describe('Custom plugin MyPlugin', () => {
+  const use = [MyPlugin]
+
+  // extend Vue with plugins
+  const extensions = {
+    use
+  }
+  beforeEach(mountVue({}, { extensions }))
+
+  it('registers global method on Vue instance', () => {
+    cy.window().its('Vue').its('aPluginMethod').should('be.a', 'function')
+  })
+
+  it('can call this global function', () => {
+    cy.window().its('Vue').invoke('aPluginMethod').should('equal', 'foo')
+  })
+})

src/index.js

@@ -99,6 +99,15 @@ const registerGlobalComponents = (Vue, options) => {
   }
 }
 
+const installPlugins = (Vue, options) => {
+  const plugins = Cypress._.get(options, 'extensions.use')
+  if (Cypress._.isArray(plugins)) {
+    plugins.forEach(plugin => {
+      Vue.use(plugin)
+    })
+  }
+}
+
 const mountVue = (component, options = {}) => () => {
   const vueHtml = getPageHTML(options)
   const document = cy.state('document')
@@ -111,6 +120,7 @@ const mountVue = (component, options = {}) => () => {
     .window({ log: false })
     .its('Vue')
     .then(Vue => {
+      installPlugins(Vue, options)
       registerGlobalComponents(Vue, options)
       deleteCachedConstructors(component)
       Cypress.vue = new Vue(component).$mount('#app')