Skip to content

Commit

Permalink
fix bugs when appending components
Browse files Browse the repository at this point in the history
  • Loading branch information
@kbrsh
kbrsh committed Apr 1, 2017
1 parent 850ea1b commit 2cdd5d9
Show file tree
Hide file tree
Showing 4 changed files with 59 additions and 25 deletions.
41 changes: 29 additions & 12 deletions dist/moon.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -358,12 +358,23 @@
// Hydrate
vnode.meta.el = el;

return el;
};

/**
* Appends a Child, Ensuring Components are Mounted
* @param {Object} node
* @param {Object} vnode
* @param {Object} parent
*/
var appendChild = function (node, vnode, parent) {
// Remove the node
parent.appendChild(node);

// Check for Component
if (vnode.meta.component) {
createComponentFromVNode(el, vnode, vnode.meta.component);
createComponentFromVNode(node, vnode, vnode.meta.component);
}

return el;
};

/**
Expand All @@ -386,9 +397,10 @@
* Replaces a Child, Ensuring Components are Unmounted/Mounted
* @param {Object} oldNode
* @param {Object} newNode
* @param {Object} vnode
* @param {Object} parent
*/
var replaceChild = function (oldNode, newNode, parent) {
var replaceChild = function (oldNode, newNode, vnode, parent) {
// Check for Component
if (oldNode.__moon__) {
// Component was unmounted, destroy it here
Expand All @@ -397,6 +409,11 @@

// Replace It
parent.replaceChild(newNode, oldNode);

// Check for Component
if (vnode.meta.component) {
createComponentFromVNode(newNode, vnode, vnode.meta.component);
}
};

/**
Expand Down Expand Up @@ -625,7 +642,7 @@
if (!node) {
// No node, create one
var newNode = createNodeFromVNode(vnode, instance);
parent.appendChild(newNode);
appendChild(newNode, vnode, parent);

return newNode;
} else if (!vnode) {
Expand All @@ -634,20 +651,20 @@
return null;
} else if (nodeName !== vnode.type) {
var newNode = createNodeFromVNode(vnode, instance);
replaceChild(node, newNode, parent);
replaceChild(node, newNode, vnode, parent);
return newNode;
} else if (vnode.meta.shouldRender && vnode.type === "#text") {
if (node && nodeName === "#text") {
// Both are textnodes, update the node
if (node.nodeValue !== vnode.val) {
node.nodeValue = vnode.val;
if (node.textContent !== vnode.val) {
node.textContent = vnode.val;
}

// Hydrate
vnode.meta.el = node;
} else {
// Node isn't text, replace with one
replaceChild(node, createNodeFromVNode(vnode, instance), parent);
replaceChild(node, createNodeFromVNode(vnode, instance), vnode, parent);
}

return node;
Expand Down Expand Up @@ -707,7 +724,7 @@
return PATCH.SKIP;
} else if (!oldVNode) {
// No Node, append a node
parent.appendChild(createNodeFromVNode(vnode, instance));
appendChild(createNodeFromVNode(vnode, instance), vnode, parent);

return PATCH.APPEND;
} else if (!vnode) {
Expand All @@ -717,7 +734,7 @@
return PATCH.REMOVE;
} else if (oldVNode.type !== vnode.type) {
// Different types, replace it
replaceChild(oldVNode.meta.el, createNodeFromVNode(vnode, instance), parent);
replaceChild(oldVNode.meta.el, createNodeFromVNode(vnode, instance), vnode, parent);

return PATCH.REPLACE;
} else if (vnode.meta.shouldRender && vnode.type === "#text") {
Expand All @@ -732,7 +749,7 @@
return PATCH.TEXT;
} else {
// Node isn't text, replace with one
replaceChild(node, createNodeFromVNode(vnode, instance), parent);
replaceChild(node, createNodeFromVNode(vnode, instance), vnode, parent);
return PATCH.REPLACE;
}
} else if (vnode.meta.shouldRender) {
Expand Down
2 changes: 1 addition & 1 deletion dist/moon.min.js
View file

Large diffs are not rendered by default.

25 changes: 21 additions & 4 deletions src/util/dom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,23 @@ const createNodeFromVNode = function(vnode, instance) {
// Hydrate
vnode.meta.el = el;

return el;
}

/**
* Appends a Child, Ensuring Components are Mounted
* @param {Object} node
* @param {Object} vnode
* @param {Object} parent
*/
const appendChild = function(node, vnode, parent) {
// Remove the node
parent.appendChild(node);

// Check for Component
if(vnode.meta.component) {
createComponentFromVNode(el, vnode, vnode.meta.component);
createComponentFromVNode(node, vnode, vnode.meta.component);
}

return el;
}

/**
Expand All @@ -94,9 +105,10 @@ const removeChild = function(node, parent) {
* Replaces a Child, Ensuring Components are Unmounted/Mounted
* @param {Object} oldNode
* @param {Object} newNode
* @param {Object} vnode
* @param {Object} parent
*/
const replaceChild = function(oldNode, newNode, parent) {
const replaceChild = function(oldNode, newNode, vnode, parent) {
// Check for Component
if(oldNode.__moon__) {
// Component was unmounted, destroy it here
Expand All @@ -105,4 +117,9 @@ const replaceChild = function(oldNode, newNode, parent) {

// Replace It
parent.replaceChild(newNode, oldNode);

// Check for Component
if(vnode.meta.component) {
createComponentFromVNode(newNode, vnode, vnode.meta.component);
}
}
16 changes: 8 additions & 8 deletions src/util/vdom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -224,7 +224,7 @@ const hydrate = function(node, vnode, parent, instance) {
if(!node) {
// No node, create one
var newNode = createNodeFromVNode(vnode, instance);
parent.appendChild(newNode);
appendChild(newNode, vnode, parent);

return newNode;
} else if(!vnode) {
Expand All @@ -233,20 +233,20 @@ const hydrate = function(node, vnode, parent, instance) {
return null;
} else if(nodeName !== vnode.type) {
var newNode = createNodeFromVNode(vnode, instance);
replaceChild(node, newNode, parent);
replaceChild(node, newNode, vnode, parent);
return newNode;
} else if(vnode.meta.shouldRender && vnode.type === "#text") {
if(node && nodeName === "#text") {
// Both are textnodes, update the node
if(node.nodeValue !== vnode.val) {
node.nodeValue = vnode.val;
if(node.textContent !== vnode.val) {
node.textContent = vnode.val;
}

// Hydrate
vnode.meta.el = node;
} else {
// Node isn't text, replace with one
replaceChild(node, createNodeFromVNode(vnode, instance), parent);
replaceChild(node, createNodeFromVNode(vnode, instance), vnode, parent);
}

return node;
Expand Down Expand Up @@ -306,7 +306,7 @@ const diff = function(oldVNode, vnode, parent, instance) {
return PATCH.SKIP;
} else if(!oldVNode) {
// No Node, append a node
parent.appendChild(createNodeFromVNode(vnode, instance));
appendChild(createNodeFromVNode(vnode, instance), vnode, parent);

return PATCH.APPEND;
} else if(!vnode) {
Expand All @@ -316,7 +316,7 @@ const diff = function(oldVNode, vnode, parent, instance) {
return PATCH.REMOVE;
} else if(oldVNode.type !== vnode.type) {
// Different types, replace it
replaceChild(oldVNode.meta.el, createNodeFromVNode(vnode, instance), parent);
replaceChild(oldVNode.meta.el, createNodeFromVNode(vnode, instance), vnode, parent);

return PATCH.REPLACE;
} else if(vnode.meta.shouldRender && vnode.type === "#text") {
Expand All @@ -331,7 +331,7 @@ const diff = function(oldVNode, vnode, parent, instance) {
return PATCH.TEXT;
} else {
// Node isn't text, replace with one
replaceChild(node, createNodeFromVNode(vnode, instance), parent);
replaceChild(node, createNodeFromVNode(vnode, instance), vnode, parent);
return PATCH.REPLACE;
}

Expand Down

0 comments on commit 2cdd5d9

Please sign in to comment.