sproutcore 1.9.2 → 1.10.0.rc.1

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/date_field/methods.js

@@ -42,6 +42,7 @@ module("SC.DateFieldView", {
 
   teardown: function() {
     pane.remove();
+    pane.destroy();
     pane = view0 = view1 = view2 = null;
   }
 });

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/date_field/ui.js

@@ -72,9 +72,6 @@
   });
 
 
-
-pane.show(); // add a test to show the test pane
-
 // ..........................................................
 // VERIFY STANDARD STATES
 //
@@ -257,9 +254,8 @@ test("Setting the selection to a null value should fail", function() {
   var thrownException = null;
   try {
     view.set('selection', null);
-  }
-  catch(e) {
-    thrownException = e;
+  } catch(e) {
+    thrownException = e.message;
   }
   ok(thrownException.indexOf !== undefined, 'an exception should have been thrown');
   if (thrownException.indexOf !== undefined) {
@@ -275,9 +271,8 @@ test("Setting the selection to a non-SC.TextSelection value should fail", functi
   var thrownException = null;
   try {
     view.set('selection', {start: 0, end: 0});
-  }
-  catch(e) {
-    thrownException = e;
+  } catch(e) {
+    thrownException = e.message;
   }
   ok(thrownException.indexOf !== undefined, 'an exception should have been thrown');
   if (thrownException.indexOf !== undefined) {
@@ -367,8 +362,8 @@ test("Adding right accessory view", function() {
   view.set('rightAccessoryView', accessoryView);
   SC.RunLoop.end();
 
-  ok(view.get('rightAccessoryView').get('layout').left === null, "right accessory view created with 'left' rather than 'right' in layout should have layout.left set to null");
-  ok(view.get('rightAccessoryView').get('layout').right === 0, "right accessory view created with 'left' rather than 'right' in layout should have layout.right set to 0");
+  equals(view.get('rightAccessoryView').get('layout').left, null, "right accessory view created with 'left' rather than 'right' in layout should have layout.left");
+  equals(view.get('rightAccessoryView').get('layout').right, 0, "right accessory view created with 'left' rather than 'right' in layout should have layout.right");
 
 
   // Test removing the accessory view.

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/disclosure/ui.js

@@ -10,10 +10,10 @@
 (function() {
 	var pane = SC.ControlTestPane.design()
 		.add("diclosure", SC.DisclosureView, {
-	      value: NO, isEnabled: YES		
+	      value: NO, isEnabled: YES
 		})
 		.add("selected", SC.DisclosureView, {
-	      value: YES	
+	      value: YES
 		})
 		.add("disabled", SC.DisclosureView, {
 	      isEnabled: NO
@@ -36,10 +36,8 @@
         value: NO, isEnabled: NO
     });
 
-	pane.show();
-	
 	module("TODO: Test SC.DisclosureView UI", pane.standardSetup());
-	
+
 	test("basic", function() {
 		var view = pane.view('diclosure');
 		ok(!view.$().hasClass('disabled'), 'should not have disabled class');

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/grid/drag_and_drop.js

@@ -48,20 +48,19 @@ var pane = SC.ControlTestPane.design()
     })
   }));
 
-pane.show(); // add a test to show the test pane
-window.pane = pane;
-
 module("SC.GridView - drag and drop", pane.standardSetup());
 
 test("drag on default grid view", function() {
   var ev,
+    frame,
     itemView,
     layer,
     gridView = pane.view("basic").get('contentView');
 
   itemView = gridView.itemViewForContentIndex(0);
+  frame = itemView.get('frame');
   layer = itemView.get('layer');
-  ev = SC.Event.simulateEvent(layer, 'mousedown');
+  ev = SC.Event.simulateEvent(layer, 'mousedown', { clientX: frame.x, clientY: frame.y });
   SC.Event.trigger(layer, 'mousedown', [ev]);
 
   ev = SC.Event.simulateEvent(layer, 'mousemove');
@@ -77,6 +76,7 @@ test("drag on default grid view", function() {
 
 test("drag on grid view with SC.DROP_ON support", function() {
   var ev,
+    frame,
     itemView,
     layer,
     gridView = pane.view("basic").get('contentView');
@@ -91,8 +91,10 @@ test("drag on grid view with SC.DROP_ON support", function() {
   }));
 
   itemView = gridView.itemViewForContentIndex(0);
+  frame = itemView.get('frame');
   layer = itemView.get('layer');
-  ev = SC.Event.simulateEvent(layer, 'mousedown');
+
+  ev = SC.Event.simulateEvent(layer, 'mousedown', { clientX: frame.x, clientY: frame.y });
   SC.Event.trigger(layer, 'mousedown', [ev]);
 
   var f = function() {
@@ -100,14 +102,12 @@ test("drag on grid view with SC.DROP_ON support", function() {
       itemView2,
       point;
 
-    SC.RunLoop.begin();
     ev = SC.Event.simulateEvent(layer, 'mousemove');
     SC.Event.trigger(layer, 'mousemove', [ev]);
 
     equals(gridView.get('dragContent').content, gridView.get('content'), "dragContent.content should be equal to the GridView's content");
     ok(gridView.get('dragContent').indexes.isEqual(SC.IndexSet.create(0)), "dragContent.indexes should be equal to indexes equal to [{0}]");
 
-    SC.RunLoop.end();
 
     // Drag over 2nd item
     itemView2 = gridView.itemViewForContentIndex(1);
@@ -138,10 +138,105 @@ test("drag on grid view with SC.DROP_ON support", function() {
     ev = SC.Event.simulateEvent(layer, 'mouseup');
     SC.Event.trigger(layer, 'mouseup', [ev]);
 
-    window.start();
+    start();
+  };
+
+  setTimeout(f, 200);
+  stop(700); // stops the test runner
+});
+
+test("insertion point when drag on grid view", function() {
+  var ev,
+    frame,
+    itemView,
+    layer,
+    gridView = pane.view("basic").get('contentView');
+
+  // Configure the view to accept drop on.
+  gridView.set('canReorderContent', YES);
+
+  itemView = gridView.itemViewForContentIndex(0);
+  frame = itemView.get('frame');
+  layer = itemView.get('layer');
+
+  ev = SC.Event.simulateEvent(layer, 'mousedown', { clientX: frame.x, clientY: frame.y });
+  SC.Event.trigger(layer, 'mousedown', [ev]);
+
+  var f = function() {
+    var halfWidth,
+      itemView2,
+      point;
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove');
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    // Drag over 2nd item
+    itemView2 = gridView.itemViewForContentIndex(1);
+    layer = itemView2.get('layer');
+    point = SC.offset(layer);
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove', { pageX: point.x + 1, pageY: point.y + 1 });
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    ok(gridView._insertionPointView, "An insertion point should have been added");
+
+    // Clean up
+    ev = SC.Event.simulateEvent(layer, 'mouseup');
+    SC.Event.trigger(layer, 'mouseup', [ev]);
+
+    equals(gridView._insertionPointView, null, "The insertion point should have been destroyed");
+
+    start();
   };
 
   stop(); // stops the test runner
   setTimeout(f, 200);
 });
 
+test("insertion point when cancel drag on grid view", function() {
+  var ev,
+    frame,
+    itemView,
+    layer,
+    gridView = pane.view("basic").get('contentView');
+
+  // Configure the view to accept drop on.
+  gridView.set('canReorderContent', YES);
+
+  itemView = gridView.itemViewForContentIndex(0);
+  frame = itemView.get('frame');
+  layer = itemView.get('layer');
+
+  ev = SC.Event.simulateEvent(layer, 'mousedown', { clientX: frame.x, clientY: frame.y });
+  SC.Event.trigger(layer, 'mousedown', [ev]);
+
+  var f = function() {
+    var halfWidth,
+      itemView2,
+      point;
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove');
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    // Drag over 2nd item
+    itemView2 = gridView.itemViewForContentIndex(1);
+    layer = itemView2.get('layer');
+    point = SC.offset(layer);
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove', { pageX: point.x + 1, pageY: point.y + 1 });
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    ok(gridView._insertionPointView, "An insertion point should have been added");
+
+    // cancel drag
+    ev = SC.Event.simulateEvent(layer, 'keydown', { keyCode: 27 });
+    SC.Event.trigger(layer, 'keydown', [ev]);
+
+    equals(gridView._insertionPointView, null, "The insertion point should have been destroyed");
+
+    start();
+  };
+
+  stop(); // stops the test runner
+  setTimeout(f, 200);
+});

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/grid/methods.js

@@ -4,42 +4,51 @@
 //            portions copyright @2011 Apple Inc.
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
-/*globals module, test, htmlbody, ok, equals, same, stop, start */
+/*global module, test, same, CoreTest */
 
 
 var scrollView, view;
 
 module("SC.GridView", {
-  setup: function() {
+  setup: function () {
 
-    view = SC.GridView.create({
-      content: "a b c d e f".w().map(function(x) {
-        return SC.Object.create({ title: x });
-      }),
+    SC.run(function () {
+      view = SC.GridView.create({
+        columnWidth: 100,
 
-      // ..........................................................
-      // STUB: itemViewForContentIndex
-      //
-      itemViewForContentIndex: CoreTest.stub('itemViewForContentIndex', SC.GridView.prototype.itemViewForContentIndex),
+        content: "a b c d e f".w().map(function (x) {
+          return SC.Object.create({ title: x });
+        }),
 
-      layout: { centerX: 0, height: 400, minWidth: 200 },
+        // ..........................................................
+        // STUB: itemViewForContentIndex
+        //
+        itemViewForContentIndex: CoreTest.stub('itemViewForContentIndex', SC.GridView.prototype.itemViewForContentIndex),
 
-      // ..........................................................
-      // STUB: layoutForContentIndex
-      //
-      layoutForContentIndex: CoreTest.stub('layoutForContentIndex', SC.GridView.prototype.layoutForContentIndex)
+        layout: { minWidth: 200 },
 
-    });
+        // ..........................................................
+        // STUB: layoutForContentIndex
+        //
+        layoutForContentIndex: CoreTest.stub('layoutForContentIndex', SC.GridView.prototype.layoutForContentIndex),
+
+        // ..........................................................
+        // STUB: adjustLayout
+        //
+        adjustLayout: CoreTest.stub('adjustLayout', SC.CollectionView.prototype.adjustLayout)
 
-    scrollView = SC.ScrollView.create({
-      contentView: view,
+      });
 
-      layout: { centerX: 0, centerY: 0, height: 400, width: 200 }
-    })
+      scrollView = SC.ScrollView.create({
+        contentView: view,
+
+        layout: { centerX: 0, centerY: 0, height: 400, width: 200 }
+      });
+    });
 
   },
 
-  teardown: function() {
+  teardown: function () {
     view = scrollView = null;
   }
 });
@@ -53,48 +62,49 @@ module("SC.GridView", {
   update properly when clippingFrame changed and frame did not change.  For
   example during a rotation on an iPad.
 */
-test("GridView items should be positioned according to frame", function() {
-  var columnWidth,
-    itemsPerRow = view.get('itemsPerRow'),
-    layout,
+test("GridView items should be positioned according to frame", function () {
+  var layout,
     expectedLayout;
 
-  columnWidth = Math.floor(200/itemsPerRow);
-
   layout = view.layoutForContentIndex(0);
-  expectedLayout = { left: 0, top: 0, height: 48, width: columnWidth };
+  expectedLayout = { left: 0, top: 0, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of first item should be");
 
+  layout = view.layoutForContentIndex(1);
+  expectedLayout = { left: 100, top: 0, height: 48, width: 100 };
+  same(layout, expectedLayout, "Layout of second item should be");
+
   layout = view.layoutForContentIndex(2);
-  expectedLayout = { left: 132, top: 0, height: 48, width: columnWidth };
+  expectedLayout = { left: 0, top: 48, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of third item should be");
 
   layout = view.layoutForContentIndex(3);
-  expectedLayout = { left: 0, top: 48, height: 48, width: columnWidth };
+  expectedLayout = { left: 100, top: 48, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of fourth item should be");
 
-  console.log(SC.stringFromRect(view.get('clippingFrame')));
   SC.RunLoop.begin();
   scrollView.adjust('width', 100);
-  // view.set('clippingFrame', { x: 0, y: 0, width: 100, height: 400 });
   SC.RunLoop.end();
 
-  console.log(SC.stringFromRect(view.get('clippingFrame')));
   layout = view.layoutForContentIndex(0);
-  expectedLayout = { left: 0, top: 0, height: 48, width: columnWidth };
+  expectedLayout = { left: 0, top: 0, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of first item should be");
 
+  layout = view.layoutForContentIndex(1);
+  expectedLayout = { left: 100, top: 0, height: 48, width: 100 };
+  same(layout, expectedLayout, "Layout of second item should be");
+
   layout = view.layoutForContentIndex(2);
-  expectedLayout = { left: 132, top: 0, height: 48, width: columnWidth };
+  expectedLayout = { left: 0, top: 48, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of third item should be");
 
   layout = view.layoutForContentIndex(3);
-  expectedLayout = { left: 0, top: 48, height: 48, width: columnWidth };
+  expectedLayout = { left: 100, top: 48, height: 48, width: 100 };
   same(layout, expectedLayout, "Layout of fourth item should be");
 });
 
 
-/**
+/*
   GridView would adjust all of its item views every time that its frame
   changed (which happens on scroll), which was very wasteful.  Instead, it was
   improved to only reposition the nowShowing item views, which improved the
@@ -103,7 +113,7 @@ test("GridView items should be positioned according to frame", function() {
   width and not its x, y or height properties.  We can optimize it further to
   only adjust item views when the width is different.
 */
-test("Optimized re-position of item views when the frame changes.", function() {
+test("Optimized re-position of item views when the frame changes.", function () {
   view.itemViewForContentIndex.expect(0);
   view.layoutForContentIndex.expect(0);
 
@@ -129,3 +139,31 @@ test("Optimized re-position of item views when the frame changes.", function() {
   view.itemViewForContentIndex.expect(6);
   view.layoutForContentIndex.expect(12);
 });
+
+
+/**
+  GridView used to not re-compute its layout when the frame changed, which meant
+  that if the itemsPerRow changed the calculated height of the grid would not
+  update to fit the new number of rows.
+*/
+test("Adjusts layout when the itemsPerRow changes.", function () {
+  view.adjustLayout.expect(1);
+
+  SC.RunLoop.begin();
+  view.notifyPropertyChange('frame');
+  SC.RunLoop.end();
+
+  view.adjustLayout.expect(1);
+
+  SC.RunLoop.begin();
+  view.adjust('height', 500);
+  SC.RunLoop.end();
+
+  view.adjustLayout.expect(1);
+
+  SC.RunLoop.begin();
+  view.adjust('width', 400);
+  SC.RunLoop.end();
+
+  view.adjustLayout.expect(2);
+});

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/image_button/ui.js

@@ -11,12 +11,10 @@ var pane = SC.ControlTestPane.design({height:24})
     image: 'start'
   });
 
-pane.show();
-
-module('SC.ImageButtonView ui');
+module('SC.ImageButtonView ui', pane.standardSetup());
 
 test("Check if image class is set properly on ImageButton", function() {
-  var viewElem = pane.view('default').$('div');
+  var viewElem = pane.view('default').$();
   ok(viewElem.hasClass('start'), 'Icon class set initially to "start"');
 });
 
@@ -47,6 +45,6 @@ test("Check if image class is set properly on ImageButton if changed", function(
   var viewElem = pane.view('iconchange');
   viewElem.set('image','stop');
   SC.RunLoop.end(); // force redraw...
-  var newViewElem = pane.view('iconchange').$('div');
+  var newViewElem = pane.view('iconchange').$();
   ok(newViewElem.hasClass('stop'), 'Icon class has correctly changed to "stop"');
 });

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/list/drag_and_drop.js

@@ -48,9 +48,6 @@ var pane = SC.ControlTestPane.design()
     })
   }));
 
-pane.show(); // add a test to show the test pane
-window.pane = pane;
-
 
 module("SC.ListView - drag and drop", pane.standardSetup());
 
@@ -148,3 +145,94 @@ test("drag on list view with SC.DROP_ON support", function() {
   setTimeout(f, 200);
 });
 
+test("insertion point when drag on list view", function() {
+  var ev,
+    itemView,
+    layer,
+    listView = pane.view("basic").get('contentView');
+
+  listView.set('canReorderContent', YES);
+
+  itemView = listView.itemViewForContentIndex(0);
+  layer = itemView.get('layer');
+  ev = SC.Event.simulateEvent(layer, 'mousedown');
+  SC.Event.trigger(layer, 'mousedown', [ev]);
+
+  var f = function() {
+    var itemView2,
+      point;
+
+    SC.RunLoop.begin();
+    ev = SC.Event.simulateEvent(layer, 'mousemove');
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    // Drag over 2nd item
+    itemView2 = listView.itemViewForContentIndex(1);
+    layer = itemView2.get('layer');
+    point = SC.offset(layer);
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove', { pageX: point.x + 1, pageY: point.y + 1 });
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    ok(listView._insertionPointView, "An insertion point should have been added");
+
+    // Clean up
+    ev = SC.Event.simulateEvent(layer, 'mouseup');
+    SC.Event.trigger(layer, 'mouseup', [ev]);
+
+    equals(listView._insertionPointView, null, "The insertion point should have been destroyed");
+
+    window.start();
+  };
+
+  stop(); // stops the test runner
+  setTimeout(f, 200);
+});
+
+test("insertion point when cancel drag on list view", function() {
+  var ev,
+    itemView,
+    layer,
+    listView = pane.view("basic").get('contentView');
+
+  listView.set('canReorderContent', YES);
+
+  itemView = listView.itemViewForContentIndex(0);
+  layer = itemView.get('layer');
+  ev = SC.Event.simulateEvent(layer, 'mousedown');
+  SC.Event.trigger(layer, 'mousedown', [ev]);
+
+  var f = function() {
+    var itemView2,
+      point;
+
+    SC.RunLoop.begin();
+    ev = SC.Event.simulateEvent(layer, 'mousemove');
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    // Drag over 2nd item
+    itemView2 = listView.itemViewForContentIndex(1);
+    layer = itemView2.get('layer');
+    point = SC.offset(layer);
+
+    ev = SC.Event.simulateEvent(layer, 'mousemove', { pageX: point.x + 1, pageY: point.y + 1 });
+    SC.Event.trigger(layer, 'mousemove', [ev]);
+
+    ok(listView._insertionPointView, "An insertion point should have been added");
+
+    // cancel drag
+    ev = SC.Event.simulateEvent(layer, 'keydown', { keyCode: 27 });
+    SC.Event.trigger(layer, 'keydown', [ev]);
+
+    equals(listView._insertionPointView, null, "The insertion point should have been destroyed");
+
+    window.start();
+  };
+
+  stop(); // stops the test runner
+  setTimeout(f, 200);
+});
+
+
+
+