From dbd37ade78148162d2ca5bb5defcefb28b853fbb Mon Sep 17 00:00:00 2001
From: Bartek Fabiszewski <github@fabiszewski.net>
Date: Wed, 25 Dec 2019 22:17:41 +0100
Subject: [PATCH] Bind option text to model property

---
 js/src/select.js       |  8 +++++++-
 js/test/select.test.js | 14 ++++++++++++++
 2 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/js/src/select.js b/js/src/select.js
index 2eb6d6e..723b0e4 100644
--- a/js/src/select.js
+++ b/js/src/select.js
@@ -17,6 +17,8 @@
  * along with this program; if not, see <http://www.gnu.org/licenses/>.
  */
 
+import uObserve from './observe.js';
+
 export default class uSelect {
 
   /**
@@ -134,7 +136,11 @@ export default class uSelect {
       this.element.add(new Option(this.allText, uSelect.allValue, false, selected === uSelect.allValue));
     }
     for (const option of options) {
-      this.element.add(new Option(option.listText, option.listValue, false, selected === option.listValue));
+      const optEl = new Option(option.listText, option.listValue, false, selected === option.listValue);
+      this.element.add(optEl);
+      uObserve.observe(option, 'listText', (text) => {
+        optEl.text = text;
+      })
     }
   }
 
diff --git a/js/test/select.test.js b/js/test/select.test.js
index 1eaef56..75b953c 100644
--- a/js/test/select.test.js
+++ b/js/test/select.test.js
@@ -162,6 +162,20 @@ describe('Select tests', () => {
     expect(select.element.options[2].value).toBe(options[1].listValue);
   });
 
+  it('should bind DOM option text with model property', (done) => {
+    // given
+    const select = new uSelect(element);
+    select.setOptions(options);
+    const newValue = 'new';
+    // when
+    options[0].listText = newValue;
+    // then
+    setTimeout(() => {
+      expect(select.element.options[0].text).toBe(newValue);
+      done();
+    }, 100);
+  });
+
   it('should set selected option', () => {
     // given
     const select = new uSelect(element);