зеркало из https://github.com/mozilla/gecko-dev.git
Bug 959973 - Add tests for using variables in external style sheets. r=heycam
This commit is contained in:
Родитель
62b7295d4b
Коммит
44f55a7b5f
|
@ -59,6 +59,10 @@ default-preferences pref(layout.css.variables.enabled,true)
|
|||
== variable-declaration-58.html support/color-green-ref.html
|
||||
== variable-declaration-59.html support/color-green-ref.html
|
||||
== variable-declaration-60.html support/color-green-ref.html
|
||||
== variable-external-declaration-01.html support/color-green-ref.html
|
||||
== variable-external-font-face-01.html variable-font-face-01-ref.html
|
||||
== variable-external-reference-01.html support/color-green-ref.html
|
||||
== variable-external-supports-01.html support/color-green-ref.html
|
||||
== variable-font-face-01.html variable-font-face-01-ref.html
|
||||
== variable-font-face-02.html variable-font-face-02-ref.html
|
||||
== variable-reference-01.html support/color-green-ref.html
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
p {
|
||||
color: red;
|
||||
var-a: green;
|
||||
color: var(a);
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
@font-face {
|
||||
var-a: MyTestFontName;
|
||||
font-family: var(a);
|
||||
src: url(../../../../fonts/Ahem.ttf);
|
||||
}
|
||||
@font-face {
|
||||
font-family: MyTestFontName2;
|
||||
src: url(../../../../fonts/Ahem.ttf);
|
||||
}
|
||||
#a {
|
||||
font-family: MyTestFontName;
|
||||
}
|
||||
#b {
|
||||
font-family: MyTestFontName2;
|
||||
}
|
|
@ -0,0 +1,6 @@
|
|||
:root {
|
||||
var-a: green;
|
||||
}
|
||||
p {
|
||||
color: var(a);
|
||||
}
|
|
@ -0,0 +1,4 @@
|
|||
body { color: red; }
|
||||
@supports (color:var(a)) {
|
||||
p { color: green; }
|
||||
}
|
|
@ -0,0 +1,12 @@
|
|||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<title>CSS Test: Test declaring a variable in an external CSS file.</title>
|
||||
<link rel="author" title="Mihaela Velimiroviciu" href="mailto:mihaela.velimiroviciu@softvisioninc.eu">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-variables-1/#syntax">
|
||||
<link rel="match" href="support/color-green-ref.html">
|
||||
<link rel="stylesheet" type="text/css" href="support/external-variable-declaration.css">
|
||||
|
||||
<p>This text must be green.</p>
|
|
@ -0,0 +1,13 @@
|
|||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<title>CSS Test: Test the invalid declaration and use of a variable in an @font-face rule within an external CSS.</title>
|
||||
<link rel="author" title="Mihaela Velimiroviciu" href="mailto:mihaela.velimiroviciu@softvisioninc.eu">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-variables-1/#defining-variables">
|
||||
<link rel="match" href="variable-font-face-01-ref.html">
|
||||
<link rel="stylesheet" type="text/css" href="support/external-variable-font-face.css">
|
||||
<meta name="flags" content="ahem">
|
||||
<p id=a>This text must not be in Ahem.</p>
|
||||
<p id=b>But this text must be in Ahem.</p>
|
|
@ -0,0 +1,12 @@
|
|||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<title>CSS Test: Test the use of a variable in a non-custom property where the variable value is inherited within an external CSS.</title>
|
||||
<link rel="author" title="Mihaela Velimiroviciu" href="mailto:mihaela.velimiroviciu@softvisioninc.eu">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-variables-1/#using-variables">
|
||||
<link rel="stylesheet" type="text/css" href="support/external-variable-reference.css">
|
||||
<link rel="match" href="support/color-green-ref.html">
|
||||
|
||||
<p>This text must be green.</p>
|
|
@ -0,0 +1,12 @@
|
|||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<title>CSS Test: Test a passing non-custom property declaration in an @supports rule where the property value contains a variable reference within an external stylesheet file.</title>
|
||||
<link rel="author" title="Mihaela Velimiroviciu" href="mailto:mihaela.velimiroviciu@softvisioninc.eu">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-variables-1/#using-variables">
|
||||
<link rel="stylesheet" type="text/css" href="support/external-variable-supports.css">
|
||||
<link rel="match" href="support/color-green-ref.html">
|
||||
|
||||
<p>This text must be green.</p>
|
|
@ -29,6 +29,7 @@ ifdef COMPILE_ENVIRONMENT
|
|||
MOCHITEST_FILES += \
|
||||
test_property_database.html \
|
||||
css_properties.js \
|
||||
support/external-variable-url.css \
|
||||
$(NULL)
|
||||
|
||||
css_properties.js: host_ListCSSProperties$(HOST_BIN_SUFFIX) css_properties_like_longhand.js Makefile
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
<script src="/MochiKit/MochiKit.js"></script>
|
||||
<script src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css">
|
||||
<link rel="stylesheet" href="external-variable-url.css" type="text/css">
|
||||
|
||||
<style id="test1">
|
||||
p { var-a:123!important; }
|
||||
|
@ -16,6 +17,8 @@ p { var-a: a !important; }
|
|||
p { border-left-style: inset; padding: 1px; var-decoration: line-through; }
|
||||
</style>
|
||||
|
||||
<div id="t4"></div>
|
||||
|
||||
<script>
|
||||
var tests = [
|
||||
function() {
|
||||
|
@ -37,6 +40,16 @@ var tests = [
|
|||
var declaration = document.getElementById("test3").sheet.cssRules[0].style;
|
||||
is(declaration[declaration.length - 1], "var-decoration");
|
||||
},
|
||||
|
||||
function() {
|
||||
// https://bugzilla.mozilla.org/show_bug.cgi?id=959973
|
||||
var element = document.getElementById("t4");
|
||||
var path = window.location.pathname;
|
||||
var currentDir = path.substring(0, path.lastIndexOf('/'));
|
||||
var imageURL = "http://mochi.test:8888" + currentDir + "/image.png";
|
||||
|
||||
is(window.getComputedStyle(element).getPropertyValue("background-image"), "url(\"" + imageURL +"\")");
|
||||
},
|
||||
];
|
||||
|
||||
tests.forEach(function(fn) { fn(); });
|
||||
|
|
Загрузка…
Ссылка в новой задаче