ui: fix replay url switch resulting in refresh, move <form> tag

sw: update to latest sw, includes fix for skipping metadata records with no url, not reading from stream if already buffered

src/replay.js

@@ -247,6 +247,10 @@ class Replay extends LitElement
         top: 174px;
       }
 
+      form {
+        width: 100%;
+      }
+
     `);
   }
 
@@ -254,7 +258,6 @@ class Replay extends LitElement
     return html`
     ${this.embed !== "replayonly" ? html`
     <div class="replay-bar">
-      <form @submit="${this.onSubmit}">
       <div class="field has-addons">
         <a id="fullscreen" class="button is-borderless" @click="${this.onFullscreenToggle}">
           <span class="icon is-small">
@@ -268,12 +271,13 @@ class Replay extends LitElement
             ` : ``}
           </span>
         </button>
+        <form @submit="${this.onSubmit}">
           <p class="control is-expanded">
             <input id="url" class="input" type="text" .value="${this.replayUrl}" placeholder="https://... Enter a URL to replay from the archive here">
           </p>
+        </form>
         <p id="datetime" class="control is-hidden-mobile">${tsToDate(this.replayTS).toLocaleString()}</p>
       </div>
-      </form>
     </div>` : html`
     `}
 

ui.js

@@ -1332,10 +1332,13 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM
         top: 174px;
       }
 
+      form {
+        width: 100%;
+      }
+
     `)}render(){return O`
     ${"replayonly"!==this.embed?O`
     <div class="replay-bar">
-      <form @submit="${this.onSubmit}">
       <div class="field has-addons">
         <a id="fullscreen" class="button is-borderless" @click="${this.onFullscreenToggle}">
           <span class="icon is-small">
@@ -1349,12 +1352,13 @@ const tt=new WeakMap,it=v(e=>t=>{if(!(t instanceof T))throw new Error("unsafeHTM
             `}
           </span>
         </button>
+        <form @submit="${this.onSubmit}">
           <p class="control is-expanded">
             <input id="url" class="input" type="text" .value="${this.replayUrl}" placeholder="https://... Enter a URL to replay from the archive here">
           </p>
+        </form>
         <p id="datetime" class="control is-hidden-mobile">${function(e){if(!e)return"";e.length<14&&(e+="00000000000000".substr(e.length));const t=e.substring(0,4)+"-"+e.substring(4,6)+"-"+e.substring(6,8)+"T"+e.substring(8,10)+":"+e.substring(10,12)+":"+e.substring(12,14)+"-00:00";return new Date(t)}(this.replayTS).toLocaleString()}</p>
       </div>
-      </form>
     </div>`:O`
     `}
 

yarn.lock

@@ -293,7 +293,7 @@
 
 "@webrecorder/wabac@github:https://github.com/webrecorder/wabac.js#master", "wabac@github:https://github.com/webrecorder/wabac.js#master":
   version "2.0.1"
-  resolved "https://codeload.github.com/webrecorder/wabac.js/tar.gz/605711975257735d8de1cfde6b054c274bceb376"
+  resolved "https://codeload.github.com/webrecorder/wabac.js/tar.gz/47ba5e77b6a1a55eab314e85cb9fad106a5a17ca"
   dependencies:
     brotli "github:foliojs/brotli.js"
     fast-xml-parser "^3.15.1"