From 37da39999738393ab4fa04308408e29363c3b45c Mon Sep 17 00:00:00 2001 From: cahrens Date: Fri, 18 Apr 2014 09:43:23 -0400 Subject: [PATCH] Update unit test based on changes in master. --- CHANGELOG.rst | 2 + cms/static/js/spec/views/container_spec.js | 118 ++++--- .../js/spec/views/modals/edit_xblock_spec.js | 2 +- cms/static/js/views/container.js | 24 +- .../js/mock/mock-container-xblock.underscore | 309 ++++++++++++------ .../js/mock/mock-container.underscore | 209 ------------ 6 files changed, 284 insertions(+), 380 deletions(-) delete mode 100644 cms/templates/js/mock/mock-container.underscore diff --git a/CHANGELOG.rst b/CHANGELOG.rst index b3a6331f7f..79de8c09f4 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -5,6 +5,8 @@ These are notable changes in edx-platform. This is a rolling list of changes, in roughly chronological order, most recent first. Add your entries at or near the top. Include a label indicating the component affected. +Studio: Add drag-and-drop support to the container page. STUD-1309. + Common: Add extensible third-party auth module. Blades: Handle situation if no response were sent from XQueue to LMS in Matlab diff --git a/cms/static/js/spec/views/container_spec.js b/cms/static/js/spec/views/container_spec.js index 53de72a3be..dd13ef46a5 100644 --- a/cms/static/js/spec/views/container_spec.js +++ b/cms/static/js/spec/views/container_spec.js @@ -1,4 +1,4 @@ -define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/models/xblock_info", +define([ "jquery", "js/spec_helpers/create_sinon", "URI", "js/views/container", "js/models/xblock_info", "js/views/feedback_notification", "jquery.simulate", "xmodule", "coffee/src/main", "xblock/cms.runtime.v1"], function ($, create_sinon, URI, ContainerView, XBlockInfo, Notification) { @@ -7,24 +7,26 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode describe("Supports reordering components", function () { - var model, containerView, mockContainerHTML, respondWithMockXBlockFragment; + var model, containerView, mockContainerHTML, respondWithMockXBlockFragment, + init, dragHandle, verifyRequest, verifyNumReorderCalls, respondToRequest, - // TODO: this will all need to be updated according to Andy's mock HTML, - // and locators should be draft. - var splitTestUrl = "/xblock/ccc.dd.ee/branch/draft/block/AB_Test"; + rootLocator = 'testCourse/branch/draft/split_test/splitFFF', + containerTestUrl = '/xblock/' + rootLocator, - var groupAUrl = "/xblock/ccc.dd.ee/branch/published/block/group_a"; - var groupA = "ccc.dd.ee/branch/published/block/group_a"; - var groupAText = "ccc.dd.ee/branch/published/block/html_4658c0f4c400"; - var groupAVideo = "ccc.dd.ee/branch/published/block/group_a_video"; + groupAUrl = "/xblock/locator-group-A", + groupA = "locator-group-A", + groupAComponent1 = "locator-component-A1", + groupAComponent2 = "locator-component-A2", + groupAComponent3 = "locator-component-A3", - var groupBUrl = "/xblock/ccc.dd.ee/branch/published/block/group_b"; - var groupB = "ccc.dd.ee/branch/published/block/group_b"; - var groupBText = "ccc.dd.ee/branch/published/block/html_b5c18016d991"; - var groupBProblem = "ccc.dd.ee/branch/published/block/Checkboxes"; + groupBUrl = "/xblock/locator-group-B", + groupB = "locator-group-B", + groupBComponent1 = "locator-component-B1", + groupBComponent2 = "locator-component-B2", + groupBComponent3 = "locator-component-B3"; - // TODO: switch to using Andy's mock container view files (which uses mock xblocks). - mockContainerHTML = readFixtures('mock/mock-container.underscore'); + rootLocator = 'testCourse/branch/draft/split_test/splitFFF'; + mockContainerHTML = readFixtures('mock/mock-container-xblock.underscore'); respondWithMockXBlockFragment = function (requests, response) { var requestIndex = requests.length - 1; @@ -32,15 +34,17 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode }; beforeEach(function () { + setFixtures('
'); model = new XBlockInfo({ - id: 'testCourse/branch/draft/split_test/splitFFF', + id: rootLocator, display_name: 'Test AB Test', category: 'split_test' }); containerView = new ContainerView({ model: model, - view: 'container_preview' + view: 'container_preview', + el: $('.wrapper-xblock') }); }); @@ -48,7 +52,7 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode containerView.remove(); }); - var init = function (caller) { + init = function (caller) { var requests = create_sinon.requests(caller); containerView.render(); @@ -61,27 +65,29 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode return requests; }; - var dragHandle = function (index, dy) { - containerView.$el.find(".drag-handle:eq(" + index + ")").simulate("drag", {dy: dy}); + dragHandle = function (index, dy) { + var handle = containerView.$(".drag-handle:eq(" + index + ")"); + handle.simulate("drag", {dy: dy}); }; - var verifyRequest = function (requests, reorderCallIndex, expectedURL, expectedChildren) { + verifyRequest = function (requests, reorderCallIndex, expectedURL, expectedChildren) { + var request, children, i; // 0th call is the response to the initial render call to get HTML. - var request = requests[reorderCallIndex + 1]; + request = requests[reorderCallIndex + 1]; expect(request.url).toEqual(expectedURL); - var children = (JSON.parse(request.requestBody)).children; + children = (JSON.parse(request.requestBody)).children; expect(children.length).toEqual(expectedChildren.length); - for (var i = 0; i < children.length; i++) { + for (i = 0; i < children.length; i++) { expect(children[i]).toEqual(expectedChildren[i]); } }; - var verifyNumReorderCalls = function (requests, expectedCalls) { + verifyNumReorderCalls = function (requests, expectedCalls) { // Number of calls will be 1 more than expected because of the initial render call to get HTML. expect(requests.length).toEqual(expectedCalls + 1); }; - var respondToRequest = function (requests, reorderCallIndex, status) { + respondToRequest = function (requests, reorderCallIndex, status) { // Number of calls will be 1 more than expected because of the initial render call to get HTML. requests[reorderCallIndex + 1].respond(status); }; @@ -89,68 +95,70 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode it('does nothing if item not moved far enough', function () { var requests = init(this); // Drag the first thing in Group A (text component) down very slightly, but not past second thing. - dragHandle(1, 5); + dragHandle(2, 5); verifyNumReorderCalls(requests, 0); }); it('can reorder within a group', function () { var requests = init(this); - // Drag the first thing in Group A (text component) after the second thing (video). - dragHandle(1, 80); + // Drag the first component in Group A to the end + dragHandle(2, 80); respondToRequest(requests, 0, 200); verifyNumReorderCalls(requests, 1); - verifyRequest(requests, 0, groupAUrl, [groupAVideo, groupAText]); + verifyRequest(requests, 0, groupAUrl, [groupAComponent2, groupAComponent3, groupAComponent1]); }); it('can drag from one group to another', function () { var requests = init(this); - // Drag the first thing in Group A (text component) into the second group. - dragHandle(1, 200); + // Drag the first component in Group A into the second group. + dragHandle(2, 300); respondToRequest(requests, 0, 200); respondToRequest(requests, 1, 200); // Will get an event to move into Group B and an event to remove from Group A. verifyNumReorderCalls(requests, 2); - verifyRequest(requests, 0, groupBUrl, [groupBText, groupAText, groupBProblem]); - verifyRequest(requests, 1, groupAUrl, [groupAVideo]); + verifyRequest(requests, 0, groupBUrl, + [groupBComponent1, groupBComponent2, groupAComponent1, groupBComponent3]); + verifyRequest(requests, 1, groupAUrl, [groupAComponent2, groupAComponent3]); }); it('does not remove from old group if addition to new group fails', function () { var requests = init(this); - // Drag the first thing in Group A (text component) into the second group. - dragHandle(1, 200); + // Drag the first component in Group A into the second group. + dragHandle(2, 300); respondToRequest(requests, 0, 500); // Send failure for addition to new group-- no removal event should be received. verifyNumReorderCalls(requests, 1); - verifyRequest(requests, 0, groupBUrl, [groupBText, groupAText, groupBProblem]); + verifyRequest(requests, 0, groupBUrl, + [groupBComponent1, groupBComponent2, groupAComponent1, groupBComponent3]); }); it('can swap group A and group B', function () { var requests = init(this); // Drag Group B before group A. - dragHandle(3, -200); + dragHandle(5, -300); respondToRequest(requests, 0, 200); verifyNumReorderCalls(requests, 1); - verifyRequest(requests, 0, splitTestUrl, [groupB, groupA]); + verifyRequest(requests, 0, containerTestUrl, [groupB, groupA]); }); it('can drag a component to the top level, and nest one group in another', function () { var requests = init(this); // Drag text item in Group A to the top level (in first position). - dragHandle(1, -20); + dragHandle(2, -40); respondToRequest(requests, 0, 200); respondToRequest(requests, 1, 200); verifyNumReorderCalls(requests, 2); - verifyRequest(requests, 0, splitTestUrl, [groupAText, groupA, groupB]); - verifyRequest(requests, 1, groupAUrl, [groupAVideo]); + verifyRequest(requests, 0, containerTestUrl, [groupAComponent1, groupA, groupB]); + verifyRequest(requests, 1, groupAUrl, [groupAComponent2, groupAComponent3]); - // Drag Group A (only contains video now) into Group B. + // Drag Group A into Group B. dragHandle(1, 150); respondToRequest(requests, 2, 200); respondToRequest(requests, 3, 200); verifyNumReorderCalls(requests, 4); - verifyRequest(requests, 2, groupBUrl, [groupBText, groupA, groupBProblem]); - verifyRequest(requests, 3, splitTestUrl, [groupAText, groupB]); + verifyRequest(requests, 2, groupBUrl, [groupBComponent1, groupA, groupBComponent2]); + verifyRequest(requests, 3, containerTestUrl, [groupAComponent1, groupB]); }); describe("Shows a saving message", function () { @@ -163,13 +171,16 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode }); it('hides saving message upon success', function () { - var requests = init(this); - // Drag text item in Group A to the top level (in first position). - dragHandle(1, -20); + var requests, savingOptions; + requests = init(this); + + // Drag the first component in Group A into the second group. + dragHandle(2, 200); + expect(savingSpies.constructor).toHaveBeenCalled(); expect(savingSpies.show).toHaveBeenCalled(); expect(savingSpies.hide).not.toHaveBeenCalled(); - var savingOptions = savingSpies.constructor.mostRecentCall.args[0]; + savingOptions = savingSpies.constructor.mostRecentCall.args[0]; expect(savingOptions.title).toMatch(/Saving/); respondToRequest(requests, 0, 200); @@ -181,8 +192,10 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode it('does not hide saving message if failure', function () { var requests = init(this); - // Drag text item in Group A to the top level (in first position). - dragHandle(1, -20); + + // Drag the first component in Group A into the second group. + dragHandle(2, 200); + expect(savingSpies.constructor).toHaveBeenCalled(); expect(savingSpies.show).toHaveBeenCalled(); expect(savingSpies.hide).not.toHaveBeenCalled(); @@ -195,4 +208,5 @@ define([ "jquery", "js/spec/create_sinon", "URI", "js/views/container", "js/mode }); }); }); - }); \ No newline at end of file + }); +147 \ No newline at end of file diff --git a/cms/static/js/spec/views/modals/edit_xblock_spec.js b/cms/static/js/spec/views/modals/edit_xblock_spec.js index e58759dea3..ecc12b43f6 100644 --- a/cms/static/js/spec/views/modals/edit_xblock_spec.js +++ b/cms/static/js/spec/views/modals/edit_xblock_spec.js @@ -12,7 +12,7 @@ define(["jquery", "underscore", "js/spec_helpers/create_sinon", "js/spec_helpers beforeEach(function () { edit_helpers.installEditTemplates(); - appendSetFixtures('
'); + appendSetFixtures('
'); model = new XBlockInfo({ id: 'testCourse/branch/draft/block/verticalFFF', display_name: 'Test Unit', diff --git a/cms/static/js/views/container.js b/cms/static/js/views/container.js index 151d89f527..c3cabd60ce 100644 --- a/cms/static/js/views/container.js +++ b/cms/static/js/views/container.js @@ -4,8 +4,8 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", xblockReady: function () { XBlockView.prototype.xblockReady.call(this); - var verticalContainer = $(this.$el).find('.vertical-container'), - alreadySortable = $(this.$el).find('.ui-sortable'), + var verticalContainer = this.$('.vertical-container'), + alreadySortable = this.$('.ui-sortable'), newParent, oldParent, self = this; @@ -16,6 +16,8 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", handle: '.drag-handle', stop: function (event, ui) { + var saving, hideSaving, removeFromParent; + console.log('stop'); if (oldParent === undefined) { @@ -24,12 +26,12 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", return; } - var saving = new NotificationView.Mini({ + saving = new NotificationView.Mini({ title: gettext('Saving…') }); saving.show(); - var hideSaving = function () { + hideSaving = function () { saving.hide(); }; @@ -37,12 +39,11 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", // add to new container before deleting from old to // avoid creating an orphan if the addition fails. if (newParent) { - var removeFromParent = oldParent; + removeFromParent = oldParent; self.reorder(newParent, function () { self.reorder(removeFromParent, hideSaving); }); - } - else { + } else { // No new parent, only reordering within same container. self.reorder(oldParent, hideSaving); } @@ -60,8 +61,7 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", if (ui.sender) { // Move to a new container (the addition part). newParent = parent; - } - else { + } else { // Reorder inside a container, or deletion when moving to new container. oldParent = parent; } @@ -79,16 +79,18 @@ define(["jquery", "underscore", "js/views/xblock", "js/utils/module", "gettext", }, reorder: function (targetParent, successCallback) { + var children, childLocators; + console.log('calling reorder for ' + targetParent.data('locator')); // Find descendants with class "wrapper-xblock" whose parent == targetParent. // This is necessary to filter our grandchildren, great-grandchildren, etc. - var children = targetParent.find('.wrapper-xblock').filter(function () { + children = targetParent.find('.wrapper-xblock').filter(function () { var parent = $(this).parent().closest('.wrapper-xblock'); return parent.data('locator') === targetParent.data('locator'); }); - var childLocators = _.map( + childLocators = _.map( children, function (child) { return $(child).data('locator'); diff --git a/cms/templates/js/mock/mock-container-xblock.underscore b/cms/templates/js/mock/mock-container-xblock.underscore index 16f3b9456b..cf6f9c660a 100644 --- a/cms/templates/js/mock/mock-container-xblock.underscore +++ b/cms/templates/js/mock/mock-container-xblock.underscore @@ -1,127 +1,222 @@
-
+
-
+
    +
  1. +
    + +
    +
    +
      +
    1. +
      + +
      +
      -
      -
      -
      +
      +
      +
      +
        +
      1. +
        + +
        +
        +
        +
          +
        • +
          • +
        • +
          • +
        • +
          • +
        +
        +
        +
        +
        +
        -
        -
        +
        2. +
      2. +
        + +
        -
        -
        -
        -
        - -
        - -
        -
        -
          -
          • -
          • -
          • -
        +
        +
        +
          +
        • +
          • +
        • +
          • +
        • +
          • +
        +
        +
        +
        +
        +
        +
        3. +
      3. +
        + +
        +
        +
        +
          +
        • +
          • +
        • +
          • +
        • +
          • +
        +
        +
        +
        +
        +
        +
        4. +
      - -
      -
      - -
      - -
      -
      -
        -
        • -
        • -
        • -
      -
      -
      -
      -
      - -
      - -
      -
      -
        -
        • -
        • -
        • -
      -
      -
      -
      -
      -
      +
    +
