chore(release): 3.0.0-alpha.5

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [3.0.0-alpha.5](https://github.com/nuxt/vue-meta/compare/v3.0.0-alpha.4...v3.0.0-alpha.5) (2021-05-03)
+
+
+### Bug Fixes
+
+* apply diff on nested computed objects ([29b294c](https://github.com/nuxt/vue-meta/commit/29b294c2be1bdbb57d6341871df72848c9d0b034))
+* dont include ssr support in main dist ([5699bf4](https://github.com/nuxt/vue-meta/commit/5699bf4ff202a731830621583183dd8ae97a2c7c))
+
 ## [3.0.0-alpha.4](https://github.com/nuxt/vue-meta/compare/v3.0.0-alpha.3...v3.0.0-alpha.4) (2021-04-11)
 
 

dist/vue-meta.cjs.js

@@ -1,5 +1,5 @@
 /**
- * vue-meta v3.0.0-alpha.4
+ * vue-meta v3.0.0-alpha.5
  * (c) 2021
  * - Pim (@pimlie)
  * - All the amazing contributors
@@ -12,18 +12,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      n[k] = e[k];
-    });
-  }
-  n['default'] = e;
-  return Object.freeze(n);
-}
-
 const resolveOption = (predicament, initialValue) => (options, contexts) => {
     let resolvedIndex = -1;
     contexts.reduce((acc, context, index) => {
@@ -330,7 +318,7 @@ const createHandler = (context, resolveContext, pathSegments = []) => ({
     },
     set: (target, key, value) => {
         const success = Reflect.set(target, key, value);
-        // console.warn(success, 'PROXY SET\nkey:', key, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
+        // console.warn(success, 'PROXY SET\nkey:', key, '\nvalue:', value, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
         if (success) {
             const isArrayItem = isArray(target);
             let hasArrayParent = false;
@@ -661,9 +649,8 @@ function applyDifference(target, newSource, oldSource) {
             target[key] = newSource[key];
             continue;
         }
-        // We dont care about nested objects here , these changes
-        // should already have been tracked by the MergeProxy
         if (isObject(target[key])) {
+            applyDifference(target[key], newSource[key], oldSource[key]);
             continue;
         }
         if (newSource[key] !== oldSource[key]) {
@@ -696,7 +683,6 @@ function useMeta(source, manager) {
     }
     if (vue.isProxy(source)) {
         vue.watch(source, (newSource, oldSource) => {
-            // We only care about first level props, second+ level will already be changed by the merge proxy
             applyDifference(metaProxy.meta, newSource, oldSource);
         });
         source = source.value;
@@ -863,31 +849,10 @@ MetaManager.create = (config, resolver) => {
     return manager;
 };
 
-async function renderToStringWithMeta(app) {
-    const { renderToString } = await Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@vue/server-renderer')); });
-    const ctx = {};
-    const html = await renderToString(app, ctx);
-    // TODO: better way of determining whether meta was rendered with the component or not
-    if (!ctx.teleports || !ctx.teleports.head) {
-        const teleports = app.config.globalProperties.$metaManager.render();
-        await Promise.all(teleports.map((teleport) => renderToString(teleport, ctx)));
-    }
-    const { teleports } = ctx;
-    for (const target in teleports) {
-        if (target.endsWith('Attrs')) {
-            const str = teleports[target];
-            // match from first space to first >, these should be all rendered attributes
-            teleports[target] = str.slice(str.indexOf(' ') + 1, str.indexOf('>'));
-        }
-    }
-    return [html, ctx];
-}
-
 exports.createMetaManager = createMetaManager;
 exports.deepestResolver = defaultResolver;
 exports.defaultConfig = defaultConfig;
 exports.getCurrentManager = getCurrentManager;
-exports.renderToStringWithMeta = renderToStringWithMeta;
 exports.resolveOption = resolveOption;
 exports.useActiveMeta = useActiveMeta;
 exports.useMeta = useMeta;

dist/vue-meta.cjs.prod.js

@@ -1,5 +1,5 @@
 /**
- * vue-meta v3.0.0-alpha.4
+ * vue-meta v3.0.0-alpha.5
  * (c) 2021
  * - Pim (@pimlie)
  * - All the amazing contributors
@@ -12,18 +12,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      n[k] = e[k];
-    });
-  }
-  n['default'] = e;
-  return Object.freeze(n);
-}
-
 const resolveOption = (predicament, initialValue) => (options, contexts) => {
     let resolvedIndex = -1;
     contexts.reduce((acc, context, index) => {
@@ -327,7 +315,7 @@ const createHandler = (context, resolveContext, pathSegments = []) => ({
     },
     set: (target, key, value) => {
         const success = Reflect.set(target, key, value);
-        // console.warn(success, 'PROXY SET\nkey:', key, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
+        // console.warn(success, 'PROXY SET\nkey:', key, '\nvalue:', value, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
         if (success) {
             const isArrayItem = isArray(target);
             let hasArrayParent = false;
@@ -654,9 +642,8 @@ function applyDifference(target, newSource, oldSource) {
             target[key] = newSource[key];
             continue;
         }
-        // We dont care about nested objects here , these changes
-        // should already have been tracked by the MergeProxy
         if (isObject(target[key])) {
+            applyDifference(target[key], newSource[key], oldSource[key]);
             continue;
         }
         if (newSource[key] !== oldSource[key]) {
@@ -689,7 +676,6 @@ function useMeta(source, manager) {
     }
     if (vue.isProxy(source)) {
         vue.watch(source, (newSource, oldSource) => {
-            // We only care about first level props, second+ level will already be changed by the merge proxy
             applyDifference(metaProxy.meta, newSource, oldSource);
         });
         source = source.value;
@@ -856,31 +842,10 @@ MetaManager.create = (config, resolver) => {
     return manager;
 };
 
-async function renderToStringWithMeta(app) {
-    const { renderToString } = await Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@vue/server-renderer')); });
-    const ctx = {};
-    const html = await renderToString(app, ctx);
-    // TODO: better way of determining whether meta was rendered with the component or not
-    if (!ctx.teleports || !ctx.teleports.head) {
-        const teleports = app.config.globalProperties.$metaManager.render();
-        await Promise.all(teleports.map((teleport) => renderToString(teleport, ctx)));
-    }
-    const { teleports } = ctx;
-    for (const target in teleports) {
-        if (target.endsWith('Attrs')) {
-            const str = teleports[target];
-            // match from first space to first >, these should be all rendered attributes
-            teleports[target] = str.slice(str.indexOf(' ') + 1, str.indexOf('>'));
-        }
-    }
-    return [html, ctx];
-}
-
 exports.createMetaManager = createMetaManager;
 exports.deepestResolver = defaultResolver;
 exports.defaultConfig = defaultConfig;
 exports.getCurrentManager = getCurrentManager;
-exports.renderToStringWithMeta = renderToStringWithMeta;
 exports.resolveOption = resolveOption;
 exports.useActiveMeta = useActiveMeta;
 exports.useMeta = useMeta;

dist/vue-meta.d.ts

@@ -1,5 +1,4 @@
 import { App, ComponentInternalInstance, Slots, VNode } from 'vue';
-import { SSRContext } from '@vue/server-renderer';
 
 declare const IS_PROXY: unique symbol;
 declare const PROXY_SOURCES: unique symbol;
@@ -204,10 +203,8 @@ interface ResolveOptionPredicament<T, U> {
 }
 declare const resolveOption: <T, U = ResolveContext>(predicament: ResolveOptionPredicament<T, U>, initialValue?: T | undefined) => ResolveMethod<any, U>;
 
-declare function renderToStringWithMeta(app: App): Promise<[string, SSRContext]>;
-
 declare function getCurrentManager(vm?: ComponentInternalInstance): MetaManager | undefined;
 declare function useMeta(source: MetaSource, manager?: MetaManager): MetaProxy;
 declare function useActiveMeta(): MetaActive;
 
-export { MetaActive, MetaConfig, MetaConfigSection, MetaConfigSectionAttribute, MetaConfigSectionGroup, MetaConfigSectionKey, MetaConfigSectionTag, MetaGroupConfig, MetaGuardRemoved, MetaGuards, MetaProxy, MetaRenderContext, MetaRendered, MetaRenderedNode, MetaResolveContext, MetaResolveSetup, MetaResolver, MetaResolverSetup, MetaSource, MetaSourceProxy, MetaTagConfig, MetaTagConfigKey, MetaTagName, MetaTagsConfig, MetaTeleports, Modify, SlotScopeProperties, TODO, createMetaManager, deepest_d as deepestResolver, defaultConfig, getCurrentManager, renderToStringWithMeta, resolveOption, useActiveMeta, useMeta };
+export { MetaActive, MetaConfig, MetaConfigSection, MetaConfigSectionAttribute, MetaConfigSectionGroup, MetaConfigSectionKey, MetaConfigSectionTag, MetaGroupConfig, MetaGuardRemoved, MetaGuards, MetaProxy, MetaRenderContext, MetaRendered, MetaRenderedNode, MetaResolveContext, MetaResolveSetup, MetaResolver, MetaResolverSetup, MetaSource, MetaSourceProxy, MetaTagConfig, MetaTagConfigKey, MetaTagName, MetaTagsConfig, MetaTeleports, Modify, SlotScopeProperties, TODO, createMetaManager, deepest_d as deepestResolver, defaultConfig, getCurrentManager, resolveOption, useActiveMeta, useMeta };

dist/vue-meta.esm-browser.js

@@ -1,5 +1,5 @@
 /**
- * vue-meta v3.0.0-alpha.4
+ * vue-meta v3.0.0-alpha.5
  * (c) 2021
  * - Pim (@pimlie)
  * - All the amazing contributors
@@ -314,7 +314,7 @@ const createHandler = (context, resolveContext, pathSegments = []) => ({
     },
     set: (target, key, value) => {
         const success = Reflect.set(target, key, value);
-        // console.warn(success, 'PROXY SET\nkey:', key, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
+        // console.warn(success, 'PROXY SET\nkey:', key, '\nvalue:', value, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
         if (success) {
             const isArrayItem = isArray(target);
             let hasArrayParent = false;
@@ -666,9 +666,8 @@ function applyDifference(target, newSource, oldSource) {
             target[key] = newSource[key];
             continue;
         }
-        // We dont care about nested objects here , these changes
-        // should already have been tracked by the MergeProxy
         if (isObject(target[key])) {
+            applyDifference(target[key], newSource[key], oldSource[key]);
             continue;
         }
         if (newSource[key] !== oldSource[key]) {
@@ -701,7 +700,6 @@ function useMeta(source, manager) {
     }
     if (isProxy(source)) {
         watch(source, (newSource, oldSource) => {
-            // We only care about first level props, second+ level will already be changed by the merge proxy
             applyDifference(metaProxy.meta, newSource, oldSource);
         });
         source = source.value;

dist/vue-meta.esm-bundler.js

@@ -1,5 +1,5 @@
 /**
- * vue-meta v3.0.0-alpha.4
+ * vue-meta v3.0.0-alpha.5
  * (c) 2021
  * - Pim (@pimlie)
  * - All the amazing contributors
@@ -314,7 +314,7 @@ const createHandler = (context, resolveContext, pathSegments = []) => ({
     },
     set: (target, key, value) => {
         const success = Reflect.set(target, key, value);
-        // console.warn(success, 'PROXY SET\nkey:', key, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
+        // console.warn(success, 'PROXY SET\nkey:', key, '\nvalue:', value, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
         if (success) {
             const isArrayItem = isArray(target);
             let hasArrayParent = false;
@@ -645,9 +645,8 @@ function applyDifference(target, newSource, oldSource) {
             target[key] = newSource[key];
             continue;
         }
-        // We dont care about nested objects here , these changes
-        // should already have been tracked by the MergeProxy
         if (isObject(target[key])) {
+            applyDifference(target[key], newSource[key], oldSource[key]);
             continue;
         }
         if (newSource[key] !== oldSource[key]) {
@@ -680,7 +679,6 @@ function useMeta(source, manager) {
     }
     if (isProxy(source)) {
         watch(source, (newSource, oldSource) => {
-            // We only care about first level props, second+ level will already be changed by the merge proxy
             applyDifference(metaProxy.meta, newSource, oldSource);
         });
         source = source.value;
@@ -847,24 +845,4 @@ MetaManager.create = (config, resolver) => {
     return manager;
 };
 
-async function renderToStringWithMeta(app) {
-    const { renderToString } = await import('@vue/server-renderer');
-    const ctx = {};
-    const html = await renderToString(app, ctx);
-    // TODO: better way of determining whether meta was rendered with the component or not
-    if (!ctx.teleports || !ctx.teleports.head) {
-        const teleports = app.config.globalProperties.$metaManager.render();
-        await Promise.all(teleports.map((teleport) => renderToString(teleport, ctx)));
-    }
-    const { teleports } = ctx;
-    for (const target in teleports) {
-        if (target.endsWith('Attrs')) {
-            const str = teleports[target];
-            // match from first space to first >, these should be all rendered attributes
-            teleports[target] = str.slice(str.indexOf(' ') + 1, str.indexOf('>'));
-        }
-    }
-    return [html, ctx];
-}
-
-export { createMetaManager, defaultResolver as deepestResolver, defaultConfig, getCurrentManager, renderToStringWithMeta, resolveOption, useActiveMeta, useMeta };
+export { createMetaManager, defaultResolver as deepestResolver, defaultConfig, getCurrentManager, resolveOption, useActiveMeta, useMeta };

dist/vue-meta.global.js

@@ -1,5 +1,5 @@
 /**
- * vue-meta v3.0.0-alpha.4
+ * vue-meta v3.0.0-alpha.5
  * (c) 2021
  * - Pim (@pimlie)
  * - All the amazing contributors
@@ -315,7 +315,7 @@ var VueMeta = (function (exports, vue) {
       },
       set: (target, key, value) => {
           const success = Reflect.set(target, key, value);
-          // console.warn(success, 'PROXY SET\nkey:', key, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
+          // console.warn(success, 'PROXY SET\nkey:', key, '\nvalue:', value, '\npath:', pathSegments, '\ntarget:', isArray(target), target, '\ncontext:\n', context)
           if (success) {
               const isArrayItem = isArray(target);
               let hasArrayParent = false;
@@ -667,9 +667,8 @@ var VueMeta = (function (exports, vue) {
               target[key] = newSource[key];
               continue;
           }
-          // We dont care about nested objects here , these changes
-          // should already have been tracked by the MergeProxy
           if (isObject(target[key])) {
+              applyDifference(target[key], newSource[key], oldSource[key]);
               continue;
           }
           if (newSource[key] !== oldSource[key]) {
@@ -702,7 +701,6 @@ var VueMeta = (function (exports, vue) {
       }
       if (vue.isProxy(source)) {
           vue.watch(source, (newSource, oldSource) => {
-              // We only care about first level props, second+ level will already be changed by the merge proxy
               applyDifference(metaProxy.meta, newSource, oldSource);
           });
           source = source.value;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-meta",
-  "version": "3.0.0-alpha.4",
+  "version": "3.0.0-alpha.5",
   "description": "Manage HTML metadata in Vue.js components with SSR support",
   "main": "dist/vue-meta.cjs.js",
   "browser": "dist/vue-meta.esm-browser.min.js",