mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

Use tree order when z-index is the same

Browse Source
This commit is contained in:
MoyuScript 2017-08-09 11:52:42 +08:00
parent f3ade251e4
commit a09f38ba7c
36 changed files with 392 additions and 337 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/NodeContainer.js
View File

@ -80,9 +80,11 @@ export default class NodeContainer {
bounds: Bounds; bounds: Bounds;
curvedBounds: BoundCurves; curvedBounds: BoundCurves;
image: ?string; image: ?string;
index: number;
constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader) { constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader, index: number) {
this.parent = parent; this.parent = parent;
this.index = index;
this.childNodes = []; this.childNodes = [];
const defaultView = node.ownerDocument.defaultView; const defaultView = node.ownerDocument.defaultView;
const style = defaultView.getComputedStyle(node, null); const style = defaultView.getComputedStyle(node, null);

15
src/NodeParser.js
View File

@ -17,11 +17,13 @@ export const NodeParser = (
logger.log(`Starting node parsing`); logger.log(`Starting node parsing`);
} }
const container = new NodeContainer(node, null, imageLoader); let index = 0;
const container = new NodeContainer(node, null, imageLoader, index++);
const stack = new StackingContext(container, null, true); const stack = new StackingContext(container, null, true);
createPseudoHideStyles(node.ownerDocument); createPseudoHideStyles(node.ownerDocument);
parseNodeTree(node, container, stack, imageLoader); parseNodeTree(node, container, stack, imageLoader, index);
if (__DEV__) { if (__DEV__) {
logger.log(`Finished parsing node tree`); logger.log(`Finished parsing node tree`);
@ -41,7 +43,8 @@ const parseNodeTree = (
node: HTMLElement, node: HTMLElement,
parent: NodeContainer, parent: NodeContainer,
stack: StackingContext, stack: StackingContext,
imageLoader: ImageLoader imageLoader: ImageLoader,
index: number
): void => { ): void => {
for (let childNode = node.firstChild, nextNode; childNode; childNode = nextNode) { for (let childNode = node.firstChild, nextNode; childNode; childNode = nextNode) {
nextNode = childNode.nextSibling; nextNode = childNode.nextSibling;
@ -57,7 +60,7 @@ const parseNodeTree = (
if (IGNORED_NODE_NAMES.indexOf(childNode.nodeName) === -1) { if (IGNORED_NODE_NAMES.indexOf(childNode.nodeName) === -1) {
inlinePseudoElement(childNode, PSEUDO_BEFORE); inlinePseudoElement(childNode, PSEUDO_BEFORE);
inlinePseudoElement(childNode, PSEUDO_AFTER); inlinePseudoElement(childNode, PSEUDO_AFTER);
const container = new NodeContainer(childNode, parent, imageLoader); const container = new NodeContainer(childNode, parent, imageLoader, index++);
if (container.isVisible()) { if (container.isVisible()) {
if (childNode.tagName === 'INPUT') { if (childNode.tagName === 'INPUT') {
// $FlowFixMe // $FlowFixMe
@ -89,12 +92,12 @@ const parseNodeTree = (
); );
parentStack.contexts.push(childStack); parentStack.contexts.push(childStack);
if (SHOULD_TRAVERSE_CHILDREN) { if (SHOULD_TRAVERSE_CHILDREN) {
parseNodeTree(childNode, container, childStack, imageLoader); parseNodeTree(childNode, container, childStack, imageLoader, index);
} }
} else { } else {
stack.children.push(container); stack.children.push(container);
if (SHOULD_TRAVERSE_CHILDREN) { if (SHOULD_TRAVERSE_CHILDREN) {
parseNodeTree(childNode, container, stack, imageLoader); parseNodeTree(childNode, container, stack, imageLoader, index);
} }
} }
} }

3
src/Renderer.js
View File

@ -395,5 +395,6 @@ const sortByZIndex = (a: StackingContext, b: StackingContext): number => {
} else if (a.container.style.zIndex.order < b.container.style.zIndex.order) { } else if (a.container.style.zIndex.order < b.container.style.zIndex.order) {
return -1; return -1;
} }
return 0;
return a.container.index > b.container.index ? 1 : -1;
}; };

4
tests/reftests/border/radius.txt
View File

@ -30,7 +30,7 @@ Shape: rgb(0,128,0) Path (BezierCurve(x0: 401, y0: 635, x1: 408, y1: 653, cx0: 4
Shape: rgb(0,0,0) Path (BezierCurve(x0: 401, y0: 881, x1: 383, y1: 888, cx0: 396, cy0: 885, cx1: 390, cy1: 888) > BezierCurve(x0: 133, y0: 888, x1: 115, y1: 881, cx0: 126, cy0: 888, cx1: 120, cy1: 885) > BezierCurve(x0: 158, y0: 845, x1: 158, y1: 838, cx0: 158, cy0: 841, cx1: 158, cy1: 838) > BezierCurve(x0: 358, y0: 838, x1: 358, y1: 845, cx0: 358, cy0: 838, cx1: 358, cy1: 841)) Shape: rgb(0,0,0) Path (BezierCurve(x0: 401, y0: 881, x1: 383, y1: 888, cx0: 396, cy0: 885, cx1: 390, cy1: 888) > BezierCurve(x0: 133, y0: 888, x1: 115, y1: 881, cx0: 126, cy0: 888, cx1: 120, cy1: 885) > BezierCurve(x0: 158, y0: 845, x1: 158, y1: 838, cx0: 158, cy0: 841, cx1: 158, cy1: 838) > BezierCurve(x0: 358, y0: 838, x1: 358, y1: 845, cx0: 358, cy0: 838, cx1: 358, cy1: 841))
Clip: Path (BezierCurve(x0: 522, y0: 738, x1: 623, y1: 637, cx0: 522, cy0: 682, cx1: 567, cy1: 637) > BezierCurve(x0: 623, y0: 637, x1: 724, y1: 738, cx0: 679, cy0: 637, cx1: 724, cy1: 682) > BezierCurve(x0: 724, y0: 738, x1: 623, y1: 839, cx0: 724, cy0: 794, cx1: 679, cy1: 839) > BezierCurve(x0: 623, y0: 839, x1: 522, y1: 738, cx0: 567, cy0: 839, cx1: 522, cy1: 794)) Clip: Path (BezierCurve(x0: 522, y0: 738, x1: 623, y1: 637, cx0: 522, cy0: 682, cx1: 567, cy1: 637) > BezierCurve(x0: 623, y0: 637, x1: 724, y1: 738, cx0: 679, cy0: 637, cx1: 724, cy1: 682) > BezierCurve(x0: 724, y0: 738, x1: 623, y1: 839, cx0: 724, cy0: 794, cx1: 679, cy1: 839) > BezierCurve(x0: 623, y0: 839, x1: 522, y1: 738, cx0: 567, cy0: 839, cx1: 522, cy1: 794))
Fill: rgb(111,66,140) Fill: rgb(111,66,140)
Shape: rgb(0,0,0) Path (BezierCurve(x0: 552, y0: 666, x1: 623, y1: 637, cx0: 570, cy0: 648, cx1: 595, cy1: 637) > BezierCurve(x0: 623, y0: 637, x1: 695, y1: 666, cx0: 651, cy0: 637, cx1: 676, cy1: 648) > BezierCurve(x0: 694, y0: 667, x1: 623, y1: 638, cx0: 676, cy0: 649, cx1: 651, cy1: 638) > BezierCurve(x0: 623, y0: 638, x1: 552, y1: 667, cx0: 596, cy0: 638, cx1: 570, cy1: 649)) Shape: rgb(0,0,0) Path (BezierCurve(x0: 552, y0: 666, x1: 623, y1: 637, cx0: 570, cy0: 648, cx1: 595, cy1: 637) > BezierCurve(x0: 623, y0: 637, x1: 695, y1: 666, cx0: 651, cy0: 637, cx1: 676, cy1: 648) > BezierCurve(x0: 694, y0: 667, x1: 623, y1: 638, cx0: 676, cy0: 649, cx1: 651, cy1: 638) > BezierCurve(x0: 623, y0: 638, x1: 552, y1: 667, cx0: 596, cy0: 638, cx1: 571, cy1: 649))
Shape: rgb(0,0,0) Path (BezierCurve(x0: 695, y0: 666, x1: 724, y1: 738, cx0: 713, cy0: 685, cx1: 724, cy1: 710) > BezierCurve(x0: 724, y0: 738, x1: 695, y1: 810, cx0: 724, cy0: 766, cx1: 713, cy1: 791) > BezierCurve(x0: 694, y0: 809, x1: 723, y1: 738, cx0: 712, cy0: 791, cx1: 723, cy1: 766) > BezierCurve(x0: 723, y0: 738, x1: 694, y1: 667, cx0: 723, cy0: 710, cx1: 712, cy1: 685)) Shape: rgb(0,0,0) Path (BezierCurve(x0: 695, y0: 666, x1: 724, y1: 738, cx0: 713, cy0: 685, cx1: 724, cy1: 710) > BezierCurve(x0: 724, y0: 738, x1: 695, y1: 810, cx0: 724, cy0: 766, cx1: 713, cy1: 791) > BezierCurve(x0: 694, y0: 809, x1: 723, y1: 738, cx0: 712, cy0: 791, cx1: 723, cy1: 766) > BezierCurve(x0: 723, y0: 738, x1: 694, y1: 667, cx0: 723, cy0: 710, cx1: 712, cy1: 685))
Shape: rgb(0,0,0) Path (BezierCurve(x0: 695, y0: 810, x1: 623, y1: 839, cx0: 676, cy0: 828, cx1: 651, cy1: 839) > BezierCurve(x0: 623, y0: 839, x1: 552, y1: 810, cx0: 595, cy0: 839, cx1: 570, cy1: 828) > BezierCurve(x0: 552, y0: 809, x1: 623, y1: 838, cx0: 570, cy0: 827, cx1: 596, cy1: 838) > BezierCurve(x0: 623, y0: 838, x1: 694, y1: 809, cx0: 651, cy0: 838, cx1: 676, cy1: 827)) Shape: rgb(0,0,0) Path (BezierCurve(x0: 695, y0: 810, x1: 623, y1: 839, cx0: 676, cy0: 828, cx1: 651, cy1: 839) > BezierCurve(x0: 623, y0: 839, x1: 552, y1: 810, cx0: 595, cy0: 839, cx1: 570, cy1: 828) > BezierCurve(x0: 552, y0: 809, x1: 623, y1: 838, cx0: 571, cy0: 827, cx1: 596, cy1: 838) > BezierCurve(x0: 623, y0: 838, x1: 694, y1: 809, cx0: 651, cy0: 838, cx1: 676, cy1: 827))
Shape: rgb(0,0,0) Path (BezierCurve(x0: 552, y0: 810, x1: 522, y1: 738, cx0: 533, cy0: 791, cx1: 522, cy1: 766) > BezierCurve(x0: 522, y0: 738, x1: 552, y1: 666, cx0: 522, cy0: 710, cx1: 533, cy1: 685) > BezierCurve(x0: 552, y0: 667, x1: 523, y1: 738, cx0: 534, cy0: 685, cx1: 523, cy1: 710) > BezierCurve(x0: 523, y0: 738, x1: 552, y1: 809, cx0: 523, cy0: 766, cx1: 534, cy1: 791)) Shape: rgb(0,0,0) Path (BezierCurve(x0: 552, y0: 810, x1: 522, y1: 738, cx0: 533, cy0: 791, cx1: 522, cy1: 766) > BezierCurve(x0: 522, y0: 738, x1: 552, y1: 666, cx0: 522, cy0: 710, cx1: 533, cy1: 685) > BezierCurve(x0: 552, y0: 667, x1: 523, y1: 738, cx0: 534, cy0: 685, cx1: 523, cy1: 710) > BezierCurve(x0: 523, y0: 738, x1: 552, y1: 809, cx0: 523, cy0: 766, cx1: 534, cy1: 791))

5
tests/reftests/text/fontawesome.html
View File

@ -5,6 +5,11 @@
<title>fontawesome icons</title> <title>fontawesome icons</title>
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<script type="text/javascript" src="../../test.js"></script> <script type="text/javascript" src="../../test.js"></script>
<style>
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div> <div>

142
tests/reftests/text/fontawesome.txt
View File

@ -1,88 +1,88 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 8]: Fontawesome [8, 8]: Fontawesome
[101, 8]: icons [113, 8]: icons
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[92, 98]: fa [92, 97]: fa
[104, 98]: - [106, 97]: -
[110, 98]: 5x [111, 97]: 5x
Shape: rgb(0,0,0) Path (Vector(x: 8, y: 35) > Vector(x: 792, y: 35) > Vector(x: 791, y: 36) > Vector(x: 9, y: 36)) Shape: rgb(0,0,0) Path (Vector(x: 8, y: 34) > Vector(x: 792, y: 34) > Vector(x: 791, y: 35) > Vector(x: 9, y: 35))
Shape: rgb(0,0,0) Path (Vector(x: 792, y: 35) > Vector(x: 792, y: 37) > Vector(x: 791, y: 36) > Vector(x: 791, y: 36)) Shape: rgb(0,0,0) Path (Vector(x: 792, y: 34) > Vector(x: 792, y: 36) > Vector(x: 791, y: 35) > Vector(x: 791, y: 35))
Shape: rgb(0,0,0) Path (Vector(x: 792, y: 37) > Vector(x: 8, y: 37) > Vector(x: 9, y: 36) > Vector(x: 791, y: 36)) Shape: rgb(0,0,0) Path (Vector(x: 792, y: 36) > Vector(x: 8, y: 36) > Vector(x: 9, y: 35) > Vector(x: 791, y: 35))
Shape: rgb(0,0,0) Path (Vector(x: 8, y: 37) > Vector(x: 8, y: 35) > Vector(x: 9, y: 36) > Vector(x: 9, y: 36)) Shape: rgb(0,0,0) Path (Vector(x: 8, y: 36) > Vector(x: 8, y: 34) > Vector(x: 9, y: 35) > Vector(x: 9, y: 35))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[55, 242]: fa [55, 239]: fa
[67, 242]: - [68, 239]: -
[72, 242]: twitter [74, 239]: twitter
[118, 242]: on [121, 239]: on
[138, 242]: fa [143, 239]: fa
[151, 242]: - [156, 239]: -
[156, 242]: square [162, 239]: square
[198, 242]: - [211, 239]: -
[203, 242]: o [216, 239]: o
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[55, 285]: fa [55, 282]: fa
[67, 285]: - [68, 282]: -
[72, 285]: flag [74, 282]: flag
[101, 285]: on [104, 282]: on
[121, 285]: fa [126, 282]: fa
[134, 285]: - [140, 282]: -
[139, 285]: circle [145, 282]: circle
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[55, 328]: fa [55, 325]: fa
[67, 328]: - [68, 325]: -
[72, 328]: terminal [74, 325]: terminal
[130, 328]: on [135, 325]: on
[150, 328]: fa [157, 325]: fa
[162, 328]: - [171, 325]: -
[168, 328]: square [176, 325]: square
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[55, 371]: fa [55, 368]: fa
[67, 371]: - [68, 368]: -
[72, 371]: ban [74, 368]: ban
[100, 371]: on [105, 368]: on
[120, 371]: fa [127, 368]: fa
[132, 371]: - [140, 368]: -
[137, 371]: camera [146, 368]: camera
Text: rgb(0,0,0) normal normal 400 80px FontAwesome Text: rgb(0,0,0) normal normal 400 80px FontAwesome
[8, 44]:  [8, 43]: 
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[42, 141]: List [42, 140]: List
[71, 141]: icons [71, 140]: icons
Text: rgb(0,0,0) normal normal 400 16px FontAwesome Text: rgb(0,0,0) normal normal 400 16px FontAwesome
[18, 143]:  [18, 142]: 
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[42, 160]: can [42, 158]: can
[69, 160]: be [73, 158]: be
[87, 160]: used [95, 158]: used
Text: rgb(0,0,0) normal normal 400 16px FontAwesome Text: rgb(0,0,0) normal normal 400 16px FontAwesome
[18, 162]:  [18, 160]: 
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[42, 179]: as [42, 176]: as
[59, 179]: bullets [63, 176]: bullets
Transform: (24, 186) [0.99, 0.16, -0.16, 0.99, 0, 0] Transform: (24, 182) [0.97, 0.26, -0.26, 0.97, 0, 0]
Text: rgb(0,0,0) normal normal 400 16px FontAwesome Text: rgb(0,0,0) normal normal 400 16px FontAwesome
[17, 180]:  [16, 177]: 
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[42, 198]: in [42, 194]: in
[59, 198]: lists [59, 194]: lists
Text: rgb(0,0,0) normal normal 400 16px FontAwesome Text: rgb(0,0,0) normal normal 400 16px FontAwesome
[18, 199]:  [18, 196]: 
Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome
[13, 232]:  [13, 228]: 
Text: rgb(0,0,0) normal normal 400 21.3333px FontAwesome Text: rgb(0,0,0) normal normal 400 21.3333px FontAwesome
[19, 242]:  [19, 238]: 
Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome
[11, 274]:  [11, 270]: 
Text: rgb(255,255,255) normal normal 400 21.3333px FontAwesome Text: rgb(255,255,255) normal normal 400 21.3333px FontAwesome
[19, 285]:  [19, 281]: 
Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome
[11, 317]:  [11, 313]: 
Text: rgb(255,255,255) normal normal 400 21.3333px FontAwesome Text: rgb(255,255,255) normal normal 400 21.3333px FontAwesome
[19, 328]:  [19, 324]: 
Text: rgb(0,0,0) normal normal 400 21.3333px FontAwesome Text: rgb(0,0,0) normal normal 400 21.3333px FontAwesome
[18, 370]:  [18, 366]: 
Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome
[11, 360]:  [11, 356]: 

5
tests/reftests/text/shadow.html
View File

@ -35,8 +35,11 @@
.red-text-shadow { .red-text-shadow {
text-shadow: 0 -2px; text-shadow: 0 -2px;
} }
</style>
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div class="shadow1"> <div class="shadow1">

166
tests/reftests/text/shadow.txt
View File

@ -1,88 +1,88 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 8]: Some [8, 8]: Some
[48, 8]: text [54, 8]: text
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[271, 8]: followed [292, 8]: followed
[332, 8]: by [355, 8]: by
[352, 8]: more [376, 8]: more
[388, 8]: text [417, 8]: text
[416, 8]: without [447, 8]: without
[469, 8]: shadow. [502, 8]: shadow.
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[653, 8]: and [704, 8]: and
[680, 8]: some [736, 8]: some
[718, 8]: more [8, 26]: more
[754, 8]: text [49, 26]: text
[8, 27]: without [79, 26]: without
[61, 27]: shadow [134, 26]: shadow
Text: rgb(255,255,255) normal normal 400 24px Georgia Shadows: (rgb(0,0,0) 1px 1px 2px, rgb(0,0,255) 0px 0px 24px) Text: rgb(255,255,255) normal normal 400 24px Georgia Shadows: (rgb(0,0,0) 1px 1px 2px, rgb(0,0,255) 0px 0px 24px)
[8, 180]: Sed [8, 178]: Sed
[53, 180]: ut [53, 178]: ut
[80, 180]: perspiciatis [80, 178]: perspiciatis
[208, 180]: unde [208, 178]: unde
[268, 180]: omnis [268, 178]: omnis
[339, 180]: iste [339, 178]: iste
[382, 180]: natus [382, 178]: natus
[446, 180]: error [446, 178]: error
[506, 180]: sit [506, 178]: sit
[538, 180]: voluptatem [538, 178]: voluptatem
[8, 207]: accusantium [8, 206]: accusantium
[148, 207]: doloremque [148, 206]: doloremque
[282, 207]: laudantium, [282, 206]: laudantium,
[418, 207]: totam [418, 206]: totam
[486, 207]: rem [486, 206]: rem
[534, 207]: aperiam, [534, 206]: aperiam,
[634, 207]: eaque [634, 206]: eaque
[702, 207]: ipsa [702, 206]: ipsa
[8, 234]: quae [8, 233]: quae
[65, 234]: ab [65, 233]: ab
[96, 234]: illo [96, 233]: illo
[136, 234]: inventore. [136, 233]: inventore.
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Shadows: (rgb(0,0,0) 0px -2px 0px) Text: rgb(0,0,0) normal normal 400 16px Arial Shadows: (rgb(0,0,0) 0px -2px 0px)
[8, 286]: Sed [8, 284]: Sed
[36, 286]: ut [41, 284]: ut
[52, 286]: perspiciatis [59, 284]: perspiciatis
[129, 286]: unde [143, 284]: unde
[164, 286]: omnis [183, 284]: omnis
[208, 286]: iste [230, 284]: iste
[234, 286]: natus [260, 284]: natus
[272, 286]: error [303, 284]: error
[307, 286]: sit [342, 284]: sit
[326, 286]: voluptatem [362, 284]: voluptatem
[402, 286]: accusantium [445, 284]: accusantium
[486, 286]: doloremque [539, 284]: doloremque
[566, 286]: laudantium, [628, 284]: laudantium,
[646, 286]: totam [715, 284]: totam
[686, 286]: rem [760, 284]: rem
[715, 286]: aperiam, [8, 302]: aperiam,
[8, 305]: eaque [75, 302]: eaque
[49, 305]: ipsa [124, 302]: ipsa
[79, 305]: quae [158, 302]: quae
[113, 305]: ab [198, 302]: ab
[132, 305]: illo [220, 302]: illo
[158, 305]: inventore. [244, 302]: inventore.
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Shadows: (rgb(136,136,136) 1px 1px 3px) Text: rgb(0,0,0) normal normal 400 16px Arial Shadows: (rgb(136,136,136) 1px 1px 3px)
[76, 8]: followed [84, 8]: followed
[137, 8]: by [148, 8]: by
[157, 8]: text [169, 8]: text
[185, 8]: with [199, 8]: with
[218, 8]: shadow [232, 8]: shadow
Text: rgb(0,0,0) normal normal 700 16px Times New Roman Shadows: (rgb(0,0,0) 1px 1px 2px, rgb(0,0,255) 0px 0px 16px) Text: rgb(0,0,0) normal normal 700 16px Arial Shadows: (rgb(0,0,0) 1px 1px 2px, rgb(0,0,255) 0px 0px 16px)
[525, 8]: Multi [566, 8]: Multi
[567, 8]: text [607, 8]: text
[597, 8]: shadow [640, 8]: shadow
Text: rgba(0,0,0,0) normal normal 400 48px Times New Roman Shadows: (rgb(0,0,255) 0px 0px 5px, rgb(255,0,0) 2px 2px 0px) Text: rgba(0,0,0,0) normal normal 400 48px Arial Shadows: (rgb(0,0,255) 0px 0px 5px, rgb(255,0,0) 2px 2px 0px)
[8, 46]: testing [8, 45]: testing
[148, 46]: with [163, 45]: with
[245, 46]: transparent [262, 45]: transparent
Text: rgba(0,255,0,0.5) normal normal 700 48px Times New Roman Shadows: (rgb(0,0,255) 0px 0px 5px, rgb(255,0,0) 2px 2px 0px) solid rgba(0,255,0,0.5) underline Text: rgba(0,255,0,0.5) normal normal 700 48px Arial Shadows: (rgb(0,0,255) 0px 0px 5px, rgb(255,0,0) 2px 2px 0px) solid rgba(0,255,0,0.5) underline
[470, 46]: testing [518, 45]: testing
[606, 46]: [675, 45]:
[618, 46]: with [688, 45]: with
[709, 46]: [784, 45]:
[8, 102]: low [8, 100]: low
[80, 102]: [88, 100]:
[92, 102]: opacity [101, 100]: opacity

5
tests/reftests/transform/nested.html
View File

@ -35,8 +35,11 @@
display: inline-block; display: inline-block;
} }
</style>
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div id="first">First level content <div id="second">with second level content <div id="third">and third level content</div>, ending second</div>, ending first</div> <div id="first">First level content <div id="second">with second level content <div id="third">and third level content</div>, ending second</div>, ending first</div>

70
tests/reftests/transform/nested.txt
View File

@ -1,42 +1,42 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Clip: Path (Vector(x: 8, y: 108) > Vector(x: 649, y: 108) > Vector(x: 649, y: 157) > Vector(x: 8, y: 157)) Clip: Path (Vector(x: 8, y: 108) > Vector(x: 708, y: 108) > Vector(x: 708, y: 156) > Vector(x: 8, y: 156))
Fill: rgb(205,92,92) Fill: rgb(205,92,92)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 124]: First [8, 123]: First
[41, 124]: level [44, 123]: level
[76, 124]: content [81, 123]: content
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[568, 124]: , [620, 123]: ,
[576, 124]: ending [630, 123]: ending
[624, 124]: first [682, 123]: first
Clip: Path (Vector(x: 653, y: 123) > Vector(x: 749, y: 123) > Vector(x: 749, y: 142) > Vector(x: 653, y: 142)) Clip: Path (Vector(x: 8, y: 156) > Vector(x: 116, y: 156) > Vector(x: 116, y: 174) > Vector(x: 8, y: 174))
Fill: rgb(188,143,143) Fill: rgb(188,143,143)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[653, 124]: something [8, 156]: something
[724, 124]: else [86, 156]: else
Transform: (348, 132) [0.99, 0.13, -0.13, 0.99, 0, 0] Transform: (379, 132) [0.99, 0.13, -0.13, 0.99, 0, 0]
Clip: Path (Vector(x: 128, y: 108) > Vector(x: 568, y: 108) > Vector(x: 568, y: 157) > Vector(x: 128, y: 157)) Clip: Path (Vector(x: 138, y: 108) > Vector(x: 621, y: 108) > Vector(x: 621, y: 156) > Vector(x: 138, y: 156))
Fill: rgb(143,188,143) Fill: rgb(143,188,143)
Shape: rgb(255,0,0) Path (Vector(x: 128, y: 108) > Vector(x: 568, y: 108) > Vector(x: 553, y: 123) > Vector(x: 143, y: 123)) Shape: rgb(255,0,0) Path (Vector(x: 138, y: 108) > Vector(x: 621, y: 108) > Vector(x: 606, y: 123) > Vector(x: 153, y: 123))
Shape: rgb(255,0,0) Path (Vector(x: 568, y: 108) > Vector(x: 568, y: 157) > Vector(x: 553, y: 142) > Vector(x: 553, y: 123)) Shape: rgb(255,0,0) Path (Vector(x: 621, y: 108) > Vector(x: 621, y: 156) > Vector(x: 606, y: 141) > Vector(x: 606, y: 123))
Shape: rgb(255,0,0) Path (Vector(x: 568, y: 157) > Vector(x: 128, y: 157) > Vector(x: 143, y: 142) > Vector(x: 553, y: 142)) Shape: rgb(255,0,0) Path (Vector(x: 621, y: 156) > Vector(x: 138, y: 156) > Vector(x: 153, y: 141) > Vector(x: 606, y: 141))
Shape: rgb(255,0,0) Path (Vector(x: 128, y: 157) > Vector(x: 128, y: 108) > Vector(x: 143, y: 123) > Vector(x: 143, y: 142)) Shape: rgb(255,0,0) Path (Vector(x: 138, y: 156) > Vector(x: 138, y: 108) > Vector(x: 153, y: 123) > Vector(x: 153, y: 141))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[143, 123]: with [153, 123]: with
[175, 123]: second [186, 123]: second
[224, 123]: level [242, 123]: level
[258, 123]: content [279, 123]: content
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[453, 123]: , [493, 123]: ,
[461, 123]: ending [501, 123]: ending
[509, 123]: second [554, 123]: second
Transform: (381, 132) [0.33, -0.94, 0.94, 0.33, 0, 0] Transform: (414, 132) [0.33, -0.94, 0.94, 0.33, 0, 0]
Clip: Path (Vector(x: 310, y: 123) > Vector(x: 453, y: 123) > Vector(x: 453, y: 142) > Vector(x: 310, y: 142)) Clip: Path (Vector(x: 336, y: 123) > Vector(x: 493, y: 123) > Vector(x: 493, y: 141) > Vector(x: 336, y: 141))
Fill: rgb(95,158,160) Fill: rgb(95,158,160)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[310, 123]: and [336, 123]: and
[337, 123]: third [367, 123]: third
[371, 123]: level [403, 123]: level
[406, 123]: content [440, 123]: content

6
tests/reftests/transform/rotate.html
View File

@ -36,7 +36,11 @@
-o-transform: rotate(45deg); /* Opera 10.50-12.00 */ -o-transform: rotate(45deg); /* Opera 10.50-12.00 */
transform:rotate(45deg); transform:rotate(45deg);
} }
</style
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div class="container"> <div class="container">

5
tests/reftests/transform/translate.html
View File

@ -36,8 +36,11 @@
display: inline-block; display: inline-block;
padding: 10px; padding: 10px;
} }
</style>
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div id="first">First level content <div id="second">with second level content <div id="third">and third level content</div>, ending second</div>, ending first</div> <div id="first">First level content <div id="second">with second level content <div id="third">and third level content</div>, ending second</div>, ending first</div>

60
tests/reftests/transform/translate.txt
View File

@ -1,37 +1,37 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Clip: Path (Vector(x: 8, y: 108) > Vector(x: 699, y: 108) > Vector(x: 699, y: 207) > Vector(x: 8, y: 207)) Clip: Path (Vector(x: 8, y: 108) > Vector(x: 758, y: 108) > Vector(x: 758, y: 206) > Vector(x: 8, y: 206))
Fill: rgb(205,92,92) Fill: rgb(205,92,92)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[18, 148]: First [18, 148]: First
[51, 148]: level [54, 148]: level
[86, 148]: content [91, 148]: content
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[608, 148]: , [660, 148]: ,
[616, 148]: ending [670, 148]: ending
[664, 148]: first [722, 148]: first
Transform: (373, 157) [1, 0, 0, 1, 125, 0] Transform: (404, 157) [1, 0, 0, 1, 125, 0]
Clip: Path (Vector(x: 138, y: 118) > Vector(x: 608, y: 118) > Vector(x: 608, y: 197) > Vector(x: 138, y: 197)) Clip: Path (Vector(x: 148, y: 118) > Vector(x: 661, y: 118) > Vector(x: 661, y: 196) > Vector(x: 148, y: 196))
Fill: rgb(143,188,143) Fill: rgb(143,188,143)
Shape: rgb(255,0,0) Path (Vector(x: 138, y: 118) > Vector(x: 608, y: 118) > Vector(x: 598, y: 128) > Vector(x: 148, y: 128)) Shape: rgb(255,0,0) Path (Vector(x: 148, y: 118) > Vector(x: 661, y: 118) > Vector(x: 651, y: 128) > Vector(x: 158, y: 128))
Shape: rgb(255,0,0) Path (Vector(x: 608, y: 118) > Vector(x: 608, y: 197) > Vector(x: 598, y: 187) > Vector(x: 598, y: 128)) Shape: rgb(255,0,0) Path (Vector(x: 661, y: 118) > Vector(x: 661, y: 196) > Vector(x: 651, y: 186) > Vector(x: 651, y: 128))
Shape: rgb(255,0,0) Path (Vector(x: 608, y: 197) > Vector(x: 138, y: 197) > Vector(x: 148, y: 187) > Vector(x: 598, y: 187)) Shape: rgb(255,0,0) Path (Vector(x: 661, y: 196) > Vector(x: 148, y: 196) > Vector(x: 158, y: 186) > Vector(x: 651, y: 186))
Shape: rgb(255,0,0) Path (Vector(x: 138, y: 197) > Vector(x: 138, y: 118) > Vector(x: 148, y: 128) > Vector(x: 148, y: 187)) Shape: rgb(255,0,0) Path (Vector(x: 148, y: 196) > Vector(x: 148, y: 118) > Vector(x: 158, y: 128) > Vector(x: 158, y: 186))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[158, 148]: with [168, 148]: with
[190, 148]: second [201, 148]: second
[238, 148]: level [257, 148]: level
[274, 148]: content [294, 148]: content
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[488, 148]: , [527, 148]: ,
[496, 148]: ending [537, 148]: ending
[544, 148]: second [589, 148]: second
Transform: (425, 188) [1, 0, 0, 1, 100, -25] Transform: (451, 188) [1, 0, 0, 1, 100, -25]
Clip: Path (Vector(x: 325, y: 138) > Vector(x: 488, y: 138) > Vector(x: 488, y: 177) > Vector(x: 325, y: 177)) Clip: Path (Vector(x: 351, y: 138) > Vector(x: 528, y: 138) > Vector(x: 528, y: 176) > Vector(x: 351, y: 176))
Fill: rgb(95,158,160) Fill: rgb(95,158,160)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[335, 148]: and [361, 148]: and
[362, 148]: third [392, 148]: third
[396, 148]: level [428, 148]: level
[431, 148]: content [465, 148]: content

