Andreas Hocevar
349 lines
13 KiB
JavaScript
349 lines
13 KiB
JavaScript
// Copyright 2010 The Closure Library Authors. All Rights Reserved.
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS-IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
goog.provide('goog.ui.TextareaTest');
|
|
goog.setTestOnly('goog.ui.TextareaTest');
|
|
|
|
goog.require('goog.dom');
|
|
goog.require('goog.dom.classlist');
|
|
goog.require('goog.events');
|
|
goog.require('goog.style');
|
|
goog.require('goog.testing.ExpectedFailures');
|
|
goog.require('goog.testing.events.EventObserver');
|
|
goog.require('goog.testing.jsunit');
|
|
goog.require('goog.ui.Textarea');
|
|
goog.require('goog.ui.TextareaRenderer');
|
|
goog.require('goog.userAgent');
|
|
goog.require('goog.userAgent.product');
|
|
|
|
var sandbox;
|
|
var textarea;
|
|
var demoTextareaElement;
|
|
var expectedFailures;
|
|
|
|
function setUp() {
|
|
sandbox = goog.dom.getElement('sandbox');
|
|
textarea = new goog.ui.Textarea();
|
|
demoTextareaElement = goog.dom.getElement('demo-textarea');
|
|
expectedFailures = new goog.testing.ExpectedFailures();
|
|
}
|
|
|
|
function tearDown() {
|
|
expectedFailures.handleTearDown();
|
|
textarea.dispose();
|
|
goog.dom.removeChildren(sandbox);
|
|
}
|
|
|
|
|
|
/**
|
|
* @return {boolean} Whether we're on Mac Safari 3.x.
|
|
*/
|
|
function isMacSafari3() {
|
|
return goog.userAgent.WEBKIT && goog.userAgent.MAC &&
|
|
!goog.userAgent.isVersionOrHigher('527');
|
|
}
|
|
|
|
|
|
/**
|
|
* @return {boolean} Whether we're on Linux Firefox 3.6.3.
|
|
*/
|
|
function isLinuxFirefox() {
|
|
return goog.userAgent.product.FIREFOX && goog.userAgent.LINUX;
|
|
}
|
|
|
|
|
|
/**
|
|
* @return {boolean} Whether we're on Firefox 3.0.
|
|
*/
|
|
function isFirefox3() {
|
|
return goog.userAgent.GECKO &&
|
|
!goog.userAgent.isVersionOrHigher('1.9.1');
|
|
}
|
|
|
|
function testConstructor() {
|
|
assertNotNull('Textarea must not be null', textarea);
|
|
assertEquals('Renderer must default to expected value',
|
|
goog.ui.TextareaRenderer.getInstance(), textarea.getRenderer());
|
|
|
|
var fakeDomHelper = {
|
|
'getDocument': function() { return true; }
|
|
};
|
|
var testTextarea = new goog.ui.Textarea('Hello',
|
|
goog.ui.TextareaRenderer.getInstance(), fakeDomHelper);
|
|
assertEquals('Content must have expected content', 'Hello',
|
|
testTextarea.getContent());
|
|
assertEquals('Renderer must have expected value',
|
|
goog.ui.TextareaRenderer.getInstance(), testTextarea.getRenderer());
|
|
assertEquals('DOM helper must have expected value', fakeDomHelper,
|
|
testTextarea.getDomHelper());
|
|
testTextarea.dispose();
|
|
}
|
|
|
|
function testConstructorWithDecorator() {
|
|
var decoratedTextarea = new goog.ui.Textarea();
|
|
decoratedTextarea.decorate(demoTextareaElement);
|
|
assertEquals('Textarea should have current content after decoration',
|
|
'Foo', decoratedTextarea.getContent());
|
|
var initialHeight = decoratedTextarea.getHeight_();
|
|
var initialOffsetHeight = decoratedTextarea.getElement().offsetHeight;
|
|
// focus() will trigger the grow/shrink flow.
|
|
decoratedTextarea.getElement().focus();
|
|
assertEquals('Height should not have changed without content change',
|
|
initialHeight, decoratedTextarea.getHeight_());
|
|
assertEquals('offsetHeight should not have changed without content ' +
|
|
'change', initialOffsetHeight,
|
|
decoratedTextarea.getElement().offsetHeight);
|
|
decoratedTextarea.dispose();
|
|
}
|
|
|
|
function testGetSetContent() {
|
|
textarea.render(sandbox);
|
|
assertEquals('Textarea\'s content must default to an empty string',
|
|
'', textarea.getContent());
|
|
textarea.setContent(17);
|
|
assertEquals('Textarea element must have expected content', '17',
|
|
textarea.getElement().value);
|
|
textarea.setContent('foo');
|
|
assertEquals('Textarea element must have updated content', 'foo',
|
|
textarea.getElement().value);
|
|
}
|
|
|
|
function testGetSetValue() {
|
|
textarea.render(sandbox);
|
|
assertEquals('Textarea\'s content must default to an empty string',
|
|
'', textarea.getValue());
|
|
textarea.setValue(17);
|
|
assertEquals('Textarea element must have expected content', '17',
|
|
textarea.getValue());
|
|
textarea.setValue('17');
|
|
assertEquals('Textarea element must have expected content', '17',
|
|
textarea.getValue());
|
|
}
|
|
|
|
function testBasicTextareaBehavior() {
|
|
var observer = new goog.testing.events.EventObserver();
|
|
goog.events.listen(textarea, goog.ui.Textarea.EventType.RESIZE, observer);
|
|
textarea.render(sandbox);
|
|
var el = textarea.getElement();
|
|
var heightBefore = textarea.getHeight_();
|
|
assertTrue('One resize event should be fired during render',
|
|
observer.getEvents().length == 1);
|
|
textarea.setContent('Lorem ipsum dolor sit amet, consectetuer ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.');
|
|
var heightAfter = textarea.getHeight_();
|
|
assertTrue('With this much content, height should have grown.',
|
|
heightAfter > heightBefore);
|
|
assertTrue('With a height change, a resize event should have fired.',
|
|
observer.getEvents().length == 2);
|
|
textarea.setContent('');
|
|
heightAfter = textarea.getHeight_();
|
|
assertTrue('Textarea should shrink with no content.',
|
|
heightAfter <= heightBefore);
|
|
assertTrue('With a height change, a resize event should have fired.',
|
|
observer.getEvents().length == 3);
|
|
goog.events.unlisten(textarea, goog.ui.Textarea.EventType.RESIZE,
|
|
observer);
|
|
}
|
|
|
|
function testMinHeight() {
|
|
textarea.render(sandbox);
|
|
textarea.setMinHeight(50);
|
|
assertEquals('offsetHeight should be 50 initially', 50,
|
|
textarea.getElement().offsetHeight);
|
|
textarea.setContent('Lorem ipsum dolor sit amet, consectetuer ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.');
|
|
assertTrue('getHeight_() should be > 50',
|
|
textarea.getHeight_() > 50);
|
|
|
|
textarea.setContent('');
|
|
assertEquals('With no content, offsetHeight should go back to 50, ' +
|
|
'the minHeight.', 50, textarea.getElement().offsetHeight);
|
|
|
|
expectedFailures.expectFailureFor(isMacSafari3());
|
|
try {
|
|
textarea.setMinHeight(0);
|
|
assertTrue('After setting minHeight to 0, offsetHeight should ' +
|
|
'now be < 50, but it is ' + textarea.getElement().offsetHeight,
|
|
textarea.getElement().offsetHeight < 50);
|
|
} catch (e) {
|
|
expectedFailures.handleException(e);
|
|
}
|
|
}
|
|
|
|
function testMouseUpListener() {
|
|
textarea.render(sandbox);
|
|
textarea.setMinHeight(100);
|
|
textarea.setMaxHeight(200);
|
|
textarea.mouseUpListener_({});
|
|
assertEquals('After a mouseup which is not a resize, minHeight should ' +
|
|
'still be 100', 100, textarea.minHeight_);
|
|
|
|
// We need to test how CSS drop shadows effect this too.
|
|
goog.dom.classlist.add(textarea.getElement(), 'drop-shadowed');
|
|
textarea.mouseUpListener_({});
|
|
assertEquals('After a mouseup which is not a resize, minHeight should ' +
|
|
'still be 100 even with a shadow', 100, textarea.minHeight_);
|
|
|
|
}
|
|
|
|
function testMaxHeight() {
|
|
textarea.render(sandbox);
|
|
textarea.setMaxHeight(50);
|
|
assertTrue('Initial offsetHeight should be less than 50',
|
|
textarea.getElement().offsetHeight < 50);
|
|
var newContent = 'Lorem ipsum dolor sit amet, consectetuer adipiscing ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.';
|
|
textarea.setContent(newContent);
|
|
|
|
assertTrue('With lots of content, getHeight_() should be > 50',
|
|
textarea.getHeight_() > 50);
|
|
assertEquals('Even with lots of content, offsetHeight should be 50 ' +
|
|
'with maxHeight set', 50, textarea.getElement().offsetHeight);
|
|
textarea.setMaxHeight(0);
|
|
assertTrue('After setting maxHeight to 0, offsetHeight should now ' +
|
|
'be > 50', textarea.getElement().offsetHeight > 50);
|
|
}
|
|
|
|
function testMaxHeight_canShrink() {
|
|
textarea.render(sandbox);
|
|
textarea.setMaxHeight(50);
|
|
assertTrue('Initial offsetHeight should be less than 50',
|
|
textarea.getElement().offsetHeight < 50);
|
|
var newContent = 'Lorem ipsum dolor sit amet, consectetuer adipiscing ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.';
|
|
textarea.setContent(newContent);
|
|
|
|
assertEquals('Even with lots of content, offsetHeight should be 50 ' +
|
|
'with maxHeight set', 50, textarea.getElement().offsetHeight);
|
|
textarea.setContent('');
|
|
assertTrue('With no content, offsetHeight should be back to < 50',
|
|
textarea.getElement().offsetHeight < 50);
|
|
}
|
|
|
|
function testSetPlaceholder() {
|
|
textarea.setPlaceholder('Some default text here.');
|
|
textarea.setPlaceholder('new default text...');
|
|
textarea.render(sandbox);
|
|
if (textarea.supportsNativePlaceholder_()) {
|
|
assertEquals('new default text...', textarea.getElement().placeholder);
|
|
}
|
|
assertEquals('', textarea.getValue());
|
|
textarea.setValue('some value');
|
|
assertEquals('some value', textarea.getValue());
|
|
// ensure setting a new placeholder doesn't replace the value.
|
|
textarea.setPlaceholder('some new placeholder');
|
|
assertEquals('some value', textarea.getValue());
|
|
}
|
|
|
|
function testSetPlaceholderForInitialContent() {
|
|
var testTextarea = new goog.ui.Textarea('initial content');
|
|
testTextarea.render(sandbox);
|
|
assertEquals('initial content', testTextarea.getValue());
|
|
testTextarea.setPlaceholder('new default text...');
|
|
assertEquals('initial content', testTextarea.getValue());
|
|
testTextarea.setValue('new content');
|
|
assertEquals('new content', testTextarea.getValue());
|
|
testTextarea.setValue('');
|
|
assertEquals('', testTextarea.getValue());
|
|
if (!testTextarea.supportsNativePlaceholder_()) {
|
|
// Pretend we leave the textarea. When that happens, the
|
|
// placeholder text should appear.
|
|
assertEquals('', testTextarea.getElement().value);
|
|
testTextarea.blur_();
|
|
assertEquals('new default text...', testTextarea.getElement().value);
|
|
}
|
|
}
|
|
|
|
function testMinAndMaxHeight() {
|
|
textarea.render(sandbox);
|
|
textarea.setMinHeight(50);
|
|
textarea.setMaxHeight(150);
|
|
assertEquals('offsetHeight should be 50 initially', 50,
|
|
textarea.getElement().offsetHeight);
|
|
|
|
textarea.setContent('Lorem ipsum dolor sit amet, consectetuer ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.');
|
|
|
|
var height = textarea.getHeight_();
|
|
// For some reason Mac Safari 3 has 136 and Linux FF has 146 here.
|
|
expectedFailures.expectFailureFor(isMacSafari3() || isLinuxFirefox());
|
|
try {
|
|
assertTrue('With lots of content, getHeight_() should be > 150 ' +
|
|
'(it is ' + height + ')', height > 150);
|
|
assertEquals('Even with lots of content, offsetHeight should be 150 ' +
|
|
'with maxHeight set', 150,
|
|
textarea.getElement().offsetHeight);
|
|
|
|
textarea.setMaxHeight(0);
|
|
assertTrue('After setting maxHeight to 0, offsetHeight should now ' +
|
|
'be > 150 (it is ' + textarea.getElement().offsetHeight + ')',
|
|
textarea.getElement().offsetHeight > 150);
|
|
|
|
textarea.setContent('');
|
|
textarea.setMinHeight(0);
|
|
assertTrue('After setting minHeight to 0, with no contents, ' +
|
|
'offsetHeight should now be < 50',
|
|
textarea.getElement().offsetHeight < 50);
|
|
} catch (e) {
|
|
expectedFailures.handleException(e);
|
|
}
|
|
}
|
|
|
|
function testSetValueWhenInvisible() {
|
|
textarea.render(sandbox);
|
|
var content = 'Lorem ipsum dolor sit amet, consectetuer ' +
|
|
'elit. Aenean sollicitudin ultrices urna. Proin vehicula mauris ac ' +
|
|
'est. Ut scelerisque, risus ut facilisis dictum, est massa lacinia ' +
|
|
'lorem, in fermentum purus ligula quis nunc.';
|
|
textarea.setValue(content);
|
|
var height = textarea.getHeight_();
|
|
var elementHeight = goog.style.getStyle(textarea.getElement(), 'height');
|
|
assertEquals(height + 'px', elementHeight);
|
|
|
|
// Hide the element, height_ should be invalidate when setValue().
|
|
goog.style.setElementShown(textarea.getElement(), false);
|
|
textarea.setValue(content);
|
|
|
|
// Show the element again.
|
|
goog.style.setElementShown(textarea.getElement(), true);
|
|
textarea.setValue(content);
|
|
height = textarea.getHeight_();
|
|
elementHeight = goog.style.getStyle(textarea.getElement(), 'height');
|
|
assertEquals(height + 'px', elementHeight);
|
|
}
|
|
|
|
function testSetAriaLabel() {
|
|
assertNull('Textarea must not have aria label by default',
|
|
textarea.getAriaLabel());
|
|
textarea.setAriaLabel('My textarea');
|
|
textarea.render(sandbox);
|
|
var element = textarea.getElementStrict();
|
|
assertNotNull('Element must not be null', element);
|
|
assertEquals('Item element must have expected aria-label', 'My textarea',
|
|
element.getAttribute('aria-label'));
|
|
textarea.setAriaLabel('My new textarea');
|
|
assertEquals('Item element must have updated aria-label', 'My new textarea',
|
|
element.getAttribute('aria-label'));
|
|
}
|