Bug 621351 - Test that border widths and colors set by logical border shorthands can be transitioned. r=dbaron
authorCameron McCormack <cam@mcc.id.au>
Wed, 28 Jan 2015 14:41:31 +1100
changeset 239549 56011c2c814c515023ac071d83a5ab6d93340c67
parent 239548 47de36ef3ab4527f24c53d21dc6d516c26bf472f
child 239550 cad25450eff5dec73395b194b05d21ca27dc7344
push id500
push userjoshua.m.grant@gmail.com
push dateThu, 29 Jan 2015 01:48:36 +0000
reviewersdbaron
bugs621351
milestone38.0a1
Bug 621351 - Test that border widths and colors set by logical border shorthands can be transitioned. r=dbaron
layout/style/test/mochitest.ini
layout/style/test/test_bug621351.html
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@@ -83,16 +83,17 @@ support-files = bug453896_iframe.html
 [test_bug499655.xhtml]
 [test_bug511909.html]
 [test_bug517224.html]
 support-files = bug517224.sjs
 [test_bug524175.html]
 [test_bug534804.html]
 [test_bug573255.html]
 [test_bug580685.html]
+[test_bug621351.html]
 [test_bug635286.html]
 [test_bug652486.html]
 [test_bug657143.html]
 [test_bug664955.html]
 [test_bug667520.html]
 [test_bug645998.html]
 support-files = file_bug645998-1.css file_bug645998-2.css
 [test_bug716226.html]
new file mode 100644
--- /dev/null
+++ b/layout/style/test/test_bug621351.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang=en>
+<title>Test for Bug 160403</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css">
+<span></span>
+<style>
+span {
+  -moz-border-start: 0px solid rgb(0, 0, 0);
+  -moz-border-end: 0px solid rgb(0, 0, 0);
+  transition: border 100s linear -50s;
+}
+span.transitioned {
+  -moz-border-start: 100px solid rgb(100, 100, 100);
+  -moz-border-end: 10px solid rgb(10, 10, 10);
+}
+</style>
+<script>
+// Test that transitioning each of border-{left,right}-{color,width}
+// works when the values are set through the -moz-border-{start,end}
+// shorthands.
+
+var e = document.querySelector("span");
+var cs = getComputedStyle(e);
+is(cs.borderLeftColor, "rgb(0, 0, 0)", "value of border-left-color before transition");
+is(cs.borderLeftWidth, "0px", "value of border-left-width before transition");
+is(cs.borderRightColor, "rgb(0, 0, 0)", "value of border-right-color before transition");
+is(cs.borderRightWidth, "0px", "value of border-right-width before transition");
+e.className = "transitioned";
+is(cs.borderLeftWidth, "50px", "value of border-left-width during transition");
+is(cs.borderLeftColor, "rgb(50, 50, 50)", "value of border-left-color during transition");
+is(cs.borderRightWidth, "5px", "value of border-right-width during transition");
+is(cs.borderRightColor, "rgb(5, 5, 5)", "value of border-right-color during transition");
+e.remove();
+</script>