5
tests/reftests/visibility.html
View File

@ -11,8 +11,11 @@
.none { .none {
display:none display:none
} }
</style>
body {
font-family: Arial;
}
</style>
</head> </head>
<body> <body>
<div> <div>

36
tests/reftests/visibility.txt
View File

@ -2,24 +2,24 @@ Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Shape: rgb(0,0,0) Path (Vector(x: 8, y: 8) > Vector(x: 792, y: 8) > Vector(x: 790, y: 10) > Vector(x: 10, y: 10)) Shape: rgb(0,0,0) Path (Vector(x: 8, y: 8) > Vector(x: 792, y: 8) > Vector(x: 790, y: 10) > Vector(x: 10, y: 10))
Shape: rgb(0,0,0) Path (Vector(x: 792, y: 8) > Vector(x: 792, y: 178) > Vector(x: 790, y: 176) > Vector(x: 790, y: 10)) Shape: rgb(0,0,0) Path (Vector(x: 792, y: 8) > Vector(x: 792, y: 176) > Vector(x: 790, y: 174) > Vector(x: 790, y: 10))
Shape: rgb(0,0,0) Path (Vector(x: 792, y: 178) > Vector(x: 8, y: 178) > Vector(x: 10, y: 176) > Vector(x: 790, y: 176)) Shape: rgb(0,0,0) Path (Vector(x: 792, y: 176) > Vector(x: 8, y: 176) > Vector(x: 10, y: 174) > Vector(x: 790, y: 174))
Shape: rgb(0,0,0) Path (Vector(x: 8, y: 178) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 176)) Shape: rgb(0,0,0) Path (Vector(x: 8, y: 176) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 174))
Text: rgb(0,0,0) normal normal 700 32px Times New Roman Text: rgb(0,0,0) normal normal 700 32px Arial
[10, 32]: Display:none [10, 32]: Display:none
[198, 32]: and [220, 32]: and
[257, 32]: visible:hidden [286, 32]: visible:hidden
[457, 32]: tests [510, 32]: tests
Shape: rgb(0,0,0) Path (Vector(x: 10, y: 89) > Vector(x: 790, y: 89) > Vector(x: 788, y: 91) > Vector(x: 12, y: 91)) Shape: rgb(0,0,0) Path (Vector(x: 10, y: 90) > Vector(x: 790, y: 90) > Vector(x: 788, y: 92) > Vector(x: 12, y: 92))
Shape: rgb(0,0,0) Path (Vector(x: 790, y: 89) > Vector(x: 790, y: 112) > Vector(x: 788, y: 110) > Vector(x: 788, y: 91)) Shape: rgb(0,0,0) Path (Vector(x: 790, y: 90) > Vector(x: 790, y: 112) > Vector(x: 788, y: 110) > Vector(x: 788, y: 92))
Shape: rgb(0,0,0) Path (Vector(x: 790, y: 112) > Vector(x: 10, y: 112) > Vector(x: 12, y: 110) > Vector(x: 788, y: 110)) Shape: rgb(0,0,0) Path (Vector(x: 790, y: 112) > Vector(x: 10, y: 112) > Vector(x: 12, y: 110) > Vector(x: 788, y: 110))
Shape: rgb(0,0,0) Path (Vector(x: 10, y: 112) > Vector(x: 10, y: 89) > Vector(x: 12, y: 91) > Vector(x: 12, y: 110)) Shape: rgb(0,0,0) Path (Vector(x: 10, y: 112) > Vector(x: 10, y: 90) > Vector(x: 12, y: 92) > Vector(x: 12, y: 110))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[12, 92]: This [12, 92]: This
[44, 92]: should [47, 92]: should
[91, 92]: be [98, 92]: be
[110, 92]: visible [120, 92]: visible
Shape: rgb(0,0,0) Path (Vector(x: 10, y: 143) > Vector(x: 790, y: 143) > Vector(x: 789, y: 144) > Vector(x: 11, y: 144)) Shape: rgb(0,0,0) Path (Vector(x: 10, y: 142) > Vector(x: 790, y: 142) > Vector(x: 789, y: 143) > Vector(x: 11, y: 143))
Shape: rgb(0,0,0) Path (Vector(x: 790, y: 143) > Vector(x: 790, y: 145) > Vector(x: 789, y: 144) > Vector(x: 789, y: 144)) Shape: rgb(0,0,0) Path (Vector(x: 790, y: 142) > Vector(x: 790, y: 144) > Vector(x: 789, y: 143) > Vector(x: 789, y: 143))
Shape: rgb(0,0,0) Path (Vector(x: 790, y: 145) > Vector(x: 10, y: 145) > Vector(x: 11, y: 144) > Vector(x: 789, y: 144)) Shape: rgb(0,0,0) Path (Vector(x: 790, y: 144) > Vector(x: 10, y: 144) > Vector(x: 11, y: 143) > Vector(x: 789, y: 143))
Shape: rgb(0,0,0) Path (Vector(x: 10, y: 145) > Vector(x: 10, y: 143) > Vector(x: 11, y: 144) > Vector(x: 11, y: 144)) Shape: rgb(0,0,0) Path (Vector(x: 10, y: 144) > Vector(x: 10, y: 142) > Vector(x: 11, y: 143) > Vector(x: 11, y: 143))

