sproutit-sproutcore 1.0.0.20090407205609 → 1.0.0.20090408130025

data/frameworks/sproutcore/frameworks/desktop/tests/views/scroll/ui.js

@@ -0,0 +1,111 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+(function() {
+    var appleURL=static_url('debug/apple-logo1');
+    var iv=SC.ImageView.design({value: appleURL, layout: {height:400, width:400}});
+    var pane = SC.ControlTestPane.design({ height: 100 })
+    .add("basic", SC.ScrollView, {
+  
+    })
+
+    .add("basic2", SC.ScrollView, {
+        contentView: iv
+    })
+
+    .add("basic3", SC.ScrollView, {
+      contentView: iv,
+      isHorizontalScrollerVisible: NO
+    })
+    
+    .add("disabled", SC.ScrollView, {
+      isEnabled: NO
+    });
+
+    pane.show(); // add a test to show the test pane
+
+  // ..........................................................
+  // TEST VIEWS
+  // 
+  module('SC.ScrollView UI', pane.standardSetup());
+  
+  test("basic", function() {
+    var view = pane.view('basic');
+    ok(!view.$().hasClass('disabled'), 'should not have disabled class');
+    ok(!view.$().hasClass('sel'), 'should not have sel class');
+    
+    equals(view.getPath('childViews.length'), 3, 'scroll view should have only three child views');
+
+    var containerView = view.get('containerView') ;
+    ok(containerView, 'scroll views should have a container view');
+    ok(containerView.kindOf(SC.ContainerView), 'default containerView is a kind of SC.ContainerView');
+    ok(containerView.get('contentView') === null, 'default containerView should have a null contentView itself');
+    ok(view.get('contentView') === null, 'scroll view should have no contentView by default');
+    equals(containerView.getPath('childViews.length'), 0, 'containerView should have no child views');
+    
+    var horizontalScrollerView = view.get('horizontalScrollerView');
+    ok(view.get('hasHorizontalScroller'), 'default scroll view wants a horizontal scroller');
+    ok(horizontalScrollerView, 'default scroll view has a horizontal scroller');
+    
+    var verticalScrollerView = view.get('verticalScrollerView');
+    ok(view.get('hasVerticalScroller'), 'default scroll view wants a vertical scroller');
+    ok(verticalScrollerView, 'default scroll view has a vertical scroller');
+  });
+  
+  
+  
+  test("basic2", function() {
+    var view = pane.view('basic2');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');    
+        
+    var horizontalScrollerView = view.get('horizontalScrollerView');
+    ok(view.get('hasHorizontalScroller'), 'default scroll view wants a horizontal scroller');
+    ok(horizontalScrollerView, 'default scroll view has a horizontal scroller');
+    ok(horizontalScrollerView.$().hasClass('sc-horizontal'), 'should have sc-horizontal class');        
+	  var maxHScroll = view.maximumHorizontalScrollOffset();    
+	  ok((maxHScroll > 0), 'Max horizontal scroll should be greater than zero');
+    
+    var verticalScrollerView = view.get('verticalScrollerView');
+    ok(view.get('hasVerticalScroller'), 'default scroll view wants a vertical scroller');
+    ok(verticalScrollerView, 'default scroll view has a vertical scroller');
+    ok(verticalScrollerView.$().hasClass('sc-vertical'), 'should have sc-vertical class');    
+	  var maxVScroll = view.maximumVerticalScrollOffset();    
+	  ok((maxVScroll > 0), 'Max vertical scroll should be greater than zero');
+    
+  });
+   
+  test("basic3", function() {
+    var view = pane.view('basic3');
+    view.set('isHorizontalScrollerVisible',NO);
+    ok(!view.get('canScrollHorizontal'),'cannot scroll in horizontal direction');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');    
+    var horizontalScrollerView = view.get('horizontalScrollerView');
+    ok(view.get('hasHorizontalScroller'), 'default scroll view wants a horizontal scroller');
+    ok(horizontalScrollerView, 'default scroll view has a horizontal scroller');
+    ok(horizontalScrollerView.$().hasClass('sc-horizontal'), 'should have sc-horizontal class');        
+    var maxHScroll = view.maximumHorizontalScrollOffset();    
+    equals(maxHScroll , 0, 'Max horizontal scroll should be equal to zero');
+
+    view.set('isVerticalScrollerVisible',NO);
+    ok(!view.get('canScrollVertical'),'cannot scroll in vertical direction');
+    var verticalScrollerView = view.get('verticalScrollerView');
+    ok(view.get('hasVerticalScroller'), 'default scroll view wants a vertical scroller');
+    ok(verticalScrollerView, 'default scroll view has a vertical scroller');
+    ok(verticalScrollerView.$().hasClass('sc-vertical'), 'should have sc-vertical class');    
+    var maxVScroll = view.maximumVerticalScrollOffset();    
+    equals(maxVScroll ,0, 'Max vertical scroll should be equal to zero');
+  });
+
+  test("disabled", function() {
+     var view = pane.view('disabled'); 
+     ok(view.$().hasClass('disabled'), 'should have disabled class');
+     ok(!view.$().hasClass('sel'), 'should not have sel class');
+   });
+   
+})();

