2009-03-04 Simon Fraser <simon.fraser@apple.com>
authorsimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 5 Mar 2009 02:11:26 +0000 (02:11 +0000)
committersimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 5 Mar 2009 02:11:26 +0000 (02:11 +0000)
        Rubber-stamped by Eric Seidel.

        New layout tests for point mapping and hit testing through 3d transforms.
        Not run by default yet.

        * platform/mac/transforms/3d/hit-testing/backface-hit-test-expected.txt: Added.
        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-2-expected.txt: Added.
        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-deep-expected.txt: Added.
        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-expected.txt: Added.
        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-origins-expected.txt: Added.
        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-preserve-3d-expected.txt: Added.
        * transforms/3d/cssmatrix-3d-interface-expected.txt: Added.
        * transforms/3d/cssmatrix-3d-interface.xhtml: Added.
        * transforms/3d/hit-testing/backface-hit-test.html: Added.
        * transforms/3d/point-mapping/3d-point-mapping-2.html: Added.
        * transforms/3d/point-mapping/3d-point-mapping-deep.html: Added.
        * transforms/3d/point-mapping/3d-point-mapping-origins.html: Added.
        * transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html: Added.
        * transforms/3d/point-mapping/3d-point-mapping.html: Added.
        * transforms/3d/point-mapping/point-mapping-helpers.js: Added.
        (mousemoved):
        (dispatchEvent):
        (clicked):
        (log):
        (runTest):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@41440 268f45cc-cd09-0410-ab3c-d52691b4dbfc

16 files changed:
LayoutTests/ChangeLog
LayoutTests/platform/mac/transforms/3d/hit-testing/backface-hit-test-expected.txt [new file with mode: 0644]
LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-2-expected.txt [new file with mode: 0644]
LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-deep-expected.txt [new file with mode: 0644]
LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-expected.txt [new file with mode: 0644]
LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-origins-expected.txt [new file with mode: 0644]
LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-preserve-3d-expected.txt [new file with mode: 0644]
LayoutTests/transforms/3d/cssmatrix-3d-interface-expected.txt [new file with mode: 0644]
LayoutTests/transforms/3d/cssmatrix-3d-interface.xhtml [new file with mode: 0644]
LayoutTests/transforms/3d/hit-testing/backface-hit-test.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/3d-point-mapping-2.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/3d-point-mapping-deep.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/3d-point-mapping-origins.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/3d-point-mapping.html [new file with mode: 0644]
LayoutTests/transforms/3d/point-mapping/point-mapping-helpers.js [new file with mode: 0644]

index 04aaab0..000ea40 100644 (file)
@@ -1,3 +1,31 @@
+2009-03-04  Simon Fraser  <simon.fraser@apple.com>
+
+        Rubber-stamped by Eric Seidel.
+        
+        New layout tests for point mapping and hit testing through 3d transforms.
+        Not run by default yet.
+        
+        * platform/mac/transforms/3d/hit-testing/backface-hit-test-expected.txt: Added.
+        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-2-expected.txt: Added.
+        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-deep-expected.txt: Added.
+        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-expected.txt: Added.
+        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-origins-expected.txt: Added.
+        * platform/mac/transforms/3d/point-mapping/3d-point-mapping-preserve-3d-expected.txt: Added.
+        * transforms/3d/cssmatrix-3d-interface-expected.txt: Added.
+        * transforms/3d/cssmatrix-3d-interface.xhtml: Added.
+        * transforms/3d/hit-testing/backface-hit-test.html: Added.
+        * transforms/3d/point-mapping/3d-point-mapping-2.html: Added.
+        * transforms/3d/point-mapping/3d-point-mapping-deep.html: Added.
+        * transforms/3d/point-mapping/3d-point-mapping-origins.html: Added.
+        * transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html: Added.
+        * transforms/3d/point-mapping/3d-point-mapping.html: Added.
+        * transforms/3d/point-mapping/point-mapping-helpers.js: Added.
+        (mousemoved):
+        (dispatchEvent):
+        (clicked):
+        (log):
+        (runTest):
+
 2009-03-04  Eric Carlson  <eric.carlson@apple.com>
 
         - Correct bogus result checked in as part of r41432.
