Convert aspect-edit-spec.js to use actual DOM fixtures generated by AspectsControllerSpec.
This commit is contained in:
parent
d0774022b0
commit
de502bf67c
3 changed files with 60 additions and 65 deletions
|
|
@ -23,7 +23,7 @@ var AspectEdit = {
|
|||
},
|
||||
|
||||
startDrag: function() {
|
||||
AspectEdit.animateImage($(this).children("img").first());
|
||||
AspectEdit.animateImage($(this).find("img").first());
|
||||
$(".draggable_info").fadeIn(100);
|
||||
},
|
||||
|
||||
|
|
@ -33,11 +33,11 @@ var AspectEdit = {
|
|||
},
|
||||
|
||||
duringDrag: function(event, ui) {
|
||||
$(this).children("img").tipsy("hide"); //ensure this is hidden
|
||||
$(this).find("img").first().tipsy("hide"); //ensure this is hidden
|
||||
},
|
||||
|
||||
stopDrag: function(event, ui) {
|
||||
$(this).children("img").animate({'height':70, 'width':70, 'opacity':1}, 200);
|
||||
$(this).find("img").first().animate({'height':70, 'width':70, 'opacity':1}, 200);
|
||||
$(".draggable_info").fadeOut(100);
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -163,6 +163,10 @@ describe AspectsController do
|
|||
get :manage
|
||||
assigns(:remote_requests).count.should == 1
|
||||
end
|
||||
it "generates a jasmine fixture" do
|
||||
get :manage
|
||||
save_fixture(html_for("body"), "aspects_manage")
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -6,15 +6,7 @@
|
|||
describe("AspectEdit", function() {
|
||||
|
||||
beforeEach(function() {
|
||||
$('#jasmine_content').html(
|
||||
'<ul data-aspect_id="guid-of-current-aspect" class="dropzone ui-droppable">' +
|
||||
' <li class="person ui-draggable" data-aspect_id="guid-of-current-aspect" data-guid="guid-of-this-person">' +
|
||||
' <img alt="Alexander Hamiltom" class="avatar" data-person_id="guid-of-this-person" src="default.png" original-title="Alexander Hamiltom">' +
|
||||
' </li>' +
|
||||
'</ul>' +
|
||||
'<ul data-aspect_id="guid-of-target-aspect" class="dropzone ui-droppable">' +
|
||||
'</ul>'
|
||||
);
|
||||
spec.loadFixture('aspects_manage');
|
||||
});
|
||||
|
||||
describe("initialize", function() {
|
||||
|
|
@ -52,13 +44,13 @@ describe("AspectEdit", function() {
|
|||
describe("startDrag", function() {
|
||||
it("animates the image", function() {
|
||||
spyOn(AspectEdit, "animateImage");
|
||||
$.proxy(AspectEdit.startDrag, $('.person.ui-draggable'))();
|
||||
$.proxy(AspectEdit.startDrag, $('ul .person').first())();
|
||||
expect(AspectEdit.animateImage).toHaveBeenCalled();
|
||||
expect(AspectEdit.animateImage.mostRecentCall.args[0]).toHaveClass("avatar");
|
||||
});
|
||||
it("fades in the drag and drop text", function() {
|
||||
spyOn($.fn, "fadeIn");
|
||||
$.proxy(AspectEdit.startDrag, $('.person.ui-draggable'))();
|
||||
$.proxy(AspectEdit.startDrag, $('ul .person').first())();
|
||||
expect($.fn.fadeIn).toHaveBeenCalledWith(100);
|
||||
expect($.fn.fadeIn.mostRecentCall.object.selector).toEqual(".draggable_info");
|
||||
});
|
||||
|
|
@ -81,7 +73,7 @@ describe("AspectEdit", function() {
|
|||
describe("duringDrag", function() {
|
||||
it("rehides the tipsy thingy", function() {
|
||||
spyOn($.fn, "tipsy");
|
||||
$.proxy(AspectEdit.duringDrag, $('.person.ui-draggable'))();
|
||||
$.proxy(AspectEdit.duringDrag, $('ul .person'))();
|
||||
expect($.fn.tipsy).toHaveBeenCalledWith("hide");
|
||||
expect($.fn.tipsy.mostRecentCall.object).toHaveClass("avatar");
|
||||
});
|
||||
|
|
@ -90,14 +82,14 @@ describe("AspectEdit", function() {
|
|||
describe("stopDrag", function() {
|
||||
it("animates the image back to smaller size and full opacity", function() {
|
||||
spyOn($.fn, "animate");
|
||||
$.proxy(AspectEdit.stopDrag, $('.person.ui-draggable'))();
|
||||
$.proxy(AspectEdit.stopDrag, $('ul .person'))();
|
||||
expect($.fn.animate).toHaveBeenCalledWith({'height':70, 'width':70, 'opacity':1}, 200);
|
||||
// fadeOut calls animate, apparently, so mostRecentCall isn't the right call
|
||||
expect($.fn.animate.calls[0].object).toHaveClass("avatar");
|
||||
});
|
||||
it("fades out the drag and drop text", function() {
|
||||
spyOn($.fn, "fadeOut");
|
||||
$.proxy(AspectEdit.stopDrag, $('.person.ui-draggable'))();
|
||||
$.proxy(AspectEdit.stopDrag, $('ul .person'))();
|
||||
expect($.fn.fadeOut).toHaveBeenCalledWith(100);
|
||||
expect($.fn.fadeOut.mostRecentCall.object.selector).toEqual(".draggable_info");
|
||||
});
|
||||
|
|
@ -114,108 +106,107 @@ describe("AspectEdit", function() {
|
|||
expect($.ajax).not.toHaveBeenCalled();
|
||||
});
|
||||
it("adds the person back into the original div", function() {
|
||||
var targetAspect = $('.dropzone.ui-droppable[data-aspect_id="guid-of-current-aspect"]');
|
||||
var thingToDrag = $('ul .person').last();
|
||||
var aspectId = thingToDrag.attr('data-aspect_id');
|
||||
var targetAspect = $('ul.dropzone[data-aspect_id="' + aspectId + '"]');
|
||||
|
||||
spyOn($.fn, "append");
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: $('.person.ui-draggable')});
|
||||
expect($.fn.append).toHaveBeenCalledWith($('.person.ui-draggable'));
|
||||
expect($.fn.append.mostRecentCall.object.attr("data-aspect_id")).toEqual("guid-of-current-aspect");
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: thingToDrag});
|
||||
expect($.fn.append).toHaveBeenCalledWith(thingToDrag);
|
||||
expect($.fn.append.mostRecentCall.object.attr("data-aspect_id")).toEqual(aspectId);
|
||||
});
|
||||
});
|
||||
describe("when moving an existing friend between aspects", function() {
|
||||
beforeEach(function() {
|
||||
thingToDrag = $('ul .person').last();
|
||||
personId = thingToDrag.attr("data-guid");
|
||||
fromAspectId = thingToDrag.attr('data-aspect_id');
|
||||
targetAspect = $('ul.dropzone').last();
|
||||
toAspectId = targetAspect.attr('data-aspect_id');
|
||||
expect(fromAspectId).not.toEqual(toAspectId);
|
||||
});
|
||||
it("calls move_contact", function() {
|
||||
var targetAspect = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: $('.person.ui-draggable')});
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: thingToDrag});
|
||||
expect($.ajax).toHaveBeenCalled();
|
||||
var args = $.ajax.mostRecentCall.args[0];
|
||||
expect(args["url"]).toEqual("/aspects/move_contact/");
|
||||
expect(args["data"]["person_id"]).toEqual("guid-of-this-person");
|
||||
expect(args["data"]["from"]).toEqual("guid-of-current-aspect");
|
||||
expect(args["data"]["to"]).toEqual({"to": "guid-of-target-aspect" });
|
||||
expect(args["data"]["person_id"]).toEqual(personId);
|
||||
expect(args["data"]["from"]).toEqual(fromAspectId);
|
||||
expect(args["data"]["to"]).toEqual({"to": toAspectId});
|
||||
});
|
||||
it("doesn't call the ajaxy request delete", function() {
|
||||
var targetAspect = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: $('.person.ui-draggable')});
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: thingToDrag});
|
||||
expect($.ajax.calls.length).toEqual(1);
|
||||
});
|
||||
it("adds the person to the aspect div", function() {
|
||||
var targetAspect = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
spyOn($.fn, "append");
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: $('.person.ui-draggable')});
|
||||
expect($.fn.append).toHaveBeenCalledWith($('.person.ui-draggable'));
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: thingToDrag});
|
||||
expect($.fn.append).toHaveBeenCalledWith(thingToDrag);
|
||||
expect($.fn.append.mostRecentCall.object.hasClass("dropzone")).toBeTruthy();
|
||||
});
|
||||
});
|
||||
describe("when dragging a friend request", function() {
|
||||
beforeEach(function() {
|
||||
$('#jasmine_content').html(
|
||||
'<li class="person request ui-draggable" data-person_id="guid-of-friendship-requestor" data-guid="guid-of-friendship-requestor">' +
|
||||
' <img alt="Alexander Hamiltom" class="avatar" data-person_id="guid-of-friendship-requestor" src="/images/user/default.png?1287542906" original-title="Alexander Hamiltom">' +
|
||||
'</li>' +
|
||||
'<ul data-aspect_id="guid-of-target-aspect" class="dropzone ui-droppable">' +
|
||||
'</ul>'
|
||||
);
|
||||
});
|
||||
requestToDrag = $('ul .person').first();
|
||||
personId = requestToDrag.attr("data-guid");
|
||||
targetAspect = $('ul.dropzone').last();
|
||||
toAspectId = targetAspect.attr('data-aspect_id');
|
||||
});
|
||||
it("deletes the request object", function() {
|
||||
$.proxy(AspectEdit.onDropMove, $('.dropzone.ui-droppable'))(null, {draggable: $('.person.ui-draggable')});
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: requestToDrag});
|
||||
expect($.ajax).toHaveBeenCalled();
|
||||
var args = $.ajax.calls[0].args[0];
|
||||
expect(args["type"]).toEqual("DELETE");
|
||||
expect(args["url"]).toEqual("/requests/guid-of-friendship-requestor");
|
||||
expect(args["data"]).toEqual({"accept" : true, "aspect_id" : "guid-of-target-aspect" });
|
||||
expect(args["url"]).toEqual("/requests/" + personId);
|
||||
expect(args["data"]).toEqual({"accept" : true, "aspect_id" : toAspectId });
|
||||
});
|
||||
it("doesn't call move_contact", function() {
|
||||
$.proxy(AspectEdit.onDropMove, $('.dropzone.ui-droppable'))(null, {draggable: $('.person.ui-draggable')});
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: requestToDrag});
|
||||
expect($.ajax.calls.length).toEqual(1);
|
||||
});
|
||||
it("adds the person to the aspect div", function() {
|
||||
spyOn($.fn, "append");
|
||||
$.proxy(AspectEdit.onDropMove, $('.dropzone.ui-droppable'))(null, {draggable: $('.person.ui-draggable')});
|
||||
expect($.fn.append).toHaveBeenCalledWith($('.person.ui-draggable'));
|
||||
$.proxy(AspectEdit.onDropMove, targetAspect)(null, {draggable: requestToDrag});
|
||||
expect($.fn.append).toHaveBeenCalledWith(requestToDrag);
|
||||
expect($.fn.append.mostRecentCall.object.hasClass("dropzone")).toBeTruthy();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("onDeleteRequestSuccess", function() {
|
||||
beforeEach(function() {
|
||||
$('#jasmine_content').html(
|
||||
'<li class="person request ui-draggable" data-person_id="guid-of-friendship-requestor" data-guid="guid-of-friendship-requestor">' +
|
||||
' <img alt="Alexander Hamiltom" class="avatar" data-person_id="guid-of-friendship-requestor" src="/images/user/default.png?1287542906" original-title="Alexander Hamiltom">' +
|
||||
'</li>' +
|
||||
'<ul data-aspect_id="guid-of-target-aspect" class="dropzone ui-droppable">' +
|
||||
'</ul>'
|
||||
);
|
||||
});
|
||||
it("takes the request class off the person li", function() {
|
||||
var person = $('li.person');
|
||||
var dropzone = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
var person = $('ul .person').first();
|
||||
var dropzone = $('ul.dropzone').last();
|
||||
expect(person).toHaveClass('request');
|
||||
AspectEdit.onDeleteRequestSuccess(person, dropzone);
|
||||
expect(person).not.toHaveClass('request');
|
||||
});
|
||||
it("removes data-person_id from the li", function() {
|
||||
var person = $('li.person');
|
||||
var dropzone = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
var person = $('ul .person').first();
|
||||
var dropzone = $('ul.dropzone').last();
|
||||
expect(person.attr("data-person_id")).toBeDefined();
|
||||
AspectEdit.onDeleteRequestSuccess(person, dropzone);
|
||||
expect(person.attr("data-person_id")).not.toBeDefined();
|
||||
});
|
||||
it("puts a data-aspect_id on the li", function() {
|
||||
var person = $('li.person');
|
||||
var dropzone = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
var person = $('ul .person').first();
|
||||
var dropzone = $('ul.dropzone').last();
|
||||
expect(person.attr("data-aspect_id")).not.toBeDefined();
|
||||
AspectEdit.onDeleteRequestSuccess(person, dropzone);
|
||||
expect(person.attr("data-aspect_id")).toEqual("guid-of-target-aspect");
|
||||
expect(person.attr("data-aspect_id")).toEqual(dropzone.attr("data-aspect_id"));
|
||||
});
|
||||
});
|
||||
|
||||
describe("onMovePersonSuccess", function() {
|
||||
it("updates the data-aspect_id attribute on the person li", function() {
|
||||
var person = $('li.person');
|
||||
var dropzone = $('.dropzone.ui-droppable[data-aspect_id="guid-of-target-aspect"]');
|
||||
expect(person.attr("data-aspect_id")).toEqual("guid-of-current-aspect");
|
||||
var person = $('ul .person').last();
|
||||
var fromAspectId = person.attr('data-aspect_id');
|
||||
var dropzone = $('ul.dropzone').last();
|
||||
var toAspectId = dropzone.attr('data-aspect_id');
|
||||
|
||||
expect(person.attr("data-aspect_id")).toEqual(fromAspectId);
|
||||
AspectEdit.onMovePersonSuccess(person, dropzone);
|
||||
expect(person.attr("data-aspect_id")).toEqual("guid-of-target-aspect");
|
||||
expect(person.attr("data-aspect_id")).toEqual(toAspectId);
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue