add feedback for gist

Author: devsnek

index.html

@@ -39,6 +39,7 @@ <h1>engine262</h1>
             <option value="module">Module</option>
           </select>
           <button type="button" id="save-to-gist">Save to Gist</button>
+          <span id="save-to-gist-output"></span>
         </fieldset>
 
         <textarea id="input" autocomplete="off"></textarea>

src/state.mjs

@@ -87,10 +87,11 @@ export function setState(name, value) {
     .then(() => updateState());
 }
 
+const saveSpan = document.querySelector('#save-to-gist-output');
 document.querySelector('#save-to-gist')
-  .addEventListener('click', async () => {
-    const s = await state;
-    const id = await fetch('https://engine262-api.snek.now.sh/api/gist', {
+  .addEventListener('click', () => {
+    saveSpan.textContent = 'Saving...';
+    state.then((s) => fetch('https://engine262-api.snek.now.sh/api/gist', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
@@ -102,7 +103,14 @@ document.querySelector('#save-to-gist')
           features: [...s.get('features')],
         },
       }),
-    }).then((r) => r.text());
-    s.set('gist', id);
-    await updateState();
+    })
+      .then((r) => r.text())
+      .then((id) => {
+        s.set('gist', id);
+        saveSpan.textContent = `Saved! ${id}`;
+      })
+      .then(() => updateState))
+      .catch((e) => {
+        saveSpan.textContent = `Error saving to gist: ${e.message}`;
+      });
   });