FIX: better headerText handling on select-box

app/assets/javascripts/discourse/components/select-box.js.es6

@@ -17,6 +17,7 @@ export default Ember.Component.extend({
   caretUpIcon: "caret-up",
   caretDownIcon: "caret-down",
   headerText: null,
+  dynamicHeaderText: true,
   icon: null,
 
   value: null,
@@ -145,7 +146,7 @@ export default Ember.Component.extend({
     }
   },
 
-  @observes("content.[]")
+  @observes("content.[]", "value")
   @on("didReceiveAttrs")
   _contentChanged: function() {
     if (!Ember.isNone(this.get("value"))) {
@@ -157,8 +158,10 @@ export default Ember.Component.extend({
     this.set("filteredContent", this._remapContent(this.get("content")));
     this._setSelectedContent(this.get("content"));
 
-    if (Ember.isNone(this.get("headerText"))) {
-      this.set("headerText", this.get("selectedContent.text"));
+    if (this.get("dynamicHeaderText") === true) {
+      if (!Ember.isNone(this.get("selectedContent.text"))) {
+        this.set("headerText", this.get("selectedContent.text"));
+      }
     }
   },
 

app/assets/javascripts/discourse/components/topic-footer-mobile-dropdown.js.es6

@@ -6,6 +6,8 @@ export default SelectBoxComponent.extend({
 
   headerText: I18n.t("topic.controls"),
 
+  dynamicHeaderText: false,
+
   maxCollectionHeight: 300,
 
   init() {

test/javascripts/components/select-box-test.js.es6

@@ -272,3 +272,44 @@ componentTest('supports converting select value to integer', {
     });
   }
 });
+
+componentTest('dynamic headerText', {
+  template: '{{select-box value=1 content=content}}',
+
+  beforeEach() {
+    this.set("content", [{ id: 1, text: "robin" }, { id: 2, text: "regis" }]);
+  },
+
+  test(assert) {
+    click(".select-box-header");
+    andThen(() => {
+      assert.equal(find(".select-box-header .current-selection").html().trim(), "robin");
+    });
+
+    click(".select-box-row[title='regis']");
+    andThen(() => {
+      assert.equal(find(".select-box-header .current-selection").html().trim(), "regis", "it changes header text");
+    });
+  }
+});
+
+componentTest('static headerText', {
+  template: '{{select-box value=1 content=content dynamicHeaderText=false headerText=headerText}}',
+
+  beforeEach() {
+    this.set("content", [{ id: 1, text: "robin" }, { id: 2, text: "regis" }]);
+    this.set("headerText", "Choose...");
+  },
+
+  test(assert) {
+    click(".select-box-header");
+    andThen(() => {
+      assert.equal(find(".select-box-header .current-selection").html().trim(), "Choose...");
+    });
+
+    click(".select-box-row[title='regis']");
+    andThen(() => {
+      assert.equal(find(".select-box-header .current-selection").html().trim(), "Choose...", "it doesn’t change header text");
+    });
+  }
+});