data/frameworks/sproutcore/frameworks/desktop/tests/views/scroller/methods.js

@@ -0,0 +1,63 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+var pane, view, view1 ;
+module("SC.ScrollerView",{
+  setup: function() {
+    SC.RunLoop.begin();
+	pane = SC.MainPane.create({
+	  childViews: [
+	    SC.ScrollerView.extend({		     
+		}),
+		SC.ScrollerView.extend({		     
+		  minimum:10,
+		  maximum:100,
+		  isEnabled:NO,
+		  value:15,
+		  layoutDirection: SC.LAYOUT_HORIZONTAL
+		})
+	  ]	
+	});
+	pane.append(); // make sure there is a layer...
+	SC.RunLoop.end();	
+	view = pane.childViews[0];
+	view1= pane.childViews[1];
+  },
+
+  teardown: function() {
+   	pane.remove();
+   	pane = view = null ;
+  }
+});
+
+test("listing the displayProperties",function(){
+  var obj = view.get('displayProperties');
+  equals(4,obj.length,'the number of dispay properties');
+  equals('value',obj[0],'the offset value property');
+  equals('minimum',obj[1],'the minimum offset value property');
+  equals('maximum',obj[2],'the maximum offset value property');	
+  equals('isEnabled',obj[3],'the isEnabled offset value property');	  
+});
+
+test("testing properties of a scrollerview", function(){
+  equals(10,view1.get('minimum'),'Minimum offset value for the scroller')	;
+  equals(100,view1.get('maximum'),'Maximum offset value for the scroller');
+  equals(NO,view1.get('isEnabled'),'The scroller should be not enabled');
+  equals(SC.LAYOUT_VERTICAL,view.get('layoutDirection'),'The default scroller direction should be vertical');
+  equals(SC.LAYOUT_HORIZONTAL,view1.get('layoutDirection'),'The scroller direction set as vertical during view creation');
+  equals(0,view.value,'The default offset value set during creation for a scroller should be 0');
+  equals(15,view1.value,'The offset value should be 15');
+  // view1.set('layoutDirection',SC.LAYOUT_VERTICAL);
+  // equals(SC.LAYOUT_VERTICAL,view1.get('layoutDirection'),'The scroller direction set after view creation');
+});
+
+test("ownerScrollValueKey() function of the scroller view",function(){
+  equals('verticalScrollOffset',view.ownerScrollValueKey(),'should have a vertical scroll offset');
+  equals('horizontalScrollOffset',view1.ownerScrollValueKey(),'should have a vertical scroll offset');
+});
+

data/frameworks/sproutcore/frameworks/desktop/tests/views/scroller/ui.js

