Wrong dimension on retina display

[allaire]

Bug description

On a retina display, with both srcset and data-zoom-src on the image, the dimensions are wrong on the zoomed image (the image is the same size the unzoomed image). I expected that the zoomed image would be the one in data-zoom-src.

      <img
        src="<%= item.gallery_image[orientation].url %>"
        srcset="<%= item.gallery_image[orientation].url %> 1x, <%= item.gallery_image[`${orientation}_2x`].url %> 2x"
        data-zoom-src="<%= item.gallery_image.url %>"
        alt="<%= item.gallery_image.alt %>"
      >

If I remove the srcset attribute, the image is correctly sized. This only happen on a retina display,

I saw #27 was similar to my issue, but looks like it should be fixed?

I created a sandbox here with the same setup as I have, you can see how weird the zoomed image is sized: https://codesandbox.io/s/6vlwkp24yk

I gave a try using the Zooming library, and it has the behaviour I want, if it helps to understand: https://codesandbox.io/s/n5yypw66wp

Environment

• Browser: name / version: Chrome Mac latest
• medium-zoom version: 1.0.3

Let me know if I need to provide more information to pin point the issue!

[tjbenton]

here's a workaround for this bug until it get's fixed

zoom
  .on('close', ({ target }) => {
    target.setAttribute('srcset', target.getAttribute('data-zoom-srcset'))
  })
  on('open', ({ target }) => {
    // `srcset` is being removed because of a small bug
    // https://github.com/francoischalifour/medium-zoom/issues/92
    target.setAttribute('data-zoom-srcset', target.getAttribute('srcset'))
    target.removeAttribute('srcset')
  })

[DotIN13]

The same issue also ocuured when working picture tag with srcset, in which the image does not consume the full viewport.