Merge pull request #1354 from Incognitus-Io/dev

Add provided/inject support for Composition API components

Author: JessicaSachs

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+  "javascript.validate.enable": false,
+  "flow.pathToFlow": "${workspaceFolder}/node_modules/.bin/flow"
+}

package.json

@@ -88,5 +88,8 @@
     "vuex": "^3.0.1",
     "webpack": "^3.0.1",
     "webpack-node-externals": "^1.6.0"
+  },
+  "devDependencies": {
+    "@vue/composition-api": "^0.3.2"
   }
 }

packages/create-instance/create-instance.js

@@ -82,6 +82,7 @@ export default function createInstance(
   const parentComponentOptions = options.parentComponent || {}
 
   parentComponentOptions.provide = options.provide
+  parentComponentOptions._provided = options.provide
   parentComponentOptions.$_doNotStubChildren = true
   parentComponentOptions._isFunctionalContainer = componentOptions.functional
   parentComponentOptions.render = function(h) {

test/resources/components/component-with-inject-composition.vue

@@ -0,0 +1,20 @@
+<template>
+  <div>{{ fromMount }}</div>
+</template>
+
+<script>
+import { createComponent, inject, ref } from '@vue/composition-api'
+
+export default createComponent({
+  name: 'component-with-inject-composition',
+  setup: () => {
+    const fromMount = inject('fromMount')
+    const setInSetup = ref('created')
+
+    return {
+      fromMount,
+      setInSetup
+    }
+  }
+})
+</script>

test/specs/mounting-options/provide.spec.js

@@ -1,8 +1,11 @@
 import { config } from '~vue/test-utils'
+import { createLocalVue } from '~vue/test-utils'
 import ComponentWithInject from '~resources/components/component-with-inject.vue'
+import CompositionComponentWithInject from '~resources/components/component-with-inject-composition.vue'
 import { injectSupported } from '~resources/utils'
 import { describeWithShallowAndMount } from '~resources/utils'
 import { itDoNotRunIf, itSkipIf } from 'conditional-specs'
+import VueCompositionApi from '@vue/composition-api'
 
 describeWithShallowAndMount('options.provide', mountingMethod => {
   let configProvideSave
@@ -58,6 +61,23 @@ describeWithShallowAndMount('options.provide', mountingMethod => {
     }
   )
 
+  itDoNotRunIf(
+    !injectSupported || mountingMethod.name === 'renderToString',
+    'supports setup in composition api component',
+    () => {
+      if (!injectSupported) return
+
+      const localVue = createLocalVue()
+      localVue.use(VueCompositionApi)
+      const wrapper = mountingMethod(CompositionComponentWithInject, {
+        provide: { fromMount: '_' },
+        localVue
+      })
+
+      expect(wrapper.vm.setInSetup).to.equal('created')
+    }
+  )
+
   itSkipIf(
     mountingMethod.name === 'renderToString',
     'injects the provide from the config',
@@ -86,6 +106,21 @@ describeWithShallowAndMount('options.provide', mountingMethod => {
     }
   )
 
+  itDoNotRunIf(
+    !injectSupported,
+    'injects in a composition api component',
+    () => {
+      const localVue = createLocalVue()
+      localVue.use(VueCompositionApi)
+      const wrapper = mountingMethod(CompositionComponentWithInject, {
+        provide: { fromMount: '_' },
+        localVue
+      })
+
+      expect(wrapper.html()).to.contain('_')
+    }
+  )
+
   it('config with function throws', () => {
     config.provide = () => {}
 

yarn.lock

@@ -810,6 +810,13 @@
     source-map "^0.5.6"
     vue-template-es2015-compiler "^1.6.0"
 
+"@vue/composition-api@^0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@vue/composition-api/-/composition-api-0.3.2.tgz#2d797028e489bf7812f08c7bb33ffd03ef23c617"
+  integrity sha512-fD4dn9cJX62QSP2TMFLXCOQOa+Bu2o7kWDjrU/FNLkNqPPcCKBLxCH/Lc+gNCRBKdEUGyI3arjAw7j0Yz1hnvw==
+  dependencies:
+    tslib "^1.9.3"
+
 "@webassemblyjs/ast@1.4.3":
   version "1.4.3"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.4.3.tgz#3b3f6fced944d8660273347533e6d4d315b5934a"
@@ -4491,9 +4498,10 @@ flatten@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
 
-flow-bin@^0.66.0:
-  version "0.66.0"
-  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.66.0.tgz#a96dde7015dc3343fd552a7b4963c02be705ca26"
+flow-bin@^0.111.0:
+  version "0.111.3"
+  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.111.3.tgz#8653a413400ebc966097a47c81fb4e6b722a5921"
+  integrity sha512-Gn27aRTjSFicukZ/pq3raRERmSk9UWszhIK9eNtj6843L54YtK+jk2OkQWV70+VKi9LmWyfItCkhwoIVy7L2lA==
 
 flow-remove-types-no-whitespace@^1.0.3:
   version "1.0.5"
@@ -9600,6 +9608,11 @@ trough@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.1.tgz#a9fd8b0394b0ae8fff82e0633a0a36ccad5b5f86"
 
+tslib@^1.9.3:
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a"
+  integrity sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==
+
 tty-browserify@0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"