84 lines
4.0 KiB
JavaScript
84 lines
4.0 KiB
JavaScript
|
/** @odoo-module **/
|
||
|
import weUtils from '@web_editor/js/common/utils';
|
||
|
|
||
|
QUnit.module('web_editor', {}, function () {
|
||
|
QUnit.module('utils', {}, function () {
|
||
|
QUnit.module('Utils functions');
|
||
|
// Test weUtils
|
||
|
|
||
|
QUnit.test('compare CSS property values', async function (assert) {
|
||
|
assert.expect(86);
|
||
|
|
||
|
let $div = $(`<div>abc</div>`);
|
||
|
let currentProperty = 'font-size';
|
||
|
function compare(expected, value1, value2, property = currentProperty, $target = $div) {
|
||
|
// Comparisons are done in both directions if values are different.
|
||
|
assert.strictEqual(weUtils.areCssValuesEqual(value1, value2, property, $target), expected,
|
||
|
`'${value1}' should be ${expected ? 'equal to' : 'different from'} '${value2}'`
|
||
|
);
|
||
|
if (value1 !== value2) {
|
||
|
assert.strictEqual(weUtils.areCssValuesEqual(value2, value1, property, $target), expected,
|
||
|
`'${value2}' should be ${expected ? 'equal to' : 'different from'} '${value1}'`
|
||
|
);
|
||
|
}
|
||
|
}
|
||
|
compare(true, '', '');
|
||
|
compare(true, 'auto', 'auto');
|
||
|
compare(true, '', 'auto');
|
||
|
compare(true, '15px', '15px');
|
||
|
compare(true, '15.0px', '15px');
|
||
|
compare(true, '15 px', '15px');
|
||
|
compare(false, '15px', '25px');
|
||
|
compare(false, '15px', '');
|
||
|
compare(false, '15px', 'auto');
|
||
|
compare(true, '15px', '1.5e+1px');
|
||
|
compare(true, '15px', '1.5e1px');
|
||
|
compare(true, '15px', '150e-1px');
|
||
|
|
||
|
currentProperty = 'background-size';
|
||
|
compare(true, '', '');
|
||
|
compare(true, 'auto', 'auto');
|
||
|
compare(true, '', 'auto');
|
||
|
compare(true, '15px', '15px');
|
||
|
compare(true, '15.0px', '15px');
|
||
|
compare(false, '15px', '25px');
|
||
|
compare(false, '15px', '');
|
||
|
compare(false, '15px', 'auto');
|
||
|
compare(true, '', 'auto auto');
|
||
|
compare(true, 'auto', 'auto auto');
|
||
|
compare(true, 'auto auto', 'auto auto');
|
||
|
compare(true, '15px 15px', '15px 15px');
|
||
|
compare(false, '15px 25px', '15px 15px');
|
||
|
compare(false, '25px 15px', '15px 15px');
|
||
|
compare(true, 'auto 15px', 'auto 15px');
|
||
|
compare(true, '15px auto', '15px auto');
|
||
|
compare(true, '15px', '15px auto');
|
||
|
compare(false, 'auto 25px', 'auto 15px');
|
||
|
compare(false, '25px auto', '15px auto');
|
||
|
compare(false, '25px', '15px auto');
|
||
|
compare(true, '15px 15px', '1.5e+1px 1.5e+1px');
|
||
|
compare(true, '15px 15px', '1.5e1px 1.5e1px');
|
||
|
compare(true, '15px 15px', '150e-1px 150e-1px');
|
||
|
|
||
|
currentProperty = 'color';
|
||
|
compare(true, '', '');
|
||
|
compare(false, '', '#123456');
|
||
|
compare(true, '#123456', '#123456');
|
||
|
compare(false, '#123456', '#654321');
|
||
|
compare(true, 'rgb(255, 0, 0)', '#FF0000');
|
||
|
compare(false, 'rgb(255, 0, 0)', '#EE0000');
|
||
|
|
||
|
currentProperty = 'background-image';
|
||
|
compare(true, '', '');
|
||
|
compare(false, '', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(true, 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(false, 'linear-gradient(0deg, rgb(10, 0, 0) 0%, rgb(1, 1, 1) 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(false, 'linear-gradient(10deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(false, 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(10, 1, 1) 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(false, 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(9, 9, 9) 50%, rgb(1, 1, 1) 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(true, 'linear-gradient(0deg, #000000 0%, #010101 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
compare(false, 'linear-gradient(0deg, #FF0000 0%, #010101 100%)', 'linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(1, 1, 1) 100%)');
|
||
|
});
|
||
|
});
|
||
|
});
|