spade 0.0.1 → 0.0.2

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

@@ -1,119 +0,0 @@
-// ==========================================================================
-// Project:   SproutCore - JavaScript Application Framework
-// Copyright: ©2006-2011 Strobe Inc. and contributors.
-//            portions copyright @2009 Apple Inc.
-// License:   Licensed under MIT license (see license.js)
-// ==========================================================================
-
-/*global module test htmlbody ok equals same stop start Q$*/
-
-var pane, view ;
-module("SC.RadioView Logic", {
-  setup: function() {
-    SC.RunLoop.begin();
-    pane = SC.MainPane.create({
-      childViews: [
-        SC.RadioView.extend({
-          layout: { right: 20, bottom: 20, width: 100, height: 23 },
-          items: 'Red Green'.w(),
-          value: 'Red',
-          isEnabled: YES
-        })]
-    });
-    pane.append(); // make sure there is a layer...
-    SC.RunLoop.end();
-    
-    view = pane.childViews[0];
-  }, 
-  
-  teardown: function() {
-    pane.remove();
-    pane = view = null ;
-  }
-});
-
-test("renders an input tag with appropriate attributes", function() {
-  equals(view.get('value'), 'Red', 'precon - value should be YES');
-
-  var q = view.$();
-  equals(q.attr('role'), 'radiogroup', 'should have role=radio');
-  var radios=view.$('.sc-radio-button');
-  equals(SC.$(radios[0]).attr('aria-checked'), 'true', 'should be checked');
-
-});
-
-test("changing the value should update the group", function() {
-  var oldValue = view.get('value');
-  SC.RunLoop.begin();
-  view.set('value', 'Green');
-  SC.RunLoop.end();
-
-  ok(view.get('value') !== oldValue, 'precond - should have changed value');
-  var q = Q$('.sel > span', view.get('layer'));
-  equals(q.text(), view.get('value'), 'label should have new value');
-});
-
-test("isEnabled should alter group classname and sync with isEnabled property", function() {
-
-  // check initial render state
-  ok(view.get('isEnabled'), 'isEnabled should match value');
-  ok(!view.$().hasClass('disabled'), 'should NOT have disabled class');
-
-  // update value -- make sure isEnabled changes.  
-  SC.RunLoop.begin();
-  view.set('isEnabled', 0); // make falsy. (but not NO exactly)
-  SC.RunLoop.end();
-  
-  ok(!view.get('isEnabled'), 'isEnabled should now be NO');
-  ok(view.$().hasClass('disabled'), 'should have disabled class');
-
-  // update isEnabled -- make sure it edits the value
-  SC.RunLoop.begin();
-  view.set('isEnabled', YES);
-  SC.RunLoop.end();
-  
-  ok(view.get('isEnabled'), 'isEnabled should match value');
-  ok(!view.$().hasClass('disabled'), 'should NOT have disabled class');
-});
-
-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');
-  SC.Event.trigger(r[1], 'mouseup');
-  equals(view.get('value'), 'Green', 'value should have changed');
-});
-
-test("pressing mouseDown and then mouseUp anywhere in a radio button should toggle the selection", function() {
-  var elem = view.get('layer'), 
-      r = view.$('.sc-radio-button');
-
-  SC.Event.trigger(r[0], 'mousedown');
-  equals(view.get('value'), 'Red', 'value should not change yet');
-  ok(r.first().hasClass('active'), 'radio button should be active');
-  
-  // simulate mouseUp and browser-native change to control
-  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');
-  SC.Event.trigger(r[1],'mouseup');
-  
-  ok(!r.first().hasClass('active'), 'radio button should no longer be active');
-  equals(view.get('value'), 'Green', 'value should be undefined (none checked)');
-  
-  elem = null ;
-});
-
-test("isEnabled=NO should add disabled attr to input", function() {
-  SC.RunLoop.begin();
-  view.set('isEnabled', NO);
-  SC.RunLoop.end();
-  
-  ok(view.$().hasClass('disabled'), 'should have disabled attr');
-  
-  ok(view.get('value'), 'precond - value should be true');
-  view.mouseDown();
-  view.mouseUp();
-  ok(view.get('value'), 'value should not change when clicked');
-});

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

