Closed pmaojo closed 5 years ago
Also happening when PWA is installed on Android
Hello @pmaojo
I tried reproduce this issue on Xaomi Redmi Note 4 (Android version: 7.0 NRD90M) but all images are displayed.
Please provide more details.
We saw this once on my colleague's phone which is a OnePlus 6 (I believe), also on Chrome. I was able top inspect for a while and noticed this line of css: mix-blend-mode: multiply; on the images. Disabling this line made the images appear. That is all the inspecting I did at that time, and right now I have only 1 Android test device with me which is a Huawei P Smart and cannot reproduce this issue.
So if anyone is able to reproduce this issue on their phone, try looking into that css
Hi @pmaojo @RGijsberts today I was trying to check this problem on 10 different mobile devices (with Android and iOS). I tested on demo and next.storefrontcloud.io, with Chrome, Firefox and Safari (also PWA installed) and.. nothing, everything looks good for me
This night I will be able to inspect with my device and try to fix it
That is it. Tested with chrome inspector running on my Android Xiaomi 6 Mi. The use of mix-blend-mode CSS property should be avoided. Thoughts:
Should this be fixed?
In that case, I believe we should have this feature (cutting off the background as an option on the vs-api) level maybe? I mean: we can set the guidelines but the default Magento product set images are not compliant with it - and have just the white background :)
Maybe just some specific blend mode is not supported on the Android? Can You help us checking the different options from: https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode
?
This is overall strange as https://caniuse.com/#search=blend-mode shows that it should work on Chrome for Android anyway :(
This fixes:
.product-image--loaded {
transform: translateZ(0);
}
Cool. Can You Please create a fix for 1.9.1?
Yes
Current behavior
Images are not shown.
Expected behavior
Images should display.
Steps to reproduce the issue
Can you handle fixing this bug by yourself?
Right now I don't know the origin of the bug. I could try. But maybe someone has an idea to go right to the problem!
Which Release Cycle state this refers to? Info for developer.
Pick one option.
develop
branch and create Pull Request2. Feature / Improvement
back todevelop
.release
branch and create Pull Request3. Stabilisation fix
back torelease
.hotfix
ormaster
branch and create Pull Request4. Hotfix
back tohotfix
.Environment details