sproutcore 1.6.0.1-java → 1.7.1.beta-java

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/render_delegates/desktop_scroller.js

@@ -0,0 +1,92 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2011 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+
+SC.BaseTheme.desktopScrollerRenderDelegate = SC.RenderDelegate.create({
+  className: 'desktop-scroller',
+
+  render: function (dataSource, context) {
+    var layoutDirection = dataSource.get('layoutDirection'),
+        isVertical = layoutDirection === SC.LAYOUT_VERTICAL,
+        isHorizontal = layoutDirection === SC.LAYOUT_HORIZONTAL;
+
+    context.setClass({
+      'sc-vertical': isVertical,
+      'sc-horizontal': isHorizontal,
+      disabled: !dataSource.get('isEnabled'),
+      'controls-hidden': dataSource.get('controlsHidden')
+    });
+
+    context.push(
+      '<div class="track"></div>',
+      '<div class="cap"></div>',
+      dataSource.get('hasButtons') ?
+        '<div class="button-bottom"></div><div class="button-top"></div>' :
+        '<div class="endcap"></div>',
+      ('<div class="thumb" style="%@:' + dataSource.get('thumbLength') + 'px;' +
+                                'top:' + dataSource.get('thumbPosition') + 'px;">').
+        fmt(isVertical ? 'height' : 'width'),
+         '<div class="thumb-center"></div>',
+         '<div class="thumb-top"></div>',
+         '<div class="thumb-bottom"></div>',
+      '</div>');
+
+
+    context.attr('aria-orientation',
+                 (layoutDirection === SC.LAYOUT_VERTICAL) ? 'vertical' : 'horizontal');
+    context.attr('aria-valuemax', dataSource.get('maximum'));
+    context.attr('aria-valuemin', dataSource.get('minimum'));
+    context.attr('aria-valuenow', dataSource.get('value'));
+    context.attr('aria-controls', dataSource.get('controlsId'));
+  },
+
+  update: function (dataSource, context) {
+    var layoutDirection = dataSource.get('layoutDirection'),
+        isVertical = layoutDirection === SC.LAYOUT_VERTICAL,
+        isHorizontal = layoutDirection === SC.LAYOUT_HORIZONTAL,
+        controlsAreHidden = dataSource.get('controlsHidden'),
+        thumb, K = 'desktopScrollerRenderDelegate';
+
+    context.setClass({
+      'sc-vertical': isVertical,
+      'sc-horizontal': isHorizontal,
+      disabled: !dataSource.get('isEnabled'),
+      'controls-hidden': controlsAreHidden
+    });
+
+    if (dataSource.didChangeFor(K, 'maximum')) {
+      context.attr('aria-valuemax', dataSource.get('maximum'));
+    }
+
+    if (dataSource.didChangeFor(K, 'minimum')) {
+      context.attr('aria-valuemin', dataSource.get('minimum'));
+    }
+
+    if (dataSource.didChangeFor(K, 'value')) {
+      context.attr('aria-valuenow', dataSource.get('value'));
+    }
+
+    if (dataSource.didChangeFor(K, 'controlsId')) {
+      context.attr('aria-controls', dataSource.get('controlsId'));
+    }
+
+    // Don't bother if the controls are hidden.
+    if (!controlsAreHidden) {
+      thumb = context.find('.thumb');
+
+      if (dataSource.didChangeFor(K, 'thumbPosition')) {
+        thumb.css(layoutDirection === SC.LAYOUT_VERTICAL ?
+                  'top' : 'left', dataSource.get('thumbPosition'));
+      }
+
+      if (dataSource.didChangeFor(K, 'thumbLength')) {
+        thumb.css(layoutDirection === SC.LAYOUT_VERTICAL ?
+                  'height' : 'width', dataSource.get('thumbLength'));
+      }
+    }
+  }
+});

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/render_delegates/native_scroll.js