@@ -0,0 +1,70 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+(function() {
+  var scURL='http://www.sproutcore.com/wp-content/themes/sproutcore/images/download.png';
+  var imageView=SC.ImageView.design({value:scURL, layout: {height:400, width:320,top:10,left:10}});
+  var imageView1=SC.ImageView.design({value:scURL, layout: {height:50, width:400,top:10,left:10}});	
+  var pane = SC.ControlTestPane.design({ height: 100 })  	
+  .add("basic horizontal", SC.ScrollerView, {
+    layoutDirection: SC.LAYOUT_HORIZONTAL
+  })    
+  
+  .add("basic vertical", SC.ScrollerView, {
+    layoutDirection: SC.LAYOUT_VERTICAL
+  })
+
+  .add("scrollerViewVertical", SC.ScrollerView, {
+    layoutDirection: SC.LAYOUT_VERTICAL,
+	isEnabled:NO,
+	childViews:[imageView]
+  })
+
+  .add("scrollerViewHorizontal", SC.ScrollerView, {
+    layoutDirection: SC.LAYOUT_HORIZONTAL,
+	isEnabled:NO,
+	childViews:[imageView1]
+  });
+    
+  pane.show(); // add a test to show the test pane
+  
+  // ..........................................................
+  // TEST VIEWS
+  // 
+  module('SC.ScrollerView UI', pane.standardSetup());
+  
+  test("basic horizontal", function() {
+    var view = pane.view('basic horizontal');
+    ok(!view.$().hasClass('disabled'), 'should not have disabled class');
+    ok(!view.$().hasClass('sel'), 'should not have sel class');    
+    ok(view.$().hasClass('sc-scroller-view'), 'should have sc-scroller-view class');
+    ok(view.$().hasClass('sc-horizontal'), 'should have sc-horizontal class');
+    ok(!view.$().hasClass('sc-vertical'), 'should not have sc-vertical class');   
+    equals(view.getPath('childViews.length'), 0, 'scroller views have no children');
+  });
+  
+  test("basic vertical", function() {
+    var view = pane.view('basic vertical');
+    ok(!view.$().hasClass('disabled'), 'should not have disabled class');
+    ok(!view.$().hasClass('sel'), 'should not have sel class');    
+    ok(view.$().hasClass('sc-scroller-view'), 'should have sc-scroller-view class');
+    ok(!view.$().hasClass('sc-horizontal'), 'should not have sc-horizontal class');
+    ok(view.$().hasClass('sc-vertical'), 'should have sc-vertical class');   
+    equals(view.getPath('childViews.length'), 0, 'scroller views have no children');
+  });
+
+  test("scrollerView with a child view", function() {
+	var view = pane.view('scrollerViewVertical');
+    equals(view.getPath('childViews.length'), 1, 'scroller should have a child');
+	view = pane.view('scrollerViewHorizontal');
+	equals(view.getPath('childViews.length'), 1, 'scroller should have a child');
+  });
+  
+  
+})();

data/frameworks/sproutcore/frameworks/desktop/tests/views/segmented/methods.js

@@ -0,0 +1,94 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+var iconURL= "http://www.freeiconsweb.com/Icons/16x16_people_icons/People_046.gif";
+
+module("SC.SegmentedView", {
+  setup: function() {
+    SC.RunLoop.begin();
+    pane = SC.MainPane.create({
+      childViews: [
+        SC.SegmentedView.extend({
+          items: [
+          { value: "Item1", icon: iconURL },
+          { value: "Item2", icon: iconURL },
+          { value: "Item3", icon: iconURL }],
+          itemTitleKey: 'value',
+          itemValueKey: 'value',
+          itemIconKey: 'icon',
+          value: "Item1 Item3".w(),
+          allowsEmptySelection: NO,
+          layout: { height: 25 } 
+        })]
+    });
+    pane.append(); // make sure there is a layer...
+    SC.RunLoop.end();
+    
+    view = pane.childViews[0];
+  }, 
+  
+  teardown: function() {
+    pane.remove();
+    pane = view = null ;
+  }
+});
+
+test("Check that properties are mapped correctly", function() {
+    view.triggerItemAtIndex(1);
+    SC.RunLoop.begin();
+    view.set('isEnabled', YES);
+    SC.RunLoop.end();
+    equals(view.get('value'), "Item2", "the second item should be selected.");
+    var items=view.displayItems();
+    equals(items[0][0], "Item1", 'Computed properties should match');
+    equals(items[0][1], "Item1", 'Computed properties should match');
+    equals(items[0][2], true, 'Computed properties should match');
+    equals(items[0][3], iconURL, 'Computed properties should match');
+    equals(items[0][4], null, 'Computed properties should match');
+    equals(items[0][5], 0, 'Computed properties should match');
+    var elem = view.get('layer').childNodes[0];
+
+    SC.Event.trigger(elem, 'mousedown');
+    equals(view._isMouseDown, YES, 'mousedown');
+    equals(view.get('activeIndex'), 0, '');
+    
+ });
+
+
+
+ test("Check that mouse actions work", function() {
+   view.triggerItemAtIndex(1);
+   SC.RunLoop.begin();
+   view.set('isEnabled', YES);
+   SC.RunLoop.end();
+   var elem = view.get('layer').childNodes[0];
+
+   SC.Event.trigger(elem, 'mousedown');
+   equals(view._isMouseDown, YES, 'Mouse down flag on mousedown should be ');
+   equals(view.get('activeIndex'), 0, 'The active item is the first segment.');
+   
+   var elem = view.get('layer').childNodes[1];
+   SC.Event.trigger(elem, 'mouseup');
+   equals(view._isMouseDown, NO, 'Mouse down flag on mouseup should be ');
+   equals(view.get('activeIndex'), -1, 'Ther shouldnt be any active item');
+   
+   var elem = view.get('layer').childNodes[2];
+   SC.Event.trigger(elem, 'mousedown');
+    
+   SC.Event.trigger(elem, 'mousemoved');
+   equals(view._isMouseDown, YES, 'Mouse down flag on mousemoved should be ');
+   equals(view.get('activeIndex'), 2, 'The active item is the third segment.');
+   
+   SC.Event.trigger(elem, 'mouseover');
+   equals(view._isMouseDown, YES, 'Mouse down flag on mouseover should be ');
+   equals(view.get('activeIndex'), 2, 'The active item is the third segment.');
+   
+  });
+
+

