From af484911cea483984bd39e6797e87eaeb54f31b5 Mon Sep 17 00:00:00 2001
From: Patrick Nelson <pat@catchyour.com>
Date: Sat, 3 Jun 2023 03:40:06 -0700
Subject: [PATCH] Fix for #12: Ensure original named slot tags are retained
 when not using shadow root. (#13)

* Fix for #12: Ensure original named slot tags are retained when not using shadow root. Only "unwrap" (i.e. from the host tag) when in the default slot. Including ignore of .idea/ files (JetBrains) and enforcing repo-specific whitespace rules (differs from my specific IDE settings)

* Removing yarn.lock (added accidentally)

* Fixing typo in .editorconfig
---
 .editorconfig     |  7 +++++++
 .gitignore        |  3 ++-
 index.js          | 16 ++++++++--------
 tests/tag.test.js |  8 ++++----
 4 files changed, 21 insertions(+), 13 deletions(-)
 create mode 100644 .editorconfig

diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..0359c42
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,7 @@
+[*]
+charset = utf-8
+end_of_line = lf
+
+[{*.js,*.json}]
+indent_style = space
+indent_size = 2
diff --git a/.gitignore b/.gitignore
index f2a529e..fe92c03 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 node_modules
 .DS_Store
-coverage
\ No newline at end of file
+coverage
+.idea/
diff --git a/index.js b/index.js
index f82cd94..d205389 100644
--- a/index.js
+++ b/index.js
@@ -16,12 +16,12 @@ function createSlots(slots) {
       return {
         c: noop,
         m: function mount(target, anchor) {
-          insert(target, element.cloneNode(true), anchor); 
+          insert(target, element.cloneNode(true), anchor);
         },
-        d: function destroy(detaching) { 
-          if (detaching && element.innerHTML){ 
+        d: function destroy(detaching) {
+          if (detaching && element.innerHTML){
             detach(element);
-          } 
+          }
         },
         l: noop,
       };
@@ -42,7 +42,7 @@ export default function(opts){
         let link = document.createElement('link');
         link.setAttribute("href",opts.href)
         link.setAttribute("rel","stylesheet")
-        root.appendChild(link);    
+        root.appendChild(link);
       }
       if(opts.shadow){
         this._root = document.createElement('div')
@@ -82,7 +82,7 @@ export default function(opts){
       }
       try{ this.elem.$destroy()}catch(err){} // detroy svelte element when removed from dom
     }
-    
+
     unwrap(from){
       let node = document.createDocumentFragment();
       while (from.firstChild) {
@@ -95,7 +95,7 @@ export default function(opts){
       const namedSlots = this.querySelectorAll('[slot]')
       let slots = {}
       namedSlots.forEach(n=>{
-        slots[n.slot] = this.unwrap(n)
+        slots[n.slot] = n
         this.removeChild(n)
       })
       if(this.innerHTML.length){
@@ -144,6 +144,6 @@ export default function(opts){
         this.elem.$set({[name]:newValue})
       }
     }
-  }  
+  }
   window.customElements.define(opts.tagname, Wrapper);
 }
diff --git a/tests/tag.test.js b/tests/tag.test.js
index b746d02..97d03f8 100644
--- a/tests/tag.test.js
+++ b/tests/tag.test.js
@@ -42,21 +42,21 @@ describe("Component Wrapper shadow false", () => {
     el = document.createElement('div')
     el.innerHTML = `<test-tag><div slot="inner">HERE</div></test-tag>`
     document.body.appendChild(el)
-    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content">Main Default <div>HERE</div></div></test-tag>')
+    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content">Main Default <div><div slot="inner">HERE</div></div></div></test-tag>')
   })
 
   it("both slots", () => {
     el = document.createElement('div')
     el.innerHTML = `<test-tag>BOOM!<div slot="inner">HERE</div></test-tag>`
     document.body.appendChild(el)
-    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content">BOOM! <div>HERE</div></div></test-tag>')
+    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content">BOOM! <div><div slot="inner">HERE</div></div></div></test-tag>')
   })
 
   it("nested tags", () => {
     el = document.createElement('div')
     el.innerHTML = `<test-tag><h2>Nested</h2><div slot="inner">HERE</div></test-tag>`
     document.body.appendChild(el)
-    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content"><h2>Nested</h2> <div>HERE</div></div></test-tag>')
+    expect(el.innerHTML).to.equal('<test-tag><h1>Main H1</h1> <div class="content"><h2>Nested</h2> <div><div slot="inner">HERE</div></div></div></test-tag>')
   })
 
   it("Unknown slot gets ignored", () => {
@@ -133,6 +133,6 @@ describe("Component Wrapper shadow true", () => {
     shadowhtml = document.querySelector('test-shad').shadowRoot.innerHTML
     expect(shadowhtml).to.equal('<div><h1>Main H1</h1> <div class="content"><slot></slot> <div>Inner Default</div></div></div>')
   })
-  
+
 })