| <!DOCTYPE html> |
| <html> |
| <script> |
| function check_rect_bbox(bbox, test_name) |
| { |
| var result_str = ""; |
| var visible_rect = document.querySelector("#r1"); |
| var expected_bbox = visible_rect.getBBox(); |
| |
| if (bbox.x == expected_bbox.x && bbox.y == expected_bbox.y && bbox.width == expected_bbox.width && bbox.height == expected_bbox.height) { |
| result_str = "Passed"; |
| } else { |
| result_str += test_name + ": Failed"; |
| result_str += "("+bbox.x+","+bbox.y+":"+bbox.width + "," + bbox.height+")"; |
| visible_rect.setAttribute("fill", "red"); |
| |
| var bbox_rect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); |
| bbox_rect.setAttribute("x", bbox.x); |
| bbox_rect.setAttribute("y", bbox.y); |
| bbox_rect.setAttribute("width", bbox.width); |
| bbox_rect.setAttribute("height", bbox.height); |
| bbox_rect.setAttribute("fill", "none"); |
| bbox_rect.setAttribute("stroke", "red"); |
| bbox_rect.setAttribute("stroke-dasharray", "5 5"); |
| document.querySelector("svg").appendChild(bbox_rect); |
| } |
| |
| var p_result = document.querySelector("#result"); |
| p_result.appendChild(document.createTextNode(result_str + "; ")); |
| } |
| |
| function run() |
| { |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| var g_bbox = document.querySelector("#g1").getBBox(); |
| check_rect_bbox(g_bbox, "Group with hidden child"); |
| } |
| </script> |
| |
| <body onload="run()"> |
| <p>Bug <a href="https://bugs.webkit.org/show_bug.cgi?id=134184">134184</a>: Bounding box of hidden child is unioned with other elements of group</p> |
| <p>For this test to pass, you should see 'Passed' below.</a> |
| <p id="result"></p> |
| <svg xmlns="http://www.w3.org/2000/svg"> |
| <g id="g1"> |
| <rect id="r1" x="50" y="50" width="50" height="50" fill="green" /> |
| <rect id="r2" x="20" y="20" width="20" height="0" fill="red" /> |
| <rect id="r3" x="120" y="20" width="20" height="20" fill="blue" style="display:none" /> |
| <ellipse id="c1" cx="20" cy="120" rx="0" ry="20" fill="black" /> |
| <!-- test the fall-back case as well as the normal case --> |
| <ellipse id="c2" cx="120" cy="20" rx="0" ry="20" stroke="black" vector-effect="non-scaling-stroke" /> |
| <rect id="r4" x="20" y="120" width="20" height="0" fill="none" stroke="black" vector-effect="non-scaling-stroke" /> |
| <g> |
| <rect id="r4" x="120" y="120" width="-1" height="100" fill="cyan" /> |
| </g> |
| </g> |
| </svg> |
| </body> |
| </html> |
