RESOLVED DUPLICATE of bug 96168 66095
Invalid SVG highlighted regions on Safari w/VoiceOver 
https://bugs.webkit.org/show_bug.cgi?id=66095
Summary Invalid SVG highlighted regions on Safari w/VoiceOver
Courtney Christensen
Reported 2011-08-11 14:00:51 PDT
Created attachment 103666 [details] iOS screenshot for example #1 A secondary, invalid accessibility overlay is generated at the wrong location for transformed SVG elements. Live examples -------------------- Two live examples can be found at: http://viewplus.com/downloads/htmltests/accessibility/msafari-overlay-bug.xhtml The first test case shows inline SVG with page-level CSS padding applied. The second uses the `transform="translate(x,y)"` attribute on an SVG rect. Results are similar with both the desktop and mobile versions of Safari (see screenshots at link) Details -------------------- Elements can be made selectable by using `role="button"` (or similar). Transformed SVG elements create an additional, invalid selectable area at the untransformed location. Tapping/navigating-to the transformed SVG element incorrectly displays the highlighting rectangle at the untransformed location. Tapping/navigating-to this untransformed location (when nothing is highlighted) also displays the highlighting rectangle. This occurs with both CSS-based and SVG-based transformations. To reproduce -------------------- Code for example #1 (CSS-based error): <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> body { padding: 25px; } </style> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"> <rect x="50" y="50" width="50" height="50" role="button" aria-label="click me" /> </svg> </body> </html> Code for example #2 (`transform`-based error): <svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"> <rect x="0" y="0" width="50" height="50" transform="translate(150, 150)" role="button" aria-label="click me" /> </svg>
Attachments
iOS screenshot for example #1 (29.11 KB, image/png)
2011-08-11 14:00 PDT, Courtney Christensen 		no flags
Details
Example #1 source (560 bytes, application/xhtml+xml)
2011-08-11 14:02 PDT, Courtney Christensen 		no flags
Details
Example #2 source (360 bytes, image/svg+xml)
2011-08-11 14:02 PDT, Courtney Christensen 		no flags
Details
iOS screenshot for example #2 (29.36 KB, image/png)
2011-08-11 14:03 PDT, Courtney Christensen 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Courtney Christensen
Comment 1 2011-08-11 14:02:16 PDT
Created attachment 103667 [details] Example #1 source
Courtney Christensen
Comment 2 2011-08-11 14:02:43 PDT
Created attachment 103669 [details] Example #2 source
Courtney Christensen
Comment 3 2011-08-11 14:03:07 PDT
Created attachment 103670 [details] iOS screenshot for example #2
chris fleizach
Comment 4 2011-08-11 14:20:54 PDT
rdar://9939761
chris fleizach
Comment 5 2012-09-20 11:07:02 PDT
*** This bug has been marked as a duplicate of bug 96168 ***
Note You need to log in before you can comment on or make changes to this bug.