sproutcore 1.10.3.1 → 1.11.0.rc1

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

@@ -4,13 +4,13 @@
 //            portions copyright @2011 Apple Inc.
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
+/*globals module, test, ok, same, equals */
 
 /*
-  This test evaluates a plain list with no custom row heights, outlines,
-  group views or any other non-standard behavior.
+  This test evaluates progressive rendering to the clippingFrame in a plain list with no
+  custom row heights, outlines, group views or other non-standard behavior.
 */
 
-
 // create a fake content array.  Generates a list with whatever length you
 // want of objects with a title based on the index.  Cannot mutate.
 var ContentArray = SC.Object.extend(SC.Array, {
@@ -36,20 +36,21 @@ var ContentArray = SC.Object.extend(SC.Array, {
   }
 });
 
-var pane = SC.ControlTestPane.design()
-  .add("basic", SC.ScrollView.design({
-    borderStyle: SC.BORDER_NONE,
-    layout: { left: 0, right: 0, top: 0, height: 300 },
-    hasHorizontalScroller: NO,
-    contentView: SC.ListView.design({
-      content: ContentArray.create({ length: 20001 }),
-      contentValueKey: "title",
-      contentCheckboxKey: "isDone",
-      contentUnreadCountKey: "unread",
-      rowHeight: 20
-
-    })
-  }));
+var pane = SC.ControlTestPane.design();
+pane.add("basic", SC.ListView.design({
+  // To avoid turning this into a SC.ScrollView integration test, our strategy is to override clippingFrame to allow
+  // us to control it directly, focusing our tests on the "progressive rendering within a given clipping frame" unit.
+  clippingFrame: function(key, value) {
+    return value || { x: 0, y: 0, width: 100, height: 300 };
+  }.property('frame', 'parentView').cacheable(),
+
+  content: ContentArray.create({ length: 20001 }),
+  contentValueKey: "title",
+  contentCheckboxKey: "isDone",
+  contentUnreadCountKey: "unread",
+  rowHeight: 20
+
+}));
 
 function verifyChildViewsMatch(views, set) {
   var indexes = set.clone();
@@ -77,14 +78,13 @@ module("SC.ListView - simple list", pane.standardSetup());
 //
 
 test("rendering only incremental portion", function() {
-  var listView = pane.view("basic").contentView;
+  var listView = pane.view("basic");
   ok(listView.getPath("nowShowing.length") < listView.get('length'), 'nowShowing should be a subset of content items');
   equals(listView.get('childViews').length, listView.get('nowShowing').get('length'), 'should have same number of childViews as nowShowing length');
 });
 
 test("scrolling by small amount should update incremental rendering", function() {
-  var scrollView = pane.view('basic'),
-      listView   = scrollView.contentView,
+  var listView = pane.view('basic'),
       exp;
 
   ok(listView.getPath('nowShowing.length') < listView.get('length'), 'precond - nowShowing has incremental range');
@@ -92,35 +92,34 @@ test("scrolling by small amount should update incremental rendering", function()
   exp = SC.IndexSet.create(0, 15);
   same(listView.get('nowShowing'), exp, 'nowShowing should start at just the first 20 items');
 
-  // SCROLL DOWN ONE LINE
+  // CLIP DOWN ONE LINE
   SC.run(function() {
-    scrollView.scrollTo(0,20);
+    listView.set('clippingFrame', { x: 0, y: 20, width: 100, height: 300 });
   });
 
-  // top line should have scrolled out of view
+  // top line should be clipped out of view
   exp = SC.IndexSet.create(1,15);
   same(listView.get('nowShowing'), exp, 'nowShowing should change to reflect new clippingFrame');
 
   verifyChildViewsMatch(listView.childViews, exp);
 
-  // SCROLL DOWN ANOTHER LINE
+  // CLIP DOWN ANOTHER LINE
   SC.run(function() {
-    scrollView.scrollTo(0,42);
+    listView.set('clippingFrame', { x: 0, y: 42, width: 100, height: 300 });
   });
 
-  // top line should have scrolled out of view
+  // top line should be clipped out of view
   exp = SC.IndexSet.create(2,16);
   same(listView.get('nowShowing'), exp, 'nowShowing should change to reflect new clippingFrame');
 
   verifyChildViewsMatch(listView.childViews, exp);
 
-
-  // SCROLL UP ONE LINE
+  // CLIP BACK UP ONE LINE
   SC.run(function() {
-    scrollView.scrollTo(0,21);
+    listView.set('clippingFrame', { x: 0, y: 21, width: 100, height: 300 });
   });
 
-  // top line should have scrolled out of view
+  // top line should be clipped out of view
   exp = SC.IndexSet.create(1,16);
   same(listView.get('nowShowing'), exp, 'nowShowing should change to reflect new clippingFrame');
 

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/list_item.js

@@ -211,6 +211,18 @@ var pane = SC.ControlTestPane.design({ height: 32 })
     contentValueKey: "title",
     contentUnreadCountKey:  "count",
     outlineLevel: 2
+  }))
+
+  .add("right icon", SC.ListItemView.design(SC.ActionSupport,{
+    content: SC.Object.create({
+      title: "List Item",
+      icon: "sc-icon-folder-16"
+    }),
+    contentValueKey: "title",
+    hasContentRightIcon: YES,
+    contentRightIconKey: "icon",
+    rightIconAction: "doOnRightIconAction",
+    rightIconTarget: "onRightIconTarget"
   }));
 
 // ..........................................................
@@ -314,6 +326,18 @@ function branch(view, visible) {
   }
 }
 
+function rightIcon(view, hasIt) {
+  var cq = view.$(), rightIconCQ = cq.find('.right-icon');
+  if (hasIt) {
+    ok(cq.hasClass('has-right-icon'), "should have has-right-icon class");
+    equals(rightIconCQ.size(), 1, 'should have right icon');
+  } else {
+    ok(!cq.hasClass('has-right-icon'), "should not have has-right-icon class");
+    equals(rightIconCQ.size(), 0, 'should not have branch') ;
+  }
+}
+
+
 // ..........................................................
 // Test Basic Setup
 //
@@ -495,3 +519,36 @@ test("changing count value should update display", function () {
   count(view, null); // verify change
 });
 
+test("right icon action dom", function() {
+  // basic does not have right icon and action
+  var view = pane.view('basic');
+  rightIcon(view, false);
+
+  // has right icon and action
+  view = pane.view('right icon');
+  rightIcon(view, true);
+});
+
+test("right icon action event", function() {
+  var spiedRootResponder = { sendAction: function(){} };
+  var sendActionSpy = CoreTest.spyOn(spiedRootResponder, 'sendAction');
+
+  var view = pane.view('right icon'),
+      spyPane = SC.Object.create({
+        rootResponder: spiedRootResponder
+      });
+
+  view.pane=spyPane;
+
+  var expectedAction = view.get("rightIconAction");
+  var expectedTarget = view.get("rightIconTarget");
+  var target = view.$('.right-icon').get(0);
+  var evt = { target: target, which: 1 };
+  view.mouseDown(evt);
+  view.mouseUp(evt);
+
+  ok(expectedAction === "doOnRightIconAction", 'expectedAction should have been doOnRightIconAction');
+  ok(sendActionSpy.wasCalled, 'action should have been called');
+  ok(sendActionSpy.wasCalledWith(expectedAction,expectedTarget,view,spyPane), 'should have triggered the action with these arguments');
+});
+

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/menu_scroll_view/menu_scroll_view_test.js

@@ -0,0 +1,206 @@
+// ==========================================================================
+// Project:   SC.MenuScrollView Unit Test
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+/*globals SC, module, test, ok, equals */
+
+var view, pane;
+module("Menu Scroll View", {
+  setup: function () {
+    SC.RunLoop.begin();
+
+    var content = ['Dogfish Head',
+                   'Delerium',
+                   'Smuttynose',
+                   'Harpoon',
+                   'Bitburger',
+                   'Goose Island',
+                   'Old Speckled Hen',
+                   'Fuller\'s',
+                   'Anchor',
+                   'Brooklyn',
+                   'Lagunitas',
+                   'Coney Island'];
+
+    view = SC.MenuScrollView.create({
+      layout: { top: 100, left: 20, height: 100, width: 100 },
+      contentView: SC.SourceListView.design({
+        content: content
+      })
+    });
+
+    pane = SC.MainPane.create();
+    pane.appendChild(view);
+    pane.append();
+
+    SC.RunLoop.end();
+  },
+
+  teardown: function () {
+    SC.RunLoop.begin();
+    pane.remove();
+    pane.destroy();
+    SC.RunLoop.end();
+  }
+});
+
+test("menu scroll views cannot scroll horizontally", function () {
+  ok(!view.get('hasHorizontalScroller'),
+     "the horizontal scroller doesn't exist");
+  ok(!view.get('canScrollHorizontal'), "The view cannot scroll horizontally.");
+});
+
+test("menu scrollers not visible when content doesn't fill the container", function () {
+  SC.RunLoop.begin();
+  view.setPath('contentView.content', []);
+  SC.RunLoop.end();
+
+  ok(view.get('hasVerticalScroller'), "the vertical scrollers should exist");
+  equals(view.getPath('topScrollerView.isVisible'), NO,
+         "the top vertical scroller shouldn't be visible");
+  equals(view.getPath('bottomScrollerView.isVisible'), NO,
+         "the bottom vertical scroller shouldn't be visible");
+});
+
+test("initially, only the bottom menu scroller should be visible", function () {
+  equals(view.getPath('topScrollerView.isVisible'), NO,
+         "the top scroller shouldn't be visible");
+  equals(view.getPath('bottomScrollerView.isVisible'), YES,
+         "the bottom scroller should be visible");
+});
+
+// ..........................................................
+// autohidesVerticalScrollers => YES
+//
+
+// Top scroller visibility
+test("when setting `verticalScrollOffset` to anywhere before the scroller thickness, the top scroller will become invisible", function () {
+  SC.run(function () {
+    view.scrollTo(0, 50);
+  });
+
+  ok(view.getPath('topScrollerView.isVisible'),
+     "top scroller should be visible 1");
+
+  SC.run(function () {
+    view.scrollTo(0, view.getPath('topScrollerView.scrollerThickness'));
+  });
+  equals(view.get('verticalScrollOffset'), 0,
+         "view should be at 0px scroll offset");
+  ok(!view.getPath('topScrollerView.isVisible'),
+     "top scroller should NOT be visible");
+
+  SC.run(function () {
+    view.scrollTo(0, 50);
+  });
+  ok(view.getPath('topScrollerView.isVisible'),
+     "top scroller should be visible 2");
+
+  SC.run(function () {
+    view.scrollTo(0, view.getPath('topScrollerView.scrollerThickness') + 1);
+  });
+  ok(view.getPath('topScrollerView.isVisible'),
+     "top scroller should be visible 3");
+
+  SC.run(function () {
+    view.scrollTo(0, 50);
+  });
+  ok(view.getPath('topScrollerView.isVisible'),
+     "top scroller should be visible 4");
+
+  SC.run(function () {
+    view.scrollTo(0, view.getPath('topScrollerView.scrollerThickness') - 1);
+  });
+  ok(!view.getPath('topScrollerView.isVisible'),
+     "top scroller should NOT be visible");
+});
+
+// Bottom scroller visibility
+test("when setting `verticalScrollOffset` to anywhere before the scroller thickness, the bottom scroller will become invisible", function () {
+  var max = view.get('maximumVerticalScrollOffset');
+  ok(view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should be visible 1");
+
+  // @ bottom
+  SC.run(function () {
+    view.scrollTo(0, max);
+  });
+  ok(!view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should NOT be visible");
+
+  SC.run(function () {
+    view.scrollTo(0, 0);
+  });
+  ok(view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should be visible 2");
+
+  // just enough so bottom is invisible
+  SC.run(function () {
+    view.scrollTo(0, max - view.getPath('bottomScrollerView.scrollerThickness') - 1);
+  });
+  ok(view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should be visible 3");
+
+  SC.run(function () {
+    view.scrollTo(0, 0);
+  });
+  ok(view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should be visible 4");
+
+  // exactly enough for bottom to be invisible
+  SC.run(function () {
+    view.scrollTo(0, max - view.getPath('bottomScrollerView.scrollerThickness'));
+  });
+  ok(!view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should NOT be visible");
+
+  SC.run(function () {
+    view.scrollTo(0, 0);
+  });
+  ok(view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should be visible 5");
+
+  // more than enough for bottom to be invisible
+  SC.run(function () {
+    view.scrollTo(0, max - view.getPath('bottomScrollerView.scrollerThickness') + 1);
+  });
+  ok(!view.getPath('bottomScrollerView.isVisible'),
+     "bottom scroller should NOT be visible");
+});
+
+test("when the top scroller becomes visible, the vertical scroll offset is adjusted by the scroller thickness", function () {
+  SC.run(function () {
+    view.scrollBy(0, 1);
+  });
+
+  var thickness = view.getPath('topScrollerView.scrollerThickness');
+
+  // check for adjustment
+  equals(view.get('verticalScrollOffset'),
+         1 + thickness,
+         "the offset should be the scroller thickness + 1");
+
+  // shouldn't adjust this time
+  SC.run(function () {
+    view.scrollBy(0, 1);
+  });
+  equals(view.get('verticalScrollOffset'),
+         2 + thickness,
+         "the offset should be the scroller thickness + 2");
+
+  // shouldn't adjust this time
+  SC.run(function () {
+    view.scrollBy(0, -1);
+  });
+  equals(view.get('verticalScrollOffset'),
+         1 + thickness,
+         "the offset should be the scroller thickness + 1");
+
+  // check for adjustment
+  SC.run(function () {
+    view.scrollBy(0, -1);
+  });
+  equals(view.get('verticalScrollOffset'), 0,
+         "the offset should be 0px");
+});

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

@@ -40,6 +40,12 @@ var pane = SC.ControlTestPane.design()
     minimum: 0,
     maximum: 50
   })
+  .add("progress basic min max", SC.ProgressView, {
+    layout: {top:0, bottom:0, left:0, width: 250},
+    value: 75,
+    minimum: 50,
+    maximum: 100
+  })
   .add("progress aria-role", SC.ProgressView, {
     layout: {top:0, bottom:0, left:0, width: 250},
     value: 10,
@@ -168,6 +174,15 @@ test("basic max 50", function() {
 
 });
 
+test("basic min max", function () {
+  var view = pane.view('progress basic min max');
+
+  ok(!view.$().hasClass('disabled'), 'should NOT have disabled class');
+  ok(view.$('.content').length > 0, 'should have content class');
+  equals(view.$('.content')[0].style.width, "50%", 'width should be 50%');
+  equals(view.$('.content').width(), 125, 'pixel width ');
+})
+
 // ..........................................................
 // TEST CHANGING PROGRESS BARS
 //

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

@@ -94,7 +94,9 @@ test("isEnabled should alter group classname and sync with isEnabled property",
 test("clicking on a radio button will change toggle the value", function() {
   equals(view.get('value'), 'Red', 'precond - value should be Red');
   var r = view.$('.sc-radio-button');
-  SC.Event.trigger(r[1], 'mousedown');
+
+  var evt = SC.Event.simulateEvent(r[1], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[1], 'mousedown', [evt]);
   SC.Event.trigger(r[1], 'mouseup');
   equals(view.get('value'), 'Green', 'value should have changed');
 });
@@ -103,7 +105,8 @@ test("pressing mouseDown and then mouseUp anywhere in a radio button should togg
   var elem = view.get('layer'),
       r = view.$('.sc-radio-button');
 
-  SC.Event.trigger(r[0], 'mousedown');
+  var evt = SC.Event.simulateEvent(r[0], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[0], 'mousedown', [evt]);
   equals(view.get('value'), 'Red', 'value should not change yet');
   ok(r.first().hasClass('active'), 'radio button should be active');
 
@@ -111,7 +114,8 @@ test("pressing mouseDown and then mouseUp anywhere in a radio button should togg
   SC.Event.trigger(r[0],'mouseup');
   //input.attr('checked', NO);
   // loose focus of the element since it was changed
-  SC.Event.trigger(r[1],'mousedown');
+  evt = SC.Event.simulateEvent(r[1], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[1], 'mousedown', [evt]);
   SC.Event.trigger(r[1],'mouseup');
 
   ok(!r.first().hasClass('active'), 'radio button should no longer be active');
@@ -128,7 +132,8 @@ test("isEnabled=NO should add disabled attr to input", function() {
   ok(view.$().hasClass('disabled'), 'should have disabled attr');
 
   ok(view.get('value'), 'precond - value should be true');
-  view.mouseDown();
+  var evt = SC.Event.simulateEvent(view.get('layer'), 'mousedown', { which: 1 });
+  view.mouseDown(evt);
   view.mouseUp();
   ok(view.get('value'), 'value should not change when clicked');
 });
@@ -139,7 +144,8 @@ test("disabled radio buttons do not become selected on click", function () {
   var elem = view.get('layer'),
       r = view.$('.sc-radio-button');
 
-  SC.Event.trigger(r[0], 'mousedown');
+  var evt = SC.Event.simulateEvent(r[0], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[0], 'mousedown', [evt]);
   ok(!r.first().hasClass('active'), 'radio button should not be active');
 
   // simulate mouseUp and browser-native change to control
@@ -149,13 +155,15 @@ test("disabled radio buttons do not become selected on click", function () {
   equals(view.get('value'), undefined, "value should be undefined (nothing is checked)");
 
   // lose focus of the element since it was changed
-  SC.Event.trigger(r[1],'mousedown');
+  evt = SC.Event.simulateEvent(r[1], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[1], 'mousedown', [evt]);
   SC.Event.trigger(r[1],'mouseup');
 
   equals(view.get('value'), undefined, "value should be undefined (nothing is checked)");
 
   // last one is selectable
-  SC.Event.trigger(r[2],'mousedown');
+  evt = SC.Event.simulateEvent(r[2], 'mousedown', { which: 1 });
+  SC.Event.trigger(r[2], 'mousedown', [evt]);
   SC.Event.trigger(r[2],'mouseup');
 
   equals(view.get('value'), view.items[2], "value should be 'Salgar'");