@@ -0,0 +1,25 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2010 Sprout Systems, Inc. and contributors.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+SC.BaseTheme.nativeScrollRenderDelegate = SC.RenderDelegate.create({
+  className: 'native-scroll',
+
+  render: function (dataSource, context) {},
+
+  update: function (dataSource, context) {
+    var K = 'scrollRenderDelegate',
+        scroll = context.find('> .sc-scroll-container-view');
+
+    if (dataSource.didChangeFor(K, 'canScrollHorizontal')) {
+      scroll.css('overflow-x', dataSource.get('canScrollHorizontal') ? 'scroll' : 'hidden');
+    }
+
+    if (dataSource.didChangeFor(K, 'canScrollVertical')) {
+      scroll.css('overflow-y', dataSource.get('canScrollVertical') ? 'scroll' : 'hidden');
+    }
+  }
+
+});

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/render_delegates/scroll.js

@@ -0,0 +1,33 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2010 Sprout Systems, Inc. and contributors.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+SC.BaseTheme.scrollRenderDelegate = SC.RenderDelegate.create({
+  className: 'scroll',
+
+  render: function (dataSource, context) {
+    context.push('<div class="corner"></div>');
+  },
+
+  update: function (dataSource, context) {
+    var K = 'scrollRenderDelegate',
+        thicknessDidChange = dataSource.didChangeFor(K, 'nativeScrollbarThickness'),
+        scroll = context.find('> .sc-scroll-container-view'),
+        canScroll, thickness = dataSource.get('nativeScrollbarThickness');
+
+    if (thicknessDidChange || dataSource.didChangeFor(K, 'canScrollHorizontal')) {
+      canScroll = dataSource.get('canScrollHorizontal');
+      scroll.css('margin-bottom', canScroll ? -1 * thickness : 0);
+      scroll.css('overflow-x', canScroll ? 'scroll' : 'hidden');
+    }
+
+    if (thicknessDidChange || dataSource.didChangeFor(K, 'canScrollVertical')) {
+      canScroll = dataSource.get('canScrollVertical');
+      scroll.css('margin-right', canScroll ? -1 * thickness : 0);
+      scroll.css('overflow-y', canScroll ? 'scroll' : 'hidden');
+    }
+  }
+
+});

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/render_delegates/touch_scroller.js

@@ -0,0 +1,76 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2011 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+SC.BaseTheme.touchScrollerRenderDelegate = SC.RenderDelegate.create({
+  className: 'touch-scroller',
+
+  render: function (dataSource, context) {
+    var layoutDirection = dataSource.get('layoutDirection'),
+        isVertical = layoutDirection === SC.LAYOUT_VERTICAL,
+        isHorizontal = layoutDirection === SC.LAYOUT_HORIZONTAL;
+
+    context.setClass({
+      'sc-vertical': isVertical,
+      'sc-horizontal': isHorizontal,
+      disabled: !dataSource.get('isEnabled'),
+      'controls-hidden': dataSource.get('controlsHidden')
+    });
+
+    context.push(
+      '<div class="track"></div>',
+      '<div class="cap"></div>',
+      dataSource.get('hasButtons') ?
+        '<div class="button-bottom"></div><div class="button-top"></div>' :
+        '<div class="endcap"></div>',
+      '<div class="thumb">',
+        '<div class="thumb-top"></div>',
+        '<div class="thumb-clip">',
+          ('<div class="thumb-inner" style="-webkit-transform: ' +
+             'translate%@(' + (dataSource.get('thumbLength') - 1044) + 'px);').
+               fmt(isVertical ? 'Y' : 'X') + '">',
+             '<div class="thumb-center"></div>',
+             '<div class="thumb-bottom"></div>',
+           '</div>',
+         '</div>',
+      '</div>');
+  },
+
+  update: function (dataSource, context) {
+    var layoutDirection = dataSource.get('layoutDirection'),
+        isVertical = layoutDirection === SC.LAYOUT_VERTICAL,
+        isHorizontal = layoutDirection === SC.LAYOUT_HORIZONTAL,
+        controlsAreHidden = dataSource.get('controlsHidden'),
+        K = 'touchScrollerRenderDelegate';
+
+    context.setClass({
+      'sc-vertical': isVertical,
+      'sc-horizontal': isHorizontal,
+      disabled: !dataSource.get('isEnabled'),
+      'controls-hidden': controlsAreHidden
+    });
+
+    if (!controlsAreHidden) {
+      var length = dataSource.get('thumbLength'),
+          position = dataSource.get('thumbPosition'),
+          T = 'translate3d(%@px,%@px,%@px)';
+
+      if (dataSource.didChangeFor(K, 'thumbPosition')) {
+        context.find('.thumb').css('-webkit-transform', isVertical ?
+                                   T.fmt(0, position, 0) :
+                                   T.fmt(position, 0, 0));
+      }
+
+      if (dataSource.didChangeFor(K, 'thumbLength')) {
+        context.find('.thumb-inner').css('-webkit-transform', isVertical ?
+                                         T.fmt(0, length, 0) :
+                                         T.fmt(length, 0, 0));
+
+      }
+    }
+  }
+
+});

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/tests/scroll/integration.js