data/frameworks/sproutcore/frameworks/desktop/tests/views/segmented/ui.js

@@ -0,0 +1,206 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+
+htmlbody('<style> .sc-static-layout { border: 1px red dotted; } </style>');
+
+(function() {
+  var iconURL= "http://www.freeiconsweb.com/Icons/16x16_people_icons/People_046.gif";
+  
+  var pane = SC.ControlTestPane.design()
+    
+    .add("3_empty", SC.SegmentedView, { 
+      items: [ '', '' , ''],
+      layout: { height: 25 }
+    })
+    .add("3_empty,icon", SC.SegmentedView, { 
+      items: [
+      { value: "", icon: iconURL },
+      { value: "", icon: iconURL },
+      { value: "", icon: iconURL }],
+      itemTitleKey: 'value',
+      itemValueKey: 'value',
+      itemIconKey: 'icon',
+      layout: { height: 25 }
+    })
+    .add("3_items,1_sel", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item2",
+      layout: { height: 25 }
+    })
+    
+    .add("3_items,1_sel,disabled", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item2",
+      isEnabled: NO,
+      layout: { height: 25 }
+    })
+    .add("3_items,icon,2_sel", SC.SegmentedView, { 
+      items: [
+      { value: "Item1", icon: iconURL },
+      { value: "Item2", icon: iconURL },
+      { value: "Item3", icon: iconURL }],
+      itemTitleKey: 'value',
+      itemValueKey: 'value',
+      itemIconKey: 'icon',
+      value: "Item1 Item3".w(),
+      allowsEmptySelection: NO,
+      layout: { height: 25 }
+    })
+    .add("3_items,2_sel,disabled", SC.SegmentedView, { 
+       items: [
+        { value: "Item1", icon: iconURL },
+        { value: "Item2", icon: iconURL },
+        { value: "Item3", icon: iconURL }],
+        itemTitleKey: 'value',
+        itemValueKey: 'value',
+        itemIconKey: 'icon',
+        isEnabled: NO,
+        value: "Item1 Item3".w(),
+        layout: { height: 25 }
+    })   
+    .add("3_items,1_sel,emptySel", SC.SegmentedView, { 
+      items: ["Item1", "Very Long Item", "Item 3"],
+        value: "Very Long Item",
+        allowsEmptySelection: YES,
+        layout: { height: 25 }
+    })
+    .add("3_items,2_sel,emptySel", SC.SegmentedView, { 
+      items: ["Item1", "Very Long Item", "Item 3"],
+      value: "Item1 Item3".w(),
+      allowsEmptySelection: YES,
+      layout: { height: 25 }
+    })
+    .add("3_items,1_sel,multipleSel", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item2",
+      allowsMultipleSelection: YES,
+      layout: { height: 25 }
+    })
+    .add("3_items,2_sel,multipleSel", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item1 Item3".w(),
+      allowsMultipleSelection: YES,
+      layout: { height: 25 }
+    })
+    .add("3_items,1_sel,emptySel,multiSel", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item2",
+      allowsEmptySelection: YES,
+      allowsMultipleSelection: YES,
+      layout: { height: 25 }
+    })
+    .add("3_items,2_sel,emptySel,multiSel", SC.SegmentedView, { 
+      items: "Item1 Item2 Item3".w(),
+      value: "Item1 Item3".w(),
+      allowsEmptySelection: YES,
+      allowsMultipleSelection: YES,
+      layout: { height: 25 }
+    });
+    
+  pane.show(); // add a test to show the test pane
+
+  // ..........................................................
+  // TEST VIEWS
+  // 
+  module('SC.SegmentedView ui', pane.standardSetup());
+  
+  test("Check that all segmentedViews are visible", function() {
+    ok(pane.view('3_empty').get('isVisibleInWindow'), '3_empty.isVisibleInWindow should be YES');
+    ok(pane.view('3_empty,icon').get('isVisibleInWindow'), '3_empty,icon.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,1_sel').get('isVisibleInWindow'), '3_items,1_sel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,1_sel,disabled').get('isVisibleInWindow'), '3_items,1_sel,disabled.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,icon,2_sel').get('isVisibleInWindow'), '3_items,icon,2_sel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,2_sel,disabled').get('isVisibleInWindow'), '3_items,2_sel,disabled.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,1_sel,emptySel').get('isVisibleInWindow'), '3_items,1 sel,emptySel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,2_sel,emptySel').get('isVisibleInWindow'), '3_items,2 sel,emptySel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,1_sel,multipleSel').get('isVisibleInWindow'), '3_items,1_sel,multipleSel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,2_sel,multipleSel').get('isVisibleInWindow'), '3_items,2_sel,multipleSel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,1_sel,emptySel,multiSel').get('isVisibleInWindow'), '3_items,1_sel,emptySel,multiSel.isVisibleInWindow should be YES');
+    ok(pane.view('3_items,2_sel,emptySel,multiSel').get('isVisibleInWindow'), '3_items,2_sel,emptySel,multiSel.isVisibleInWindow should be YES');
+  });
+  
+  
+  test("Check that all segments have the right classes set", function() {
+    var viewElem=pane.view('3_empty').$();
+    var segments=pane.view('3_empty').$('a');
+    ok(viewElem.hasClass('sc-view'), '3_empty.hasClass(sc-view) should be YES');
+    ok(viewElem.hasClass('sc-segmented-view'), '3_empty.hasClass(sc-segmented-view) should be YES');
+    for (var i=0, ilen=segments.length; i<ilen; i++){
+      seg=segments[i];
+      if(i==0){
+        ok((seg.className.indexOf('sc-first-segment')>=0), 'first segment has the right classname assigned.');
+      }    
+      if(i==segments.length-1){
+        ok((seg.className.indexOf('sc-last-segment')>=0), 'last segment has the right classname assigned.');
+      }
+      ok((seg.childNodes[0].className.indexOf('sc-button-inner')>=0), 'segment '+i+' should have an inner-button.');
+      ok((seg.childNodes[0].childNodes[0].className.indexOf('sc-button-label')>=0), 'segment '+i+' should have a label.');
+        
+      if(i!=0 && i!=segments.length-1){
+        ok((seg.className.indexOf('sc-middle-segment')>=0), 'middle segment has the right classname assigned.');
+      }
+      viewElem=pane.view('3_items,2_sel,disabled').$();
+      ok(viewElem.hasClass('disabled'), '3_items,2_sel,disabled should have the disabled class set');
+    }
+
+  });
+  
+  
+  test("Check that all segments have the right classes set", function() {
+    var viewElem=pane.view('3_empty,icon').$();
+    var segments=pane.view('3_empty,icon').$('a');
+    ok(viewElem.hasClass('sc-view'), '3_empty.hasClass(sc-view) should be YES');
+    ok(viewElem.hasClass('sc-segmented-view'), '3_empty.hasClass(sc-segmented-view) should be YES');
+    for (var i=0, ilen=segments.length; i<ilen; i++){
+      seg=segments[i];
+      if(i==0){
+        ok((seg.className.indexOf('sc-first-segment')>=0), 'first segment has the right classname assigned.');
+      }    
+      if(i==segments.length-1){
+        ok((seg.className.indexOf('sc-last-segment')>=0), 'last segment has the right classname assigned.');
+      }
+      ok((seg.childNodes[0].className.indexOf('sc-button-inner')>=0), 'segment '+i+' should have an inner-button.');
+      ok((seg.childNodes[0].childNodes[0].className.indexOf('sc-button-label')>=0), 'segment '+i+' should have a label.');
+      ok((seg.childNodes[0].childNodes[0].childNodes[0].src.length>0), 'segment '+i+' should have an icon.');
+        
+      if(i!=0 && i!=segments.length-1){
+        ok((seg.className.indexOf('sc-middle-segment')>=0), 'middle segment has the right classname assigned.');
+      }
+      viewElem=pane.view('3_items,2_sel,disabled').$();
+      ok(viewElem.hasClass('disabled'), '3_items,2_sel,disabled should have the disabled class set');
+    }
+
+  });
+  
+  
+  test("Check that the selected segments have the right classes assigned.", function() {
+    var segments=pane.view('3_empty').$('a');
+    for (var i=0, ilen=segments.length; i<ilen; i++){
+      seg=segments[i];
+      ok((seg.className.indexOf('sel')==-1), 'this element should not be selected.');
+    }
+
+  });
+  
+  
+  test("Check that two items are selected.", function() {
+    var segments=pane.view('3_items,icon,2_sel').$('a');
+    var count=0;
+    for (var i=0, ilen=segments.length; i<ilen; i++){
+      seg=segments[i];
+      if(seg.className.indexOf('sel')!=-1){
+        count++;
+      }
+    }
+    ok((count==2), '3_items,2_sel,disabled should have two segments selected.');
+
+  });
+  
+})();

