github
diff --git a/‎examples/index.html
Lines changed: 34 additions & 4 deletions b/‎examples/index.html
Lines changed: 34 additions & 4 deletions
diff --git a/‎examples/markdown.html
Lines changed: 0 additions & 1 deletion b/‎examples/markdown.html
Lines changed: 0 additions & 1 deletion
diff --git a/‎examples/results.html
Lines changed: 0 additions & 4 deletions b/‎examples/results.html
Lines changed: 0 additions & 4 deletions
@@ -3,16 +3,46 @@
 <head>
   <meta charset="utf-8">
   <title>remote-input demo</title>
+  <style>
+    marquee, textarea, input { width: 20rem; }
+    remote-input, textarea { display: block; }
+  </style>
+  <script>
+    function fakeFetch(url) {
+      const urlObj = new URL(url)
+      let html = ''
+      if (url.pathname === '/results') {
+        const doc = document.createElement('div')
+        doc.innerHTML = `<li>Hubot</li><li>BB-8</li><li>Wall-E</li><li>Bender</li>`
+        const q = url.searchParams.get('q')
+        for (const el of doc.querySelectorAll('li')) {
+          if (q !== '' && !el.textContent.toLowerCase().match(q.toLowerCase())) el.remove()
+        }
+        html = doc.innerHTML
+      } else if (url.pathname === '/marquee') {
+        html = `<marquee>${url.searchParams.get('q') || 'blank'}</marquee>`
+      }
+      const promiseHTML = new Promise(resolve => resolve(html))
+      return new Promise(resolve => resolve({text: () => promiseHTML}))
+    }
+    window.fetch = fakeFetch
+  </script>
 </head>
 <body>
-  <remote-input aria-owns="results" src="/examples/results.html">
-    <label>Search robots <input type="text"></label>
+  <remote-input aria-owns="marquee-preview" src="/marquee">
+    <label>Marquee preview <textarea autofocus>🐈🐈🐈🐈🐈</textarea></label>
   </remote-input>
-  <ol id="results"></ol>
+  <div id="marquee-preview"></div>
+
+  <remote-input aria-owns="results" src="/results">
+    <label>Search robots<br><input type="text"></label>
+  </remote-input>
+  <ul id="results"></ul>
 
   <!-- GitHub Pages development script, uncomment when running example locally and comment out the production one -->
   <!-- <script src="../dist/index.umd.js"></script> -->
 
   <!-- GitHub Pages demo script -->
-  <script src="https://unpkg.com/@github/remote-input-element@latest/dist/index.umd.js"></script></body>
+  <script src="https://unpkg.com/@github/remote-input-element@latest/dist/index.umd.js"></script>
+</body>
 </html>