diff --git a/src/wcc.js b/src/wcc.js index e37a4a4..db9fa2d 100644 --- a/src/wcc.js +++ b/src/wcc.js @@ -48,7 +48,7 @@ async function renderComponentRoots(tree, definitions) { console.log('elementTree.childNodes', elementTree.childNodes); console.log('node.childNodes', node.childNodes); - node.childNodes = node.childNodes.length === 0 && hasLight > 0 && !hasShadow + node.childNodes = node.childNodes.length === 0 && hasLight && !hasShadow ? elementTree.childNodes : hasShadow ? [...elementTree.childNodes, ...node.childNodes] diff --git a/test/cases/html-web-component/html-web-component.spec.js b/test/cases/html-web-component/html-web-component.spec.js index cdf2ed4..4af2ff9 100644 --- a/test/cases/html-web-component/html-web-component.spec.js +++ b/test/cases/html-web-component/html-web-component.spec.js @@ -40,9 +40,11 @@ describe('Run WCC For ', function() { expect(pictureFrame.length).to.equal(1); }); - it('should have the expected title attribute content in the heading of HTML', () => { - const heading = pictureFrame[0].querySelectorAll('.picture-frame .heading'); + it('should have the expected title attribute content in a nested tag', () => { + const caption = pictureFrame[0].querySelectorAll('.picture-frame wcc-caption .caption'); + const heading = caption[0].querySelectorAll('.heading'); + expect(caption.length).to.equal(1); expect(heading.length).to.equal(1); expect(heading[0].textContent).to.equal('Greenwood'); }); diff --git a/test/cases/html-web-component/src/components/caption.js b/test/cases/html-web-component/src/components/caption.js new file mode 100644 index 0000000..333cdad --- /dev/null +++ b/test/cases/html-web-component/src/components/caption.js @@ -0,0 +1,13 @@ +export default class Caption extends HTMLElement { + connectedCallback() { + const title = this.getAttribute('title'); + + this.innerHTML = ` +
+ ${this.innerHTML} +
+ `; + } +} + +customElements.define('wcc-caption', Caption); \ No newline at end of file diff --git a/test/cases/html-web-component/src/components/picture-frame.js b/test/cases/html-web-component/src/components/picture-frame.js index cd926d9..5fa0eda 100644 --- a/test/cases/html-web-component/src/components/picture-frame.js +++ b/test/cases/html-web-component/src/components/picture-frame.js @@ -1,10 +1,14 @@ +import './caption.js'; + export default class PictureFrame extends HTMLElement { connectedCallback() { const title = this.getAttribute('title'); this.innerHTML = `
-
${title}
+ +
${title}
+
${this.innerHTML}
`;