use mutation observer to sync search-input and search-tag

Author: jonian

devdocs_desktop.py

@@ -98,7 +98,7 @@ def __init__(self):
 
     self.header_search = self.main.get_object('header_search_entry')
     self.header_search.get_style_context().remove_class('search')
-    self.header_search.set_text(self.search)
+    self.header_search.set_text('')
 
     self.revealer      = self.main.get_object('revealer_main')
     self.finder_search = self.main.get_object('finder_search_entry')
@@ -242,20 +242,6 @@ def set_window_accel_groups(self):
 
     self.window.add_accel_group(group)
 
-  def sync_header_search(self):
-    self.run_javascript('getValue', 'searchTag', 'update_header_filter')
-    self.run_javascript('getValue', 'searchInput', 'update_header_search')
-
-  def update_header_filter(self, text):
-    if text != self.filter:
-      self.filter = text
-      self.header_filter.set_label(text)
-      self.header_filter.set_visible(bool(text))
-
-  def update_header_search(self, text):
-    if text != self.search:
-      self.header_search.set_text(text)
-
   def on_script_message(self, manager, data):
     data = data.get_js_value()
     data = json.loads(data.to_json(0))
@@ -268,6 +254,15 @@ def on_script_message(self, manager, data):
   def on_apply_button_changed(self, visible):
     self.header_save.set_visible(visible)
 
+  def on_search_tag_changed(self, label):
+    self.filter = label
+    self.header_filter.set_label(label)
+    self.header_filter.set_visible(bool(label))
+
+  def on_search_input_changed(self, text):
+    self.search = text
+    self.header_search.set_text(text)
+
   def on_cookies_changed(self, _manager):
     self.retrieve_cookies_values()
 
@@ -302,7 +297,6 @@ def on_window_main_key_press_event(self, _widget, event):
 
     if kname == 'Tab' and bool(self.search) and search:
       self.run_javascript('sendKey', 'search', kcode)
-      self.sync_header_search()
 
       return True
 
@@ -349,7 +343,6 @@ def on_header_search_entry_key_press_event(self, _widget, event):
 
     if kname == 'BackSpace' and not bool(self.search):
       self.run_javascript('sendKey', 'search', kcode)
-      self.sync_header_search()
 
   def on_header_search_entry_key_release_event(self, _widget, event):
     kname = Gdk.keyval_name(event.keyval)

scripts/webview.js

@@ -3,6 +3,7 @@ class DevDocsDesktop {
     this.refs = refs
 
     this.observe('settings', this.syncSettings, { attributes: true }, true)
+    this.observe('searchTag', this.syncSearch, { childList: true }, true)
   }
 
   query(selector) {
@@ -53,6 +54,11 @@ class DevDocsDesktop {
     this.isVisible('saveButton', 'on_apply_button_changed')
   }
 
+  syncSearch() {
+    this.getValue('searchTag', 'on_search_tag_changed')
+    this.getValue('searchInput', 'on_search_input_changed')
+  }
+
   isVisible(ref, callback) {
     this.onElement(ref, (element) => {
       const style = getComputedStyle(element)