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/unit/updaters.test.js

@@ -1,8 +1,9 @@
 import _updateClientMetaInfo from '../../src/client/updateClientMetaInfo'
-import { defaultOptions } from '../../src/shared/constants'
+import { defaultOptions, ssrAppId, ssrAttribute } from '../../src/shared/constants'
 import metaInfoData from '../utils/meta-info-data'
+import * as load from '../../src/client/load'
 
-const updateClientMetaInfo = (type, data) => _updateClientMetaInfo('test', defaultOptions, { [type]: data })
+const updateClientMetaInfo = (type, data) => _updateClientMetaInfo(ssrAppId, defaultOptions, { [type]: data })
 
 describe('updaters', () => {
   let html
@@ -14,7 +15,7 @@ describe('updaters', () => {
     Array.from(html.getElementsByTagName('meta')).forEach(el => el.parentNode.removeChild(el))
   })
 
-  Object.keys(metaInfoData).forEach((type) => {
+  for (const type in metaInfoData) {
     const typeTests = metaInfoData[type]
 
     const testCases = {
@@ -93,5 +94,22 @@ describe('updaters', () => {
         }
       })
     })
+  }
+})
+
+describe('extra tests', () => {
+  test('adds callback listener on hydration', () => {
+    const addListeners = load.addListeners
+    const addListenersSpy = jest.spyOn(load, 'addListeners').mockImplementation(addListeners)
+
+    const html = document.getElementsByTagName('html')[0]
+    html.setAttribute(ssrAttribute, 'true')
+
+    const data = [{ src: 'src1', [defaultOptions.tagIDKeyName]: 'content', callback: () => {} }]
+    const tags = updateClientMetaInfo('script', data)
+
+    expect(tags).toBe(false)
+    expect(html.hasAttribute(ssrAttribute)).toBe(false)
+    expect(addListenersSpy).toHaveBeenCalledTimes(1)
   })
 })