Bug 1170627: close the context edit form upon a successful save action inside a Hello conversation window. r=Standard8

This commit is contained in:
Mike de Boer 2015-06-10 13:36:21 +02:00
parent 1de8404025
commit 2b23909508
6 changed files with 52 additions and 11 deletions

View File

@ -513,7 +513,11 @@ loop.store = loop.store || {};
// When no properties have been set on the roomData object, there's nothing
// to save.
if (!Object.getOwnPropertyNames(roomData).length) {
this.dispatchAction(new sharedActions.UpdateRoomContextDone());
// Ensure async actions so that we get separate setStoreState events
// that React components won't miss.
setTimeout(function() {
this.dispatchAction(new sharedActions.UpdateRoomContextDone());
}.bind(this), 0);
return;
}

View File

@ -338,6 +338,13 @@ loop.roomViews = (function(mozL10n) {
}
}
// Make sure we do not show the edit-mode when we just successfully saved
// context.
if (this.props.savingContext && nextProps.savingContext !== this.props.savingContext &&
!nextProps.error && this.state.editMode) {
newState.editMode = false;
}
if (Object.getOwnPropertyNames(newState).length) {
this.setState(newState);
}
@ -345,7 +352,7 @@ loop.roomViews = (function(mozL10n) {
getDefaultProps: function() {
return { editMode: false };
},
},
getInitialState: function() {
var url = this._getURL();
@ -528,7 +535,7 @@ loop.roomViews = (function(mozL10n) {
React.createElement("button", {className: "btn btn-info",
disabled: this.props.savingContext,
onClick: this.handleFormSubmit},
mozL10n.get("context_save_label")
mozL10n.get("context_save_label2")
),
React.createElement("button", {className: "room-context-btn-close",
onClick: this.handleCloseClick,

View File

@ -338,6 +338,13 @@ loop.roomViews = (function(mozL10n) {
}
}
// Make sure we do not show the edit-mode when we just successfully saved
// context.
if (this.props.savingContext && nextProps.savingContext !== this.props.savingContext &&
!nextProps.error && this.state.editMode) {
newState.editMode = false;
}
if (Object.getOwnPropertyNames(newState).length) {
this.setState(newState);
}
@ -345,7 +352,7 @@ loop.roomViews = (function(mozL10n) {
getDefaultProps: function() {
return { editMode: false };
},
},
getInitialState: function() {
var url = this._getURL();
@ -528,7 +535,7 @@ loop.roomViews = (function(mozL10n) {
<button className="btn btn-info"
disabled={this.props.savingContext}
onClick={this.handleFormSubmit}>
{mozL10n.get("context_save_label")}
{mozL10n.get("context_save_label2")}
</button>
<button className="room-context-btn-close"
onClick={this.handleCloseClick}

View File

@ -603,9 +603,10 @@ describe("loop.store.RoomStore", function () {
});
describe("#updateRoomContext", function() {
var store, fakeMozLoop;
var store, fakeMozLoop, clock;
beforeEach(function() {
clock = sinon.useFakeTimers();
fakeMozLoop = {
rooms: {
get: sinon.stub().callsArgWith(1, null, {
@ -620,6 +621,10 @@ describe("loop.store.RoomStore", function () {
store = new loop.store.RoomStore(dispatcher, {mozLoop: fakeMozLoop});
});
afterEach(function() {
clock.restore();
});
it("should rename the room via mozLoop", function() {
fakeMozLoop.rooms.update = sinon.spy();
dispatcher.dispatch(new sharedActions.UpdateRoomContext({
@ -674,6 +679,7 @@ describe("loop.store.RoomStore", function () {
roomToken: "42abc",
newRoomName: " \t \t "
}));
clock.tick(1);
sinon.assert.notCalled(fakeMozLoop.rooms.update);
expect(store.getStoreState().savingContext).to.eql(false);
@ -731,6 +737,7 @@ describe("loop.store.RoomStore", function () {
newRoomThumbnail: "",
newRoomURL: ""
}));
clock.tick(1);
sinon.assert.notCalled(fakeMozLoop.rooms.update);
expect(store.getStoreState().savingContext).to.eql(false);

View File

@ -700,6 +700,7 @@ describe("loop.roomViews", function () {
props = _.extend({
dispatcher: dispatcher,
mozLoop: fakeMozLoop,
savingContext: false,
show: true,
roomData: {
roomToken: "fakeToken"
@ -785,7 +786,7 @@ describe("loop.roomViews", function () {
expect(checkbox.classList.contains("disabled")).to.eql(true);
});
it("should render the editMode view when the edit button is clicked", function(next) {
it("should render the editMode view when the edit button is clicked", function(done) {
var roomName = "Hello, is it me you're looking for?";
view = mountTestComponent({
roomData: {
@ -808,11 +809,11 @@ describe("loop.roomViews", function () {
expect(node.querySelector(".room-context-url").value).to.eql(fakeContextURL.location);
expect(node.querySelector(".room-context-comments").value).to.eql(fakeContextURL.description);
next();
done();
});
});
it("should hide the checkbox when no context data is stored or available", function(next) {
it("should hide the checkbox when no context data is stored or available", function(done) {
view = mountTestComponent({
roomData: {
roomToken: "fakeToken",
@ -830,7 +831,7 @@ describe("loop.roomViews", function () {
var node = view.getDOMNode();
expect(node.querySelector(".checkbox-wrapper").classList.contains("hide")).to.eql(true);
next();
done();
});
});
});
@ -890,6 +891,21 @@ describe("loop.roomViews", function () {
newRoomThumbnail: fakeContextURL.thumbnail
}));
});
it("should close the edit form when context was saved successfully", function(done) {
view.setProps({ savingContext: true }, function() {
var node = view.getDOMNode();
// The button should show up as disabled.
expect(node.querySelector(".btn-info").hasAttribute("disabled")).to.eql(true);
// Now simulate a successful save.
view.setProps({ savingContext: false }, function() {
// The editMode flag should be updated.
expect(view.state.editMode).to.eql(false);
done();
});
});
});
});
describe("#handleCheckboxChange", function() {

View File

@ -351,6 +351,6 @@ context_add_some_label=Add some context
context_edit_tooltip=Edit Context
context_hide_tooltip=Hide Context
context_show_tooltip=Show Context
context_save_label=Save Context
context_save_label2=Save
context_link_modified=This link was modified.
context_learn_more_link_label=Learn more.