Bind option text to model property

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;
+      })
     }
   }
 

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);