@@ -0,0 +1,50 @@
+module("SC.ScrollView integration");
+
+test("should work with SC.TemplateView", function() {
+  var pane = SC.MainPane.create({
+    childViews: ['scrollView'],
+
+    scrollView: SC.ScrollView.design({
+      layout: { width: 400, height: 600 },
+
+      contentView: SC.TemplateView.create({
+        template: SC.Handlebars.compile("foo bar baz")
+      })
+    })
+  });
+
+  pane.append();
+  var exceptionThrown = false;
+  try {
+    SC.RunLoop.begin().end();
+  } catch (e) {
+    exceptionThrown = true;
+  }
+  ok(!exceptionThrown, "Does not throw an exception at the end of the run loop.");
+  pane.remove();
+});
+
+test("should work with views that have static layout applied", function() {
+  var pane;
+  try {
+    pane = SC.MainPane.create({
+      childViews: ['scrollView'],
+
+      scrollView: SC.ScrollView.design({
+        layout: { width: 400, height: 600 },
+
+        contentView: SC.View.design({
+          useStaticLayout: YES
+        })
+      })
+    });
+
+    pane.append();
+    SC.RunLoop.begin().end();
+
+    ok(true, "displays scroll view without throwing an exception");
+  } finally {
+    if (pane) { pane.remove(); }
+  }
+});
+

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/tests/scroll/methods.js

