Zoom issues when using the <picture> and <img> element

[carlocarels90]

Check that this is really a bug

• I confirm

Reproduction link

https://codesandbox.io/s/swiper-zoom-forked-o4iw1?file=/index.html

Bug description

This issue was already mentioned in: #3456 (comment)
The problem still exist, so I've created a new one.

The problem

• The zoom function applies on all element that are found by this rule:
  

So the Zoom scale will be applied twice. (See demo)

• Slide 1 contains a <img> element.
• Slide 2 contains a <picture> element with an <img> inside.

swiperjs-zoom-issue.mov

Expected Behavior

Apply the zoom only on the first found $imageEl

Actual Behavior

The zoom is applied on the <picture> and <img> element. (See demo)

Swiper version

6.8.4

Platform/Target and Browser Versions

macOS, Chrome

Validations

• Follow our Code of Conduct
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

• I'm willing to open a PR