From 77393074ba18be56d38b9ae8153d2998de0f3f4b Mon Sep 17 00:00:00 2001 From: Niklas von Hertzen Date: Wed, 9 Aug 2017 11:52:42 +0800 Subject: [PATCH] Use tree order when z-index is the same --- src/NodeContainer.js | 4 +- src/NodeParser.js | 15 ++- src/Renderer.js | 3 +- tests/reftests/border/radius.txt | 4 +- tests/reftests/text/fontawesome.html | 5 + tests/reftests/text/fontawesome.txt | 142 ++++++++++---------- tests/reftests/text/shadow.html | 5 +- tests/reftests/text/shadow.txt | 166 ++++++++++++------------ tests/reftests/transform/nested.html | 5 +- tests/reftests/transform/nested.txt | 70 +++++----- tests/reftests/transform/rotate.html | 6 +- tests/reftests/transform/translate.html | 5 +- tests/reftests/transform/translate.txt | 60 ++++----- tests/reftests/visibility.html | 5 +- tests/reftests/visibility.txt | 36 ++--- tests/reftests/zindex/z-index13.html | 3 + tests/reftests/zindex/z-index13.txt | 2 +- tests/reftests/zindex/z-index14.html | 1 + tests/reftests/zindex/z-index14.txt | 4 +- tests/reftests/zindex/z-index15.html | 3 + tests/reftests/zindex/z-index15.txt | 4 +- tests/reftests/zindex/z-index16.html | 3 + tests/reftests/zindex/z-index16.txt | 46 +++---- tests/reftests/zindex/z-index17.html | 3 + tests/reftests/zindex/z-index17.txt | 10 +- tests/reftests/zindex/z-index18.html | 3 + tests/reftests/zindex/z-index18.txt | 24 ++-- tests/reftests/zindex/z-index3.txt | 32 ++--- tests/reftests/zindex/z-index4.html | 6 +- tests/reftests/zindex/z-index4.txt | 8 +- tests/reftests/zindex/z-index5.html | 3 + tests/reftests/zindex/z-index5.txt | 8 +- tests/reftests/zindex/z-index6.html | 3 + tests/reftests/zindex/z-index6.txt | 16 +-- tests/test.js | 4 +- tests/testrunner.js | 12 +- 36 files changed, 392 insertions(+), 337 deletions(-) diff --git a/src/NodeContainer.js b/src/NodeContainer.js index c8cad46..9408913 100644 --- a/src/NodeContainer.js +++ b/src/NodeContainer.js @@ -80,9 +80,11 @@ export default class NodeContainer { bounds: Bounds; curvedBounds: BoundCurves; image: ?string; + index: number; - constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader) { + constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader, index: number) { this.parent = parent; + this.index = index; this.childNodes = []; const defaultView = node.ownerDocument.defaultView; const style = defaultView.getComputedStyle(node, null); diff --git a/src/NodeParser.js b/src/NodeParser.js index 97ae914..167d17b 100644 --- a/src/NodeParser.js +++ b/src/NodeParser.js @@ -17,11 +17,13 @@ export const NodeParser = ( 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); createPseudoHideStyles(node.ownerDocument); - parseNodeTree(node, container, stack, imageLoader); + parseNodeTree(node, container, stack, imageLoader, index); if (__DEV__) { logger.log(`Finished parsing node tree`); @@ -41,7 +43,8 @@ const parseNodeTree = ( node: HTMLElement, parent: NodeContainer, stack: StackingContext, - imageLoader: ImageLoader + imageLoader: ImageLoader, + index: number ): void => { for (let childNode = node.firstChild, nextNode; childNode; childNode = nextNode) { nextNode = childNode.nextSibling; @@ -57,7 +60,7 @@ const parseNodeTree = ( if (IGNORED_NODE_NAMES.indexOf(childNode.nodeName) === -1) { inlinePseudoElement(childNode, PSEUDO_BEFORE); inlinePseudoElement(childNode, PSEUDO_AFTER); - const container = new NodeContainer(childNode, parent, imageLoader); + const container = new NodeContainer(childNode, parent, imageLoader, index++); if (container.isVisible()) { if (childNode.tagName === 'INPUT') { // $FlowFixMe @@ -89,12 +92,12 @@ const parseNodeTree = ( ); parentStack.contexts.push(childStack); if (SHOULD_TRAVERSE_CHILDREN) { - parseNodeTree(childNode, container, childStack, imageLoader); + parseNodeTree(childNode, container, childStack, imageLoader, index); } } else { stack.children.push(container); if (SHOULD_TRAVERSE_CHILDREN) { - parseNodeTree(childNode, container, stack, imageLoader); + parseNodeTree(childNode, container, stack, imageLoader, index); } } } diff --git a/src/Renderer.js b/src/Renderer.js index 2b277a2..1121341 100644 --- a/src/Renderer.js +++ b/src/Renderer.js @@ -395,5 +395,6 @@ const sortByZIndex = (a: StackingContext, b: StackingContext): number => { } else if (a.container.style.zIndex.order < b.container.style.zIndex.order) { return -1; } - return 0; + + return a.container.index > b.container.index ? 1 : -1; }; diff --git a/tests/reftests/border/radius.txt b/tests/reftests/border/radius.txt index 1c06e17..b134366 100644 --- a/tests/reftests/border/radius.txt +++ b/tests/reftests/border/radius.txt @@ -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)) 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) -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: 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)) \ No newline at end of file diff --git a/tests/reftests/text/fontawesome.html b/tests/reftests/text/fontawesome.html index 081ab26..c5f0aed 100644 --- a/tests/reftests/text/fontawesome.html +++ b/tests/reftests/text/fontawesome.html @@ -5,6 +5,11 @@ fontawesome icons +
diff --git a/tests/reftests/text/fontawesome.txt b/tests/reftests/text/fontawesome.txt index 513ab43..c89d63e 100644 --- a/tests/reftests/text/fontawesome.txt +++ b/tests/reftests/text/fontawesome.txt @@ -1,88 +1,88 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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 - [101, 8]: icons -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [92, 98]: fa - [104, 98]: - - [110, 98]: 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: 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: 37) > Vector(x: 8, y: 37) > Vector(x: 9, y: 36) > Vector(x: 791, y: 36)) -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)) -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [55, 242]: fa - [67, 242]: - - [72, 242]: twitter - [118, 242]: on - [138, 242]: fa - [151, 242]: - - [156, 242]: square - [198, 242]: - - [203, 242]: o -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [55, 285]: fa - [67, 285]: - - [72, 285]: flag - [101, 285]: on - [121, 285]: fa - [134, 285]: - - [139, 285]: circle -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [55, 328]: fa - [67, 328]: - - [72, 328]: terminal - [130, 328]: on - [150, 328]: fa - [162, 328]: - - [168, 328]: square -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [55, 371]: fa - [67, 371]: - - [72, 371]: ban - [100, 371]: on - [120, 371]: fa - [132, 371]: - - [137, 371]: camera + [113, 8]: icons +Text: rgb(0,0,0) normal normal 400 16px Arial + [92, 97]: fa + [106, 97]: - + [111, 97]: 5x +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: 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: 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: 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 Arial + [55, 239]: fa + [68, 239]: - + [74, 239]: twitter + [121, 239]: on + [143, 239]: fa + [156, 239]: - + [162, 239]: square + [211, 239]: - + [216, 239]: o +Text: rgb(0,0,0) normal normal 400 16px Arial + [55, 282]: fa + [68, 282]: - + [74, 282]: flag + [104, 282]: on + [126, 282]: fa + [140, 282]: - + [145, 282]: circle +Text: rgb(0,0,0) normal normal 400 16px Arial + [55, 325]: fa + [68, 325]: - + [74, 325]: terminal + [135, 325]: on + [157, 325]: fa + [171, 325]: - + [176, 325]: square +Text: rgb(0,0,0) normal normal 400 16px Arial + [55, 368]: fa + [68, 368]: - + [74, 368]: ban + [105, 368]: on + [127, 368]: fa + [140, 368]: - + [146, 368]: camera Text: rgb(0,0,0) normal normal 400 80px FontAwesome - [8, 44]:  -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [42, 141]: List - [71, 141]: icons + [8, 43]:  +Text: rgb(0,0,0) normal normal 400 16px Arial + [42, 140]: List + [71, 140]: icons Text: rgb(0,0,0) normal normal 400 16px FontAwesome - [18, 143]:  -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [42, 160]: can - [69, 160]: be - [87, 160]: used + [18, 142]:  +Text: rgb(0,0,0) normal normal 400 16px Arial + [42, 158]: can + [73, 158]: be + [95, 158]: used Text: rgb(0,0,0) normal normal 400 16px FontAwesome - [18, 162]:  -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [42, 179]: as - [59, 179]: bullets -Transform: (24, 186) [0.99, 0.16, -0.16, 0.99, 0, 0] + [18, 160]:  +Text: rgb(0,0,0) normal normal 400 16px Arial + [42, 176]: as + [63, 176]: bullets +Transform: (24, 182) [0.97, 0.26, -0.26, 0.97, 0, 0] Text: rgb(0,0,0) normal normal 400 16px FontAwesome - [17, 180]:  -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [42, 198]: in - [59, 198]: lists + [16, 177]:  +Text: rgb(0,0,0) normal normal 400 16px Arial + [42, 194]: in + [59, 194]: lists 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 - [13, 232]:  + [13, 228]:  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 - [11, 274]:  + [11, 270]:  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 - [11, 317]:  + [11, 313]:  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 - [18, 370]:  + [18, 366]:  Text: rgb(0,0,0) normal normal 400 42.6667px FontAwesome - [11, 360]:  \ No newline at end of file + [11, 356]:  \ No newline at end of file diff --git a/tests/reftests/text/shadow.html b/tests/reftests/text/shadow.html index 9dd72a0..f4e43a4 100644 --- a/tests/reftests/text/shadow.html +++ b/tests/reftests/text/shadow.html @@ -35,8 +35,11 @@ .red-text-shadow { text-shadow: 0 -2px; } - + body { + font-family: Arial; + } +
diff --git a/tests/reftests/text/shadow.txt b/tests/reftests/text/shadow.txt index 6aeef47..b20da79 100644 --- a/tests/reftests/text/shadow.txt +++ b/tests/reftests/text/shadow.txt @@ -1,88 +1,88 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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 - [48, 8]: text -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [271, 8]: followed - [332, 8]: by - [352, 8]: more - [388, 8]: text - [416, 8]: without - [469, 8]: shadow. -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [653, 8]: and - [680, 8]: some - [718, 8]: more - [754, 8]: text - [8, 27]: without - [61, 27]: shadow + [54, 8]: text +Text: rgb(0,0,0) normal normal 400 16px Arial + [292, 8]: followed + [355, 8]: by + [376, 8]: more + [417, 8]: text + [447, 8]: without + [502, 8]: shadow. +Text: rgb(0,0,0) normal normal 400 16px Arial + [704, 8]: and + [736, 8]: some + [8, 26]: more + [49, 26]: text + [79, 26]: without + [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) - [8, 180]: Sed - [53, 180]: ut - [80, 180]: perspiciatis - [208, 180]: unde - [268, 180]: omnis - [339, 180]: iste - [382, 180]: natus - [446, 180]: error - [506, 180]: sit - [538, 180]: voluptatem - [8, 207]: accusantium - [148, 207]: doloremque - [282, 207]: laudantium, - [418, 207]: totam - [486, 207]: rem - [534, 207]: aperiam, - [634, 207]: eaque - [702, 207]: ipsa - [8, 234]: quae - [65, 234]: ab - [96, 234]: illo - [136, 234]: inventore. -Text: rgb(0,0,0) normal normal 400 16px Times New Roman Shadows: (rgb(0,0,0) 0px -2px 0px) - [8, 286]: Sed - [36, 286]: ut - [52, 286]: perspiciatis - [129, 286]: unde - [164, 286]: omnis - [208, 286]: iste - [234, 286]: natus - [272, 286]: error - [307, 286]: sit - [326, 286]: voluptatem - [402, 286]: accusantium - [486, 286]: doloremque - [566, 286]: laudantium, - [646, 286]: totam - [686, 286]: rem - [715, 286]: aperiam, - [8, 305]: eaque - [49, 305]: ipsa - [79, 305]: quae - [113, 305]: ab - [132, 305]: illo - [158, 305]: inventore. -Text: rgb(0,0,0) normal normal 400 16px Times New Roman Shadows: (rgb(136,136,136) 1px 1px 3px) - [76, 8]: followed - [137, 8]: by - [157, 8]: text - [185, 8]: with - [218, 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) - [525, 8]: Multi - [567, 8]: text - [597, 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) - [8, 46]: testing - [148, 46]: with - [245, 46]: 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 - [470, 46]: testing - [606, 46]: - [618, 46]: with - [709, 46]: - [8, 102]: low - [80, 102]: - [92, 102]: opacity \ No newline at end of file + [8, 178]: Sed + [53, 178]: ut + [80, 178]: perspiciatis + [208, 178]: unde + [268, 178]: omnis + [339, 178]: iste + [382, 178]: natus + [446, 178]: error + [506, 178]: sit + [538, 178]: voluptatem + [8, 206]: accusantium + [148, 206]: doloremque + [282, 206]: laudantium, + [418, 206]: totam + [486, 206]: rem + [534, 206]: aperiam, + [634, 206]: eaque + [702, 206]: ipsa + [8, 233]: quae + [65, 233]: ab + [96, 233]: illo + [136, 233]: inventore. +Text: rgb(0,0,0) normal normal 400 16px Arial Shadows: (rgb(0,0,0) 0px -2px 0px) + [8, 284]: Sed + [41, 284]: ut + [59, 284]: perspiciatis + [143, 284]: unde + [183, 284]: omnis + [230, 284]: iste + [260, 284]: natus + [303, 284]: error + [342, 284]: sit + [362, 284]: voluptatem + [445, 284]: accusantium + [539, 284]: doloremque + [628, 284]: laudantium, + [715, 284]: totam + [760, 284]: rem + [8, 302]: aperiam, + [75, 302]: eaque + [124, 302]: ipsa + [158, 302]: quae + [198, 302]: ab + [220, 302]: illo + [244, 302]: inventore. +Text: rgb(0,0,0) normal normal 400 16px Arial Shadows: (rgb(136,136,136) 1px 1px 3px) + [84, 8]: followed + [148, 8]: by + [169, 8]: text + [199, 8]: with + [232, 8]: shadow +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) + [566, 8]: Multi + [607, 8]: text + [640, 8]: shadow +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, 45]: testing + [163, 45]: with + [262, 45]: transparent +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 + [518, 45]: testing + [675, 45]: + [688, 45]: with + [784, 45]: + [8, 100]: low + [88, 100]: + [101, 100]: opacity \ No newline at end of file diff --git a/tests/reftests/transform/nested.html b/tests/reftests/transform/nested.html index b523ad7..8c88d54 100644 --- a/tests/reftests/transform/nested.html +++ b/tests/reftests/transform/nested.html @@ -35,8 +35,11 @@ display: inline-block; } - + body { + font-family: Arial; + } +
First level content
with second level content
and third level content
, ending second
, ending first
diff --git a/tests/reftests/transform/nested.txt b/tests/reftests/transform/nested.txt index 0aca0f4..8e39330 100644 --- a/tests/reftests/transform/nested.txt +++ b/tests/reftests/transform/nested.txt @@ -1,42 +1,42 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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) -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [8, 124]: First - [41, 124]: level - [76, 124]: content -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [568, 124]: , - [576, 124]: ending - [624, 124]: first -Clip: Path (Vector(x: 653, y: 123) > Vector(x: 749, y: 123) > Vector(x: 749, y: 142) > Vector(x: 653, y: 142)) +Text: rgb(0,0,0) normal normal 400 16px Arial + [8, 123]: First + [44, 123]: level + [81, 123]: content +Text: rgb(0,0,0) normal normal 400 16px Arial + [620, 123]: , + [630, 123]: ending + [682, 123]: first +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) -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [653, 124]: something - [724, 124]: else -Transform: (348, 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)) +Text: rgb(0,0,0) normal normal 400 16px Arial + [8, 156]: something + [86, 156]: else +Transform: (379, 132) [0.99, 0.13, -0.13, 0.99, 0, 0] + 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) - 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: 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: 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: 128, y: 157) > Vector(x: 128, y: 108) > Vector(x: 143, y: 123) > Vector(x: 143, y: 142)) - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [143, 123]: with - [175, 123]: second - [224, 123]: level - [258, 123]: content - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [453, 123]: , - [461, 123]: ending - [509, 123]: second - Transform: (381, 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)) + 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: 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: 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: 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 Arial + [153, 123]: with + [186, 123]: second + [242, 123]: level + [279, 123]: content + Text: rgb(0,0,0) normal normal 400 16px Arial + [493, 123]: , + [501, 123]: ending + [554, 123]: second + Transform: (414, 132) [0.33, -0.94, 0.94, 0.33, 0, 0] + 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) - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [310, 123]: and - [337, 123]: third - [371, 123]: level - [406, 123]: content \ No newline at end of file + Text: rgb(0,0,0) normal normal 400 16px Arial + [336, 123]: and + [367, 123]: third + [403, 123]: level + [440, 123]: content \ No newline at end of file diff --git a/tests/reftests/transform/rotate.html b/tests/reftests/transform/rotate.html index dc2f158..61bf661 100644 --- a/tests/reftests/transform/rotate.html +++ b/tests/reftests/transform/rotate.html @@ -36,7 +36,11 @@ -o-transform: rotate(45deg); /* Opera 10.50-12.00 */ transform:rotate(45deg); } -
diff --git a/tests/reftests/transform/translate.html b/tests/reftests/transform/translate.html index 86301b3..0630b09 100644 --- a/tests/reftests/transform/translate.html +++ b/tests/reftests/transform/translate.html @@ -36,8 +36,11 @@ display: inline-block; padding: 10px; } - + body { + font-family: Arial; + } +
First level content
with second level content
and third level content
, ending second
, ending first
diff --git a/tests/reftests/transform/translate.txt b/tests/reftests/transform/translate.txt index 1e93d11..783e953 100644 --- a/tests/reftests/transform/translate.txt +++ b/tests/reftests/transform/translate.txt @@ -1,37 +1,37 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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) -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 - [51, 148]: level - [86, 148]: content -Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [608, 148]: , - [616, 148]: ending - [664, 148]: first -Transform: (373, 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)) + [54, 148]: level + [91, 148]: content +Text: rgb(0,0,0) normal normal 400 16px Arial + [660, 148]: , + [670, 148]: ending + [722, 148]: first +Transform: (404, 157) [1, 0, 0, 1, 125, 0] + 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) - 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: 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: 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: 138, y: 197) > Vector(x: 138, y: 118) > Vector(x: 148, y: 128) > Vector(x: 148, y: 187)) - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [158, 148]: with - [190, 148]: second - [238, 148]: level - [274, 148]: content - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [488, 148]: , - [496, 148]: ending - [544, 148]: second - Transform: (425, 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)) + 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: 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: 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: 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 Arial + [168, 148]: with + [201, 148]: second + [257, 148]: level + [294, 148]: content + Text: rgb(0,0,0) normal normal 400 16px Arial + [527, 148]: , + [537, 148]: ending + [589, 148]: second + Transform: (451, 188) [1, 0, 0, 1, 100, -25] + 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) - Text: rgb(0,0,0) normal normal 400 16px Times New Roman - [335, 148]: and - [362, 148]: third - [396, 148]: level - [431, 148]: content \ No newline at end of file + Text: rgb(0,0,0) normal normal 400 16px Arial + [361, 148]: and + [392, 148]: third + [428, 148]: level + [465, 148]: content \ No newline at end of file diff --git a/tests/reftests/visibility.html b/tests/reftests/visibility.html index 77dcdb9..3071bc4 100644 --- a/tests/reftests/visibility.html +++ b/tests/reftests/visibility.html @@ -11,8 +11,11 @@ .none { display:none } - + body { + font-family: Arial; + } +
diff --git a/tests/reftests/visibility.txt b/tests/reftests/visibility.txt index 17bfa2f..46f6746 100644 --- a/tests/reftests/visibility.txt +++ b/tests/reftests/visibility.txt @@ -2,24 +2,24 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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: 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: 178) > Vector(x: 8, y: 178) > Vector(x: 10, y: 176) > Vector(x: 790, y: 176)) -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)) -Text: rgb(0,0,0) normal normal 700 32px Times New Roman +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: 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: 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 Arial [10, 32]: Display:none - [198, 32]: and - [257, 32]: visible:hidden - [457, 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: 790, y: 89) > Vector(x: 790, y: 112) > Vector(x: 788, y: 110) > Vector(x: 788, y: 91)) + [220, 32]: and + [286, 32]: visible:hidden + [510, 32]: tests +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: 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: 10, y: 112) > Vector(x: 10, y: 89) > Vector(x: 12, y: 91) > Vector(x: 12, y: 110)) -Text: rgb(0,0,0) normal normal 400 16px Times New Roman +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 Arial [12, 92]: This - [44, 92]: should - [91, 92]: be - [110, 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: 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: 145) > Vector(x: 10, y: 145) > Vector(x: 11, y: 144) > Vector(x: 789, y: 144)) -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)) \ No newline at end of file + [47, 92]: should + [98, 92]: be + [120, 92]: visible +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: 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: 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: 144) > Vector(x: 10, y: 142) > Vector(x: 11, y: 143) > Vector(x: 11, y: 143)) \ No newline at end of file diff --git a/tests/reftests/zindex/z-index13.html b/tests/reftests/zindex/z-index13.html index 884f792..02e1c7b 100644 --- a/tests/reftests/zindex/z-index13.html +++ b/tests/reftests/zindex/z-index13.html @@ -21,6 +21,9 @@ position:absolute; top:0;left:0; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index13.txt b/tests/reftests/zindex/z-index13.txt index e28eabc..fe35f4c 100644 --- a/tests/reftests/zindex/z-index13.txt +++ b/tests/reftests/zindex/z-index13.txt @@ -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) 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) -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 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index14.html b/tests/reftests/zindex/z-index14.html index 6bfa9c5..5dcdabd 100644 --- a/tests/reftests/zindex/z-index14.html +++ b/tests/reftests/zindex/z-index14.html @@ -8,6 +8,7 @@ * {margin:0;padding:0;} body { background-color: green; + font-family: Arial; } #div1 { background-color:cyan; diff --git a/tests/reftests/zindex/z-index14.txt b/tests/reftests/zindex/z-index14.txt index 783031b..b5f64e9 100644 --- a/tests/reftests/zindex/z-index14.txt +++ b/tests/reftests/zindex/z-index14.txt @@ -1,9 +1,9 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgb(0,128,0) 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) 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) -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 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index15.html b/tests/reftests/zindex/z-index15.html index f8dbece..f60efb1 100644 --- a/tests/reftests/zindex/z-index15.html +++ b/tests/reftests/zindex/z-index15.html @@ -18,6 +18,9 @@ position:absolute; top:0; left:0; } + body { + font-family: Arial; + } body diff --git a/tests/reftests/zindex/z-index15.txt b/tests/reftests/zindex/z-index15.txt index a95d588..f033218 100644 --- a/tests/reftests/zindex/z-index15.txt +++ b/tests/reftests/zindex/z-index15.txt @@ -3,7 +3,7 @@ Rectangle: [0, 0, 800, 600] rgb(128,128,128) Opacity: 1 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) -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) -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 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index16.html b/tests/reftests/zindex/z-index16.html index c9030ea..d25d036 100644 --- a/tests/reftests/zindex/z-index16.html +++ b/tests/reftests/zindex/z-index16.html @@ -10,6 +10,9 @@ width: 3in; height: 3in; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index16.txt b/tests/reftests/zindex/z-index16.txt index 8138f43..5a9f183 100644 --- a/tests/reftests/zindex/z-index16.txt +++ b/tests/reftests/zindex/z-index16.txt @@ -1,31 +1,31 @@ Window: [800, 600] Rectangle: [0, 0, 800, 600] rgba(0,0,0,0) 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 - [40, 16]: text - [68, 16]: will - [97, 16]: be - [116, 16]: beneath - [170, 16]: everything. + [43, 16]: text + [73, 16]: will + [100, 16]: be + [122, 16]: beneath + [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)) 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 - [224, 192]: text - [252, 192]: will - [281, 192]: underlay - [341, 192]: text1, - [381, 192]: but - [406, 192]: overlay - [458, 192]: the - [192, 211]: butterfly - [251, 211]: image -Text: rgb(0,0,0) normal normal 400 16px Times New Roman + [227, 192]: text + [257, 192]: will + [284, 192]: underlay + [349, 192]: text1, + [393, 192]: but + [420, 192]: overlay + [192, 210]: the + [219, 210]: butterfly + [280, 210]: image +Text: rgb(0,0,0) normal normal 400 16px Arial [192, 192]: This - [224, 192]: text - [252, 192]: will - [281, 192]: overlay - [333, 192]: the - [357, 192]: butterfly - [416, 192]: image. \ No newline at end of file + [227, 192]: text + [257, 192]: will + [284, 192]: overlay + [340, 192]: the + [366, 192]: butterfly + [428, 192]: image. \ No newline at end of file diff --git a/tests/reftests/zindex/z-index17.html b/tests/reftests/zindex/z-index17.html index 4023e3e..a79d7bb 100644 --- a/tests/reftests/zindex/z-index17.html +++ b/tests/reftests/zindex/z-index17.html @@ -16,6 +16,9 @@ body { background: violet; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index17.txt b/tests/reftests/zindex/z-index17.txt index 2079dee..3439543 100644 --- a/tests/reftests/zindex/z-index17.txt +++ b/tests/reftests/zindex/z-index17.txt @@ -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) 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) -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 - [37, 0]: z - [44, 0]: - - [49, 0]: index - [89, 0]: 10 \ No newline at end of file + [38, 0]: z + [46, 0]: - + [52, 0]: index + [94, 0]: 10 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index18.html b/tests/reftests/zindex/z-index18.html index 080b236..e81f5c6 100644 --- a/tests/reftests/zindex/z-index18.html +++ b/tests/reftests/zindex/z-index18.html @@ -57,6 +57,9 @@ width: 100px; height: 100px; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index18.txt b/tests/reftests/zindex/z-index18.txt index 82400c5..6d4fb45 100644 --- a/tests/reftests/zindex/z-index18.txt +++ b/tests/reftests/zindex/z-index18.txt @@ -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) 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) -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 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) -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 -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 -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 -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 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) -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 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) -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 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) -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 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) -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 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) -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 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) -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 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) -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 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index3.txt b/tests/reftests/zindex/z-index3.txt index 39fe563..39e93e2 100644 --- a/tests/reftests/zindex/z-index3.txt +++ b/tests/reftests/zindex/z-index3.txt @@ -52,15 +52,6 @@ Text: rgb(0,0,0) normal normal 400 12px Arial Text: rgb(0,0,0) normal normal 700 12px Arial [92, 74]: LEVEL [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)) 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)) @@ -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 [204, 83]: LEVEL [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)) 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)) @@ -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 [204, 153]: LEVEL [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) -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)) +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, 100]: LEVEL - [246, 100]: #3 + [204, 171]: LEVEL + [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)) 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)) diff --git a/tests/reftests/zindex/z-index4.html b/tests/reftests/zindex/z-index4.html index 3e0b95b..178488e 100644 --- a/tests/reftests/zindex/z-index4.html +++ b/tests/reftests/zindex/z-index4.html @@ -21,7 +21,11 @@ background-color: #ffdddd; z-index: -1; } - + + body { + font-family: Arial; + } +
diff --git a/tests/reftests/zindex/z-index4.txt b/tests/reftests/zindex/z-index4.txt index 893c7f1..6c9b6b1 100644 --- a/tests/reftests/zindex/z-index4.txt +++ b/tests/reftests/zindex/z-index4.txt @@ -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: 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)) -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 - [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)) 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: 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: 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 - [70, 84]: #1 \ No newline at end of file + [69, 84]: #1 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index5.html b/tests/reftests/zindex/z-index5.html index 960c7fc..25c8ae6 100644 --- a/tests/reftests/zindex/z-index5.html +++ b/tests/reftests/zindex/z-index5.html @@ -20,6 +20,9 @@ width: 250px; background-color: #ffdddd; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index5.txt b/tests/reftests/zindex/z-index5.txt index 62a1caa..a1480be 100644 --- a/tests/reftests/zindex/z-index5.txt +++ b/tests/reftests/zindex/z-index5.txt @@ -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: 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)) -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 - [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)) 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)) @@ -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: 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)) -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 - [70, 84]: #1 \ No newline at end of file + [69, 84]: #1 \ No newline at end of file diff --git a/tests/reftests/zindex/z-index6.html b/tests/reftests/zindex/z-index6.html index 2b7073f..83774c4 100644 --- a/tests/reftests/zindex/z-index6.html +++ b/tests/reftests/zindex/z-index6.html @@ -23,6 +23,9 @@ div.z1 { z-index: 1; } + body { + font-family: Arial; + } diff --git a/tests/reftests/zindex/z-index6.txt b/tests/reftests/zindex/z-index6.txt index cf8146e..349cffe 100644 --- a/tests/reftests/zindex/z-index6.txt +++ b/tests/reftests/zindex/z-index6.txt @@ -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: 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)) -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 - [42, 115]: - + [43, 115]: - [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)) 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: 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)) -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 - [64, 84]: z - [70, 84]: - - [76, 84]: index + [68, 84]: z + [76, 84]: - + [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)) 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: 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: 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 - [22, 158]: - + [23, 158]: - [28, 158]: index:1 \ No newline at end of file diff --git a/tests/test.js b/tests/test.js index 86fc8aa..55e378f 100644 --- a/tests/test.js +++ b/tests/test.js @@ -40,7 +40,9 @@ var REFTEST = window.location.search.indexOf('reftest') !== -1; promise.then(function(output) { var canvas = Array.isArray(targets) ? output[0] : output; 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), finishTime = new Date(); diff --git a/tests/testrunner.js b/tests/testrunner.js index 3fb82bf..fb7b4e8 100644 --- a/tests/testrunner.js +++ b/tests/testrunner.js @@ -177,8 +177,8 @@ const assertPath = (result, expected, desc) => { break; case 'Transform': - expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); - expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); + expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`); + expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`); expect(RESULT.matrix).to.equal( args.matrix, `${desc} matrix` @@ -186,8 +186,8 @@ const assertPath = (result, expected, desc) => { break; case 'Repeat': - expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); - expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); + expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`); + expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`); expect(RESULT.width).to.equal( args.width, `${desc} width` @@ -204,8 +204,8 @@ const assertPath = (result, expected, desc) => { break; case 'Gradient': - expect(RESULT.x).to.be.closeTo(args.x, 5, `${desc} x`); - expect(RESULT.y).to.be.closeTo(args.y, 5, `${desc} y`); + expect(RESULT.x).to.be.closeTo(args.x, 10, `${desc} x`); + expect(RESULT.y).to.be.closeTo(args.y, 10, `${desc} y`); expect(RESULT.x0).to.be.closeTo( args.x0, 5,