Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement CSS3 Calc #7185

Closed
wants to merge 20 commits into from
Closed
Changes from 1 commit
Commits
File filter...
Filter file types
Jump to…
Jump to file
Failed to load files.

Always

Just for now

Add calc parsing tests for the other properties

  • Loading branch information
dzbarsky committed Sep 2, 2015
commit f40f1ee2e8617e9ec086c063051eac43a093a347
@@ -6,3 +6,123 @@
[calc(0px + 0pt + 0pc + 0in + 0cm + 0mm + 0rem + 0em + 0ex + 0% + 0vw + 0vh + 0vmin + 0vmax)]
expected: FAIL

[calc for border-width]
expected: FAIL

[calc for border-top-width]
expected: FAIL

[calc for border-left-width]
expected: FAIL

[calc for border-right-width]
expected: FAIL

[calc for border-bottom-width]
expected: FAIL

[calc for outline-width]
expected: FAIL

[calc for outline-offset]
expected: FAIL

[calc for letter-spacing]
expected: FAIL

[calc for word-spacing]
expected: FAIL

[calc for border-spacing]
expected: FAIL

[calc for column-width]
expected: FAIL

[calc for column-gap]
expected: FAIL

[calc for perspective]
expected: FAIL

[calc for border-top-left-radius]
expected: FAIL

[calc for border-bottom-left-radius]
expected: FAIL

[calc for border-top-right-radius]
expected: FAIL

[calc for border-bottom-right-radius]
expected: FAIL

[calc for top]
expected: FAIL

[calc for left]
expected: FAIL

[calc for bottom]
expected: FAIL

[calc for right]
expected: FAIL

[calc for width]
expected: FAIL

[calc for height]
expected: FAIL

[calc for min-width]
expected: FAIL

[calc for min-height]
expected: FAIL

[calc for max-width]
expected: FAIL

[calc for max-height]
expected: FAIL

[calc for line-height]
expected: FAIL

[calc for vertical-align]
expected: FAIL

[calc for background-position]
expected: FAIL

[calc for background-size]
expected: FAIL

[calc for font-size]
expected: FAIL

[calc for text-indent]
expected: FAIL

[calc for transform-origin]
expected: FAIL

[calc for perspective-origin]
expected: FAIL

[calc for transition-delay]
expected: FAIL

[calc for z-index]
expected: FAIL

[calc for column-count]
expected: FAIL

[calc for opacity]
expected: FAIL

[calc for transition-duration]
expected: FAIL

@@ -57,6 +57,97 @@
assert_equals(window.getComputedStyle(div).getPropertyValue('width'), item[2]);
}, item[0]);
});

var lengthProperties = [
'border-width',
'border-top-width',
'border-left-width',
'border-right-width',
'border-bottom-width',
'outline-width',
'outline-offset',
'letter-spacing',
'word-spacing',
'border-spacing',
'column-width',
'column-gap',
'perspective',
];

lengthProperties.forEach(function(prop) {
test(function() {
div.style.setProperty(prop, 'calc(1px)');
assert_equals(div.style.getPropertyValue(prop), '1px');
assert_equals(window.getComputedStyle(div).getPropertyValue(prop), '1px');
}, 'calc for ' + prop);
});

var lengthOrPercentageProperties = [
'border-top-left-radius',
'border-bottom-left-radius',
'border-top-right-radius',
'border-bottom-right-radius',
'top',
'left',
'bottom',
'right',
'width',
'height',
'min-width',
'min-height',
'max-width',
'max-height',
'line-height',
'vertical-align',
'background-position',
'background-size',
'font-size',
'text-indent',
'transform-origin',
'perspective-origin',
];

lengthOrPercentageProperties.forEach(function(prop) {
test(function() {
div.style.setProperty(prop, 'calc(1px + 0%)');
assert_equals(div.style.getPropertyValue(prop), 'calc(1px + 0%)');
assert_equals(window.getComputedStyle(div).getPropertyValue(prop), '1px');
}, 'calc for ' + prop);
});

var timeProperties = [
'transition-delay',
];

timeProperties.forEach(function(prop) {
test(function() {
div.style.setProperty(prop, 'calc(1s)');
assert_equals(div.style.getPropertyValue(prop), '1s');
assert_equals(window.getComputedStyle(div).getPropertyValue(prop), '1s');
}, 'calc for ' + prop);
});

var numberProperties = [
'z-index',
'column-count',
'opacity',
'transition-duration',
];

numberProperties.forEach(function(prop) {
test(function() {
div.style.setProperty(prop, 'calc(1)');
assert_equals(div.style.getPropertyValue(prop), '1');
assert_equals(window.getComputedStyle(div).getPropertyValue(prop), '1');
}, 'calc for ' + prop);
});


/* TODO: test these:
counter-increment, counter-reset,
color, box-shadow, clip, text-shadow, transform
transition-timing-function
*/
</script>
</head>
</html>
ProTip! Use n and p to navigate between commits in a pull request.
You can’t perform that action at this time.