feat: enable onload callbacks (#414)

* refactor(examples): run ssr example from server

* chore: switch to babel for build

buble complains too much

* feat: enable loaded callbacks

feat: add skip option

* examples: add async-callback browser example

* examples: fix server

* examples(ssr): add reactive script with callback

* fix: also skip on ssr

* chore: remove unused var

* feat: only add mutationobserver if DOM is still loading

feat: disconnect mutation observer once DOM has loaded

* examples: pass vmid to loadCallback instead of el

* feat: also support load callbacks for link/style tags

* test: add unit tests for load

* test: add load e2e test

* chore: fix lint

* chore: remove unused files

* test: fix e2e load callback test

* test: fix attempt

* examples: ie9 compatiblity

destructuring doesnt work in ie9

* fix: add onload attribute on ssr

dont rely on mutationobserver

* chore: lint ci conf

* refactor: remove loadCallbackAttribute config option

test: fix coverage for load

* test: improve coverage

* fix: only use console when it exists (for ie9)

* chore: fix coverage

test/utils/build.js

@@ -2,11 +2,14 @@ import path from 'path'
 import fs from 'fs-extra'
 import { template } from 'lodash'
 import webpack from 'webpack'
+import CopyWebpackPlugin from 'copy-webpack-plugin'
 import VueLoaderPlugin from 'vue-loader/lib/plugin'
 import { createRenderer } from 'vue-server-renderer'
 
 const renderer = createRenderer()
 
+export { default as getPort } from 'get-port'
+
 export function webpackRun (config) {
   const compiler = webpack(config)
 
@@ -50,13 +53,22 @@ export async function buildFixture (fixture, config = {}) {
   const templateFile = await fs.readFile(path.resolve(fixturePath, '..', 'app.template.html'), { encoding: 'utf8' })
   const compiled = template(templateFile, { interpolate: /{{([\s\S]+?)}}/g })
 
-  const webpackAssets = webpackStats.assets.reduce((s, asset) => `${s}<script src="./${asset.name}"${asset.name.includes('chunk') ? '' : ' defer'}></script>\n`, '')
+  const assets = webpackStats.assets.filter(asset => !asset.name.includes('load-test'))
+
+  const headAssets = assets
+    .filter(asset => asset.name.includes('chunk'))
+    .reduce((s, asset) => `${s}<script src="./${asset.name}"></script>\n`, '')
+
+  const bodyAssets = assets
+    .filter(asset => !asset.name.includes('chunk'))
+    .reduce((s, asset) => `${s}<script src="./${asset.name}"></script>\n`, '')
+
   const app = await renderer.renderToString(vueApp)
   // !!! run inject after renderToString !!!
   const metaInfo = vueApp.$meta().inject()
 
   const appFile = path.resolve(webpackStats.outputPath, 'index.html')
-  const html = compiled({ app, webpackAssets, ...metaInfo })
+  const html = compiled({ app, headAssets, bodyAssets, ...metaInfo })
 
   await fs.writeFile(appFile, html)
 
@@ -125,7 +137,10 @@ export function createWebpackConfig (config = {}) {
           // make sure our simple polyfills are enabled
           'NODE_ENV': '"test"'
         }
-      })
+      }),
+      new CopyWebpackPlugin([
+        { from: path.join(path.dirname(config.entry), 'static') }
+      ])
     ],
     resolve: {
       alias: {