3
tests/reftests/zindex/z-index13.html
View File

@ -21,6 +21,9 @@
position:absolute; position:absolute;
top:0;left:0; top:0;left:0;
} }
body {
font-family: Arial;
}
</style></head> </style></head>
<body> <body>

2
tests/reftests/zindex/z-index13.txt
View File

@ -5,5 +5,5 @@ Clip: Path (Vector(x: 8, y: 8) > Vector(x: 208, y: 8) > Vector(x: 208, y: 208) >
Fill: rgb(0,255,255) Fill: rgb(0,255,255)
Clip: Path (Vector(x: 8, y: 8) > Vector(x: 108, y: 8) > Vector(x: 108, y: 108) > Vector(x: 8, y: 108)) Clip: Path (Vector(x: 8, y: 8) > Vector(x: 108, y: 8) > Vector(x: 108, y: 108) > Vector(x: 8, y: 108))
Fill: rgb(0,128,0) Fill: rgb(0,128,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 8]: outer [8, 8]: outer

1
tests/reftests/zindex/z-index14.html
View File

@ -8,6 +8,7 @@
* {margin:0;padding:0;} * {margin:0;padding:0;}
body { body {
background-color: green; background-color: green;
font-family: Arial;
} }
#div1 { #div1 {
background-color:cyan; background-color:cyan;

4
tests/reftests/zindex/z-index14.txt
View File

@ -1,9 +1,9 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgb(0,128,0) Rectangle: [0, 0, 800, 600] rgb(0,128,0)
Opacity: 1 Opacity: 1
Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 19) > Vector(x: 0, y: 19)) Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 18) > Vector(x: 0, y: 18))
Fill: rgb(0,128,0) Fill: rgb(0,128,0)
Clip: Path (Vector(x: 0, y: 0) > Vector(x: 200, y: 0) > Vector(x: 200, y: 200) > Vector(x: 0, y: 200)) Clip: Path (Vector(x: 0, y: 0) > Vector(x: 200, y: 0) > Vector(x: 200, y: 200) > Vector(x: 0, y: 200))
Fill: rgb(0,255,255) Fill: rgb(0,255,255)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[0, 0]: body [0, 0]: body