@@ -1,349 +0,0 @@
-// ==========================================================================
-// Project:   SproutCore - JavaScript Application Framework
-// Copyright: ©2006-2011 Strobe Inc. and contributors.
-//            portions copyright @2009 Apple Inc.
-// License:   Licensed under MIT license (see license.js)
-// ==========================================================================
-
-/*global module test htmlbody ok equals same stop start */
-
-
-var itemList = [{ title: "Red", value: "red", enabled: YES,ariaLabeledBy: "color" }, { title: "Green", value: "green",ariaLabeledBy: "color"  }, { title: "Blue", value: "blue",ariaLabeledBy: "color" }],
-itemList2 = [{ title: "Cyan", value: "cyan", enabled: YES,ariaLabel: "itemList1" }, { title: "Magenta", value: "magenta",ariaLabel: "itemList1"  }, { title: "Yellow", value: "yellow",ariaLabel: "itemList1"  },{ title: "blacK", value: "black",ariaLabel: "itemList1" }],
-itemList3 = [{ title: "Red", value: "red", enabled: YES, width: 30 }, { title: "Green", value: "green", width: 50 }, { title: "Blue", value: "blue", width: 40 }];
-
-var pane = SC.ControlTestPane.design()
-  .add("basic", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-  
-  .add("checked", SC.RadioView, {
-    value: "red",
-    isEnabled: YES,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-  
-  .add("disabled", SC.RadioView, {
-    value: "",
-    isEnabled: NO,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-  
-  .add("enabled first", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    itemIsEnabledKey: 'enabled',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-  
-  .add("horizontal", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: 'Yes No'.w(),
-    // LAYOUT_VERTICAL is default
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-  
-  .add("horizontal widths", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList3,
-    layoutDirection: SC.LAYOUT_HORIZONTAL,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    itemWidthKey: 'width'
-  })
-
-  .add("aria-role-group", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-
-  .add("aria-role-radio", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList,
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-
-  .add("aria-label", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList2,
-    itemAriaLabelKey: 'ariaLabel',
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  })
-
-  .add("aria-labeledBy", SC.RadioView, {
-    value: "",
-    isEnabled: YES,
-    items: itemList,
-    itemAriaLabeledByKey: 'ariaLabeledBy',
-    itemTitleKey: 'title',
-    itemValueKey: 'value',
-    layoutDirection: SC.LAYOUT_HORIZONTAL
-  });
-pane.show(); // add a test to show the test pane
-
-pane.verifyButtons = function verifyButtons(view, items) {
-  var radioButtons = view.$('.sc-radio-button');
-  equals(radioButtons.length, items.length, 'number of radio buttons should be %@'.fmt(items.length));
-  
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-    
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    
-    equals(theInput.attr('aria-checked'), 'false', 'radio button #%@ should not be checked'.fmt(idx));
-    ok(!theInput.hasClass('disabled'), 'radio button #%@ should not be disabled'.fmt(idx));
-    
-    i++;
-  });
-};
-
-pane.verifyLabels = function verifyLabels(view, items) {
-  var labels = view.$('span.sc-button-label');
-  equals(labels.length, items.length, 'number of labels should be %@'.fmt(items.length));
-  
-  var idx = 0;
-  labels.forEach(function(label) {
-    equals(label.innerHTML, items[idx].title, 'radio button #%@ should have original label'.fmt(idx));
-    idx++;
-  });
-};
-
-// ..........................................................
-// TEST VIEWS
-// 
-module('SC.RadioView UI', {
-  setup: function(){
-    htmlbody('<style> .sc-static-layout { border: 1px red dotted; } </style>');
-  },
-  teardown: function(){
-    clearHtmlbody();
-  }
-};
-
-test("basic", function() {
-  
-  var view = pane.view('basic');
-  
-  ok(!view.$().hasClass('disabled'), 'should not have disabled class');
-  pane.verifyButtons(view, itemList);
-  pane.verifyLabels(view, itemList);
-  
-  // Modify the items array in place
-  itemList.replace(0, {title: "Hue", value: "hue", enabled: YES });
-  itemList.replace(1, { title: "Saturation", value: "saturation" });
-  itemList.replace(2, { title: "Brightness", value: "brightness"});
-  
-  // Allow the radio view a chance to update
-  SC.RunLoop.begin().end();
-  
-  pane.verifyButtons(view, itemList);
-  pane.verifyLabels(view, itemList);
-  
-  // Swap out the items array
-  view.set('items', itemList2);
-  
-  // Allow the radio view a chance to update
-  SC.RunLoop.begin().end();
-  
-  pane.verifyButtons(view, itemList2);
-  pane.verifyLabels(view, itemList2);
-  
-  // Reset the items array before moving on
-  itemList.replace(0, { title: "Red", value: "red", enabled: YES });
-  itemList.replace(1, { title: "Green", value: "green" });
-  itemList.replace(2, { title: "Blue", value: "blue" });
-});
-
-
-test("checked", function() {
-  var view = pane.view('checked');
-  
-  ok(!view.$().hasClass('disabled'), 'should not have disabled class');
-  
-  var radioButtons = view.$('.sc-radio-button');
-  equals(radioButtons.length, 3, 'number of radio buttons should be 3');
-  
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-        idx = parseInt(theInput.attr('index'),0),
-        buttonValue = theInput.attr('value');
-    
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    if(idx===0) {
-      equals(theInput.attr('aria-checked'), 'true', 'radio button #%@ should be checked'.fmt(idx));
-    } else {
-      equals(theInput.attr('aria-checked'), 'false', 'radio button #%@ should not be checked'.fmt(idx));
-    }
-    
-    ok(!theInput.hasClass('disabled'), 'radio button #%@ should not be disabled'.fmt(idx));
-    i++;
-  });
-  
-  var labels = view.$('span.sc-button-label');
-  equals(labels.length, 3, 'number of labels should be 3');
-  
-  var idx = 0;
-  labels.forEach(function(label) {
-    equals(label.innerHTML, itemList[idx].title, 'radio button #%@ should have original label'.fmt(idx));
-    idx++;
-  });
-  
-});
-
-test("disabled", function() {
-  var view = pane.view('disabled');
-  
-  ok(view.$().hasClass('disabled'), 'should have disabled class');
-  
-  var radioButtons = view.$('.sc-radio-button');
-  equals(radioButtons.length, 3, 'number of radio buttons should be 3');
-  
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-    
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    equals(theInput.attr('aria-checked'), 'false', 'radio button #%@ should not be checked'.fmt(idx));
-    ok(!theInput.hasClass('disabled'), 'radio button #%@ should be disabled'.fmt(idx));
-    i++;
-  });
-  
-  var labels = view.$('span.sc-button-label');
-  equals(labels.length, 3, 'number of labels should be 3');
-  
-  var idx = 0;
-  labels.forEach(function(label) {
-    equals(label.innerHTML, itemList[idx].title, 'radio button #%@ should have original label'.fmt(idx));
-    idx++;
-  });
-  
-});
-
-test("enabled first", function() {
-  var view = pane.view('enabled first');
-  
-  ok(!view.$().hasClass('disabled'), 'should not have disabled class');
-  
-  var radioButtons = view.$('.sc-radio-button');
-  equals(radioButtons.length, 3, 'number of radio buttons should be 3');
-  SC.RunLoop.begin();
-  view.set('isEnabled', NO);
-  SC.RunLoop.end();
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-      
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    ok(theInput.attr('aria-checked'), 'false', 'radio button #%@ should not be checked'.fmt(idx));
-    i++;
-  });
-  
-  ok(view.$().hasClass('disabled'), 'should have disabled class');
-  
-  var labels = view.$('span.sc-button-label');
-  equals(labels.length, 3, 'number of labels should be 3');
-  
-  var idx = 0;
-  labels.forEach(function(label) {
-    equals(label.innerHTML, itemList[idx].title, 'radio button #%@ should have original label'.fmt(idx));
-    idx++;
-  });
-});
-
-test("item widths", function() {
-  var radioButtons = pane.view('horizontal widths').$('.sc-radio-button'),
-      widths = [30, 50, 40],
-      idx = 0, radio;
-  
-  radioButtons.forEach(function(elem) {
-    equals(SC.$(elem).width(), widths[idx], 'radio button %@ should width specified by itemWidthKey'.fmt(idx, widths[idx]));
-    idx++;
-  });
- }); 
-
-test("aria-role-group", function() {
-  var radioButton = pane.view('aria-role-group');
-  equals(radioButton.$().attr('role'),'radiogroup', 'role should be radiogroup');
-});
-
-test("aria-role-radio", function() {
-  var radioButtons = pane.view('aria-role-radio').$('.sc-radio-button');
-
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    equals(theInput.attr('role'), 'radio', 'radio button #%@ should have role as radio'.fmt(idx));
-
-    i++;
-  });
-});
-
-test("aria-label", function() {
-  var radioButtons = pane.view('aria-label').$('.sc-radio-button');
-
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    equals(theInput.attr('aria-label'), 'itemList1', 'radio button #%@ should have aria-label as itemList1'.fmt(idx));
-
-    i++;
-  });
-});
-
-test("aria-labeledBy", function() {
-  var radioButtons = pane.view('aria-labeledBy').$('.sc-radio-button');
-
-  var i = 0;
-  radioButtons.forEach(function(radioInput) {
-    var theInput = SC.$(radioInput),
-      idx = parseInt(theInput.attr('index'),0),
-      buttonValue = theInput.attr('value');
-
-    equals(idx, i, 'radio button #%@ should have field value %@'.fmt(idx, i));
-    equals(theInput.attr('aria-labelledby'), 'color', 'radio button #%@ should have aria-labelledby as color'.fmt(idx));
-
-    i++;
-  });
-});