test: use build/dist for e2e testing

.circleci/config.yml

@@ -76,7 +76,7 @@ jobs:
       - attach-project
       - run:
           name: E2E SSR Tests
-          command: yarn test:e2e-ssr
+          command: yarn build && yarn test:e2e-ssr
       - persist_to_workspace:
           root: ~/project
           paths:

scripts/rollup.config.js

@@ -40,7 +40,7 @@ function rollupConfig({
     delimiters: ['', ''],
     values: {
       // replaceConfig needs to have some values
-      'const polyfill = process.env.NODE_ENV === \'test\'': 'const polyfill = false',
+      'const polyfill = process.env.NODE_ENV === \'test\'': 'const polyfill = true',
     }
   }
 

src/client/load.js

@@ -30,14 +30,14 @@ export function addCallback (query, callback) {
 export function addCallbacks ({ tagIDKeyName }, type, tags, autoAddListeners) {
   let hasAsyncCallback = false
 
-  for (const tag of tags) {
+  tags.forEach((tag) => {
     if (!tag[tagIDKeyName] || !tag.callback) {
-      continue
+      return
     }
 
     hasAsyncCallback = true
     addCallback(`${type}[data-${tagIDKeyName}="${tag[tagIDKeyName]}"]`, tag.callback)
-  }
+  })
 
   if (!autoAddListeners || !hasAsyncCallback) {
     return hasAsyncCallback
@@ -60,7 +60,7 @@ export function addListeners () {
 }
 
 export function applyCallbacks (matchElement) {
-  for (const [query, callback] of callbacks) {
+  callbacks.forEach(([query, callback]) => {
     const selector = `${query}[onload="this.__vm_l=1"]`
 
     let elements = []
@@ -72,13 +72,13 @@ export function applyCallbacks (matchElement) {
       elements = [matchElement]
     }
 
-    for (const element of elements) {
+    elements.forEach((element) => {
       /* __vm_cb: whether the load callback has been called
        * __vm_l: set by onload attribute, whether the element was loaded
        * __vm_ev: whether the event listener was added or not
        */
       if (element.__vm_cb) {
-        continue
+        return
       }
 
       const onload = () => {
@@ -105,14 +105,14 @@ export function applyCallbacks (matchElement) {
        */
       if (element.__vm_l) {
         onload()
-        continue
+        return
       }
 
       if (!element.__vm_ev) {
         element.__vm_ev = true
 
         element.addEventListener('load', onload)
       }
-    }
-  }
+    })
+  })
 }

src/client/updateClientMetaInfo.js

@@ -25,11 +25,11 @@ export default function updateClientMetaInfo (appId, options = {}, newInfo) {
 
     // add load callbacks if the
     let addLoadListeners = false
-    for (const type of tagsSupportingOnload) {
+    tagsSupportingOnload.forEach((type) => {
       if (newInfo[type] && addCallbacks(options, type, newInfo[type])) {
         addLoadListeners = true
       }
-    }
+    })
 
     if (addLoadListeners) {
       addListeners()

src/client/updaters/tag.js

@@ -13,7 +13,9 @@ import { queryElements, getElementsKey } from '../../utils/elements.js'
 export default function updateTag (appId, options = {}, type, tags, head, body) {
   const { attribute, tagIDKeyName } = options
 
-  const dataAttributes = [tagIDKeyName, ...commonDataAttributes]
+  const dataAttributes = commonDataAttributes.slice()
+  dataAttributes.push(tagIDKeyName)
+
   const newElements = []
 
   const queryOptions = { appId, attribute, type, tagIDKeyName }
@@ -36,103 +38,98 @@ export default function updateTag (appId, options = {}, type, tags, head, body)
     })
   }
 
-  if (tags.length) {
-    for (const tag of tags) {
-      if (tag.skip) {
-        continue
-      }
-
-      const newElement = document.createElement(type)
-      newElement.setAttribute(attribute, appId)
+  tags.forEach((tag) => {
+    if (tag.skip) {
+      return
+    }
 
-      for (const attr in tag) {
-        /* istanbul ignore next */
-        if (!tag.hasOwnProperty(attr)) {
-          continue
-        }
+    const newElement = document.createElement(type)
+    newElement.setAttribute(attribute, appId)
 
-        if (attr === 'innerHTML') {
-          newElement.innerHTML = tag.innerHTML
-          continue
-        }
+    for (const attr in tag) {
+      /* istanbul ignore next */
+      if (!tag.hasOwnProperty(attr)) {
+        continue
+      }
 
-        if (attr === 'json') {
-          newElement.innerHTML = JSON.stringify(tag.json)
-          continue
-        }
+      if (attr === 'innerHTML') {
+        newElement.innerHTML = tag.innerHTML
+        continue
+      }
 
-        if (attr === 'cssText') {
-          if (newElement.styleSheet) {
-            /* istanbul ignore next */
-            newElement.styleSheet.cssText = tag.cssText
-          } else {
-            newElement.appendChild(document.createTextNode(tag.cssText))
-          }
-          continue
-        }
+      if (attr === 'json') {
+        newElement.innerHTML = JSON.stringify(tag.json)
+        continue
+      }
 
-        if (attr === 'callback') {
-          newElement.onload = () => tag[attr](newElement)
-          continue
+      if (attr === 'cssText') {
+        if (newElement.styleSheet) {
+          /* istanbul ignore next */
+          newElement.styleSheet.cssText = tag.cssText
+        } else {
+          newElement.appendChild(document.createTextNode(tag.cssText))
         }
+        continue
+      }
 
-        const _attr = includes(dataAttributes, attr)
-          ? `data-${attr}`
-          : attr
+      if (attr === 'callback') {
+        newElement.onload = () => tag[attr](newElement)
+        continue
+      }
 
-        const isBooleanAttribute = includes(booleanHtmlAttributes, attr)
-        if (isBooleanAttribute && !tag[attr]) {
-          continue
-        }
+      const _attr = includes(dataAttributes, attr)
+        ? `data-${attr}`
+        : attr
 
-        const value = isBooleanAttribute ? '' : tag[attr]
-        newElement.setAttribute(_attr, value)
+      const isBooleanAttribute = includes(booleanHtmlAttributes, attr)
+      if (isBooleanAttribute && !tag[attr]) {
+        continue
       }
 
-      const oldElements = currentElements[getElementsKey(tag)]
+      const value = isBooleanAttribute ? '' : tag[attr]
+      newElement.setAttribute(_attr, value)
+    }
 
-      // Remove a duplicate tag from domTagstoRemove, so it isn't cleared.
-      let indexToDelete
-      const hasEqualElement = oldElements.some((existingTag, index) => {
-        indexToDelete = index
-        return newElement.isEqualNode(existingTag)
-      })
+    const oldElements = currentElements[getElementsKey(tag)]
 
-      if (hasEqualElement && (indexToDelete || indexToDelete === 0)) {
-        oldElements.splice(indexToDelete, 1)
-      } else {
-        newElements.push(newElement)
-      }
+    // Remove a duplicate tag from domTagstoRemove, so it isn't cleared.
+    let indexToDelete
+    const hasEqualElement = oldElements.some((existingTag, index) => {
+      indexToDelete = index
+      return newElement.isEqualNode(existingTag)
+    })
+
+    if (hasEqualElement && (indexToDelete || indexToDelete === 0)) {
+      oldElements.splice(indexToDelete, 1)
+    } else {
+      newElements.push(newElement)
     }
-  }
+  })
 
-  let oldElements = []
-  for (const current of Object.values(currentElements)) {
-    oldElements = [
-      ...oldElements,
-      ...current
-    ]
+  const oldElements = []
+  for (const type in currentElements) {
+    Array.prototype.push.apply(oldElements, currentElements[type])
   }
 
   // remove old elements
-  for (const element of oldElements) {
+  oldElements.forEach((element) => {
     element.parentNode.removeChild(element)
-  }
+  })
 
   // insert new elements
-  for (const element of newElements) {
+  newElements.forEach((element) => {
     if (element.hasAttribute('data-body')) {
       body.appendChild(element)
-      continue
+      return
     }
 
     if (element.hasAttribute('data-pbody')) {
       body.insertBefore(element, body.firstChild)
-      continue
+      return
     }
 
     head.appendChild(element)
-  }
+  })
 
   return {
     oldTags: oldElements,

src/shared/escaping.js

@@ -19,9 +19,9 @@ export const clientSequences = [
 ]
 
 // sanitizes potentially dangerous characters
-export function escape (info, options, escapeOptions) {
+export function escape (info, options, escapeOptions, escapeKeys) {
   const { tagIDKeyName } = options
-  const { doEscape = v => v, escapeKeys } = escapeOptions
+  const { doEscape = v => v } = escapeOptions
   const escaped = {}
 
   for (const key in info) {
@@ -56,13 +56,13 @@ export function escape (info, options, escapeOptions) {
     } else if (isArray(value)) {
       escaped[key] = value.map((v) => {
         if (isPureObject(v)) {
-          return escape(v, options, { ...escapeOptions, escapeKeys: true })
+          return escape(v, options, escapeOptions, true)
         }
 
         return doEscape(v)
       })
     } else if (isPureObject(value)) {
-      escaped[key] = escape(value, options, { ...escapeOptions, escapeKeys: true })
+      escaped[key] = escape(value, options, escapeOptions, true)
     } else {
       escaped[key] = value
     }

src/shared/log.js

@@ -4,13 +4,13 @@ const _global = hasGlobalWindow ? window : global
 
 const console = (_global.console = _global.console || {})
 
-export function warn (...args) {
+export function warn (str) {
   /* istanbul ignore next */
   if (!console || !console.warn) {
     return
   }
 
-  console.warn(...args)
+  console.warn(str)
 }
 
 export const showWarningNotSupported = () => warn('This vue app/component has no vue-meta configuration')

test/fixtures/basic/client.js

@@ -1,5 +1,5 @@
 import Vue from 'vue'
-import VueMeta from '../../../src/browser'
+import VueMeta from 'vue-meta'
 import App from './App.vue'
 import createRouter from './router'
 

test/fixtures/basic/server.js

@@ -1,10 +1,14 @@
 import Vue from 'vue'
-import VueMeta from '../../../src'
+import { _import, getVueMetaPath } from '../../utils/build'
 import App from './App.vue'
 import createRouter from './router'
 
-Vue.use(VueMeta)
+export default async function createServerApp () {
+  const VueMeta = await _import(getVueMetaPath())
 
-App.router = createRouter()
+  Vue.use(VueMeta)
 
-export default new Vue(App)
+  App.router = createRouter()
+
+  return new Vue(App)
+}