3
tests/reftests/zindex/z-index15.html
View File

@ -18,6 +18,9 @@
position:absolute; position:absolute;
top:0; left:0; top:0; left:0;
} }
body {
font-family: Arial;
}
</style></head> </style></head>
<body>body <body>body

4
tests/reftests/zindex/z-index15.txt
View File

@ -3,7 +3,7 @@ Rectangle: [0, 0, 800, 600] rgb(128,128,128)
Opacity: 1 Opacity: 1
Clip: Path (Vector(x: 0, y: 0) > Vector(x: 200, y: 0) > Vector(x: 200, y: 200) > Vector(x: 0, y: 200)) Clip: Path (Vector(x: 0, y: 0) > Vector(x: 200, y: 0) > Vector(x: 200, y: 200) > Vector(x: 0, y: 200))
Fill: rgb(0,255,255) Fill: rgb(0,255,255)
Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 19) > Vector(x: 0, y: 19)) Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 18) > Vector(x: 0, y: 18))
Fill: rgb(0,128,0) Fill: rgb(0,128,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[0, 0]: body [0, 0]: body

3
tests/reftests/zindex/z-index16.html
View File

@ -10,6 +10,9 @@
width: 3in; width: 3in;
height: 3in; height: 3in;
} }
body {
font-family: Arial;
}
</STYLE> </STYLE>
<script type="text/javascript" src="../../test.js"></script> <script type="text/javascript" src="../../test.js"></script>
</HEAD> </HEAD>