diff --git a/LayoutTests/platform/mac/transforms/3d/hit-testing/backface-hit-test-expected.txt b/LayoutTests/platform/mac/transforms/3d/hit-testing/backface-hit-test-expected.txt
new file mode 100644 (file)
index 0000000..c8da2ea
--- /dev/null
@@ -0,0 +1,23 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x600
+  RenderBlock {HTML} at (0,0) size 800x600
+    RenderBody {BODY} at (8,8) size 784x584
+      RenderBlock {P} at (0,0) size 784x18
+        RenderText {#text} at (0,0) size 762x18
+          text run at (0,0) width 762: "There are two boxes below, both rotated 180\x{B0} in Y. The rightmost one has backface-visibility: hidden, so you can't see it."
+      RenderBlock {DIV} at (0,34) size 402x202 [border: (1px solid #000000)]
+        RenderText {#text} at (197,183) size 4x18
+          text run at (197,183) width 4: " "
+        RenderText {#text} at (0,0) size 0x0
+      RenderBlock {DIV} at (0,236) size 784x36
+        RenderText {#text} at (0,0) size 168x18
+          text run at (0,0) width 168: "Found box1 on left: PASS"
+        RenderBR {BR} at (168,14) size 0x0
+        RenderText {#text} at (0,18) size 203x18
+          text run at (0,18) width 203: "Found container on right: PASS"
+        RenderBR {BR} at (203,32) size 0x0
+layer at (27,61) size 160x160
+  RenderBlock {DIV} at (19,19) size 160x160 [bgcolor=#808080]
+layer at (227,61) size 160x160
+  RenderBlock {DIV} at (219,19) size 160x160 [bgcolor=#808080]
diff --git a/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-2-expected.txt b/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-2-expected.txt
new file mode 100644 (file)
index 0000000..c2128b6
--- /dev/null
@@ -0,0 +1,61 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x600
+  RenderBlock {HTML} at (0,0) size 800x600
+    RenderBody {BODY} at (0,0) size 800x600 [border: (1px solid #000000)]
+      RenderBlock {DIV} at (21,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,229) size 4x18
+        text run at (243,229) width 4: " "
+      RenderBlock {DIV} at (267,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (489,229) size 4x18
+        text run at (489,229) width 4: " "
+      RenderBlock {DIV} at (513,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+layer at (30,500) size 314x90
+  RenderBlock (positioned) {DIV} at (30,500) size 314x90
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,0) size 314x18
+        text run at (0,0) width 314: "PASS: event at (120, 128) hit box4 at offset (2, 2)"
+    RenderBR {BR} at (314,14) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,18) size 306x18
+        text run at (0,18) width 306: "PASS: event at (336, 87) hit box7 at offset (2, 2)"
+    RenderBR {BR} at (306,32) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,36) size 306x18
+        text run at (0,36) width 306: "PASS: event at (348, 86) hit box8 at offset (2, 2)"
+    RenderBR {BR} at (306,50) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,54) size 314x18
+        text run at (0,54) width 314: "PASS: event at (582, 87) hit box11 at offset (2, 2)"
+    RenderBR {BR} at (314,68) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,72) size 314x18
+        text run at (0,72) width 314: "PASS: event at (594, 86) hit box12 at offset (2, 2)"
+    RenderBR {BR} at (314,86) size 0x0
+layer at (42,42) size 173x181
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,63) size 152x161
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (104,104) size 111x111
+  RenderBlock (relative positioned) {DIV} at (41,41) size 100x100 [border: (1px solid #000000)]
+layer at (125,125) size 90x90
+  RenderBlock {DIV} at (21,21) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (288,42) size 153x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,63) size 132x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (330,84) size 111x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (351,85) size 90x90
+  RenderBlock {DIV} at (21,1) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (534,42) size 153x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (555,63) size 132x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 100x100 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (597,85) size 90x90
+  RenderBlock {DIV} at (21,1) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
diff --git a/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-deep-expected.txt b/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-deep-expected.txt
new file mode 100644 (file)
index 0000000..372fda2
--- /dev/null
@@ -0,0 +1,60 @@
+layer at (0,0) size 785x794
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x600
+  RenderBlock {HTML} at (0,0) size 785x600
+    RenderBody {BODY} at (0,0) size 785x600 [border: (1px solid #000000)]
+      RenderBlock {DIV} at (21,21) size 402x402 [border: (1px solid #000000)]
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+layer at (42,42) size 526x461
+  RenderBlock {DIV} at (21,21) size 340x340 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,63) size 505x441
+  RenderBlock {DIV} at (21,21) size 300x300 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (104,104) size 464x421
+  RenderBlock {DIV} at (41,41) size 300x300 [border: (1px solid #000000)]
+layer at (145,145) size 423x401
+  RenderBlock {DIV} at (41,41) size 300x300 [bgcolor=#AA7994] [border: (1px solid #000000)]
+layer at (186,186) size 382x381
+  RenderBlock {DIV} at (41,41) size 300x300 [border: (1px solid #000000)]
+layer at (227,227) size 341x361
+  RenderBlock {DIV} at (41,41) size 300x300 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (268,268) size 300x300
+  RenderBlock {DIV} at (41,41) size 300x300 [border: (1px solid #000000)]
+    RenderBlock {DIV} at (61,61) size 90x90 [bgcolor=#0000FF]
+layer at (30,650) size 346x144
+  RenderBlock (positioned) {DIV} at (30,650) size 346x144
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,0) size 298x18
+        text run at (0,0) width 298: "PASS: event at (45, 45) hit box1 at offset (3, 3)"
+    RenderBR {BR} at (298,14) size 0x0
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,18) size 298x18
+        text run at (0,18) width 298: "PASS: event at (54, 44) hit box2 at offset (2, 2)"
+    RenderBR {BR} at (298,32) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,36) size 306x18
+        text run at (0,36) width 306: "PASS: event at (104, 93) hit box3 at offset (2, 2)"
+    RenderBR {BR} at (306,50) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,54) size 314x18
+        text run at (0,54) width 314: "PASS: event at (175, 137) hit box4 at offset (2, 2)"
+    RenderBR {BR} at (314,68) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,72) size 330x18
+        text run at (0,72) width 330: "PASS: event at (167, 528) hit box4 at offset (2, 296)"
+    RenderBR {BR} at (330,86) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,90) size 314x18
+        text run at (0,90) width 314: "PASS: event at (227, 197) hit box5 at offset (2, 2)"
+    RenderBR {BR} at (314,104) size 0x0
+    RenderInline {SPAN} at (0,0) size 346x18 [color=#008000]
+      RenderText {#text} at (0,108) size 346x18
+        text run at (0,108) width 346: "PASS: event at (539, 569) hit box7 at offset (296, 296)"
+    RenderBR {BR} at (346,122) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,126) size 330x18
+        text run at (0,126) width 330: "PASS: event at (431, 441) hit box8 at offset (85, 85)"
+    RenderBR {BR} at (330,140) size 0x0
diff --git a/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-expected.txt b/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-expected.txt
new file mode 100644 (file)
index 0000000..73f62a6
--- /dev/null
@@ -0,0 +1,80 @@
+layer at (0,0) size 785x662
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x600
+  RenderBlock {HTML} at (0,0) size 785x600
+    RenderBody {BODY} at (0,0) size 785x600 [border: (1px solid #000000)]
+      RenderBlock {DIV} at (21,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,229) size 4x18
+        text run at (243,229) width 4: " "
+      RenderBlock {DIV} at (267,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (489,229) size 4x18
+        text run at (489,229) width 4: " "
+      RenderBR {BR} at (493,243) size 0x0
+      RenderBlock {DIV} at (21,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,475) size 4x18
+        text run at (243,475) width 4: " "
+      RenderBlock {DIV} at (267,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+layer at (30,500) size 338x162
+  RenderBlock (positioned) {DIV} at (30,500) size 338x162
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,0) size 298x18
+        text run at (0,0) width 298: "PASS: event at (44, 44) hit box1 at offset (2, 2)"
+    RenderBR {BR} at (298,14) size 0x0
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,18) size 298x18
+        text run at (0,18) width 298: "PASS: event at (69, 55) hit box2 at offset (2, 2)"
+    RenderBR {BR} at (298,32) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,36) size 330x18
+        text run at (0,36) width 330: "PASS: event at (165, 182) hit box2 at offset (96, 96)"
+    RenderBR {BR} at (330,50) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,54) size 306x18
+        text run at (0,54) width 306: "PASS: event at (333, 79) hit box7 at offset (2, 2)"
+    RenderBR {BR} at (306,68) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,72) size 314x18
+        text run at (0,72) width 314: "PASS: event at (87, 325) hit box10 at offset (2, 2)"
+    RenderBR {BR} at (314,86) size 0x0
+    RenderInline {SPAN} at (0,0) size 338x18 [color=#008000]
+      RenderText {#text} at (0,90) size 338x18
+        text run at (0,90) width 338: "PASS: event at (196, 467) hit box10 at offset (98, 98)"
+    RenderBR {BR} at (338,104) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,108) size 322x18
+        text run at (0,108) width 322: "PASS: event at (333, 325) hit box13 at offset (2, 2)"
+    RenderBR {BR} at (322,122) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,126) size 322x18
+        text run at (0,126) width 322: "PASS: event at (353, 352) hit box14 at offset (2, 2)"
+    RenderBR {BR} at (322,140) size 0x0
+    RenderInline {SPAN} at (0,0) size 338x18 [color=#008000]
+      RenderText {#text} at (0,144) size 338x18
+        text run at (0,144) width 338: "PASS: event at (472, 507) hit box14 at offset (97, 97)"
+    RenderBR {BR} at (338,158) size 0x0
+layer at (42,42) size 140x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,63) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+layer at (288,42) size 142x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,63) size 121x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (42,288) size 142x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,309) size 121x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+layer at (84,330) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (288,288) size 163x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,309) size 142x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 100x100 [bgcolor=#C0D69E] [border: (1px solid #000000)]
+layer at (351,351) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
diff --git a/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-origins-expected.txt b/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-origins-expected.txt
new file mode 100644 (file)
index 0000000..6ad0765
--- /dev/null
@@ -0,0 +1,80 @@
+layer at (0,0) size 785x662
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x600
+  RenderBlock {HTML} at (0,0) size 785x600
+    RenderBody {BODY} at (0,0) size 785x600 [border: (1px solid #000000)]
+      RenderBlock {DIV} at (21,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,229) size 4x18
+        text run at (243,229) width 4: " "
+      RenderBlock {DIV} at (267,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (489,229) size 4x18
+        text run at (489,229) width 4: " "
+      RenderBR {BR} at (493,243) size 0x0
+      RenderBlock {DIV} at (21,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,475) size 4x18
+        text run at (243,475) width 4: " "
+      RenderBlock {DIV} at (267,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+layer at (30,500) size 338x162
+  RenderBlock (positioned) {DIV} at (30,500) size 338x162
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,0) size 298x18
+        text run at (0,0) width 298: "PASS: event at (48, 48) hit box1 at offset (6, 6)"
+    RenderBR {BR} at (298,14) size 0x0
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,18) size 298x18
+        text run at (0,18) width 298: "PASS: event at (70, 41) hit box2 at offset (3, 3)"
+    RenderBR {BR} at (298,32) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,36) size 330x18
+        text run at (0,36) width 330: "PASS: event at (185, 164) hit box2 at offset (97, 97)"
+    RenderBR {BR} at (330,50) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,54) size 306x18
+        text run at (0,54) width 306: "PASS: event at (338, 64) hit box7 at offset (3, 3)"
+    RenderBR {BR} at (306,68) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,72) size 314x18
+        text run at (0,72) width 314: "PASS: event at (92, 310) hit box10 at offset (3, 3)"
+    RenderBR {BR} at (314,86) size 0x0
+    RenderInline {SPAN} at (0,0) size 338x18 [color=#008000]
+      RenderText {#text} at (0,90) size 338x18
+        text run at (0,90) width 338: "PASS: event at (217, 444) hit box10 at offset (96, 96)"
+    RenderBR {BR} at (338,104) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,108) size 322x18
+        text run at (0,108) width 322: "PASS: event at (337, 309) hit box13 at offset (2, 2)"
+    RenderBR {BR} at (322,122) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,126) size 322x18
+        text run at (0,126) width 322: "PASS: event at (360, 334) hit box14 at offset (2, 2)"
+    RenderBR {BR} at (322,140) size 0x0
+    RenderInline {SPAN} at (0,0) size 338x18 [color=#008000]
+      RenderText {#text} at (0,144) size 338x18
+        text run at (0,144) width 338: "PASS: event at (500, 484) hit box14 at offset (96, 96)"
+    RenderBR {BR} at (338,158) size 0x0
+layer at (42,42) size 140x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,63) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+layer at (288,42) size 142x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,63) size 121x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (42,288) size 142x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,309) size 121x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+layer at (84,330) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (288,288) size 163x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,309) size 142x121
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#AAAAAA] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 100x100 [bgcolor=#C0D69E] [border: (1px solid #000000)]
+layer at (351,351) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#0000FF] [border: (1px solid #000000)]
diff --git a/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-preserve-3d-expected.txt b/LayoutTests/platform/mac/transforms/3d/point-mapping/3d-point-mapping-preserve-3d-expected.txt
new file mode 100644 (file)
index 0000000..6307c1a
--- /dev/null
@@ -0,0 +1,133 @@
+layer at (0,0) size 785x806
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x600
+  RenderBlock {HTML} at (0,0) size 785x600
+    RenderBody {BODY} at (0,0) size 785x600 [border: (1px solid #000000)]
+      RenderBlock {DIV} at (21,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,229) size 4x18
+        text run at (243,229) width 4: " "
+      RenderBlock {DIV} at (267,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (489,229) size 4x18
+        text run at (489,229) width 4: " "
+      RenderBlock {DIV} at (513,21) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (735,229) size 4x18
+        text run at (735,229) width 4: " "
+      RenderBR {BR} at (739,243) size 0x0
+      RenderBlock {DIV} at (21,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (243,475) size 4x18
+        text run at (243,475) width 4: " "
+      RenderBlock {DIV} at (267,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (489,475) size 4x18
+        text run at (489,475) width 4: " "
+      RenderBlock {DIV} at (513,267) size 202x202 [border: (1px solid #000000)]
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+      RenderText {#text} at (0,0) size 0x0
+layer at (30,500) size 338x306
+  RenderBlock (positioned) {DIV} at (30,500) size 338x306
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,0) size 298x18
+        text run at (0,0) width 298: "PASS: event at (44, 44) hit box1 at offset (2, 2)"
+    RenderBR {BR} at (298,14) size 0x0
+    RenderInline {SPAN} at (0,0) size 298x18 [color=#008000]
+      RenderText {#text} at (0,18) size 298x18
+        text run at (0,18) width 298: "PASS: event at (74, 68) hit box2 at offset (2, 2)"
+    RenderBR {BR} at (298,32) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,36) size 330x18
+        text run at (0,36) width 330: "PASS: event at (157, 164) hit box2 at offset (98, 98)"
+    RenderBR {BR} at (330,50) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,54) size 306x18
+        text run at (0,54) width 306: "PASS: event at (320, 68) hit box4 at offset (2, 2)"
+    RenderBR {BR} at (306,68) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,72) size 306x18
+        text run at (0,72) width 306: "PASS: event at (336, 87) hit box5 at offset (2, 2)"
+    RenderBR {BR} at (306,86) size 0x0
+    RenderInline {SPAN} at (0,0) size 306x18 [color=#008000]
+      RenderText {#text} at (0,90) size 306x18
+        text run at (0,90) width 306: "PASS: event at (582, 87) hit box8 at offset (2, 2)"
+    RenderBR {BR} at (306,104) size 0x0
+    RenderInline {SPAN} at (0,0) size 330x18 [color=#008000]
+      RenderText {#text} at (0,108) size 330x18
+        text run at (0,108) width 330: "PASS: event at (658, 174) hit box8 at offset (86, 86)"
+    RenderBR {BR} at (330,122) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,126) size 314x18
+        text run at (0,126) width 314: "PASS: event at (74, 314) hit box10 at offset (2, 2)"
+    RenderBR {BR} at (314,140) size 0x0
+    RenderInline {SPAN} at (0,0) size 314x18 [color=#008000]
+      RenderText {#text} at (0,144) size 314x18
+        text run at (0,144) width 314: "PASS: event at (91, 351) hit box11 at offset (2, 2)"
+    RenderBR {BR} at (314,158) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,162) size 322x18
+        text run at (0,162) width 322: "PASS: event at (320, 314) hit box13 at offset (2, 2)"
+    RenderBR {BR} at (322,176) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,180) size 322x18
+        text run at (0,180) width 322: "PASS: event at (343, 351) hit box14 at offset (2, 2)"
+    RenderBR {BR} at (322,194) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,198) size 322x18
+        text run at (0,198) width 322: "PASS: event at (365, 375) hit box15 at offset (2, 2)"
+    RenderBR {BR} at (322,212) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,216) size 322x18
+        text run at (0,216) width 322: "PASS: event at (566, 314) hit box17 at offset (2, 2)"
+    RenderBR {BR} at (322,230) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,234) size 322x18
+        text run at (0,234) width 322: "PASS: event at (587, 352) hit box18 at offset (2, 2)"
+    RenderBR {BR} at (322,248) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,252) size 322x18
+        text run at (0,252) width 322: "PASS: event at (629, 401) hit box19 at offset (2, 2)"
+    RenderBR {BR} at (322,266) size 0x0
+    RenderInline {SPAN} at (0,0) size 322x18 [color=#008000]
+      RenderText {#text} at (0,270) size 322x18
+        text run at (0,270) width 322: "PASS: event at (653, 422) hit box20 at offset (2, 2)"
+    RenderBR {BR} at (322,284) size 0x0
+    RenderInline {SPAN} at (0,0) size 338x18 [color=#008000]
+      RenderText {#text} at (0,288) size 338x18
+        text run at (0,288) width 338: "PASS: event at (745, 505) hit box20 at offset (86, 87)"
+    RenderBR {BR} at (338,302) size 0x0
+layer at (42,42) size 140x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,63) size 100x100
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (288,42) size 140x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,63) size 111x111
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (534,42) size 140x141
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (555,63) size 111x111
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (576,84) size 90x90
+  RenderBlock (relative positioned) {DIV} at (21,21) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (42,288) size 162x181
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (63,309) size 141x161
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (104,350) size 100x100
+  RenderBlock (relative positioned) {DIV} at (41,41) size 100x100 [border: (1px solid #000000)]
+layer at (288,288) size 173x181
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (309,309) size 152x161
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (350,350) size 111x111
+  RenderBlock (relative positioned) {DIV} at (41,41) size 100x100 [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
+layer at (534,288) size 214x201
+  RenderBlock {DIV} at (21,21) size 140x140 [bgcolor=#DDDDDD] [border: (1px solid #000000)]
+layer at (555,309) size 193x181
+  RenderBlock (relative positioned) {DIV} at (21,21) size 100x100 [bgcolor=#81AA8A] [border: (1px solid #000000)]
+layer at (596,350) size 152x161
+  RenderBlock (relative positioned) {DIV} at (41,41) size 100x100 [border: (1px solid #000000)]
+layer at (637,391) size 111x111
+  RenderBlock (relative positioned) {DIV} at (41,41) size 100x100 [bgcolor=#AA7994] [border: (1px solid #000000)]
+    RenderBlock {DIV} at (21,21) size 90x90 [bgcolor=#0000FF] [border: (1px solid #000000)]
diff --git a/LayoutTests/transforms/3d/cssmatrix-3d-interface-expected.txt b/LayoutTests/transforms/3d/cssmatrix-3d-interface-expected.txt
new file mode 100644 (file)
index 0000000..bf60d4f
--- /dev/null
@@ -0,0 +1,333 @@
+This test exercises the CSSMatrix 3D interface
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+CSSMatrix constructors
+PASS default constructor
+PASS object constructor
+PASS string constructor
+
+Test toString
+PASS a[0] is "matrix3d"
+PASS parseFloat(a2[0]) is 1
+PASS parseFloat(a2[1]) is 0
+PASS parseFloat(a2[2]) is 0
+PASS parseFloat(a2[3]) is 1
+PASS parseFloat(a2[4]) is 0
+PASS parseFloat(a2[5]) is 1
+PASS parseFloat(a2[6]) is 0
+PASS parseFloat(a2[7]) is 0
+PASS parseFloat(a2[8]) is 0
+PASS parseFloat(a2[9]) is 0
+PASS parseFloat(a2[10]) is 1
+PASS parseFloat(a2[11]) is 0
+PASS parseFloat(a2[12]) is 0
+PASS parseFloat(a2[13]) is 0
+PASS parseFloat(a2[14]) is 0
+PASS parseFloat(a3[0]) is 1
+PASS a3[1] is ""
+
+Test bad input to string constructor
+PASS new WebKitCSSMatrix("banana") threw exception Error: SYNTAX_ERR: DOM Exception 12.
+
+Test attributes on default matrix
+PASS m.m11 is 1
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 1
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 1
+PASS m.m34 is 0
+PASS m.m41 is 0
+PASS m.m42 is 0
+PASS m.m43 is 0
+PASS m.m44 is 1
+
+Test attributes on custom matrix
+PASS m.m11 is 11
+PASS m.m12 is 12
+PASS m.m13 is 13
+PASS m.m14 is 14
+PASS m.m21 is 21
+PASS m.m22 is 22
+PASS m.m23 is 23
+PASS m.m24 is 24
+PASS m.m31 is 31
+PASS m.m32 is 32
+PASS m.m33 is 33
+PASS m.m34 is 34
+PASS m.m41 is 41
+PASS m.m42 is 42
+PASS m.m43 is 43
+PASS m.m44 is 44
+
+Test setMatrixValue - set to matrix()
+PASS m.m11 is 11
+PASS m.m12 is 12
+PASS m.m13 is 13
+PASS m.m14 is 14
+PASS m.m21 is 21
+PASS m.m22 is 22
+PASS m.m23 is 23
+PASS m.m24 is 24
+PASS m.m31 is 31
+PASS m.m32 is 32
+PASS m.m33 is 33
+PASS m.m34 is 34
+PASS m.m41 is 41
+PASS m.m42 is 42
+PASS m.m43 is 43
+PASS m.m44 is 44
+
+Test setMatrixValue - set to translate(10px, 20px, 30px) scale(2, 3, 4)
+PASS m.m11 is 2
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 3
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 4
+PASS m.m34 is 0
+PASS m.m41 is 10
+PASS m.m42 is 20
+PASS m.m43 is 30
+PASS m.m44 is 1
+
+Test throwing exception from setMatrixValue
+PASS m.setMatrixValue("banana") threw exception Error: SYNTAX_ERR: DOM Exception 12.
+PASS m.setMatrixValue("translate3d(10em, 20%, 40)") threw exception Error: SYNTAX_ERR: DOM Exception 12.
+PASS m.setMatrixValue("translate3d(10px, 20px, 30px) scale3d()") threw exception Error: SYNTAX_ERR: DOM Exception 12.
+
+Test multiply
+PASS parseFloat(m3.m11) is 250
+PASS parseFloat(m3.m12) is 260
+PASS parseFloat(m3.m13) is 270
+PASS parseFloat(m3.m14) is 280
+PASS parseFloat(m3.m21) is 618
+PASS parseFloat(m3.m22) is 644
+PASS parseFloat(m3.m23) is 670
+PASS parseFloat(m3.m24) is 696
+PASS parseFloat(m3.m31) is 986
+PASS parseFloat(m3.m32) is 1028
+PASS parseFloat(m3.m33) is 1070
+PASS parseFloat(m3.m34) is 1112
+PASS parseFloat(m3.m41) is 1354
+PASS parseFloat(m3.m42) is 1412
+PASS parseFloat(m3.m43) is 1470
+PASS parseFloat(m3.m44) is 1528
+
+Test immutability of multiply
+PASS parseFloat(m.m11) is 1
+PASS parseFloat(m.m12) is 2
+PASS parseFloat(m.m13) is 3
+PASS parseFloat(m.m14) is 4
+PASS parseFloat(m.m21) is 5
+PASS parseFloat(m.m22) is 6
+PASS parseFloat(m.m23) is 7
+PASS parseFloat(m.m24) is 8
+PASS parseFloat(m.m31) is 9
+PASS parseFloat(m.m32) is 10
+PASS parseFloat(m.m33) is 11
+PASS parseFloat(m.m34) is 12
+PASS parseFloat(m.m41) is 13
+PASS parseFloat(m.m42) is 14
+PASS parseFloat(m.m43) is 15
+PASS parseFloat(m.m44) is 16
+
+Test inverse
+PASS parseFloat(m2.m11) is 0.5
+PASS parseFloat(m2.m12) is 0
+PASS parseFloat(m2.m13) is 0
+PASS parseFloat(m2.m14) is 0
+PASS parseFloat(m2.m21) is 0
+PASS parseFloat(m2.m22) is 0.5
+PASS parseFloat(m2.m23) is 0
+PASS parseFloat(m2.m24) is 0
+PASS parseFloat(m2.m31) is 0
+PASS parseFloat(m2.m32) is 0
+PASS parseFloat(m2.m33) is 0.5
+PASS parseFloat(m2.m34) is 0
+PASS parseFloat(m2.m41) is -5
+PASS parseFloat(m2.m42) is -10
+PASS parseFloat(m2.m43) is -15
+PASS parseFloat(m2.m44) is 1
+
+Test immutability of inverse
+PASS parseFloat(m.m11) is 2
+PASS parseFloat(m.m12) is 0
+PASS parseFloat(m.m13) is 0
+PASS parseFloat(m.m14) is 0
+PASS parseFloat(m.m21) is 0
+PASS parseFloat(m.m22) is 2
+PASS parseFloat(m.m23) is 0
+PASS parseFloat(m.m24) is 0
+PASS parseFloat(m.m31) is 0
+PASS parseFloat(m.m32) is 0
+PASS parseFloat(m.m33) is 2
+PASS parseFloat(m.m34) is 0
+PASS parseFloat(m.m41) is 10
+PASS parseFloat(m.m42) is 20
+PASS parseFloat(m.m43) is 30
+PASS parseFloat(m.m44) is 1
+
+Test throwing exception from inverse
+PASS m.inverse() threw exception Error: NOT_SUPPORTED_ERR: DOM Exception 9.
+
+Test translate
+PASS m2.m11 is 1
+PASS m2.m12 is 0
+PASS m2.m13 is 0
+PASS m2.m14 is 0
+PASS m2.m21 is 0
+PASS m2.m22 is 1
+PASS m2.m23 is 0
+PASS m2.m24 is 0
+PASS m2.m31 is 0
+PASS m2.m32 is 0
+PASS m2.m33 is 1
+PASS m2.m34 is 0
+PASS m2.m41 is 10
+PASS m2.m42 is 20
+PASS m2.m43 is 30
+PASS m2.m44 is 1
+
+Test immutability of translate
+PASS m.m11 is 1
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 1
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 1
+PASS m.m34 is 0
+PASS m.m41 is 0
+PASS m.m42 is 0
+PASS m.m43 is 0
+PASS m.m44 is 1
+
+Test scale
+PASS m2.m11 is 10
+PASS m2.m12 is 0
+PASS m2.m13 is 0
+PASS m2.m14 is 0
+PASS m2.m21 is 0
+PASS m2.m22 is 20
+PASS m2.m23 is 0
+PASS m2.m24 is 0
+PASS m2.m31 is 0
+PASS m2.m32 is 0
+PASS m2.m33 is 30
+PASS m2.m34 is 0
+PASS m2.m41 is 0
+PASS m2.m42 is 0
+PASS m2.m43 is 0
+PASS m2.m44 is 1
+
+Test immutability of scale
+PASS m.m11 is 1
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 1
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 1
+PASS m.m34 is 0
+PASS m.m41 is 0
+PASS m.m42 is 0
+PASS m.m43 is 0
+PASS m.m44 is 1
+
+Test rotate
+PASS parseFloat(m2.m11.toPrecision(6)) is 0.813798
+PASS parseFloat(m2.m12.toPrecision(6)) is 0.469846
+PASS parseFloat(m2.m13.toPrecision(6)) is -0.34202
+PASS parseFloat(m2.m14.toPrecision(6)) is 0
+PASS parseFloat(m2.m21.toPrecision(6)) is -0.44097
+PASS parseFloat(m2.m22.toPrecision(6)) is 0.882564
+PASS parseFloat(m2.m23.toPrecision(6)) is 0.163176
+PASS parseFloat(m2.m24.toPrecision(6)) is 0
+PASS parseFloat(m2.m31.toPrecision(6)) is 0.378522
+PASS parseFloat(m2.m32.toPrecision(6)) is 0.0180283
+PASS parseFloat(m2.m33.toPrecision(6)) is 0.925417
+PASS parseFloat(m2.m34.toPrecision(6)) is 0
+PASS parseFloat(m2.m41.toPrecision(6)) is 0
+PASS parseFloat(m2.m42.toPrecision(6)) is 0
+PASS parseFloat(m2.m43.toPrecision(6)) is 0
+PASS parseFloat(m2.m44.toPrecision(6)) is 1
+
+Test immutability of rotate
+PASS m.m11 is 1
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 1
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 1
+PASS m.m34 is 0
+PASS m.m41 is 0
+PASS m.m42 is 0
+PASS m.m43 is 0
+PASS m.m44 is 1
+
+Test rotateAxisAngle
+PASS parseFloat(m2.m11.toPrecision(6)) is 0.804738
+PASS parseFloat(m2.m12.toPrecision(6)) is 0.505879
+PASS parseFloat(m2.m13.toPrecision(6)) is -0.310617
+PASS parseFloat(m2.m14.toPrecision(6)) is 0
+PASS parseFloat(m2.m21.toPrecision(6)) is -0.310617
+PASS parseFloat(m2.m22.toPrecision(6)) is 0.804738
+PASS parseFloat(m2.m23.toPrecision(6)) is 0.505879
+PASS parseFloat(m2.m24.toPrecision(6)) is 0
+PASS parseFloat(m2.m31.toPrecision(6)) is 0.505879
+PASS parseFloat(m2.m32.toPrecision(6)) is -0.310617
+PASS parseFloat(m2.m33.toPrecision(6)) is 0.804738
+PASS parseFloat(m2.m34.toPrecision(6)) is 0
+PASS parseFloat(m2.m41.toPrecision(6)) is 0
+PASS parseFloat(m2.m42.toPrecision(6)) is 0
+PASS parseFloat(m2.m43.toPrecision(6)) is 0
+PASS parseFloat(m2.m44.toPrecision(6)) is 1
+
+Test immutability of rotateAxisAngle
+PASS m.m11 is 1
+PASS m.m12 is 0
+PASS m.m13 is 0
+PASS m.m14 is 0
+PASS m.m21 is 0
+PASS m.m22 is 1
+PASS m.m23 is 0
+PASS m.m24 is 0
+PASS m.m31 is 0
+PASS m.m32 is 0
+PASS m.m33 is 1
+PASS m.m34 is 0
+PASS m.m41 is 0
+PASS m.m42 is 0
+PASS m.m43 is 0
+PASS m.m44 is 1
+
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/transforms/3d/cssmatrix-3d-interface.xhtml b/LayoutTests/transforms/3d/cssmatrix-3d-interface.xhtml
new file mode 100644 (file)
index 0000000..1f33706
--- /dev/null
@@ -0,0 +1,411 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<link rel="stylesheet" href="../../fast/js/resources/js-test-style.css"/>
+<script src="../../fast/js/resources/js-test-pre.js"></script>
+</head>
+<body>
+<div id="description"></div>
+<div id="console"></div>
+
+<script>
+
+description("This test exercises the CSSMatrix 3D interface");
+
+debug("");
+debug("CSSMatrix constructors");
+
+var m = null;
+m = new WebKitCSSMatrix();
+if (m)
+  testPassed("default constructor");
+else
+  testFailed("default constructor");
+
+var m2 = new WebKitCSSMatrix(m);
+if (m2)
+  testPassed("object constructor");
+else
+  testFailed("object constructor");
+
+m = new WebKitCSSMatrix("matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)");
+if (m)
+  testPassed("string constructor");
+else
+  testFailed("string constructor");
+
+debug("");
+debug("Test toString");
+var m = new WebKitCSSMatrix("matrix3d(1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)");
+var s = m.toString();
+var a = s.split('(');
+shouldBe('a[0]', '"matrix3d"');
+var a2 = a[1].split(',');
+shouldBe('parseFloat(a2[0])', '1');
+shouldBe('parseFloat(a2[1])', '0');
+shouldBe('parseFloat(a2[2])', '0');
+shouldBe('parseFloat(a2[3])', '1');
+shouldBe('parseFloat(a2[4])', '0');
+shouldBe('parseFloat(a2[5])', '1');
+shouldBe('parseFloat(a2[6])', '0');
+shouldBe('parseFloat(a2[7])', '0');
+shouldBe('parseFloat(a2[8])', '0');
+shouldBe('parseFloat(a2[9])', '0');
+shouldBe('parseFloat(a2[10])', '1');
+shouldBe('parseFloat(a2[11])', '0');
+shouldBe('parseFloat(a2[12])', '0');
+shouldBe('parseFloat(a2[13])', '0');
+shouldBe('parseFloat(a2[14])', '0');
+var a3 = a2[15].split(")");
+shouldBe('parseFloat(a3[0])', '1');
+shouldBe('a3[1]', '""');
+
+debug("");
+debug("Test bad input to string constructor");
+shouldThrow('new WebKitCSSMatrix("banana")');
+
+debug("");
+debug("Test attributes on default matrix");
+m = new WebKitCSSMatrix();
+shouldBe('m.m11', '1');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '1');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '1');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '0');
+shouldBe('m.m42', '0');
+shouldBe('m.m43', '0');
+shouldBe('m.m44', '1');
+
+debug("");
+debug("Test attributes on custom matrix");
+m = new WebKitCSSMatrix("matrix3d(11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44)");
+shouldBe('m.m11', '11');
+shouldBe('m.m12', '12');
+shouldBe('m.m13', '13');
+shouldBe('m.m14', '14');
+shouldBe('m.m21', '21');
+shouldBe('m.m22', '22');
+shouldBe('m.m23', '23');
+shouldBe('m.m24', '24');
+shouldBe('m.m31', '31');
+shouldBe('m.m32', '32');
+shouldBe('m.m33', '33');
+shouldBe('m.m34', '34');
+shouldBe('m.m41', '41');
+shouldBe('m.m42', '42');
+shouldBe('m.m43', '43');
+shouldBe('m.m44', '44');
+
+debug("");
+debug("Test setMatrixValue - set to matrix()");
+m = new WebKitCSSMatrix();
+m.setMatrixValue("matrix3d(11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44)");
+shouldBe('m.m11', '11');
+shouldBe('m.m12', '12');
+shouldBe('m.m13', '13');
+shouldBe('m.m14', '14');
+shouldBe('m.m21', '21');
+shouldBe('m.m22', '22');
+shouldBe('m.m23', '23');
+shouldBe('m.m24', '24');
+shouldBe('m.m31', '31');
+shouldBe('m.m32', '32');
+shouldBe('m.m33', '33');
+shouldBe('m.m34', '34');
+shouldBe('m.m41', '41');
+shouldBe('m.m42', '42');
+shouldBe('m.m43', '43');
+shouldBe('m.m44', '44');
+
+debug("");
+debug("Test setMatrixValue - set to translate(10px, 20px, 30px) scale(2, 3, 4)");
+m = new WebKitCSSMatrix();
+m.setMatrixValue("translate3d(10px, 20px, 30px) scale3d(2, 3, 4)");
+shouldBe('m.m11', '2');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '3');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '4');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '10');
+shouldBe('m.m42', '20');
+shouldBe('m.m43', '30');
+shouldBe('m.m44', '1');
+
+debug("");
+debug("Test throwing exception from setMatrixValue");
+shouldThrow('m.setMatrixValue("banana")');
+shouldThrow('m.setMatrixValue("translate3d(10em, 20%, 40)")');
+shouldThrow('m.setMatrixValue("translate3d(10px, 20px, 30px) scale3d()")');
+
+debug("");
+debug("Test multiply");
+m =  new WebKitCSSMatrix("matrix3d( 1,  2,  3,  4,  5,  6,  7,  8,  9, 10, 11, 12, 13, 14, 15, 16)");
+m2 = new WebKitCSSMatrix("matrix3d(17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32)");
+var m3 = m.multiply(m2);
+shouldBe('parseFloat(m3.m11)', '250');
+shouldBe('parseFloat(m3.m12)', '260');
+shouldBe('parseFloat(m3.m13)', '270');
+shouldBe('parseFloat(m3.m14)', '280');
+shouldBe('parseFloat(m3.m21)', '618');
+shouldBe('parseFloat(m3.m22)', '644');
+shouldBe('parseFloat(m3.m23)', '670');
+shouldBe('parseFloat(m3.m24)', '696');
+shouldBe('parseFloat(m3.m31)', '986');
+shouldBe('parseFloat(m3.m32)', '1028');
+shouldBe('parseFloat(m3.m33)', '1070');
+shouldBe('parseFloat(m3.m34)', '1112');
+shouldBe('parseFloat(m3.m41)', '1354');
+shouldBe('parseFloat(m3.m42)', '1412');
+shouldBe('parseFloat(m3.m43)', '1470');
+shouldBe('parseFloat(m3.m44)', '1528');
+
+debug("");
+debug("Test immutability of multiply");
+shouldBe('parseFloat(m.m11)', '1');
+shouldBe('parseFloat(m.m12)', '2');
+shouldBe('parseFloat(m.m13)', '3');
+shouldBe('parseFloat(m.m14)', '4');
+shouldBe('parseFloat(m.m21)', '5');
+shouldBe('parseFloat(m.m22)', '6');
+shouldBe('parseFloat(m.m23)', '7');
+shouldBe('parseFloat(m.m24)', '8');
+shouldBe('parseFloat(m.m31)', '9');
+shouldBe('parseFloat(m.m32)', '10');
+shouldBe('parseFloat(m.m33)', '11');
+shouldBe('parseFloat(m.m34)', '12');
+shouldBe('parseFloat(m.m41)', '13');
+shouldBe('parseFloat(m.m42)', '14');
+shouldBe('parseFloat(m.m43)', '15');
+shouldBe('parseFloat(m.m44)', '16');
+
+debug("");
+debug("Test inverse");
+m = new WebKitCSSMatrix("matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 2, 0, 10, 20, 30, 1)");
+m2 = m.inverse();
+
+shouldBe('parseFloat(m2.m11)', '0.5');
+shouldBe('parseFloat(m2.m12)', '0');
+shouldBe('parseFloat(m2.m13)', '0');
+shouldBe('parseFloat(m2.m14)', '0');
+shouldBe('parseFloat(m2.m21)', '0');
+shouldBe('parseFloat(m2.m22)', '0.5');
+shouldBe('parseFloat(m2.m23)', '0');
+shouldBe('parseFloat(m2.m24)', '0');
+shouldBe('parseFloat(m2.m31)', '0');
+shouldBe('parseFloat(m2.m32)', '0');
+shouldBe('parseFloat(m2.m33)', '0.5');
+shouldBe('parseFloat(m2.m34)', '0');
+shouldBe('parseFloat(m2.m41)', '-5');
+shouldBe('parseFloat(m2.m42)', '-10');
+shouldBe('parseFloat(m2.m43)', '-15');
+shouldBe('parseFloat(m2.m44)', '1');
+
+debug("");
+debug("Test immutability of inverse");
+shouldBe('parseFloat(m.m11)', '2');
+shouldBe('parseFloat(m.m12)', '0');
+shouldBe('parseFloat(m.m13)', '0');
+shouldBe('parseFloat(m.m14)', '0');
+shouldBe('parseFloat(m.m21)', '0');
+shouldBe('parseFloat(m.m22)', '2');
+shouldBe('parseFloat(m.m23)', '0');
+shouldBe('parseFloat(m.m24)', '0');
+shouldBe('parseFloat(m.m31)', '0');
+shouldBe('parseFloat(m.m32)', '0');
+shouldBe('parseFloat(m.m33)', '2');
+shouldBe('parseFloat(m.m34)', '0');
+shouldBe('parseFloat(m.m41)', '10');
+shouldBe('parseFloat(m.m42)', '20');
+shouldBe('parseFloat(m.m43)', '30');
+shouldBe('parseFloat(m.m44)', '1');
+
+debug("");
+debug("Test throwing exception from inverse");
+m = new WebKitCSSMatrix("matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0)"); // not invertible
+shouldThrow('m.inverse()');
+
+debug("");
+debug("Test translate");
+m = new WebKitCSSMatrix();
+var m2 = m.translate(10, 20, 30);
+shouldBe('m2.m11', '1');
+shouldBe('m2.m12', '0');
+shouldBe('m2.m13', '0');
+shouldBe('m2.m14', '0');
+shouldBe('m2.m21', '0');
+shouldBe('m2.m22', '1');
+shouldBe('m2.m23', '0');
+shouldBe('m2.m24', '0');
+shouldBe('m2.m31', '0');
+shouldBe('m2.m32', '0');
+shouldBe('m2.m33', '1');
+shouldBe('m2.m34', '0');
+shouldBe('m2.m41', '10');
+shouldBe('m2.m42', '20');
+shouldBe('m2.m43', '30');
+shouldBe('m2.m44', '1');
+
+debug("");
+debug("Test immutability of translate");
+shouldBe('m.m11', '1');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '1');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '1');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '0');
+shouldBe('m.m42', '0');
+shouldBe('m.m43', '0');
+shouldBe('m.m44', '1');
+
+debug("");
+debug("Test scale");
+m = new WebKitCSSMatrix();
+m2 = m.scale(10, 20, 30);
+shouldBe('m2.m11', '10');
+shouldBe('m2.m12', '0');
+shouldBe('m2.m13', '0');
+shouldBe('m2.m14', '0');
+shouldBe('m2.m21', '0');
+shouldBe('m2.m22', '20');
+shouldBe('m2.m23', '0');
+shouldBe('m2.m24', '0');
+shouldBe('m2.m31', '0');
+shouldBe('m2.m32', '0');
+shouldBe('m2.m33', '30');
+shouldBe('m2.m34', '0');
+shouldBe('m2.m41', '0');
+shouldBe('m2.m42', '0');
+shouldBe('m2.m43', '0');
+shouldBe('m2.m44', '1');
+
+debug("");
+debug("Test immutability of scale");
+shouldBe('m.m11', '1');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '1');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '1');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '0');
+shouldBe('m.m42', '0');
+shouldBe('m.m43', '0');
+shouldBe('m.m44', '1');
+
+debug("");
+debug("Test rotate");
+m = new WebKitCSSMatrix();
+m2 = m.rotate(10, 20, 30);
+shouldBe('parseFloat(m2.m11.toPrecision(6))', '0.813798');
+shouldBe('parseFloat(m2.m12.toPrecision(6))', '0.469846');
+shouldBe('parseFloat(m2.m13.toPrecision(6))', '-0.34202');
+shouldBe('parseFloat(m2.m14.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m21.toPrecision(6))', '-0.44097');
+shouldBe('parseFloat(m2.m22.toPrecision(6))', '0.882564');
+shouldBe('parseFloat(m2.m23.toPrecision(6))', '0.163176');
+shouldBe('parseFloat(m2.m24.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m31.toPrecision(6))', '0.378522');
+shouldBe('parseFloat(m2.m32.toPrecision(6))', '0.0180283');
+shouldBe('parseFloat(m2.m33.toPrecision(6))', '0.925417');
+shouldBe('parseFloat(m2.m34.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m41.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m42.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m43.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m44.toPrecision(6))', '1');
+
+debug("");
+debug("Test immutability of rotate");
+shouldBe('m.m11', '1');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '1');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '1');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '0');
+shouldBe('m.m42', '0');
+shouldBe('m.m43', '0');
+shouldBe('m.m44', '1');
+
+debug("");
+debug("Test rotateAxisAngle");
+m = new WebKitCSSMatrix();
+m2 = m.rotateAxisAngle(0.707, 0.707, 0.707, 45);
+shouldBe('parseFloat(m2.m11.toPrecision(6))', '0.804738');
+shouldBe('parseFloat(m2.m12.toPrecision(6))', '0.505879');
+shouldBe('parseFloat(m2.m13.toPrecision(6))', '-0.310617');
+shouldBe('parseFloat(m2.m14.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m21.toPrecision(6))', '-0.310617');
+shouldBe('parseFloat(m2.m22.toPrecision(6))', '0.804738');
+shouldBe('parseFloat(m2.m23.toPrecision(6))', '0.505879');
+shouldBe('parseFloat(m2.m24.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m31.toPrecision(6))', '0.505879');
+shouldBe('parseFloat(m2.m32.toPrecision(6))', '-0.310617');
+shouldBe('parseFloat(m2.m33.toPrecision(6))', '0.804738');
+shouldBe('parseFloat(m2.m34.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m41.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m42.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m43.toPrecision(6))', '0');
+shouldBe('parseFloat(m2.m44.toPrecision(6))', '1');
+
+debug("");
+debug("Test immutability of rotateAxisAngle");
+shouldBe('m.m11', '1');
+shouldBe('m.m12', '0');
+shouldBe('m.m13', '0');
+shouldBe('m.m14', '0');
+shouldBe('m.m21', '0');
+shouldBe('m.m22', '1');
+shouldBe('m.m23', '0');
+shouldBe('m.m24', '0');
+shouldBe('m.m31', '0');
+shouldBe('m.m32', '0');
+shouldBe('m.m33', '1');
+shouldBe('m.m34', '0');
+shouldBe('m.m41', '0');
+shouldBe('m.m42', '0');
+shouldBe('m.m43', '0');
+shouldBe('m.m44', '1');
+
+debug("");
+successfullyParsed = true;
+
+</script>
+<script src="../../fast/js/resources/js-test-post.js"></script>
+
+<script>
+</script>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/hit-testing/backface-hit-test.html b/LayoutTests/transforms/3d/hit-testing/backface-hit-test.html
new file mode 100644 (file)
index 0000000..be7e16b
--- /dev/null
@@ -0,0 +1,67 @@
+<html>
+<head>
+  <title>Hit testing on backface</title>
+  <style type="text/css" media="screen">
+  
+  div:hover {
+    outline: 2px solid orange;
+  }
+    #container {
+      width: 400px;
+      height: 200px;
+      border: 1px solid black;
+    }
+    
+    .box {
+      display: inline-block;
+      width: 160px;
+      height: 160px;
+      background-color: gray;
+      margin: 18px;
+      font-size: 200%;
+      text-align: center;
+    }
+    
+  </style>
+  <script type="text/javascript" charset="utf-8">
+    function log(s)
+    {
+      var results = document.getElementById('results');
+      results.innerHTML += s + '<br>';
+    }
+
+    function runTest()
+    {
+      var firstHit = document.elementFromPoint(120, 150);
+      var secondHit = document.elementFromPoint(300, 150);
+      
+      var box1 = document.getElementById('box1');
+      var box2 = document.getElementById('box1');
+      var container = document.getElementById('container');
+
+      if (firstHit == box1)
+        log('Found box1 on left: PASS');
+      else
+        log('Found ' + firstHit.id + ' on left: FAIL');
+
+        if (secondHit == container)
+          log('Found container on right: PASS');
+        else
+          log('Found ' + secondHit.id + ' on right: FAIL');
+    }
+    
+  </script>
+</head>
+<body onload="runTest()">
+
+<p>There are two boxes below, both rotated 180&deg; in Y. The rightmost one has backface-visibility: hidden, so you can't see it.</p>
+<div id="container">
+  <div class="box" id="box1" style="-webkit-transform: translateZ(1px) rotateY(180deg)"></div>
+  <div class="box" id="box2" style="-webkit-transform: translateZ(1px) rotateY(180deg); -webkit-backface-visibility: hidden;"></div>
+</div>
+
+<div id="results">
+</div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-2.html b/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-2.html
new file mode 100644 (file)
index 0000000..00db04a
--- /dev/null
@@ -0,0 +1,153 @@
+<html>
+<head>
+  <title>More point mapping through 3D transform hierarchies</title>
+  <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
+  <script type="text/javascript" charset="utf-8">
+
+    function test()
+    {
+      // Scroll so that frame view offsets are non-zero
+      // window.scrollTo(20, 100);
+
+      // document.getElementById('overflow').scrollLeft = 80;
+      // document.getElementById('overflow').scrollTop = 60;
+      
+      // In non-test mode, show the mouse coords for testing
+      if (!window.layoutTestController)
+        document.body.addEventListener('mousemove', mousemoved, false);
+
+      dispatchEvent(120, 128, 'box4', 2, 2);
+      dispatchEvent(336, 87, 'box7', 2, 2);
+      dispatchEvent(348, 86, 'box8', 2, 2);
+
+      dispatchEvent(582, 87, 'box11', 2, 2);
+      dispatchEvent(594, 86, 'box12', 2, 2);
+    }
+  </script>
+  <style type="text/css" media="screen">
+  
+    body {
+      margin: 0;
+      border: 1px solid black;
+      cursor: crosshair;
+    }
+
+    .test {
+      display: inline-block;
+      height: 200px;
+      width: 200px;
+      border: 1px solid black;
+      margin: 20px;
+    }
+
+    .box {
+      height: 100px;
+      width: 100px;
+      -webkit-box-sizing: border-box;
+      background-color: #DDD;
+      border: 1px solid black;
+    }
+
+    .box:hover {
+      outline: 3px solid orange;
+    }
+    
+    .container {
+      height: 140px;
+      width: 140px;
+      margin: 20px;
+      border: 1px solid black;
+      -webkit-box-sizing: border-box;
+      -webkit-perspective: 400;
+    }
+    
+    .transformed-3d {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #81AA8A;
+      -webkit-transform-style: preserve-3d;
+      -webkit-box-sizing: border-box;
+    }
+
+    .transformed-flat {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #AA7994;
+      -webkit-transform-style: flat;
+      -webkit-box-sizing: border-box;
+    }
+    
+    .inner {
+      background-color: blue;
+      height: 90px;
+      width: 90px;
+      -webkit-transform: rotateY(30deg);
+    }
+    
+    #results {
+      position: absolute;
+      left: 30px;
+      top: 500px;
+    }
+    
+    #mousepos {
+      position: absolute;
+      left: 430px;
+      top: 400px;
+      color: gray;
+      font-size: smaller;
+    }
+  </style>
+</head>
+<body onclick="clicked(event)">
+
+<div id="results"></div>
+
+<div class="test">
+  <!-- preserve-3d element with no transform-->
+  <div class="container box" id="box1">
+    <div class="transformed-3d box" style="-webkit-transform: rotateY(-30deg);" id="box2">
+      <div class="transformed-3d box" id="box3">
+        <div class="inner box" id="box4">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- layer with no transform-->
+  <div class="container box" id="box5">
+    <div class="transformed-3d box" style="-webkit-transform: rotateY(-30deg);" id="box6">
+      <div class="box" style="position: relative; padding-left: 20px" id="box7">
+        <div class="inner box" id="box8">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- non-layer with no transform-->
+  <div class="container box" id="box9">
+    <div class="transformed-3d box" style="-webkit-transform: rotateY(-30deg);" id="box10">
+      <div class="box" style="padding-left: 20px" id="box11">
+        <div class="inner box" id="box12">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div id="mousepos"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-deep.html b/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-deep.html
new file mode 100644 (file)
index 0000000..1a39817
--- /dev/null
@@ -0,0 +1,143 @@
+<html>
+<head>
+  <title>Point mapping through deeply nested 3D transforms</title>
+  <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
+  <script type="text/javascript" charset="utf-8">
+
+    function test()
+    {
+      // Scroll so that frame view offsets are non-zero
+      // window.scrollTo(20, 100);
+
+      // document.getElementById('overflow').scrollLeft = 80;
+      // document.getElementById('overflow').scrollTop = 60;
+      
+      // In non-test mode, show the mouse coords for testing
+      if (!window.layoutTestController)
+        document.body.addEventListener('mousemove', mousemoved, false);
+
+      dispatchEvent(45, 45, 'box1', 3, 3);
+      dispatchEvent(54, 44, 'box2', 2, 2);
+      dispatchEvent(104, 93, 'box3', 2, 2);
+
+      dispatchEvent(175, 137, 'box4', 2, 2);
+      dispatchEvent(167, 528, 'box4', 2, 296);
+
+      dispatchEvent(227, 197, 'box5', 2, 2);
+
+      dispatchEvent(539, 569, 'box7', 296, 296);
+
+      dispatchEvent(431, 441, 'box8', 85, 85);
+    }
+  </script>
+  <style type="text/css" media="screen">
+  
+    body {
+      margin: 0;
+      border: 1px solid black;
+      cursor: crosshair;
+    }
+
+    .test {
+      display: inline-block;
+      height: 400px;
+      width: 400px;
+      border: 1px solid black;
+      margin: 20px;
+    }
+
+    .box {
+      height: 300px;
+      width: 300px;
+      -webkit-box-sizing: border-box;
+      background-color: #DDD;
+      border: 1px solid black;
+    }
+
+    .box:hover {
+      outline: 3px solid orange;
+    }
+    
+    .container {
+      height: 340px;
+      width: 340px;
+      margin: 20px;
+      border: 1px solid black;
+      -webkit-box-sizing: border-box;
+      -webkit-perspective: 400;
+    }
+    
+    .transformed-3d {
+      height: 300px;
+      width: 300px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #81AA8A;
+      -webkit-transform-style: preserve-3d;
+      -webkit-box-sizing: border-box;
+      -webkit-transform: rotateY(20deg);
+    }
+
+    .transformed-flat {
+      height: 300px;
+      width: 300px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #AA7994;
+      -webkit-transform-style: flat;
+      -webkit-box-sizing: border-box;
+    }
+    
+    .inner {
+      background-color: blue;
+      height: 90px;
+      width: 90px;
+      margin: 40px;
+    }
+    
+    #results {
+      position: absolute;
+      left: 30px;
+      top: 650px;
+    }
+    
+    #mousepos {
+      position: absolute;
+      left: 30px;
+      top: 600px;
+      color: gray;
+      font-size: smaller;
+    }
+  </style>
+</head>
+<body onclick="clicked(event)">
+
+<!-- <div id="filler" style="position: absolute; top: 0; width: 100%; height: 100%"></div> -->
+
+<div class="test">
+  <!-- Flatten in the middle of 3d -->
+  <div class="container box" id="box1">
+    <div class="transformed-3d box" id="box2">
+      <div class="transformed-3d box" style="-webkit-transform: translateZ(40px) rotateX(10deg)" id="box3">
+        <div class="transformed-flat box" style="-webkit-transform: translate3d(0, 20px, 40px) rotateX(-15deg)" id="box4">
+          <div class="transformed-flat box" style="-webkit-perspective: 500" id="box5">
+            <div class="transformed-3d box" style="-webkit-transform-origin: top left; -webkit-transform: rotateY(-15deg);" id="box6">
+              <div class="transformed-3d box" style="-webkit-transform-origin: top left; -webkit-transform: translateZ(20px)" id="box7">
+                <div class="inner" id="box8">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div id="results"></div>
+<div id="mousepos"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-origins.html b/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-origins.html
new file mode 100644 (file)
index 0000000..f59d0e1
--- /dev/null
@@ -0,0 +1,154 @@
+<html>
+<head>
+  <title>Point mapping through 3D transforms with origins</title>
+  <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
+  
+  <script type="text/javascript" charset="utf-8">
+
+    function test()
+    {
+      // Scroll so that frame view offsets are non-zero
+      // window.scrollTo(20, 100);
+
+      // document.getElementById('overflow').scrollLeft = 80;
+      // document.getElementById('overflow').scrollTop = 60;
+      
+      // In non-test mode, show the mouse coords for testing
+      if (!window.layoutTestController)
+        document.body.addEventListener('mousemove', mousemoved, false);
+
+      dispatchEvent(48, 48, 'box1', 6, 6);
+      dispatchEvent(70, 41, 'box2', 3, 3);
+      dispatchEvent(185, 164, 'box2', 97, 97);
+      dispatchEvent(338, 64, 'box7', 3, 3);
+      dispatchEvent(92, 310, 'box10', 3, 3);
+      dispatchEvent(217, 444, 'box10', 96, 96);
+      dispatchEvent(337, 309, 'box13', 2, 2);
+      dispatchEvent(360, 334, 'box14', 2, 2);
+      dispatchEvent(500, 484, 'box14', 96, 96);
+    }
+  </script>
+  <style type="text/css" media="screen">
+  
+    body {
+      margin: 0;
+      border: 1px solid black;
+      cursor: crosshair;
+    }
+
+    .test {
+      display: inline-block;
+      height: 200px;
+      width: 200px;
+      border: 1px solid black;
+      margin: 20px;
+    }
+
+    .box {
+      height: 100px;
+      width: 100px;
+      -webkit-box-sizing: border-box;
+      background-color: #DDD;
+      border: 1px solid black;
+    }
+
+    .box:hover {
+      outline: 3px solid orange;
+    }
+    
+    .container {
+      height: 140px;
+      width: 140px;
+      margin: 20px;
+      border: 1px solid black;
+      -webkit-box-sizing: border-box;
+      -webkit-perspective: 400;
+      -webkit-perspective-origin: 20% 80%;
+    }
+    
+    .transformed {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #AAA;
+      -webkit-box-sizing: border-box;
+      -webkit-transform: translateZ(100px) rotateY(-40deg);
+      -webkit-transform-origin: 20% 40%;
+    }
+    
+    .layer {
+      padding: 20px;
+      background-color: #C0D69E;
+    }
+
+    .inner {
+      background-color: blue;
+    }
+    
+    #results {
+      position: absolute;
+      left: 30px;
+      top: 500px;
+    }
+    
+    #mousepos {
+      position: absolute;
+      left: 30px;
+      top: 700px;
+      color: gray;
+      font-size: smaller;
+    }
+  </style>
+</head>
+<body onclick="clicked(event)">
+
+<div id="results"></div>
+
+<div class="test">
+  <!-- Simple transformed div in perpsective -->
+  <div class="container box" id="box1">
+    <div class="transformed box" id="box2">
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed div in perpsective with non-layer child -->
+  <div class="container box" id="box5">
+    <div class="transformed box" id="box6">
+      <div class="inner box" id="box7">
+      </div>
+    </div>
+  </div>
+</div>
+<br>
+
+<div class="test">
+  <!-- Transformed div in perpsective with layer child -->
+  <div class="container box" id="box8">
+    <div class="transformed box" id="box9">
+      <div class="inner box" style="position: relative" id="box10">
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed div in perpsective with child having layer child -->
+  <div class="container box" id="box11">
+    <div class="transformed box" id="box12">
+      <div class="layer box" id="box13">
+        <div class="inner box" style="position: relative" id="box14">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div id="mousepos"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html b/LayoutTests/transforms/3d/point-mapping/3d-point-mapping-preserve-3d.html
new file mode 100644 (file)
index 0000000..e6c1a35
--- /dev/null
@@ -0,0 +1,198 @@
+<html>
+<head>
+  <title>Point mapping through 3D transform hierarchies</title>
+  <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
+  <script type="text/javascript" charset="utf-8">
+
+    function test()
+    {
+      // Scroll so that frame view offsets are non-zero
+      // window.scrollTo(20, 100);
+
+      // document.getElementById('overflow').scrollLeft = 80;
+      // document.getElementById('overflow').scrollTop = 60;
+      
+      // In non-test mode, show the mouse coords for testing
+      if (!window.layoutTestController)
+        document.body.addEventListener('mousemove', mousemoved, false);
+
+      dispatchEvent(44, 44, 'box1', 2, 2);
+      dispatchEvent(74, 68, 'box2', 2, 2);
+      dispatchEvent(157, 164, 'box2', 98, 98);
+
+      dispatchEvent(320, 68, 'box4', 2, 2);
+      dispatchEvent(336, 87, 'box5', 2, 2);
+
+      dispatchEvent(582, 87, 'box8', 2, 2);
+      dispatchEvent(658, 174, 'box8', 86, 86);
+
+      dispatchEvent(74, 314, 'box10', 2, 2);
+      dispatchEvent(91, 351, 'box11', 2, 2);
+
+      dispatchEvent(320, 314, 'box13', 2, 2);
+      dispatchEvent(343, 351, 'box14', 2, 2);
+      dispatchEvent(365, 375, 'box15', 2, 2);
+
+      dispatchEvent(566, 314, 'box17', 2, 2);
+      dispatchEvent(587, 352, 'box18', 2, 2);
+      dispatchEvent(629, 401, 'box19', 2, 2);
+      dispatchEvent(653, 422, 'box20', 2, 2);
+      dispatchEvent(745, 505, 'box20', 86, 87);
+    }
+  </script>
+  <style type="text/css" media="screen">
+  
+    body {
+      margin: 0;
+      border: 1px solid black;
+      cursor: crosshair;
+    }
+
+    .test {
+      display: inline-block;
+      height: 200px;
+      width: 200px;
+      border: 1px solid black;
+      margin: 20px;
+    }
+
+    .box {
+      height: 100px;
+      width: 100px;
+      -webkit-box-sizing: border-box;
+      background-color: #DDD;
+      border: 1px solid black;
+    }
+
+    .box:hover {
+      outline: 3px solid orange;
+    }
+    
+    .container {
+      height: 140px;
+      width: 140px;
+      margin: 20px;
+      border: 1px solid black;
+      -webkit-box-sizing: border-box;
+      -webkit-perspective: 400;
+    }
+    
+    .transformed-3d {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #81AA8A;
+      -webkit-transform-style: preserve-3d;
+      -webkit-box-sizing: border-box;
+      -webkit-transform: rotateY(-30deg);
+    }
+
+    .transformed-flat {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #AA7994;
+      -webkit-transform-style: flat;
+      -webkit-box-sizing: border-box;
+      -webkit-transform: rotateY(-30deg);
+    }
+    
+    .inner {
+      background-color: blue;
+      height: 90px;
+      width: 90px;
+    }
+    
+    #results {
+      position: absolute;
+      left: 30px;
+      top: 500px;
+    }
+    
+    #mousepos {
+      position: absolute;
+      left: 430px;
+      top: 550px;
+      color: gray;
+      font-size: smaller;
+    }
+  </style>
+</head>
+<body onclick="clicked(event)">
+
+<div id="results"></div>
+
+<div class="test">
+  <!-- Simple transformed div in perpsective; preserve-3d on leaf -->
+  <div class="container box" id="box1">
+    <div class="transformed-3d box" id="box2">
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed, preserve-3d div in perpsective with non-layer child -->
+  <div class="container box" id="box3">
+    <div class="transformed-3d box" id="box4">
+      <div class="inner box" id="box5">
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed, preserve-3d div in perpsective with layer child -->
+  <div class="container box" id="box6">
+    <div class="transformed-3d box" id="box7">
+      <div class="inner box" style="position: relative" id="box8">
+      </div>
+    </div>
+  </div>
+</div>
+<br>
+<div class="test">
+  <!-- Nested transformed, preserve-3d divs in perpsective -->
+  <div class="container box" id="box9">
+    <div class="transformed-3d box" id="box10">
+      <div class="transformed-3d box" style="-webkit-transform: translateZ(20px) rotateY(50deg)" id="box11">
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed, preserve-3d div in perpsective with non-layer child -->
+  <div class="container box" id="box12">
+    <div class="transformed-3d box" id="box13">
+      <div class="transformed-3d box" style="-webkit-transform: translateZ(10px) rotateY(50deg)" id="box14">
+        <div class="inner box" id="box15">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Flatten in the middle of 3d -->
+  <div class="container box" id="box16">
+    <div class="transformed-3d box" id="box17">
+      <div class="transformed-3d box" style="-webkit-transform: translateZ(10px) rotateY(20deg)" id="box18">
+        <div class="transformed-flat box" style="-webkit-transform-style: flat; -webkit-transform: rotateX(-20deg)" id="box19">
+          <div class="inner box" id="box20">
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div id="mousepos"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/3d-point-mapping.html b/LayoutTests/transforms/3d/point-mapping/3d-point-mapping.html
new file mode 100644 (file)
index 0000000..6c52dee
--- /dev/null
@@ -0,0 +1,149 @@
+<html>
+<head>
+  <title>Point mapping through 3D transforms</title>
+  <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
+  
+  <script type="text/javascript" charset="utf-8">
+    
+    function test()
+    {
+      // Scroll so that frame view offsets are non-zero
+      // window.scrollTo(20, 100);
+
+      // document.getElementById('overflow').scrollLeft = 80;
+      // document.getElementById('overflow').scrollTop = 60;
+      
+      dispatchEvent(44, 44, 'box1', 2, 2);
+      dispatchEvent(69, 55, 'box2', 2, 2);
+      dispatchEvent(165, 182, 'box2', 96, 96);
+      dispatchEvent(333, 79, 'box7', 2, 2);
+      dispatchEvent(87, 325, 'box10', 2, 2);
+      dispatchEvent(196, 467, 'box10', 98, 98);
+      dispatchEvent(333, 325, 'box13', 2, 2);
+      dispatchEvent(353, 352, 'box14', 2, 2);
+      dispatchEvent(472, 507, 'box14', 97, 97);
+    }
+    
+  </script>
+  <style type="text/css" media="screen">
+  
+    body {
+      margin: 0;
+      border: 1px solid black;
+      cursor: crosshair;
+    }
+
+    .test {
+      display: inline-block;
+      height: 200px;
+      width: 200px;
+      border: 1px solid black;
+      margin: 20px;
+    }
+
+    .box {
+      height: 100px;
+      width: 100px;
+      -webkit-box-sizing: border-box;
+      background-color: #DDD;
+      border: 1px solid black;
+    }
+
+    .box:hover {
+      outline: 3px solid orange;
+    }
+    
+    .container {
+      height: 140px;
+      width: 140px;
+      margin: 20px;
+      border: 1px solid black;
+      -webkit-box-sizing: border-box;
+      -webkit-perspective: 400;
+    }
+    
+    .transformed {
+      position: relative;
+      height: 100px;
+      width: 100px;
+      padding: 20px;
+      margin: 20px;
+      border: 1px solid black;
+      background-color: #AAA;
+      -webkit-box-sizing: border-box;
+      -webkit-transform: translateZ(100px) rotateY(-40deg);
+    }
+    
+    .layer {
+      padding: 20px;
+      background-color: #C0D69E;
+    }
+
+    .inner {
+      background-color: blue;
+    }
+    
+    #results {
+      position: absolute;
+      left: 30px;
+      top: 500px;
+    }
+    
+    #mousepos {
+      position: absolute;
+      left: 30px;
+      top: 700px;
+      color: gray;
+      font-size: smaller;
+    }
+  </style>
+</head>
+<body onclick="clicked(event)">
+
+<div id="results"></div>
+
+<div class="test">
+  <!-- Simple transformed div in perpsective -->
+  <div class="container box" id="box1">
+    <div class="transformed box" id="box2">
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed div in perpsective with non-layer child -->
+  <div class="container box" id="box5">
+    <div class="transformed box" id="box6">
+      <div class="inner box" id="box7">
+      </div>
+    </div>
+  </div>
+</div>
+<br>
+
+<div class="test">
+  <!-- Transformed div in perpsective with layer child -->
+  <div class="container box" id="box8">
+    <div class="transformed box" id="box9">
+      <div class="inner box" style="position: relative" id="box10">
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="test">
+  <!-- Transformed div in perpsective with child having layer child -->
+  <div class="container box" id="box11">
+    <div class="transformed box" id="box12">
+      <div class="layer box" id="box13">
+        <div class="inner box" style="position: relative" id="box14">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div id="mousepos"></div>
+
+</body>
+</html>
diff --git a/LayoutTests/transforms/3d/point-mapping/point-mapping-helpers.js b/LayoutTests/transforms/3d/point-mapping/point-mapping-helpers.js
new file mode 100644 (file)
index 0000000..d7a2af2
--- /dev/null
@@ -0,0 +1,62 @@
+
+if (window.layoutTestController)
+    layoutTestController.waitUntilDone();
+
+function mousemoved(e)
+{
+  var resultBox = document.getElementById('mousepos');
+  var offsets = 'element id: ' + e.target.id + '<br> clientX: ' + e.clientX + ' clientY: ' + e.clientY + '<br>';
+  offsets += 'offsetX: ' + e.offsetX + ' offsetY: ' + e.offsetY;
+  resultBox.innerHTML = offsets;
+}
+
+function dispatchEvent(clientX, clientY, expectedElementID, expectedOffsetX, expectedOffsetY)
+{
+  var ev = document.createEvent("MouseEvent");
+  ev.initMouseEvent("click", true, true, window, 1, 1, 1, clientX, clientY, false, false, false, false, 0, document);
+  ev.expectedElement = expectedElementID;
+  ev.expectedOffsetX = expectedOffsetX;
+  ev.expectedOffsetY = expectedOffsetY;
+  var target = document.elementFromPoint(ev.pageX, ev.pageY);
+  target.dispatchEvent(ev);
+}
+
+function clicked(event)
+{
+  var element = event.target;
+  
+  var result;
+  if (element.id == event.expectedElement &&
+      event.offsetX == event.expectedOffsetX &&
+      event.offsetY == event.expectedOffsetY)
+    result = '<span style="color: green">PASS: event at (' + event.clientX + ', ' + event.clientY + ') hit ' + element.id + ' at offset (' + event.offsetX + ', ' + event.offsetY + ')</span>';
+  else
+    result = '<span style="color: red">FAIL: event at (' + event.clientX + ', ' + event.clientY + ') expected to hit ' + event.expectedElement + ' at (' + event.expectedOffsetX + ', ' + event.expectedOffsetY + ') but hit ' + element.id + ' at (' + event.offsetX + ', ' + event.offsetY + ')</span>';
+
+  log(result);
+}
+
+function log(s)
+{
+  var resultsDiv = document.getElementById('results');
+  resultsDiv.innerHTML += s + '<br>';
+}
+
+function runTest()
+{
+    // In non-test mode, show the mouse coords for testing
+    if (window.layoutTestController)
+      document.getElementById('mousepos').style.display = 'none';
+    else
+      document.body.addEventListener('mousemove', mousemoved, false);
+
+    test();
+    if (window.layoutTestController)
+        layoutTestController.notifyDone();
+}
+
+window.addEventListener('load', function() {
+  window.setTimeout(runTest, 0);
+}, false);
+
+