blossom
Version:
Modern, Cross-Platform Application Framework
111 lines (101 loc) • 3.99 kB
JavaScript
// ==========================================================================
// 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 v*/
(function() {
var pane = SC.ControlTestPane.design()
.add("basic", SC.WebView, {
value: "/clock",
layout: {
width: 250,
height: 150
}
}).add("change src/value", SC.WebView, {
value: "/clock",
layout: {
width: 250,
height: 150
}
}).add("auto resize", SC.WebView, {
value: sc_static('iframe'),
shouldAutoResize: true,
layout: {
width: 250,
height: 150
}
}).add("don\'t auto resize", SC.WebView, {
shouldAutoResize: false,
//set the value later when you need it
layout: {
width: 250,
height: 150
}
});
pane.show(); // add a test to show the test pane
// ..........................................................
// TEST VIEWS
//
suite('SC.WebView UI');
test("attributes tests",
function() {
var view = pane.view('basic');
var iframe = view.$('iframe');
var rootElement = view.$();
ok(view, 'view should exist');
ok(view.get('value'), 'should have value property');
equals(view.get('shouldAutoResize'), false, 'should have autoresize off by default, shouldAutoResize');
ok(rootElement.hasClass('sc-view'), 'should have sc-view css class');
ok(rootElement.hasClass('sc-web-view'), 'should have sc-web-view css class');
equals(rootElement.height(), 150, 'should have height');
equals(rootElement.width(), 250, 'should have width');
ok(iframe, 'should have iframe element');
equals(iframe.attr('src'), "/clock", "should have source as /clock");
ok(iframe[0].contentWindow, 'should have content window if src is from the same domain');
});
test('change src/value',
function() {
var view = pane.view('change src/value');
var iframe = view.$('iframe');
equals(view.get('value'), "/clock", "should have value property in view as \'/clock\' before changing source");
SC.RunLoop.begin();
view.set('value', "/store_configurator");
SC.RunLoop.end();
equals(view.get('value'), "/store_configurator", "should have value property in view as \'/store_configurator\' after changing source");
equals(iframe.attr('src'), "/store_configurator", "should have source in the iframe as \'/store_configurator\'");
});
test('auto resize tests, shouldAutoResize:true',
function() {
var view = pane.view('auto resize');
//set the test wrapper element's overflow to auto so that you can see the resize magic'
view.$()[0].parentNode.style.overflow = "auto";
equals(view.get('shouldAutoResize'), true, 'should have auto resize flag as true');
stop();
SC.Event.add(view.$('iframe')[0], 'load', this,
function() {
ok(view.$().height() > 150, "height of view should change based on content");
ok(view.$().width() > 200, "width of view should change based on content");
start();
});
});
test('auto resize tests, shouldAutoResize:false',
function() {
var view = pane.view('don\'t auto resize');
equals(view.get('shouldAutoResize'), false, 'should have auto resize flag as false');
/** set the src a bit late so that the following onload event get's hooked
up before it actually loads
*/
SC.RunLoop.begin();
view.set('value', sc_static('iframe'));
SC.RunLoop.end();
stop();
SC.Event.add(view.$('iframe')[0], 'load', this,
function() {
ok(view.$().height() === 150, "height of view should not change based on content");
ok(view.$().width() === 250, "width of view should not change based on content");
start();
});
});
})();