46
tests/reftests/zindex/z-index16.txt
View File

@ -1,31 +1,31 @@
Window: [800, 600] Window: [800, 600]
Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) Rectangle: [0, 0, 800, 600] rgba(0,0,0,0)
Opacity: 1 Opacity: 1
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 16]: This [8, 16]: This
[40, 16]: text [43, 16]: text
[68, 16]: will [73, 16]: will
[97, 16]: be [100, 16]: be
[116, 16]: beneath [122, 16]: beneath
[170, 16]: everything. [184, 16]: everything.
Clip: Path (Vector(x: 192, y: 192) > Vector(x: 480, y: 192) > Vector(x: 480, y: 480) > Vector(x: 192, y: 480)) Clip: Path (Vector(x: 192, y: 192) > Vector(x: 480, y: 192) > Vector(x: 480, y: 480) > Vector(x: 192, y: 480))
Draw image: Image ("/tests/assets/image.jpg") (source: [0, 0, 75, 75]) (destination: [0, 0, 75, 75]) Draw image: Image ("/tests/assets/image.jpg") (source: [0, 0, 75, 75]) (destination: [0, 0, 75, 75])
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[192, 192]: This [192, 192]: This
[224, 192]: text [227, 192]: text
[252, 192]: will [257, 192]: will
[281, 192]: underlay [284, 192]: underlay
[341, 192]: text1, [349, 192]: text1,
[381, 192]: but [393, 192]: but
[406, 192]: overlay [420, 192]: overlay
[458, 192]: the [192, 210]: the
[192, 211]: butterfly [219, 210]: butterfly
[251, 211]: image [280, 210]: image
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[192, 192]: This [192, 192]: This
[224, 192]: text [227, 192]: text
[252, 192]: will [257, 192]: will
[281, 192]: overlay [284, 192]: overlay
[333, 192]: the [340, 192]: the
[357, 192]: butterfly [366, 192]: butterfly
[416, 192]: image. [428, 192]: image.

3
tests/reftests/zindex/z-index17.html
View File

@ -16,6 +16,9 @@
body { body {
background: violet; background: violet;
} }
body {
font-family: Arial;
}
</style> </style>
<script type="text/javascript" src="../../test.js"></script> <script type="text/javascript" src="../../test.js"></script>
</head> </head>

10
tests/reftests/zindex/z-index17.txt
View File

@ -5,9 +5,9 @@ Clip: Path (Vector(x: 8, y: 8) > Vector(x: 792, y: 8) > Vector(x: 792, y: 8) > V
Fill: rgb(238,130,238) Fill: rgb(238,130,238)
Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 100) > Vector(x: 0, y: 100)) Clip: Path (Vector(x: 0, y: 0) > Vector(x: 800, y: 0) > Vector(x: 800, y: 100) > Vector(x: 0, y: 100))
Fill: rgb(85,107,47) Fill: rgb(85,107,47)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[0, 0]: fixed [0, 0]: fixed
[37, 0]: z [38, 0]: z
[44, 0]: - [46, 0]: -
[49, 0]: index [52, 0]: index
[89, 0]: 10 [94, 0]: 10

3
tests/reftests/zindex/z-index18.html
View File

@ -57,6 +57,9 @@
width: 100px; width: 100px;
height: 100px; height: 100px;
} }
body {
font-family: Arial;
}
</style> </style>
<script type="text/javascript" src="../../test.js"></script> <script type="text/javascript" src="../../test.js"></script>
</head> </head>

24
tests/reftests/zindex/z-index18.txt
View File