data/frameworks/sproutcore/frameworks/desktop/tests/views/select_field/methods.js

@@ -0,0 +1,81 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+var pane, view ;
+module("SC.SelectFieldView",{
+	setup: function() {
+	    SC.RunLoop.begin();
+	    pane = SC.MainPane.create({
+		  childViews: [
+		   SC.SelectFieldView.extend({
+			objects:[1,6,11,2,8]
+		   }),
+		   SC.SelectFieldView.extend({
+			objects:["Apple","Sproutcore 1.0","Development","Charles"]// ,
+			// sortObjects:function(objects){
+			// 				console.log('Displaying the options without sorting');
+			// 			}
+		   })]	
+		});
+		pane.append(); // make sure there is a layer...
+	    SC.RunLoop.end();
+	
+		view = pane.childViews[0];
+		view1= pane.childViews[1];
+		
+	},
+	
+	teardown: function() {
+    	pane.remove();
+    	pane = view = null ;
+  	}
+});
+
+test("renders a select field input tag with appropriate attributes", function() {
+	equals(view.get('tagName'), 'select', 'should have type as text');	
+	var q = Q$('select', view.get('layer'));
+	equals(view.$().attr('id'), SC.guidFor(view), 'should have id as view_guid');
+});
+
+test("select component with options", function() {
+ 	equals(5,view.objects.length,'The select component should have 5 options');
+	equals(null,view.nameKey,'the select should not have any name key');
+	equals(null,view.valueKey,'the select should not have any value key');
+});
+
+test("sortObjects() sorts the options of the select component", function() {	
+	var obj = view.objects;
+	view.objects = view.sortObjects(obj);
+
+	equals(1,obj.get(0),'should be the first element');
+	equals(2,obj.get(1),'should be the second element');
+	equals(6,obj.get(2),'should be the third element');
+	equals(8,obj.get(3),'should be the forth element');
+	equals(11,obj.get(4),'should be the fifth element');
+});
+
+test("rebuildMenu() populates the select component with new data", function() {	
+	var newObj = ['Hai,','how','are','you?'];
+	view1.objects = newObj;
+	var obj = view1.objects;
+	equals('Hai,',obj.get(0),'should be the first element');
+	equals('how',obj.get(1),'should be the second element');
+	equals('are',obj.get(2),'should be the third element');
+	equals('you?',obj.get(3),'should be the forth element');
+});
+
+test("isEnabled=NO should add disabled class", function() {
+    SC.RunLoop.begin();
+    view.set('isEnabled', NO);
+    SC.RunLoop.end();  
+    ok(view.$().hasClass('disabled'), 'should have disabled class');
+});
+
+
+