+ - - - + +
  • +
    + +
    +
    -
    -
    +
    +
    +
    +
      +
    1. +
      + +
      -
      -
      -
      -
      +
      +
      +
        +
      • +
        • +
      • +
        • +
      • +
        • +
      +
      +
      +
      +
      +
      +
      2. +
    2. +
      + +
      -
      +
      +
      +
        +
      • +
        • +
      • +
        • +
      • +
        • +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      + +
      -
      -
      -
        -
        • -
        • -
        • -
      +
      +
      +
        +
      • +
        • +
      • +
        • +
      • +
        • +
      +
      +
      +
      +
      +
      +
      4. +
    - -
    -
    - -
    - -
    -
    -
      -
      • -
      • -
      • -
    -
    -
    -
    -
    - -
    - -
    -
    -
      -
      • -
      • -
      • -
    -
    -
    -
    -
    -
    + + + - - - +
    • + + - - + + diff --git a/cms/templates/js/mock/mock-container.underscore b/cms/templates/js/mock/mock-container.underscore deleted file mode 100644 index e69a12e358..0000000000 --- a/cms/templates/js/mock/mock-container.underscore +++ /dev/null @@ -1,209 +0,0 @@ -
    -
    -
    A/B Test
    -
    -
    -
    - -
    -
      -
    1. -
      - - -
      -
      -
      - Group A -
      -
      -
        -
      • No Actions
        • -
      -
      -
      -
      -
      - -
      -
        -
      1. -
        - - -
        -
        -
        Text
        -
        -
          -
        -
        -
        -
        -
        - Welcome to group A. -
        -
        -
        -
        -
        2. -
      2. -
        - - -
        -
        -
        - Video -
        -
        -
          -
        -
        -
        -
        -
        -

        Video

        -
        -
        -
        -
        -
        3. -
      -
      -
      -
      -
      -
      -
      2. -
    2. -
      - - -
      -
      -
      - Group B -
      -
      -
        -
      • No Actions
        • -
      -
      -
      -
      -
      - -
      -
        -
      1. -
        - - -
        -
        -
        - Text -
        -
        -
          -
        -
        -
        -
        -
        - Welcome to group B. -
        - -
        -
        -
        -
        2. -
      2. -
        - - -
        -
        -
        - Checkboxes -
        -
        -
          -
        -
        -
        -
        -
        -
        -

        - Checkboxes -

        -
        -
        -
        -
        -
        -
        3. -
      -
      -
      -
      -
      -
      -
      3. -
    -
    -
    -
    -
    - -