If you look at comment expand process with javascript debugger, you
will notice that at first comments get added to existing stream ("add"
event handler of model.comments gets launched because of model.comments.fetch).
Then the comment stream gets empty and then filled by the postRenderTemplate
handler.
This patch removes comments rerendering on the expansion. The fetching process is
changed so that older comments are added to the correct place, so the order
looks nice without rerendering. Thus, unnecessary job of rerendering is avoided.
129 lines
4.6 KiB
JavaScript
129 lines
4.6 KiB
JavaScript
describe("app.views.CommentStream", function(){
|
|
beforeEach(function(){
|
|
this.view = new app.views.CommentStream({model : factory.post()});
|
|
loginAs({});
|
|
});
|
|
|
|
describe("binds", function() {
|
|
it("calls appendComment on insertion to the comments collection", function() {
|
|
spyOn(this.view, "appendComment");
|
|
this.view.setupBindings();
|
|
this.view.model.comments.push(factory.comment());
|
|
expect(this.view.appendComment).toHaveBeenCalled();
|
|
});
|
|
});
|
|
|
|
describe("createComment", function() {
|
|
beforeEach(function() {
|
|
this.view.render();
|
|
this.view.$el.append($("<div id='flash-container'/>"));
|
|
app.flashMessages = new app.views.FlashMessages({ el: this.view.$("#flash-container") });
|
|
this.view.expandComments();
|
|
});
|
|
|
|
context("submission", function() {
|
|
beforeEach(function() {
|
|
this.view.$(".comment_box").val('a new comment');
|
|
this.view.createComment();
|
|
|
|
this.request = jasmine.Ajax.requests.mostRecent();
|
|
});
|
|
|
|
it("fires an AJAX request", function() {
|
|
var params = this.request.data();
|
|
|
|
expect(params.text).toEqual("a new comment");
|
|
});
|
|
|
|
it("adds the comment to the view", function() {
|
|
this.request.respondWith({status: 200, responseText: '[]'});
|
|
expect(this.view.$(".comment-content p").text()).toEqual("a new comment");
|
|
});
|
|
|
|
it("doesn't add the comment to the view, when the request fails", function(){
|
|
this.request.respondWith({status: 500});
|
|
|
|
expect(this.view.$(".comment-content p").text()).not.toEqual("a new comment");
|
|
expect(this.view.$(".flash-message")).toBeErrorFlashMessage(
|
|
"Failed to comment. Maybe the author is ignoring you?"
|
|
);
|
|
});
|
|
});
|
|
|
|
it("clears the comment box when there are only spaces", function() {
|
|
this.view.$(".comment_box").val(' ');
|
|
this.view.createComment();
|
|
expect(this.view.$(".comment_box").val()).toEqual("");
|
|
});
|
|
|
|
it("resets comment box height", function() {
|
|
this.view.$(".comment_box").val('a new comment');
|
|
this.view.createComment();
|
|
expect(this.view.$(".comment_box").attr("style")).not.toContain("height");
|
|
});
|
|
});
|
|
|
|
describe("appendComment", function(){
|
|
it("appends this.model as 'parent' to the comment", function(){
|
|
var comment = factory.comment();
|
|
spyOn(comment, "set");
|
|
this.view.appendComment(comment);
|
|
expect(comment.set).toHaveBeenCalled();
|
|
});
|
|
|
|
it("sorts comments in the right order", function() {
|
|
this.view.render();
|
|
this.view.appendComment(factory.comment({"created_at": new Date(2000).toJSON(), "text": "2"}));
|
|
this.view.appendComment(factory.comment({"created_at": new Date(4000).toJSON(), "text": "4"}));
|
|
this.view.appendComment(factory.comment({"created_at": new Date(5000).toJSON(), "text": "5"}));
|
|
this.view.appendComment(factory.comment({"created_at": new Date(6000).toJSON(), "text": "6"}));
|
|
this.view.appendComment(factory.comment({"created_at": new Date(1000).toJSON(), "text": "1"}));
|
|
this.view.appendComment(factory.comment({"created_at": new Date(3000).toJSON(), "text": "3"}));
|
|
|
|
expect(this.view.$(".comments div.comment.media").length).toEqual(6);
|
|
expect(this.view.$(".comments div.comment.media div.comment-content p").text()).toEqual("123456");
|
|
});
|
|
});
|
|
|
|
describe("expandComments", function() {
|
|
it("doesn't drop the comment textbox value on success", function() {
|
|
this.view.render();
|
|
this.view.$("textarea").val("great post!");
|
|
this.view.expandComments();
|
|
|
|
jasmine.Ajax.requests.mostRecent().respondWith({ comments : [] });
|
|
|
|
expect(this.view.$("textarea").val()).toEqual("great post!");
|
|
});
|
|
});
|
|
|
|
describe("pressing a key when typing on the new comment box", function(){
|
|
var submitCallback;
|
|
|
|
beforeEach(function() {
|
|
submitCallback = jasmine.createSpy().and.returnValue(false);
|
|
});
|
|
|
|
it("should not submit the form when enter key is pressed", function(){
|
|
this.view.render();
|
|
var form = this.view.$("form");
|
|
form.submit(submitCallback);
|
|
|
|
var e = $.Event("keydown", { which: Keycodes.ENTER, ctrlKey: false });
|
|
this.view.keyDownOnCommentBox(e);
|
|
|
|
expect(submitCallback).not.toHaveBeenCalled();
|
|
});
|
|
|
|
it("should submit the form when enter is pressed with ctrl", function(){
|
|
this.view.render();
|
|
var form = this.view.$("form");
|
|
form.submit(submitCallback);
|
|
|
|
var e = $.Event("keydown", { which: Keycodes.ENTER, ctrlKey: true });
|
|
this.view.keyDownOnCommentBox(e);
|
|
|
|
expect(submitCallback).toHaveBeenCalled();
|
|
});
|
|
});
|
|
});
|