@@ -0,0 +1,143 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            portions copyright @2011 Apple Inc.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+var pane, view , view2;
+var appleURL='http://photos4.meetupstatic.com/photos/event/4/6/9/9/600_4518073.jpeg';
+module("SC.ScrollView",{
+	setup: function() {
+	  SC.RunLoop.begin();
+	    pane = SC.MainPane.create({
+		  childViews: [
+		   SC.ScrollView.extend({
+		     contentView: SC.ImageView.design({value: appleURL, layout: {height:4000, width:4000}})
+		   }),
+		   SC.ScrollView.extend({
+		     contentView: SC.ImageView.design({value: appleURL, layout: {height:2000, width:2000}})
+		   })
+		   
+		   ],
+		   
+		  expectedVertLine: function(line) {
+			var ret = view.get('verticalLineScroll')*line;
+			var alt = view.get('maximumVerticalScrollOffset');
+			ret = (ret > alt)? alt : ret;
+		    return ret;
+		  },
+		  expectedHorzLine: function(line) {
+			var ret = view.get('horizontalLineScroll')*line;
+			var alt = view.get('maximumHorizontalScrollOffset');
+			ret = (ret > alt)? alt : ret;
+		    return ret;
+		  },
+		  expectedVertPage: function(page) {
+			var ret = view.get('verticalPageScroll')*page;
+			var alt = view.get('maximumVerticalScrollOffset');
+			ret = (ret > alt)? alt : ret;
+		    return ret;
+		  },
+		  expectedHorzPage: function(page) {
+			var ret = view.get('horizontalPageScroll')*page;
+			var alt = view.get('maximumHorizontalScrollOffset');
+			ret = (ret > alt)? alt : ret;
+		    return ret;
+		  }
+		});
+		
+		
+		pane.append(); // make sure there is a layer...
+	  SC.RunLoop.end();	
+	  view = pane.childViews[0];
+	  view.get('containerView').get('frame').height = 100;
+	  view.get('containerView').get('frame').width = 100;
+
+	  view2 = pane.childViews[1];
+	  view2.get('containerView').get('frame').height = 100;
+	  view2.get('containerView').get('frame').width = 100;
+	  
+	},
+	
+	teardown: function() {
+    	pane.remove();
+    	pane = view = null ;
+  	}
+});
+
+
+
+test("Scrolling to a certain co-ordinate of the container view", function() {
+	equals(view.get('horizontalScrollOffset'), 0, "Initial horizontal offset must be zero");
+	equals(view.get('verticalScrollOffset'), 0, "Initial vertical offset must be zero");
+	SC.RunLoop.begin();
+	view.scrollTo(100, 100);
+	SC.RunLoop.end();
+	
+	equals(view.get('horizontalScrollOffset'), 100, "After scrolling to 100, horizontal offset must be");
+	equals(view.get('verticalScrollOffset'), 100, "After scrolling to 100, vertical offset must be");
+	view.scrollTo(5000, 5000);
+	equals(view.get('horizontalScrollOffset'), view.get('maximumHorizontalScrollOffset'), "After scrolling to 400, horizontal offset must be maximum");
+	equals(view.get('verticalScrollOffset'), view.get('maximumVerticalScrollOffset'), "After scrolling to 400, vertical offset must be maximum");
+});
+
+test("Scrolling relative to the current possition of the container view", function() {
+	equals(view.get('horizontalScrollOffset'), 0, "Initial horizontal offset must be zero");
+	equals(view.get('verticalScrollOffset'), 0, "Initial vertical offset must be zero");
+	view.scrollBy(100, 100);
+	equals(view.get('horizontalScrollOffset'), 100, "After scrolling by 100, horizontal offset must be");
+	equals(view.get('verticalScrollOffset'), 100, "After scrolling by 100, vertical offset must be");
+	view.scrollBy(100, 100);
+	equals(view.get('horizontalScrollOffset'), 200, "After scrolling by 100, horizontal offset must be");
+	equals(view.get('verticalScrollOffset'), 200, "After scrolling by 100, vertical offset must be");
+	view.scrollBy(5000, 5000);
+	equals(view.get('horizontalScrollOffset'), view.get('maximumHorizontalScrollOffset'), "After scrolling by 400, horizontal offset must be maximum");
+	equals(view.get('verticalScrollOffset'), view.get('maximumVerticalScrollOffset'), "After scrolling by 400, vertical offset must be maximum");
+});
+
+test("Scrolling through line by line", function() {
+	var line = 3;
+	equals(view.get('horizontalScrollOffset'), 0, "Initial horizontal offset must be zero");
+	equals(view.get('verticalScrollOffset'), 0, "Initial vertical offset must be zero");
+	view.scrollDownLine(line);
+	equals(view.get('horizontalScrollOffset'), 0, "After scrolling down by lines, horizontal offset is unchanged");
+	equals(view.get('verticalScrollOffset'), pane.expectedVertLine(line), "After scrolling down by lines, vertical offset must be");
+	view.scrollUpLine(line);
+});
+
+test("maximumHorizontalScrollOffset() returns the maximum horizontal scroll dimention", function() {
+  var old_horizontalScrollOffset=2;
+  var old_verticalScrollOffset=2;
+
+  view2.set('horizontalScrollOffset',old_horizontalScrollOffset);
+  view2.set('verticalScrollOffset',old_verticalScrollOffset);
+  view2.scrollBy(5000, 0);
+  view2.get('horizontalScrollOffset');
+
+  equals(view2.get('horizontalScrollOffset'),1900, 'maximum y coordinate should be 1900');	
+ 
+  view2.set('horizontalScrollOffset',old_horizontalScrollOffset);
+  view2.set('verticalScrollOffset',old_verticalScrollOffset);
+  view2.scrollBy(-5000,0);
+  equals(view2.get('horizontalScrollOffset'),0, 'minimum y coordinate should be 0');	
+  	
+});
+
+test("maximumVerticalScrollOffset() returns the maximum vertical scroll dimention", function() {
+  var old_horizontalScrollOffset=2;
+  var old_verticalScrollOffset=2;
+
+  view2.set('horizontalScrollOffset',old_horizontalScrollOffset);
+  view2.set('verticalScrollOffset',old_verticalScrollOffset);
+  view2.scrollBy(0, 5000);
+  view2.get('maximumVerticalScrollOffset');
+  equals(view2.get('verticalScrollOffset'),1900, 'maximum coordinate should be 1900'); 
+  view2.set('horizontalScrollOffset',old_horizontalScrollOffset);
+  view2.set('verticalScrollOffset',old_verticalScrollOffset);
+  view2.scrollBy(0,-5000);
+  equals(view2.get('verticalScrollOffset'),0, 'The minimum y coordinate should be 0');
+ 
+});

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/scroll_view/tests/scroll/ui.js