@ -5,43 +5,43 @@ Clip: Path (Vector(x: 8, y: 8) > Vector(x: 792, y: 8) > Vector(x: 792, y: 308) >
Fill: rgb(238,130,238) Fill: rgb(238,130,238)
Clip: Path (Vector(x: 8, y: 8) > Vector(x: 808, y: 8) > Vector(x: 808, y: 308) > Vector(x: 8, y: 308)) Clip: Path (Vector(x: 8, y: 8) > Vector(x: 808, y: 8) > Vector(x: 808, y: 308) > Vector(x: 8, y: 308))
Fill: rgb(0,128,0) Fill: rgb(0,128,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 8]: a [8, 8]: a
Clip: Path (Vector(x: 8, y: 8) > Vector(x: 808, y: 8) > Vector(x: 808, y: 308) > Vector(x: 8, y: 308)) Clip: Path (Vector(x: 8, y: 8) > Vector(x: 808, y: 8) > Vector(x: 808, y: 308) > Vector(x: 8, y: 308))
Fill: rgb(0,128,0) Fill: rgb(0,128,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[8, 8]: b [8, 8]: b
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: c [24, 18]: c
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: d [24, 18]: d
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: e [24, 18]: e
Clip: Path (Vector(x: 24, y: 18) > Vector(x: 824, y: 18) > Vector(x: 824, y: 318) > Vector(x: 24, y: 318)) Clip: Path (Vector(x: 24, y: 18) > Vector(x: 824, y: 18) > Vector(x: 824, y: 318) > Vector(x: 24, y: 318))
Fill: rgb(255,0,0) Fill: rgb(255,0,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: f [24, 18]: f
Clip: Path (Vector(x: 24, y: 18) > Vector(x: 424, y: 18) > Vector(x: 424, y: 318) > Vector(x: 24, y: 318)) Clip: Path (Vector(x: 24, y: 18) > Vector(x: 424, y: 18) > Vector(x: 424, y: 318) > Vector(x: 24, y: 318))
Fill: rgb(0,0,255) Fill: rgb(0,0,255)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: g [24, 18]: g
Clip: Path (Vector(x: 24, y: 18) > Vector(x: 224, y: 18) > Vector(x: 224, y: 218) > Vector(x: 24, y: 218)) Clip: Path (Vector(x: 24, y: 18) > Vector(x: 224, y: 18) > Vector(x: 224, y: 218) > Vector(x: 24, y: 218))
Fill: rgb(255,165,0) Fill: rgb(255,165,0)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: h [24, 18]: h
Clip: Path (Vector(x: -24, y: 18) > Vector(x: 776, y: 18) > Vector(x: 776, y: 118) > Vector(x: -24, y: 118)) Clip: Path (Vector(x: -24, y: 18) > Vector(x: 776, y: 18) > Vector(x: 776, y: 118) > Vector(x: -24, y: 118))
Fill: rgb(128,0,128) Fill: rgb(128,0,128)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[-24, 18]: i [-24, 18]: i
Clip: Path (Vector(x: 24, y: 68) > Vector(x: 824, y: 68) > Vector(x: 824, y: 168) > Vector(x: 24, y: 168)) Clip: Path (Vector(x: 24, y: 68) > Vector(x: 824, y: 68) > Vector(x: 824, y: 168) > Vector(x: 24, y: 168))
Fill: rgb(255,192,203) Fill: rgb(255,192,203)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 68]: j [24, 68]: j
Clip: Path (Vector(x: 64, y: 98) > Vector(x: 864, y: 98) > Vector(x: 864, y: 198) > Vector(x: 64, y: 198)) Clip: Path (Vector(x: 64, y: 98) > Vector(x: 864, y: 98) > Vector(x: 864, y: 198) > Vector(x: 64, y: 198))
Fill: rgb(0,0,128) Fill: rgb(0,0,128)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[64, 98]: k [64, 98]: k
Clip: Path (Vector(x: 24, y: 18) > Vector(x: 124, y: 18) > Vector(x: 124, y: 118) > Vector(x: 24, y: 118)) Clip: Path (Vector(x: 24, y: 18) > Vector(x: 124, y: 18) > Vector(x: 124, y: 118) > Vector(x: 24, y: 118))
Fill: rgb(165,42,42) Fill: rgb(165,42,42)
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[24, 18]: l [24, 18]: l

32
tests/reftests/zindex/z-index3.txt
View File

@ -52,15 +52,6 @@ Text: rgb(0,0,0) normal normal 400 12px Arial
Text: rgb(0,0,0) normal normal 700 12px Arial Text: rgb(0,0,0) normal normal 700 12px Arial
[92, 74]: LEVEL [92, 74]: LEVEL
[134, 74]: #2 [134, 74]: #2
Clip: Path (Vector(x: 197, y: 169) > Vector(x: 306, y: 169) > Vector(x: 306, y: 186) > Vector(x: 197, y: 186))
Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 169) > Vector(x: 306, y: 169) > Vector(x: 304, y: 171) > Vector(x: 199, y: 171))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 169) > Vector(x: 306, y: 186) > Vector(x: 304, y: 184) > Vector(x: 304, y: 171))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 186) > Vector(x: 197, y: 186) > Vector(x: 199, y: 184) > Vector(x: 304, y: 184))
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 186) > Vector(x: 197, y: 169) > Vector(x: 199, y: 171) > Vector(x: 199, y: 184))
Text: rgb(0,0,0) normal normal 700 12px Arial
[204, 171]: LEVEL
[246, 171]: #3
Clip: Path (Vector(x: 197, y: 81) > Vector(x: 306, y: 81) > Vector(x: 306, y: 98) > Vector(x: 197, y: 98)) Clip: Path (Vector(x: 197, y: 81) > Vector(x: 306, y: 81) > Vector(x: 306, y: 98) > Vector(x: 197, y: 98))
Fill: rgb(221,221,255) Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 81) > Vector(x: 306, y: 81) > Vector(x: 304, y: 83) > Vector(x: 199, y: 83)) Shape: rgb(0,0,153) Path (Vector(x: 197, y: 81) > Vector(x: 306, y: 81) > Vector(x: 304, y: 83) > Vector(x: 199, y: 83))
@ -70,6 +61,15 @@ Shape: rgb(0,0,153) Path (Vector(x: 197, y: 98) > Vector(x: 197, y: 81) > Vector
Text: rgb(0,0,0) normal normal 700 12px Arial Text: rgb(0,0,0) normal normal 700 12px Arial
[204, 83]: LEVEL [204, 83]: LEVEL
[246, 83]: #3 [246, 83]: #3
Clip: Path (Vector(x: 197, y: 98) > Vector(x: 306, y: 98) > Vector(x: 306, y: 116) > Vector(x: 197, y: 116))
Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 98) > Vector(x: 306, y: 98) > Vector(x: 304, y: 100) > Vector(x: 199, y: 100))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 98) > Vector(x: 306, y: 116) > Vector(x: 304, y: 114) > Vector(x: 304, y: 100))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 116) > Vector(x: 197, y: 116) > Vector(x: 199, y: 114) > Vector(x: 304, y: 114))
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 116) > Vector(x: 197, y: 98) > Vector(x: 199, y: 100) > Vector(x: 199, y: 114))
Text: rgb(0,0,0) normal normal 700 12px Arial
[204, 100]: LEVEL
[246, 100]: #3
Clip: Path (Vector(x: 197, y: 116) > Vector(x: 306, y: 116) > Vector(x: 306, y: 134) > Vector(x: 197, y: 134)) Clip: Path (Vector(x: 197, y: 116) > Vector(x: 306, y: 116) > Vector(x: 306, y: 134) > Vector(x: 197, y: 134))
Fill: rgb(221,221,255) Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 116) > Vector(x: 306, y: 116) > Vector(x: 304, y: 118) > Vector(x: 199, y: 118)) Shape: rgb(0,0,153) Path (Vector(x: 197, y: 116) > Vector(x: 306, y: 116) > Vector(x: 304, y: 118) > Vector(x: 199, y: 118))
@ -97,15 +97,15 @@ Shape: rgb(0,0,153) Path (Vector(x: 197, y: 169) > Vector(x: 197, y: 151) > Vect
Text: rgb(0,0,0) normal normal 700 12px Arial Text: rgb(0,0,0) normal normal 700 12px Arial
[204, 153]: LEVEL [204, 153]: LEVEL
[246, 153]: #3 [246, 153]: #3
Clip: Path (Vector(x: 197, y: 98) > Vector(x: 306, y: 98) > Vector(x: 306, y: 116) > Vector(x: 197, y: 116)) Clip: Path (Vector(x: 197, y: 169) > Vector(x: 306, y: 169) > Vector(x: 306, y: 186) > Vector(x: 197, y: 186))
Fill: rgb(221,221,255) Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 98) > Vector(x: 306, y: 98) > Vector(x: 304, y: 100) > Vector(x: 199, y: 100)) Shape: rgb(0,0,153) Path (Vector(x: 197, y: 169) > Vector(x: 306, y: 169) > Vector(x: 304, y: 171) > Vector(x: 199, y: 171))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 98) > Vector(x: 306, y: 116) > Vector(x: 304, y: 114) > Vector(x: 304, y: 100)) Shape: rgb(0,0,153) Path (Vector(x: 306, y: 169) > Vector(x: 306, y: 186) > Vector(x: 304, y: 184) > Vector(x: 304, y: 171))
Shape: rgb(0,0,153) Path (Vector(x: 306, y: 116) > Vector(x: 197, y: 116) > Vector(x: 199, y: 114) > Vector(x: 304, y: 114)) Shape: rgb(0,0,153) Path (Vector(x: 306, y: 186) > Vector(x: 197, y: 186) > Vector(x: 199, y: 184) > Vector(x: 304, y: 184))
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 116) > Vector(x: 197, y: 98) > Vector(x: 199, y: 100) > Vector(x: 199, y: 114)) Shape: rgb(0,0,153) Path (Vector(x: 197, y: 186) > Vector(x: 197, y: 169) > Vector(x: 199, y: 171) > Vector(x: 199, y: 184))
Text: rgb(0,0,0) normal normal 700 12px Arial Text: rgb(0,0,0) normal normal 700 12px Arial
[204, 100]: LEVEL [204, 171]: LEVEL
[246, 100]: #3 [246, 171]: #3
Clip: Path (Vector(x: 197, y: 186) > Vector(x: 306, y: 186) > Vector(x: 306, y: 204) > Vector(x: 197, y: 204)) Clip: Path (Vector(x: 197, y: 186) > Vector(x: 306, y: 186) > Vector(x: 306, y: 204) > Vector(x: 197, y: 204))
Fill: rgb(221,221,255) Fill: rgb(221,221,255)
Shape: rgb(0,0,153) Path (Vector(x: 197, y: 186) > Vector(x: 306, y: 186) > Vector(x: 304, y: 188) > Vector(x: 199, y: 188)) Shape: rgb(0,0,153) Path (Vector(x: 197, y: 186) > Vector(x: 306, y: 186) > Vector(x: 304, y: 188) > Vector(x: 199, y: 188))

4
tests/reftests/zindex/z-index4.html
View File

@ -21,6 +21,10 @@
background-color: #ffdddd; background-color: #ffdddd;
z-index: -1; z-index: -1;
} }
body {
font-family: Arial;
}
</style></head> </style></head>
<body> <body>

8
tests/reftests/zindex/z-index4.txt
View File

