зеркало из https://github.com/mozilla/gecko-dev.git
Add reftest harness for testing font inflation and add reftests for basic features. (Bug 627842, patch 16) r=roc
This commit is contained in:
L. David Baron
Родитель
898646a90e
Коммит
5a555c1957
|
|
@ -180,6 +180,7 @@ _TEST_FILES = \
|
|||
test_bug603550.html \
|
||||
test_bug629838.html \
|
||||
test_bug646757.html \
|
||||
test_font_inflation_reftests.html \
|
||||
$(NULL)
|
||||
|
||||
# Tests for bugs 441782, 467672 and 570378 don't pass reliably on Windows, because of bug 469208
|
||||
|
|
@ -377,10 +378,16 @@ _BROWSER_FILES = \
|
|||
browser_bug617076.js \
|
||||
$(NULL)
|
||||
|
||||
_INFLATION_REFTEST_FILES = \
|
||||
$(shell find $(srcdir)/font-inflation/ -name '*.html' -o -name '*.xhtml') \
|
||||
$(NULL)
|
||||
|
||||
libs:: $(_TEST_FILES)
|
||||
$(INSTALL) $(foreach f,$^,"$f") $(DEPTH)/_tests/testing/mochitest/tests/$(relativesrcdir)
|
||||
libs:: $(_BROWSER_FILES)
|
||||
$(INSTALL) $(foreach f,$^,"$f") $(DEPTH)/_tests/testing/mochitest/browser/$(relativesrcdir)
|
||||
libs:: $(_INFLATION_REFTEST_FILES)
|
||||
$(INSTALL) $(foreach f,$^,"$f") $(DEPTH)/_tests/testing/mochitest/tests/$(relativesrcdir)/font-inflation/
|
||||
|
||||
check::
|
||||
@$(EXIT_ON_ERROR) \
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
ul, li { line-height: 1.0; font-size: 35px; }
|
||||
ul { width: 500px; margin: 0; padding: 0 }
|
||||
li { margin: 0 0 0 50px; padding: 0 }
|
||||
</style>
|
||||
<ul>
|
||||
<li>item</li>
|
||||
</ul>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
ul, li { line-height: 1.0; font-size: 15px; }
|
||||
ul { width: 500px; margin: 0; padding: 0 }
|
||||
li { margin: 0 0 0 50px; padding: 0 }
|
||||
</style>
|
||||
<ul>
|
||||
<li>item</li>
|
||||
</ul>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
ol, li { line-height: 1.0; font-size: 35px; }
|
||||
ol { width: 500px; margin: 0; padding: 0 }
|
||||
li { margin: 0 0 0 50px; padding: 0 }
|
||||
</style>
|
||||
<ol>
|
||||
<li>item</li>
|
||||
</ol>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
ol, li { line-height: 1.0; font-size: 15px; }
|
||||
ol { width: 500px; margin: 0; padding: 0 }
|
||||
li { margin: 0 0 0 50px; padding: 0 }
|
||||
</style>
|
||||
<ol>
|
||||
<li>item</li>
|
||||
</ol>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; width: 150px; line-height: 1.0; white-space: nowrap }
|
||||
span { -moz-transform-origin: 0 0; -moz-transform: scale(1.2); }
|
||||
</style>
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; width: 450px; line-height: 1.0 }
|
||||
span { -moz-transform-origin: 0 0; -moz-transform: scale(1.2); }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; width: 150px; line-height: 1.0; white-space: nowrap }
|
||||
p { -moz-transform-origin: 0 0; margin: 0; -moz-transform: scale(1.2); }
|
||||
</style>
|
||||
<div><p>Hello world</p></div>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; width: 450px; line-height: 1.0 }
|
||||
p { -moz-transform-origin: 0 0; margin: 0; -moz-transform: scale(1.2); }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><p>Hello world</p></div>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
span { font-size: 36px }
|
||||
div { text-decoration: underline overline line-through }
|
||||
</style>
|
||||
<div>Hello <span>world</span></div>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
span { font-size: 18px }
|
||||
div { text-decoration: underline overline line-through }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px
|
||||
and 18px gets mapped to 36px.
|
||||
-->
|
||||
<div>Hello <span>world</span></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 34px; width: 200px }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world"></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 12px; width: 200px }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world"></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 34px; }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world" size="15"></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 12px; }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world" size="15"></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 34px; }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world"></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
input { font-size: 12px; }
|
||||
input { height: 50px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><input type="text" value="Hello world"></div>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 34px; width: 450px }
|
||||
</style>
|
||||
<div>Hello world</div>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 12px; width: 450px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div>Hello world</div>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
</style>
|
||||
<div>Hello world</div>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div>Hello world</div>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
span { background: aqua }
|
||||
div { font-size: 34px; width: 450px }
|
||||
</style>
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
span { background: aqua }
|
||||
div { font-size: 12px; width: 450px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
span { background: aqua }
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
</style>
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { background: yellow }
|
||||
span { background: aqua }
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><span>Hello world</span></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 34px; width: 200px; height: 50px }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea>Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 12px; width: 200px; height: 50px }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea>Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 34px; }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea rows="4" cols="25">Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 12px; }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea rows="4" cols="25">Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 34px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 34px; }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea>Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<style>
|
||||
div { font-size: 12px; line-height: 1.0; width: 450px }
|
||||
textarea { font-size: 12px; }
|
||||
textarea { line-height: 1.0 }
|
||||
</style>
|
||||
<!--
|
||||
In a 450px container, the minimum font size at 15em per line is 30px.
|
||||
This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px.
|
||||
-->
|
||||
<div><textarea>Hello world</textarea></div>
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<!--
|
||||
https://bugzilla.mozilla.org/show_bug.cgi?id=627842
|
||||
-->
|
||||
<head>
|
||||
<title>Font size inflation reftests</title>
|
||||
<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<script type="application/javascript" src="/tests/SimpleTest/WindowSnapshot.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
|
||||
<style type="text/css">
|
||||
canvas { border: 1px solid green }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=627842">Mozilla Bug 627842</a>
|
||||
<pre id="test">
|
||||
<script type="application/javascript; version=1.7">
|
||||
|
||||
/** Test for font size inflation **/
|
||||
|
||||
var gTests = [
|
||||
// IMPORTANT NOTE: For these tests, the test and reference are not
|
||||
// snapshotted in the same way. The REFERENCE (second file) is
|
||||
// snapshotted with no unusual pref settings, whereas the TEST (first
|
||||
// file) has font inflation set to 15 em per line.
|
||||
|
||||
|
||||
// FIXME (maybe): Commented out due to rounding differences between
|
||||
// inflating the 'normal' line height of a smaller font and using the
|
||||
// normal line height of the inflated font.
|
||||
//"== text-1.html text-1-ref.html",
|
||||
"== text-2.html text-2-ref.html",
|
||||
// FIXME (maybe): same as text-1.
|
||||
//"== text-3.html text-3-ref.html",
|
||||
"== text-4.html text-4-ref.html",
|
||||
"== decoration-1.html decoration-1-ref.html",
|
||||
"== bullet-1.html bullet-1-ref.html",
|
||||
"== bullet-2.html bullet-2-ref.html",
|
||||
"== input-text-1.html input-text-1-ref.html",
|
||||
"== input-text-2.html input-text-2-ref.html",
|
||||
"== input-text-3.html input-text-3-ref.html",
|
||||
"== textarea-1.html textarea-1-ref.html",
|
||||
"== textarea-2.html textarea-2-ref.html",
|
||||
"== textarea-3.html textarea-3-ref.html",
|
||||
"== css-transform-1.html css-transform-1-ref.html",
|
||||
"== css-transform-2.html css-transform-2-ref.html",
|
||||
];
|
||||
|
||||
// Maintain a reference count of how many things we're waiting for until
|
||||
// we can say the tests are done.
|
||||
var gDelayCount = 0;
|
||||
function AddFinishDependency()
|
||||
{ ++gDelayCount; }
|
||||
function RemoveFinishDependency()
|
||||
{ if (--gDelayCount == 0) nextPhase(); }
|
||||
|
||||
function takeSnapshot(iframe_element)
|
||||
{
|
||||
return snapshotWindow(iframe_element.contentWindow, false);
|
||||
}
|
||||
|
||||
function startIframe(url)
|
||||
{
|
||||
AddFinishDependency();
|
||||
var element = document.createElement("iframe");
|
||||
element.addEventListener("load", handleLoad, false);
|
||||
// smaller than normal reftests, but enough for these
|
||||
element.setAttribute("style", "width: 600px; height: 100px");
|
||||
element.src = "font-inflation/" + url;
|
||||
document.body.appendChild(element);
|
||||
function handleLoad(event)
|
||||
{
|
||||
RemoveFinishDependency();
|
||||
}
|
||||
return element;
|
||||
}
|
||||
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
var gPhase = 0;
|
||||
|
||||
function nextPhase() {
|
||||
switch (gPhase) {
|
||||
case 0:
|
||||
SpecialPowers.setIntPref("font.size.inflation.emPerLine", 15);
|
||||
for (var i = 0; i < gTests.length; ++i) {
|
||||
let splitData = gTests[i].split(" ");
|
||||
let testData =
|
||||
{ op: splitData[0], test: splitData[1], reference: splitData[2] };
|
||||
gTests[i] = testData;
|
||||
testData.testframe = startIframe(testData.test);
|
||||
}
|
||||
break;
|
||||
case 1:
|
||||
for (var i = 0; i < gTests.length; ++i) {
|
||||
var testData = gTests[i];
|
||||
testData.testshot = takeSnapshot(testData.testframe);
|
||||
testData.testframe.parentNode.removeChild(testData.testframe);
|
||||
}
|
||||
SpecialPowers.setIntPref("font.size.inflation.emPerLine", 0);
|
||||
for (var i = 0; i < gTests.length; ++i) {
|
||||
var testData = gTests[i];
|
||||
testData.refframe = startIframe(testData.reference);
|
||||
}
|
||||
break;
|
||||
case 2:
|
||||
for (var i = 0; i < gTests.length; ++i) {
|
||||
var testData = gTests[i];
|
||||
testData.refshot = takeSnapshot(testData.refframe);
|
||||
testData.refframe.parentNode.removeChild(testData.refframe);
|
||||
assertSnapshots(testData.testshot, testData.refshot,
|
||||
testData.op == "==",
|
||||
testData.test, testData.reference);
|
||||
}
|
||||
SimpleTest.finish();
|
||||
return;
|
||||
}
|
||||
++gPhase;
|
||||
}
|
||||
|
||||
nextPhase();
|
||||
|
||||
</script>
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -45,3 +45,19 @@ function compareSnapshots(s1, s2, expected) {
|
|||
|
||||
return [correct, s1Str, s2Str];
|
||||
}
|
||||
|
||||
function assertSnapshots(s1, s2, expected, s1name, s2name) {
|
||||
var [correct, s1Str, s2Str] = compareSnapshots(s1, s2, expected);
|
||||
var sym = expected ? "==" : "!=";
|
||||
ok(correct, "reftest comparison: " + sym + " " + s1name + " " + s2name);
|
||||
if (!correct) {
|
||||
var report = "REFTEST TEST-UNEXPECTED-FAIL | " + s1name + " | image comparison (" + sym + ")\n";
|
||||
if (expected) {
|
||||
report += "REFTEST IMAGE 1 (TEST): " + s1Str + "\n";
|
||||
report += "REFTEST IMAGE 2 (REFERENCE): " + s2Str + "\n";
|
||||
} else {
|
||||
report += "REFTEST IMAGE: " + s1Str + "\n";
|
||||
}
|
||||
dump(report);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче