diff --git a/src/components/views/rooms/RoomHeader.js b/src/components/views/rooms/RoomHeader.js
index caf19e0b69..448a46b84f 100644
--- a/src/components/views/rooms/RoomHeader.js
+++ b/src/components/views/rooms/RoomHeader.js
@@ -53,6 +53,13 @@ module.exports = React.createClass({
     componentDidMount: function() {
         var cli = MatrixClientPeg.get();
         cli.on("RoomState.events", this._onRoomStateEvents);
+
+        // When a room name occurs, RoomState.events is fired *before*
+        // room.name is updated. So we have to listen to Room.name as well as
+        // RoomState.events.
+        if (this.props.room) {
+            this.props.room.on("Room.name", this._onRoomNameChange);
+        }
     },
 
     componentDidUpdate: function() {
@@ -62,6 +69,9 @@ module.exports = React.createClass({
     },
 
     componentWillUnmount: function() {
+        if (this.props.room) {
+            this.props.room.removeListener("Room.name", this._onRoomNameChange);
+        }
         var cli = MatrixClientPeg.get();
         if (cli) {
             cli.removeListener("RoomState.events", this._onRoomStateEvents);
@@ -77,6 +87,10 @@ module.exports = React.createClass({
         this.forceUpdate();
     },
 
+    _onRoomNameChange: function(room) {
+        this.forceUpdate();
+    },
+
     onAvatarPickerClick: function(ev) {
         if (this.refs.file_label) {
             this.refs.file_label.click();
@@ -98,7 +112,7 @@ module.exports = React.createClass({
                 description: "Failed to set avatar. " + errMsg
             });
         }).done();
-    },    
+    },
 
     /**
      * After editing the settings, get the new name for the room
@@ -272,7 +286,7 @@ module.exports = React.createClass({
 
         var right_row;
         if (!this.props.editing) {
-            right_row = 
+            right_row =
                 <div className="mx_RoomHeader_rightRow">
                     { forget_button }
                     { leave_button }