mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-12-01 08:42:13 +00:00
Bug 778654 - Add test files.r=heycam
MozReview-Commit-ID: FYPgBmgBwyr --HG-- extra : transplant_source : C%7CC%88%A6%E8%88ymS%D5%7Fs%3B%A3%D4%3F%F1%A8b
This commit is contained in:
Daosheng Mu
parent
7fe155aa51
commit
568669a06c
@ -86,6 +86,7 @@ skip-if = android_version == '18' # bug 1147994
|
||||
[test_SVGxxxListIndexing.xhtml]
|
||||
[test_SVGxxxList.xhtml]
|
||||
[test_switch.xhtml]
|
||||
[test_tabindex.html]
|
||||
[test_tearoff_with_cc.html]
|
||||
support-files = tearoff_with_cc_helper.html
|
||||
[test_text_2.html]
|
||||
|
||||
68
dom/svg/test/test_tabindex.html
Normal file
68
dom/svg/test/test_tabindex.html
Normal file
@ -0,0 +1,68 @@
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Test for SVG tabIndex - Bug 778654</title>
|
||||
<link rel="stylesheet" type="text/css"
|
||||
href="chrome://mochikit/content/tests/SimpleTest/test.css" />
|
||||
|
||||
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible">
|
||||
<foreignObject id="f" x="0" y="0" width="200" height="60" tabindex="0">
|
||||
<body xmlns="http://www.w3.org/1999/xhtml">
|
||||
<p>Here is a paragraph that requires word wrap</p>
|
||||
</body>
|
||||
</foreignObject>
|
||||
<rect id="r" x="0" y="70" width="100" height="100" fill="yellow" tabIndex="1"/>
|
||||
<text id="t" x="0" y="200" tabindex="2">
|
||||
This is SVG text
|
||||
</text>
|
||||
</svg>
|
||||
<pre id="test">
|
||||
<script class="testbody" type="text/javascript">
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
function main()
|
||||
{
|
||||
var f = document.getElementById('f');
|
||||
var r = document.getElementById('r');
|
||||
var t = document.getElementById('t');
|
||||
|
||||
try {
|
||||
// Step 1: Checking by assigning tabIndex
|
||||
is(f.tabIndex, 0, "foreignObject initial tabIndex");
|
||||
f.tabIndex = 1;
|
||||
is(f.tabIndex, 1, "foreignObject tabIndex is set to 1");
|
||||
|
||||
is(r.tabIndex, 1, "rect initial tabIndex");
|
||||
r.tabIndex = 2;
|
||||
is(r.tabIndex, 2, "rect tabIndex is set to 2");
|
||||
|
||||
is(t.tabIndex, 2, "text initial tabIndex");
|
||||
t.tabIndex = 3;
|
||||
is(t.tabIndex, 3, "text is set to 3");
|
||||
|
||||
// Step 2: Checking by triggering TAB event
|
||||
is(document.activeElement.tabIndex, -1, "In the beginning, the active element tabindex is -1");
|
||||
|
||||
synthesizeKey("VK_TAB", {});
|
||||
is(document.activeElement.tabIndex, 1, "The active element tabindex is 1");
|
||||
|
||||
synthesizeKey("VK_TAB", {});
|
||||
is(document.activeElement.tabIndex, 2, "The active element tabindex is 2");
|
||||
|
||||
synthesizeKey("VK_TAB", {});
|
||||
is(document.activeElement.tabIndex, 3, "The active element tabindex is 3");
|
||||
} catch(e) {
|
||||
ok(false, "Got unexpected exception" + e);
|
||||
}
|
||||
|
||||
SimpleTest.finish();
|
||||
}
|
||||
|
||||
window.addEventListener("load", main, false);
|
||||
</script>
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
||||
88
layout/reftests/svg/outline-ref.html
Normal file
88
layout/reftests/svg/outline-ref.html
Normal file
@ -0,0 +1,88 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="en">
|
||||
<body>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible">
|
||||
<g>
|
||||
<rect id="rect" width="100" height="100" style="fill: yellow"/>
|
||||
<text id="text" x="0" y="140" font-family="Verdana" font-size="20">
|
||||
Hello world
|
||||
</text>
|
||||
<foreignObject id="foreignObject" x="0" y="160" width="200" height="60">
|
||||
<div xmlns="http://www.w3.org/1999/xhtml">
|
||||
Here is a paragraph that requires word wrap
|
||||
</div>
|
||||
</foreignObject>
|
||||
<circle id="circle" cx="40" cy="275" r="40" style="fill: green"/>
|
||||
<ellipse id="ellipse" cx="70" cy="380" rx="70" ry="50" style="fill: yellow"/>
|
||||
<image id="image" x="0" y="450" height="100" width="100"/>
|
||||
<line id="line" x1="0" y1="580" x2="100" y2="580" style="stroke: red; stroke-width: 2"/>
|
||||
<path id="path" d="M50 600 L10 650 L90 650 Z"/>
|
||||
<polygon id="polygon" points="300,50 350,0 400,50" style="fill: lime"/>
|
||||
<polyline id="polyline" points="300,80 350,70 400,80" style="fill: none;stroke: black; stroke-width: 3"/>
|
||||
<g transform="translate(300, 70)">
|
||||
<circle id="gCircle" cx="50" cy="50" r="20" style="fill: blue"/>
|
||||
</g>
|
||||
<g transform="translate(300, 150)">
|
||||
<circle id="ggCircle" cx="50" cy="50" r="20" style="fill: green"/>
|
||||
<g>
|
||||
<rect id="ggRect" x="15" y ="15" width="30" height="10" style="fill: blue"/>
|
||||
</g>
|
||||
</g>
|
||||
<svg x="300" y="250">
|
||||
<rect id="innerRect" x="30" y="10" height="50" width="50" style="fill: red"/>
|
||||
</svg>
|
||||
</g>
|
||||
</svg>
|
||||
<script>
|
||||
|
||||
function createOutline(boundingRect) {
|
||||
// Outline starts from a top-left shift pixel of the bounding rect
|
||||
var left = boundingRect.left - 1;
|
||||
var top = boundingRect.top - 1;
|
||||
var right = boundingRect.right;
|
||||
var bottom = boundingRect.bottom;
|
||||
var width = boundingRect.width;
|
||||
var height = boundingRect.height;
|
||||
|
||||
var lines = document.createElement("div");
|
||||
var styles = 'border: 1px solid;'
|
||||
+ 'width: ' + width + 'px;'
|
||||
+ 'height: ' + height + 'px;'
|
||||
+ 'position: absolute;'
|
||||
+ 'top: ' + top + 'px;'
|
||||
+ 'left: ' + left + 'px;';
|
||||
|
||||
lines.setAttribute('style', styles);
|
||||
document.body.appendChild(lines);
|
||||
}
|
||||
|
||||
window.onload = function drawOutline() {
|
||||
var elements = ['rect', 'foreignObject', 'circle',
|
||||
'ellipse', 'image', 'line', 'path',
|
||||
'polygon', 'polyline', 'text','gCircle',
|
||||
'innerRect'];
|
||||
elements.forEach(id => {
|
||||
var element = document.getElementById(id);
|
||||
createOutline(element.getBoundingClientRect());
|
||||
});
|
||||
|
||||
var ggRect = document.getElementById('ggRect');
|
||||
var ggRectbbox = ggRect.getBoundingClientRect();
|
||||
createOutline(ggRectbbox);
|
||||
|
||||
var ggCircle = document.getElementById('ggCircle');
|
||||
var ggCirclebbox = ggCircle.getBoundingClientRect();
|
||||
|
||||
var ggbbox = {
|
||||
left: ggRectbbox.left,
|
||||
top: ggRectbbox.top,
|
||||
right: ggCirclebbox.right,
|
||||
bottom: ggCirclebbox.bottom
|
||||
};
|
||||
ggbbox.width = ggbbox.right - ggbbox.left;
|
||||
ggbbox.height = ggbbox.bottom - ggbbox.top;
|
||||
createOutline(ggbbox);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
52
layout/reftests/svg/outline.html
Normal file
52
layout/reftests/svg/outline.html
Normal file
@ -0,0 +1,52 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="en">
|
||||
<style>
|
||||
rect,
|
||||
text,
|
||||
foreignObject,
|
||||
circle,
|
||||
ellipse,
|
||||
image,
|
||||
line,
|
||||
path,
|
||||
polygon,
|
||||
polyline {
|
||||
outline: 1px solid;
|
||||
}
|
||||
|
||||
</style>
|
||||
<body>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible">
|
||||
<g>
|
||||
<rect width="100" height="100" style="fill: yellow"/>
|
||||
<text x="0" y="140" font-family="Verdana" font-size="20">
|
||||
Hello world
|
||||
</text>
|
||||
<foreignObject x="0" y="160" width="200" height="60">
|
||||
<div xmlns="http://www.w3.org/1999/xhtml">
|
||||
Here is a paragraph that requires word wrap
|
||||
</div>
|
||||
</foreignObject>
|
||||
<circle cx="40" cy="275" r="40" style="fill: green"/>
|
||||
<ellipse cx="70" cy="380" rx="70" ry="50" style="fill: yellow"/>
|
||||
<image x="0" y="450" height="100" width="100"/>
|
||||
<line x1="0" y1="580" x2="100" y2="580" style="stroke: red; stroke-width: 2"/>
|
||||
<path d="M50 600 L10 650 L90 650 Z"/>
|
||||
<polygon points="300,50 350,0 400,50" style="fill: lime"/>
|
||||
<polyline points="300,80 350,70 400,80" style="fill: none; stroke: black;stroke-width: 3"/>
|
||||
<g transform="translate(300, 70)" style="outline: 1px solid">
|
||||
<circle cx="50" cy="50" r="20" style="fill: blue; outline: 0px"/>
|
||||
</g>
|
||||
<g transform="translate(300, 150)" style="outline: 1px solid">
|
||||
<circle cx="50" cy="50" r="20" style="fill: green; outline: 0px"/>
|
||||
<g>
|
||||
<rect x="15" y="15" width="30" height="10" style="fill: blue"/>
|
||||
</g>
|
||||
</g>
|
||||
<svg x="300" y="250">
|
||||
<rect x="30" y="10" height="50" width="50" style="fill: red"/>
|
||||
</svg>
|
||||
</g>
|
||||
</svg>
|
||||
</body>
|
||||
</html>
|
||||
@ -246,6 +246,7 @@ skip-if(d2d) fuzzy-if(cocoaWidget,1,99974) fuzzy-if(skiaContent,1,200000) == opa
|
||||
== opacity-and-pattern-01.svg pass.svg
|
||||
fuzzy-if(skiaContent,1,10000) == opacity-and-transform-01.svg opacity-and-transform-01-ref.svg
|
||||
fuzzy-if(Android,8,200) random-if((B2G&&browserIsRemote)||Mulet) == outer-svg-border-and-padding-01.svg outer-svg-border-and-padding-01-ref.svg # Initial mulet triage: parity with B2G/B2G Desktop
|
||||
== outline.html outline-ref.html
|
||||
== overflow-on-outer-svg-01.svg overflow-on-outer-svg-01-ref.svg
|
||||
== overflow-on-outer-svg-02a.xhtml overflow-on-outer-svg-02-ref.xhtml
|
||||
== overflow-on-outer-svg-02b.xhtml overflow-on-outer-svg-02-ref.xhtml
|
||||
|
||||
Loading…
Reference in New Issue
Block a user