@@ -0,0 +1,258 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            portions copyright @2011 Apple Inc.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test ok equals same stop start */
+
+(function() {
+    var appleURL="http://photos4.meetupstatic.com/photos/event/4/6/9/9/600_4518073.jpeg";
+    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,
+      autohidesHorizontalScroller: NO,
+      autohidesVerticalScroller: NO
+    })
+    
+    .add("nestedHoriz", SC.ScrollView, {
+      layout: { width: 100, height: 440 },
+        
+      contentView: SC.ScrollView.design({
+        layout: { width: 200, height: 420 },
+        contentView: iv
+      })
+    })
+    
+    .add("nestedVert", SC.ScrollView, {
+      layout: { width: 440, height: 100 },
+        
+      contentView: SC.ScrollView.design({
+        layout: { width: 420, height: 200 },
+        contentView: iv
+      })
+    })
+    
+    .add("nestedVertInHoriz", SC.ScrollView, {
+      layout: { width: 100, height: 220 },
+        
+      contentView: SC.ScrollView.design({
+        layout: { width: 420, height: 200 },
+        contentView: iv
+      })
+    })
+    
+    .add("nestedHorizInVert", SC.ScrollView, {
+      layout: { width: 220, height: 100 },
+        
+      contentView: SC.ScrollView.design({
+        layout: { width: 200, height: 420 },
+        contentView: iv
+      })
+    })
+    
+    .add("disabled", SC.ScrollView, {
+      isEnabled: NO
+    })
+    
+    .add("verticalScrollerBottom",SC.ScrollView, {
+      contentView: iv,
+      hasHorizontalScroller : NO,
+      verticalScrollerBottom: 16,
+      isVerticalScrollerVisible: YES,
+      autohidesVerticalScroller: NO
+      
+    })
+    .add("aria-controls_attribute", SC.ScrollView, {
+      contentView: iv
+    });
+
+    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');
+
+    view.scrollTo(0,100);
+    SC.RunLoop.begin().end();
+    var elem = view.get('containerView').$()[0];
+    equals(elem.scrollTop, 100, 'vertical scrolling should adjust scrollTop of container view');
+    
+    view.scrollTo(50,0);
+    SC.RunLoop.begin().end();
+    elem = view.get('containerView').$()[0];
+    equals(elem.scrollLeft, 50, 'horizontal scrolling should adjust scrollLeft of container view');
+  });
+   
+  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("nestedHoriz", function() {
+    var view = pane.view('nestedHoriz');
+    ok(view.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(!view.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-x'), 'scroll', 'should have \'overflow-x\': \'scroll\' style');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-y'), 'hidden', 'should have \'overflow-y\': \'hidden\' style');
+    var nestedView = view.get('contentView');
+    ok(nestedView.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(!nestedView.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(nestedView.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-x'), 'scroll', 'should have \'overflow-x\': \'scroll\' style');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-y'), 'hidden', 'should have \'overflow-y\': \'hidden\' style');
+  });
+
+  test("nestedVert", function() {
+    var view = pane.view('nestedVert');
+    ok(!view.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(view.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-x'), 'hidden', 'should have \'overflow-x\': \'scroll\' style');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-y'), 'scroll', 'should have \'overflow-y\': \'hidden\' style');
+    var nestedView = view.get('contentView');
+    ok(!nestedView.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(nestedView.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(nestedView.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-x'), 'hidden', 'should have \'overflow-x\': \'scroll\' style');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-y'), 'scroll', 'should have \'overflow-y\': \'hidden\' style');
+  });
+  
+  test("nestedVertInHoriz", function() {
+    var view = pane.view('nestedVertInHoriz');
+    ok(view.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(!view.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-x'), 'scroll', 'should have \'overflow-x\': \'scroll\' style');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-y'), 'hidden', 'should have \'overflow-y\': \'hidden\' style');
+    var nestedView = view.get('contentView');
+    ok(!nestedView.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(nestedView.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(nestedView.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-x'), 'hidden', 'should have \'overflow-x\': \'scroll\' style');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-y'), 'scroll', 'should have \'overflow-y\': \'hidden\' style');
+  });
+
+  test("nestedHorizInVert", function() {
+    var view = pane.view('nestedHorizInVert');
+    ok(!view.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(view.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(view.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-x'), 'hidden', 'should have \'overflow-x\': \'scroll\' style');
+    equals(view.$('> .sc-scroll-container-view').css('overflow-y'), 'scroll', 'should have \'overflow-y\': \'hidden\' style');
+    var nestedView = view.get('contentView');
+    ok(nestedView.get('canScrollHorizontal'),'can scroll in horizontal direction');
+    ok(!nestedView.get('canScrollVertical'),'cannot scroll in vertical direction');
+    ok(nestedView.$().hasClass('sc-scroll-view'), 'should have sc-scroll-view class');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-x'), 'scroll', 'should have \'overflow-x\': \'scroll\' style');
+    equals(nestedView.$('> .sc-scroll-container-view').css('overflow-y'), 'hidden', 'should have \'overflow-y\': \'hidden\' style');
+  });
+  
+  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');
+   });
+
+   test("non-zero bottom in vertical scrollbar", function() {
+      var view = pane.view('verticalScrollerBottom'); 
+      equals(view.get('verticalScrollerBottom'),16, "should have verticalScrollerBottom as ");
+      var scroller = view.get('verticalScrollerView') ;
+      ok(scroller, 'should have vertical scroller view ');
+      equals(scroller.get('layout').bottom,16, 'should have layout.bottom of scroller as ');
+      equals(scroller.$()[0].style.bottom,'16px', 'should have style.bottom of scroller as ');
+    });
+   
+   test('ScrollView should readjust scrollTop/scrollLeft if layer changes', function() {
+     var view = pane.view('basic2'), cv = view.get('contentView'), container = view.get('containerView') ;
+     view.scrollTo(10, 10);
+     SC.RunLoop.begin().end();
+     equals(container.get('layer').scrollLeft, 10, 'precond - scrollLeft is set to 10');
+     equals(container.get('layer').scrollTop, 10, 'precond- scrollTop is set to 10');
+     cv.replaceLayer();
+     SC.RunLoop.begin().end();
+     equals(container.get('layer').scrollLeft, 10, 'scrollLeft should be readjusted to 10');
+     equals(container.get('layer').scrollTop, 10, 'scrollTop should be readjust to 10');
+   });
+
+   test('Scroller views of scroll view should have aria-controls set to its content', function() {
+     var view = pane.view("aria-controls_attribute"),
+         horizontalScrollerView = view.get('horizontalScrollerView'),
+         verticalScrollerView   = view.get('verticalScrollerView'),
+         contentView            = view.get('contentView').get('layerId');
+
+     equals(horizontalScrollerView.$().attr('aria-controls'), contentView, "horizontalScroller has aria-controls set");
+     equals(verticalScrollerView.$().attr('aria-controls'), contentView, "verticalScroller has aria-controls set");
+   });
+})();