Bug 33379 – Full Page Zoom: image maps not scaled with images

• Status: NEW
• Component: Layout and Rendering

[Nicholas Shanks]

When using the full page zoom (either scaling in Safari or using the zoom CSS keyword) the clickable regions of an image map do not scale to match the image.

[Nicholas Shanks]

Created attachment 46133 [details]
i already attached this when i filed the bug. why is it now missing?

[Nicholas Shanks]

Created attachment 46134 [details]
image to go with test case

[Nicholas Shanks]

Created attachment 48068 [details]
second image

sorry, you need both of them

[Simon Fraser (smfr)]

Should be an easy fix.

[Max Vujovic]

I couldn't reproduce this in r101263.

For me, the test case appears to work. The clickable regions of the image map scale up with the image using the zoom CSS keyword or using scaling in Safari.

[Alexey Proskuryakov]

Hmm, this sounds like original of bug 69421, which was still reproducible very recently.

[Max Vujovic]

(In reply to comment #6)
> Hmm, this sounds like original of bug 69421, which was still reproducible very recently.

That's interesting. I could also easily reproduce bug 69421 but not this bug in its test case. I'll take a look at what the difference is between the two test cases.

[Max Vujovic]

Created attachment 116850 [details]
reduced test case image

[Max Vujovic]

Created attachment 116851 [details]
reduced test case: image map, no scaling

[Max Vujovic]

Created attachment 116852 [details]
reduced test case: image map, css width and height scaling

[Max Vujovic]

Created attachment 116853 [details]
reduced test case: image map, css zoom scaling

[Max Vujovic]

I think this bug is about CSS zoom and bug 69421 is about CSS width and height.

Both cause issues with image map scaling but in slightly different ways. I've added 3 test cases to demonstrate the issues. In some of the cases, you can see that the focus rectangles are off by holding down the mouse button on a clickable area. 

1) CSS zoom case:
https://bug-33379-attachments.webkit.org/attachment.cgi?id=116853

#image
{
     zoom: 2.0;
}

Results:
1) Image scales (expected)
2) Clickable areas scale (expected)
3) Focus rectangles of clickable areas do NOT scale (bug)

2) CSS width and height case:
https://bug-33379-attachments.webkit.org/attachment.cgi?id=116852

#image
{
     /* The original image is 200x200. */          width: 400px;
     height: 400px;
}

Results:
1) Image scales (expected)
2) Clickable areas do NOT scale (bug)
3) Focus rectangles of clickable areas do NOT scale (bug)

3) Zooming in with Safari case (works as expected):
https://bug-33379-attachments.webkit.org/attachment.cgi?id=116851

Pressing [CMD+]

Results:
1) Image scales (expected)
2) Clickable areas scale (expected)
3) Focus rectangles of clickable areas scale (expected)

[Max Vujovic]

Based on the previous comment:

Case 1) I've created a new bug to clarify the CSS zoom / focus ring issue mentioned in this bug: https://bugs.webkit.org/show_bug.cgi?id=73595

Case 2) The CSS width / height case is https://bugs.webkit.org/show_bug.cgi?id=69421

Case 3) Zooming in with Safari works as expected for me. Could not reproduce.