// ========================================================================== // Project: SproutCore
- JavaScript Application Framework // Copyright: ©2013 7x7 Software, Inc. // License: Licensed under MIT license (see license.js) // ==========================================================================
/*global module, test, equals, ok, start, stop */
var view,
pane;
/** Test the SC
.View states. */ module(“SC.View Transition States”, {
setup: function () { view = SC.View.create(); pane = SC.Pane.create({ layout: { width: 400, height: 400 } }); }, teardown: function () { view.destroy(); pane.destroy(); view = pane = null; }
});
/** */ // test(“Reversing SHOWING to HIDDEN: FADE_IN”, function () { // stop(2000);
// view.set('isVisible', false); // SC.run(function () { // pane.appendChild(view); // pane.append(); // });
// // Test assumption. // equals(view.get('isVisible'), false, “The isVisible property of the view is”); // ok(view.$().hasClass('sc-hidden'), “The view has sc-hidden class name.”); // equals(view.$().css('opacity'), '1', “The view's opacity is”);
// view.set('transitionShow', SC
.View.FADE_IN); // SC.run(function () { // view.set('isVisible', true); // }); // equals(view.$().css('opacity'), '0', “The view's opacity is”);
// setTimeout(function () { // var jqEl = view.$();
// // Test assumption. // equals(view.get('isVisible'), true, “The isVisible property of the view is”); // ok(!jqEl.hasClass('sc-hidden'), “The view doesn't have sc-hidden class name.”); // ok(jqEl.css('opacity') > 0, “The view's opacity is not 0.”); // ok(jqEl.css('opacity') < 1, “The view's opacity is not 1.”);
// SC.run(function () { // view.set('isVisible', false); // });
// jqEl = view.$(); // equals(view.get('isVisible'), false, “The isVisible property of the view is”); // ok(jqEl.hasClass('sc-hidden'), “The view has sc-hidden class name.”); // equals(jqEl.css('opacity'), '1', “The view's opacity is”);
// start(); // }, 200); // });
/** */ test(“Reversing SHOWING to HIDING: FADE_IN & FADE_OUT”, function () {
stop(2000); view.set('isVisible', false); SC.run(function () { pane.appendChild(view); pane.append(); }); // Test assumption. equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(view.$().hasClass('sc-hidden'), "The view has sc-hidden class name."); equals(view.$().css('opacity'), '1', "The view's opacity is"); view.set('transitionShow', SC.View.FADE_IN); view.set('transitionHide', SC.View.FADE_OUT); SC.run(function () { view.set('isVisible', true); }); equals(view.$().css('opacity'), '0', "The view's opacity is"); setTimeout(function () { var jqEl = view.$(); // Test assumption. equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's opacity is not 0."); ok(jqEl.css('opacity') < 1, "The view's opacity is not 1."); SC.run(function () { view.set('isVisible', false); }); jqEl = view.$(); equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's opacity is not 0 still."); }, 200); setTimeout(function () { var jqEl = view.$(); // Test assumption. equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's opacity is not 0."); ok(jqEl.css('opacity') < 1, "The view's opacity is not 1."); }, 400); setTimeout(function () { var jqEl = view.$(); SC.RunLoop.begin().end(); // Test assumption. equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(jqEl.hasClass('sc-hidden'), "The view has sc-hidden class name."); ok(view._layoutStyleNeedsUpdate, "The view's layout needs update"); start(); }, 1500);
});
/** */ test(“Reversing HIDING to SHOWN: FADE_OUT”, function () {
stop(2000); SC.run(function () { pane.appendChild(view); pane.append(); }); // Test assumption. equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!view.$().hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); equals(view.$().css('opacity'), '1', "The view's opacity is"); view.set('transitionHide', SC.View.FADE_OUT); SC.run(function () { view.set('isVisible', false); }); equals(view.$().css('opacity'), '1', "The view's opacity is"); // Fading out. setTimeout(function () { var jqEl = view.$(); // Test assumption. equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's opacity is not 0."); ok(jqEl.css('opacity') < 1, "The view's opacity is not 1."); // Cancel fading out. SC.run(function () { view.set('isVisible', true); }); jqEl = view.$(); equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); equals(jqEl.css('opacity'), '1', "The view's opacity is now"); start(); }, 200);
});
/** */ test(“Reversing HIDING to SHOWING: FADE_IN & FADE_OUT”, function () {
stop(2000); SC.run(function () { pane.appendChild(view); pane.append(); }); // Test assumption. equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!view.$().hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); equals(view.$().css('opacity'), '1', "The view's opacity is"); view.set('transitionShow', SC.View.FADE_IN); view.set('transitionHide', SC.View.FADE_OUT); SC.run(function () { view.set('isVisible', false); }); equals(view.$().css('opacity'), '1', "The view's opacity is"); setTimeout(function () { var jqEl = view.$(); // Test assumption. equals(view.get('isVisible'), false, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's current opacity is not 0."); ok(jqEl.css('opacity') < 1, "The view's current opacity is not 1."); // Cancel fading out. SC.run(function () { view.set('isVisible', true); }); jqEl = view.$(); equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); ok(jqEl.css('opacity') > 0, "The view's current opacity is not 0 still."); ok(jqEl.css('opacity') < 1, "The view's current opacity is not 1 still."); }, 200); setTimeout(function () { var jqEl = view.$(); // Test assumption. equals(view.get('isVisible'), true, "The isVisible property of the view is"); ok(!jqEl.hasClass('sc-hidden'), "The view doesn't have sc-hidden class name."); equals(jqEl.css('opacity'), '1', "The view's current opacity is now"); start(); }, 1000);
});