| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description("This test checks the SVGViewSpec API using multiple <view> elements"); |
| jsTestIsAsync = true; |
| |
| var externalSVGFileName = "resources/multiple-view-elements.svg"; |
| |
| function matrixToString(matrix) { |
| return "[" + matrix.a.toFixed(2) + " " + matrix.b.toFixed(2) + " " + matrix.c.toFixed(2) + " " + matrix.d.toFixed(2) + " " + matrix.e.toFixed(2) + " " + matrix.f.toFixed(2) + "]"; |
| } |
| |
| var firstDocumentElement; |
| |
| function testFirstViewElement() { |
| |
| iframeElement = document.getElementById("iframe"); |
| currentDocumentElement = iframeElement.contentDocument.documentElement; |
| firstDocumentElement = currentDocumentElement; |
| currentView = currentDocumentElement.currentView; |
| |
| debug(""); |
| debug("Check transform value"); |
| shouldBeEmptyString("currentView.transformString"); |
| shouldBe("currentView.transform.numberOfItems", "0"); |
| |
| debug(""); |
| debug("Check viewTarget value"); |
| shouldBeEmptyString("currentView.viewTargetString"); |
| shouldBeNull("currentView.viewTarget"); |
| |
| debug(""); |
| debug("Check zoomAndPan value"); |
| shouldBe("currentView.zoomAndPan", "SVGViewElement.SVG_ZOOMANDPAN_MAGNIFY"); |
| |
| debug(""); |
| debug("Check viewBox value"); |
| shouldBe("currentView.viewBox.baseVal.x", "0"); |
| shouldBe("currentView.viewBox.baseVal.y", "0"); |
| shouldBe("currentView.viewBox.baseVal.width", "10"); |
| shouldBe("currentView.viewBox.baseVal.height", "10"); |
| shouldBeEqualToString("currentView.viewBoxString", "0 0 10 10"); |
| |
| debug(""); |
| debug("Check preserveAspectRatio value"); |
| shouldBeEqualToString("currentView.preserveAspectRatioString", "xMidYMid meet"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.align", "SVGPreserveAspectRatio.SVG_PRESERVEASPECTRATIO_XMIDYMID"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.meetOrSlice", "SVGPreserveAspectRatio.SVG_MEETORSLICE_MEET"); |
| |
| nextView = "#view2"; |
| debug(""); |
| debug("Loading external SVG " + externalSVGFileName + nextView + "..."); |
| debug(""); |
| |
| iframeElement.src = externalSVGFileName + nextView; |
| testSecondViewElement(); |
| } |
| |
| function testSecondViewElement() { |
| |
| iframeElement = document.getElementById("iframe"); |
| currentView = iframeElement.contentDocument.documentElement.currentView; |
| |
| debug("Verify that no load was performed, but only a different view was set on the same document"); |
| shouldBe("iframeElement.contentDocument.documentElement", "firstDocumentElement"); |
| |
| debug(""); |
| debug("Check transform value"); |
| shouldBeEmptyString("currentView.transformString"); |
| shouldBe("currentView.transform.numberOfItems", "0"); |
| |
| debug(""); |
| debug("Check viewTarget value"); |
| shouldBeEmptyString("currentView.viewTargetString"); |
| shouldBeNull("currentView.viewTarget"); |
| |
| debug(""); |
| debug("Check zoomAndPan value"); |
| shouldBe("currentView.zoomAndPan", "SVGViewElement.SVG_ZOOMANDPAN_MAGNIFY"); |
| |
| debug(""); |
| debug("Check viewBox value"); |
| shouldBe("currentView.viewBox.baseVal.x", "40"); |
| shouldBe("currentView.viewBox.baseVal.y", "0"); |
| shouldBe("currentView.viewBox.baseVal.width", "20"); |
| shouldBe("currentView.viewBox.baseVal.height", "10"); |
| shouldBeEqualToString("currentView.viewBoxString", "40 0 20 10"); |
| |
| debug(""); |
| debug("Check preserveAspectRatio value"); |
| shouldBeEqualToString("currentView.preserveAspectRatioString", "xMidYMax slice"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.align", "SVGPreserveAspectRatio.SVG_PRESERVEASPECTRATIO_XMIDYMAX"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.meetOrSlice", "SVGPreserveAspectRatio.SVG_MEETORSLICE_SLICE"); |
| |
| debug(""); |
| debug("Test dynamic modifications of the 'view2' element"); |
| iframeElement.contentDocument.documentElement.getElementById("view2").setAttribute("viewBox", "10 10 30 30"); |
| |
| debug(""); |
| debug("Check viewBox value after modification"); |
| shouldBe("currentView.viewBox.baseVal.x", "10"); |
| shouldBe("currentView.viewBox.baseVal.y", "10"); |
| shouldBe("currentView.viewBox.baseVal.width", "30"); |
| shouldBe("currentView.viewBox.baseVal.height", "30"); |
| shouldBeEqualToString("currentView.viewBoxString", "10 10 30 30"); |
| |
| nextView = "#svgView(viewBox(0 0 10 15);transform(scale(2 2));preserveAspectRatio(xMinYMax meet))"; |
| debug(""); |
| debug("Loading external SVG " + externalSVGFileName + nextView + "..."); |
| debug(""); |
| |
| iframeElement.src = externalSVGFileName + nextView; |
| testCustomViewSpec(); |
| } |
| |
| function testCustomViewSpec() { |
| |
| iframeElement = document.getElementById("iframe"); |
| currentView = iframeElement.contentDocument.documentElement.currentView; |
| |
| debug("Verify that no load was performed, but only a different view was set on the same document"); |
| shouldBe("iframeElement.contentDocument.documentElement", "firstDocumentElement"); |
| |
| debug(""); |
| debug("Check transform value"); |
| shouldBeEqualToString("currentView.transformString", "scale(2 2)"); |
| shouldBe("currentView.transform.numberOfItems", "1"); |
| |
| shouldBe("currentView.transform.getItem(0).type", "SVGTransform.SVG_TRANSFORM_SCALE"); |
| shouldBe("currentView.transform.getItem(0).angle", "0"); |
| shouldBeEqualToString("matrixToString(currentView.transform.getItem(0).matrix)", "[2.00 0.00 0.00 2.00 0.00 0.00]"); |
| |
| debug(""); |
| debug("Check viewTarget value"); |
| shouldBeEmptyString("currentView.viewTargetString"); |
| shouldBeNull("currentView.viewTarget"); |
| |
| debug(""); |
| debug("Check zoomAndPan value"); |
| shouldBe("currentView.zoomAndPan", "SVGViewElement.SVG_ZOOMANDPAN_MAGNIFY"); |
| |
| debug(""); |
| debug("Check viewBox value"); |
| shouldBe("currentView.viewBox.baseVal.x", "0"); |
| shouldBe("currentView.viewBox.baseVal.y", "0"); |
| shouldBe("currentView.viewBox.baseVal.width", "10"); |
| shouldBe("currentView.viewBox.baseVal.height", "15"); |
| shouldBeEqualToString("currentView.viewBoxString", "0 0 10 15"); |
| |
| debug(""); |
| debug("Check preserveAspectRatio value"); |
| shouldBeEqualToString("currentView.preserveAspectRatioString", "xMinYMax meet"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.align", "SVGPreserveAspectRatio.SVG_PRESERVEASPECTRATIO_XMINYMAX"); |
| shouldBe("currentView.preserveAspectRatio.baseVal.meetOrSlice", "SVGPreserveAspectRatio.SVG_MEETORSLICE_MEET"); |
| |
| finishJSTest(); |
| } |
| |
| nextView = "#view1"; |
| debug(""); |
| debug("Loading external SVG " + externalSVGFileName + nextView + "..."); |
| debug(""); |
| |
| var iframeElement = document.createElement("iframe"); |
| iframeElement.setAttribute("id", "iframe"); |
| iframeElement.setAttribute("width", "120px"); |
| iframeElement.setAttribute("height", "120px"); |
| iframeElement.setAttribute("onload", "setTimeout(testFirstViewElement, 0)"); |
| iframeElement.src = externalSVGFileName + "#view1"; |
| document.getElementById("console").appendChild(iframeElement); |
| |
| successfullyParsed = true; |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
