Issue 324 pending parent tag

lute/templates/term/_form.html

@@ -18,7 +18,8 @@
 
 
 <div id="term-form-container">
-  <form id="term-form" name="term_form" method="POST">
+  <form id="term-form" name="term_form" method="POST"
+        onsubmit="return convert_pending_parent_tags(event);">
     {{ form.hidden_tag() }}
     <div id="term">
       <div id="languageSel"
@@ -68,7 +69,7 @@
           {% if term.id %}
           <button id="delete" type="button" class="btn" onclick="deleteTerm()">Delete</button>
           {% endif %}
-          <button id="submit" type="submit" title="Shortcut: Control+Enter" class="btn btn-primary">Save</button>
+          <button id="btnsubmit" type="submit" title="Shortcut: Control+Enter" class="btn btn-primary">Save</button>
       </div>
     </div>
   </form>
@@ -305,7 +306,7 @@
     $(document).keydown(function(event) {
       console.log(event);
       if (event.ctrlKey && event.key === "Enter") {
-        $("#submit").click();
+        $("#btnsubmit").click();
       }
     });
 
@@ -366,6 +367,51 @@
   });  // end $(document).ready
 
 
+  // =============================
+  // Submit.
+
+  // Users may enter in a parent term without actually hitting return
+  // in the tag input box, resulting in nothing getting posted.  This
+  // is annoying, so convert any pending text into a full tag before
+  // submitting.
+  function convert_pending_parent_tags(event) {
+    const pending_tag = $('span.tagify__input').text().trim();
+    if (pending_tag == '')
+      return true;
+    // console.log(`adding: ${pending_tag}`);
+
+    // Simply calling "addTags" is not enough, as there appears to be
+    // some kind of async processing and timing in that method.  We
+    // have to listen to the 'add' event, and only submit once that is
+    // called.
+    parents_tagify.on('add', onFinalTagAdded);
+
+    // Add the pending tag, and suppress the actual submit.
+    parents_tagify.addTags([pending_tag], true, false);
+    event.preventDefault();
+    return false;
+  }
+
+
+  // If some extra text has been added, wait for processing to be
+  // done, and then submit the form.
+  function onFinalTagAdded(e) {
+    // console.log('Tag added:', e.detail.data.value);
+
+    // We still have to wait for data to be fully processed :-(
+    const DELAY = 150;  // ms
+    setTimeout(function() {
+      const form = $('#term-form');
+      form[0].submit();
+    }, DELAY);
+
+    parents_tagify.off('add', onFinalTagAdded);  // clean up listener.
+  }
+
+
+  // =============================
+  // Delete.
+
   function deleteTerm() {
     const msg = "Are you sure you want to delete this term?\n\n" +
           "This action cannot be undone, and if this term has children, they will be orphaned.";

tests/acceptance/conftest.py

@@ -239,12 +239,14 @@ def given_book_from_file(luteclient, lang, title, filename):
     thisdir = os.path.dirname(os.path.realpath(__file__))
     fullpath = os.path.join(thisdir, "sample_files", filename)
     luteclient.make_book_from_file(title, fullpath, lang)
+    _sleep(1)  # Hack!
 
 
 @given(parsers.parse("a {lang} book from url {url}"))
 def given_book_from_url(luteclient, lang, url):
     "Book is made from url in dev_api."
     luteclient.make_book_from_url(url, lang)
+    _sleep(1)  # Hack!
 
 
 @given(parsers.parse('the book table loads "{title}"'))

tests/acceptance/lute_test_client.py

@@ -209,7 +209,7 @@ def make_term(self, lang, updates):
         updates["language_id"] = self.language_ids[lang]
         b = self.browser
         self._fill_term_form(b, updates)
-        b.find_by_css("#submit").first.click()
+        b.find_by_css("#btnsubmit").first.click()
 
     def get_term_table_content(self):
         "Get term table content."
@@ -332,7 +332,7 @@ def click_word_fill_form(self, word, updates=None):
             time.sleep(0.4)  # Hack, test failing.
             self._fill_term_form(iframe, updates)
             time.sleep(0.4)  # Hack, test failing.
-            iframe.find_by_css("#submit").first.click()
+            iframe.find_by_css("#btnsubmit").first.click()
             time.sleep(0.4)  # Hack, test failing.
 
             # Only refresh the reading frame if everything was ok.