@ -9,15 +9,15 @@ Shape: rgb(102,153,102) Path (Vector(x: 8, y: 8) > Vector(x: 267, y: 8) > Vector
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 8) > Vector(x: 267, y: 82) > Vector(x: 265, y: 80) > Vector(x: 265, y: 10)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 8) > Vector(x: 267, y: 82) > Vector(x: 265, y: 80) > Vector(x: 265, y: 10))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 8, y: 82) > Vector(x: 10, y: 80) > Vector(x: 265, y: 80)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 8, y: 82) > Vector(x: 10, y: 80) > Vector(x: 265, y: 80))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 80)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 80))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 10]: LEVEL [15, 10]: LEVEL
[70, 10]: #1 [69, 10]: #1
Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156)) Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156))
Fill: rgb(204,255,204) Fill: rgb(204,255,204)
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 265, y: 84) > Vector(x: 10, y: 84)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 265, y: 84) > Vector(x: 10, y: 84))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 84]: LEVEL [15, 84]: LEVEL
[70, 84]: #1 [69, 84]: #1

3
tests/reftests/zindex/z-index5.html
View File

@ -20,6 +20,9 @@
width: 250px; width: 250px;
background-color: #ffdddd; background-color: #ffdddd;
} }
body {
font-family: Arial;
}
</style></head> </style></head>
<body> <body>

8
tests/reftests/zindex/z-index5.txt
View File

@ -7,9 +7,9 @@ Shape: rgb(102,153,102) Path (Vector(x: 8, y: 8) > Vector(x: 267, y: 8) > Vector
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 8) > Vector(x: 267, y: 82) > Vector(x: 265, y: 80) > Vector(x: 265, y: 10)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 8) > Vector(x: 267, y: 82) > Vector(x: 265, y: 80) > Vector(x: 265, y: 10))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 8, y: 82) > Vector(x: 10, y: 80) > Vector(x: 265, y: 80)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 8, y: 82) > Vector(x: 10, y: 80) > Vector(x: 265, y: 80))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 80)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 8, y: 8) > Vector(x: 10, y: 10) > Vector(x: 10, y: 80))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 10]: LEVEL [15, 10]: LEVEL
[70, 10]: #1 [69, 10]: #1
Clip: Path (Vector(x: 8, y: 0) > Vector(x: 258, y: 0) > Vector(x: 258, y: 600) > Vector(x: 8, y: 600)) Clip: Path (Vector(x: 8, y: 0) > Vector(x: 258, y: 0) > Vector(x: 258, y: 600) > Vector(x: 8, y: 600))
Fill: rgb(255,221,221) Fill: rgb(255,221,221)
Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156)) Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156))
@ -18,6 +18,6 @@ Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vect
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 84]: LEVEL [15, 84]: LEVEL
[70, 84]: #1 [69, 84]: #1

3
tests/reftests/zindex/z-index6.html
View File

@ -23,6 +23,9 @@
div.z1 { div.z1 {
z-index: 1; z-index: 1;
} }
body {
font-family: Arial;
}
</style></head> </style></head>
<body> <body>

16
tests/reftests/zindex/z-index6.txt
View File

@ -7,9 +7,9 @@ Shape: rgb(102,153,102) Path (Vector(x: 28, y: 113) > Vector(x: 287, y: 113) > V
Shape: rgb(102,153,102) Path (Vector(x: 287, y: 113) > Vector(x: 287, y: 187) > Vector(x: 285, y: 185) > Vector(x: 285, y: 115)) Shape: rgb(102,153,102) Path (Vector(x: 287, y: 113) > Vector(x: 287, y: 187) > Vector(x: 285, y: 185) > Vector(x: 285, y: 115))
Shape: rgb(102,153,102) Path (Vector(x: 287, y: 187) > Vector(x: 28, y: 187) > Vector(x: 30, y: 185) > Vector(x: 285, y: 185)) Shape: rgb(102,153,102) Path (Vector(x: 287, y: 187) > Vector(x: 28, y: 187) > Vector(x: 30, y: 185) > Vector(x: 285, y: 185))
Shape: rgb(102,153,102) Path (Vector(x: 28, y: 187) > Vector(x: 28, y: 113) > Vector(x: 30, y: 115) > Vector(x: 30, y: 185)) Shape: rgb(102,153,102) Path (Vector(x: 28, y: 187) > Vector(x: 28, y: 113) > Vector(x: 30, y: 115) > Vector(x: 30, y: 185))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[35, 115]: z [35, 115]: z
[42, 115]: - [43, 115]: -
[48, 115]: index:0 [48, 115]: index:0
Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156)) Clip: Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 8, y: 156))
Fill: rgb(204,255,204) Fill: rgb(204,255,204)
@ -17,18 +17,18 @@ Shape: rgb(102,153,102) Path (Vector(x: 8, y: 82) > Vector(x: 267, y: 82) > Vect
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 82) > Vector(x: 267, y: 156) > Vector(x: 265, y: 154) > Vector(x: 265, y: 84))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 8, y: 156) > Vector(x: 10, y: 154) > Vector(x: 265, y: 154))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 8, y: 82) > Vector(x: 10, y: 84) > Vector(x: 10, y: 154))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 84]: default [15, 84]: default
[64, 84]: z [68, 84]: z
[70, 84]: - [76, 84]: -
[76, 84]: index [81, 84]: index
Clip: Path (Vector(x: 8, y: 156) > Vector(x: 267, y: 156) > Vector(x: 267, y: 230) > Vector(x: 8, y: 230)) Clip: Path (Vector(x: 8, y: 156) > Vector(x: 267, y: 156) > Vector(x: 267, y: 230) > Vector(x: 8, y: 230))
Fill: rgb(204,255,204) Fill: rgb(204,255,204)
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 267, y: 156) > Vector(x: 265, y: 158) > Vector(x: 10, y: 158)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 156) > Vector(x: 267, y: 156) > Vector(x: 265, y: 158) > Vector(x: 10, y: 158))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 267, y: 230) > Vector(x: 265, y: 228) > Vector(x: 265, y: 158)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 156) > Vector(x: 267, y: 230) > Vector(x: 265, y: 228) > Vector(x: 265, y: 158))
Shape: rgb(102,153,102) Path (Vector(x: 267, y: 230) > Vector(x: 8, y: 230) > Vector(x: 10, y: 228) > Vector(x: 265, y: 228)) Shape: rgb(102,153,102) Path (Vector(x: 267, y: 230) > Vector(x: 8, y: 230) > Vector(x: 10, y: 228) > Vector(x: 265, y: 228))
Shape: rgb(102,153,102) Path (Vector(x: 8, y: 230) > Vector(x: 8, y: 156) > Vector(x: 10, y: 158) > Vector(x: 10, y: 228)) Shape: rgb(102,153,102) Path (Vector(x: 8, y: 230) > Vector(x: 8, y: 156) > Vector(x: 10, y: 158) > Vector(x: 10, y: 228))
Text: rgb(0,0,0) normal normal 400 16px Times New Roman Text: rgb(0,0,0) normal normal 400 16px Arial
[15, 158]: z [15, 158]: z
[22, 158]: - [23, 158]: -
[28, 158]: index:1 [28, 158]: index:1

4
tests/test.js
View File

@ -40,7 +40,9 @@ var REFTEST = window.location.search.indexOf('reftest') !== -1;
promise.then(function(output) { promise.then(function(output) {
var canvas = Array.isArray(targets) ? output[0] : output; var canvas = Array.isArray(targets) ? output[0] : output;
if (Array.isArray(targets)) { if (Array.isArray(targets)) {
console.log(output[1]); console.log(output[1].split('\n').map(function(line, i) {
return (i + 1) + ':' + line;
}).join('\n'));
} }
var $canvas = $(canvas), var $canvas = $(canvas),
finishTime = new Date(); finishTime = new Date();

12
tests/testrunner.js
View File

@ -177,8 +177,8 @@ const assertPath = (result, expected, desc) => {
break; break;
case 'Transform': case 'Transform':
expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`);
expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`);
expect(RESULT.matrix).to.equal( expect(RESULT.matrix).to.equal(
args.matrix, args.matrix,
`${desc} matrix` `${desc} matrix`
@ -186,8 +186,8 @@ const assertPath = (result, expected, desc) => {
break; break;
case 'Repeat': case 'Repeat':
expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`);
expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`);
expect(RESULT.width).to.equal( expect(RESULT.width).to.equal(
args.width, args.width,
`${desc} width` `${desc} width`
@ -204,8 +204,8 @@ const assertPath = (result, expected, desc) => {
break; break;
case 'Gradient': case 'Gradient':
expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`);
expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`);
expect(RESULT.x0).to.be.closeTo( expect(RESULT.x0).to.be.closeTo(
args.x0, args.x0,
5, 5,