1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
|
odoo.define('web.dom_tests', function (require) {
"use strict";
var dom = require('web.dom');
var testUtils = require('web.test_utils');
/**
* Create an autoresize text area with 'border-box' as box sizing rule.
* The minimum height of this autoresize text are is 1px.
*
* @param {Object} [options={}]
* @param {integer} [options.borderBottomWidth=0]
* @param {integer} [options.borderTopWidth=0]
* @param {integer} [options.padding=0]
*/
function prepareAutoresizeTextArea(options) {
options = options || {};
var $textarea = $('<textarea>');
$textarea.css('box-sizing', 'border-box');
$textarea.css({
padding: options.padding || 0,
borderTopWidth: options.borderTopWidth || 0,
borderBottomWidth: options.borderBottomWidth || 0,
});
$textarea.appendTo($('#qunit-fixture'));
dom.autoresize($textarea, { min_height: 1 });
return $textarea;
}
QUnit.module('core', {}, function () {
QUnit.module('dom', {}, function () {
QUnit.module('autoresize', {
afterEach: function () {
$('#qunit-fixture').find('textarea').remove();
},
});
QUnit.test('autoresize (border-box): no padding + no border', function (assert) {
assert.expect(3);
var $textarea = prepareAutoresizeTextArea();
assert.strictEqual($('textarea').length, 2,
"there should be two textareas in the DOM");
$textarea = $('textarea:eq(0)');
var $fixedTextarea = $('textarea:eq(1)');
assert.strictEqual($textarea.css('height'),
$fixedTextarea[0].scrollHeight + 'px',
"autoresized textarea should have height of fixed textarea + padding (0 line)");
testUtils.fields.editInput($textarea, 'a\nb\nc\nd');
assert.strictEqual($textarea.css('height'),
$fixedTextarea[0].scrollHeight + 'px',
"autoresized textarea should have height of fixed textarea + padding (4 lines)");
});
QUnit.test('autoresize (border-box): padding + no border', function (assert) {
assert.expect(3);
var $textarea = prepareAutoresizeTextArea({ padding: 10 });
assert.strictEqual($('textarea').length, 2,
"there should be two textareas in the DOM");
$textarea = $('textarea:eq(0)');
var $fixedTextarea = $('textarea:eq(1)');
// twice the padding of 10px
var expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + 2*10;
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + padding (0 line)");
testUtils.fields.editInput($textarea, 'a\nb\nc\nd');
// twice the padding of 10px
expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + 2*10;
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + padding (4 lines)");
});
QUnit.test('autoresize (border-box): no padding + border', function (assert) {
assert.expect(3);
var $textarea = prepareAutoresizeTextArea({
borderTopWidth: 2,
borderBottomWidth: 3,
});
assert.strictEqual($('textarea').length, 2,
"there should be two textareas in the DOM");
$textarea = $('textarea:eq(0)');
var $fixedTextarea = $('textarea:eq(1)');
// top (2px) + bottom (3px) borders
var expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + (2 + 3);
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + border (0 line)");
testUtils.fields.editInput($textarea, 'a\nb\nc\nd');
// top (2px) + bottom (3px) borders
expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + (2 + 3);
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + border (4 lines)");
});
QUnit.test('autoresize (border-box): padding + border', function (assert) {
assert.expect(3);
var $textarea = prepareAutoresizeTextArea({
padding: 10,
borderTopWidth: 2,
borderBottomWidth: 3,
});
assert.strictEqual($('textarea').length, 2,
"there should be two textareas in the DOM");
$textarea = $('textarea:eq(0)');
var $fixedTextarea = $('textarea:eq(1)');
// twice padding (10px) + top (2px) + bottom (3px) borders
var expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + (2*10 + 2 + 3);
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + border (0 line)");
testUtils.fields.editInput($textarea, 'a\nb\nc\nd');
// twice padding (10px) + top (2px) + bottom (3px) borders
expectedTextAreaHeight = $fixedTextarea[0].scrollHeight + (2*10 + 2 + 3);
assert.strictEqual($textarea.css('height'),
expectedTextAreaHeight + 'px',
"autoresized textarea should have height of fixed textarea + border (4 lines)");
});
});
});
});
|