use <script type="module"> in tests

yyx990803 · yyx990803 · commit 8137aacfece4 · 2018-02-01T22:34:16.000-05:00
diff --git a/test/fixtures/attributes.html b/test/fixtures/attributes.html
@@ -1,23 +1,23 @@
 <script src="../../node_modules/vue/dist/vue.js"></script>
-<script>
-import('../../src/index.js').then(module => {
-  window.customElements.define('my-element', module.default(Vue, {
-    template: `<div>{{ foo }} {{ bar }} {{ someNumber }}</div>`,
-    props: {
-      foo: {
-        type: Boolean
-      },
-      bar: {
-        type: Boolean
-      },
-      someNumber: {
-        type: Number
-      }
+<script type="module">
+import wrap from '../../src/index.js'
+
+customElements.define('my-element', wrap(Vue, {
+  template: `<div>{{ foo }} {{ bar }} {{ someNumber }}</div>`,
+  props: {
+    foo: {
+      type: Boolean
+    },
+    bar: {
+      type: Boolean
+    },
+    someNumber: {
+      type: Number
     }
-  }))
-  window.el = document.querySelector('my-element')
-  console.log('ready')
-})
+  }
+}))
+
+window.el = document.querySelector('my-element')
 </script>
 
 <my-element foo="foo" bar="true" some-number="123"></my-element>
diff --git a/test/fixtures/events.html b/test/fixtures/events.html
@@ -1,17 +1,18 @@
 <script src="../../node_modules/vue/dist/vue.js"></script>
-<script>
-import('../../src/index.js').then(module => {
-  window.customElements.define('my-element', module.default(Vue, {
-    template: `<div>
-      <button @click="$emit('foo', 123)">Emit</button>
-    </div>`
-  }))
-  window.el = document.querySelector('my-element')
-  el.addEventListener('foo', e => {
-    window.emitted = true
-    window.emittedDetail = e.detail
-  })
-  console.log('ready')
+<script type="module">
+import wrap from '../../src/index.js'
+
+customElements.define('my-element', wrap(Vue, {
+  template: `<div>
+    <button @click="$emit('foo', 123)">Emit</button>
+  </div>`
+}))
+
+window.el = document.querySelector('my-element')
+
+el.addEventListener('foo', e => {
+  window.emitted = true
+  window.emittedDetail = e.detail
 })
 </script>
 
diff --git a/test/fixtures/lifecycle.html b/test/fixtures/lifecycle.html
@@ -1,24 +1,24 @@
 <script src="../../node_modules/vue/dist/vue.js"></script>
-<script>
-import('../../src/index.js').then(module => {
-  window.customElements.define('my-element', module.default(Vue, {
-    template: `<div></div>`,
-    created () {
-      console.log('created')
-    },
-    mounted () {
-      console.log('mounted')
-    },
-    activated () {
-      console.log('activated')
-    },
-    deactivated () {
-      console.log('deactivated')
-    }
-  }))
-  window.el = document.querySelector('my-element')
-  console.log('ready')
-})
+<script type="module">
+import wrap from '../../src/index.js'
+
+customElements.define('my-element', wrap(Vue, {
+  template: `<div></div>`,
+  created () {
+    console.log('created')
+  },
+  mounted () {
+    console.log('mounted')
+  },
+  activated () {
+    console.log('activated')
+  },
+  deactivated () {
+    console.log('deactivated')
+  }
+}))
+
+window.el = document.querySelector('my-element')
 </script>
 
 <my-element></my-element>
diff --git a/test/fixtures/properties.html b/test/fixtures/properties.html
@@ -1,22 +1,22 @@
 <script src="../../node_modules/vue/dist/vue.js"></script>
-<script>
-import('../../src/index.js').then(module => {
-  window.customElements.define('my-element', module.default(Vue, {
-    template: `<div>{{ foo }} {{ someProp }}</div>`,
-    props: {
-      foo: {
-        type: Number,
-        default: 123
-      },
-      'some-prop': {
-        type: String,
-        default: 'bar'
-      }
+<script type="module">
+import wrap from '../../src/index.js'
+
+customElements.define('my-element', wrap(Vue, {
+  template: `<div>{{ foo }} {{ someProp }}</div>`,
+  props: {
+    foo: {
+      type: Number,
+      default: 123
+    },
+    'some-prop': {
+      type: String,
+      default: 'bar'
     }
-  }))
-  window.el = document.querySelector('my-element')
-  console.log('ready')
-})
+  }
+}))
+
+window.el = document.querySelector('my-element')
 </script>
 
 <my-element></my-element>
diff --git a/test/fixtures/slots.html b/test/fixtures/slots.html
@@ -1,14 +1,14 @@
 <script src="../../node_modules/vue/dist/vue.js"></script>
-<script>
-import('../../src/index.js').then(module => {
-  window.customElements.define('my-element', module.default(Vue, {
-    template: `
-      <div><slot/><slot name="foo"/></div>
-    `,
-  }))
-  window.el = document.querySelector('my-element')
-  console.log('ready')
-})
+<script type="module">
+import wrap from '../../src/index.js'
+
+customElements.define('my-element', wrap(Vue, {
+  template: `
+    <div><slot/><slot name="foo"/></div>
+  `,
+}))
+
+window.el = document.querySelector('my-element')
 </script>
 
 <my-element>
diff --git a/test/test.js b/test/test.js
@@ -12,14 +12,10 @@ async function launchPage (name) {
   const url = `http://localhost:${port}/test/fixtures/${name}.html`
   const page = await browser.newPage()
   const logs = []
-  const ready = new Promise(resolve => {
-    page.on('console', msg => {
-      logs.push(msg.text())
-      if (msg.text() === `ready`) resolve()
-    })
+  page.on('console', msg => {
+    logs.push(msg.text())
   })
   await page.goto(url)
-  await ready
   return { browser, page, logs }
 }
 
