Automattic / Automattic/jetpack
Image Compare Plays Badly with Pinterest Image Hover Button
- Dominant language
- PHP
- Stars
- 1.8k
- Forks
- 898
- Avg merge
- 1d 18h
- Merged PRs (30d)
- 774
Description
I have a series of sites that use the Grow Social Share plugin by MediaVine (the plugin was previously called Social Pug). This issue may or may not be exclusive to Grow's implementation of the Pinterest Image Hover button.
With the image hover button enabled none of the images show in an Image Compare block.
With the image hover button disabled the images show and work as expected in an Image Compare block.
In Inspector Tools (Opera) the left and right images are both set to 0x0 pixels. To be sure I'm looking at the correct elements, here is the selector path for the left image: `#post-00000 > div > div > div.wp-block-group > div > figure > div > div > div.jx-image.jx-left > div > img` (00000 is a dummy).
Attached is an HTML version of the page in question. The file extension as uploaded is txt to get it through the upload filter.
This might be related to #16036 and #16001 .
[piloncilloyvainilla.com_pizza-hecha-en-casa_.txt](https://github.com/Automattic/jetpack/files/4974738/piloncilloyvainilla.com_pizza-hecha-en-casa_.txt)
Contributor guide
Research direction
Open the attached piloncilloyvainilla.com_pizza-hecha-en-casa_.txt HTML and reproduce the Image Compare block with the Pinterest Image Hover button enabled and disabled. Inspect the reported selector for the left image and compare its dimensions in both states. Done means both images render and the Image Compare block works with the hover button enabled.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- wordpress
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100