Certain pictures don't load in browser

Certain pictures are not loading in browsers.

If I inspect element on the page and go directly to the links, they do load.

I tried in Firefox using a new profile and I also tried on a fresh install of Vivaldi and Chromium. Same result.

This is on a Dell Precision 5530

Example website - [Preformatted text](https://us.delsey.com/products/401676805-chatelet-air-20-20inch-carry-on-spinner?variant=46387661111519)

Obviously a problem with the site, as the pictures didnā€™t load when I tested on Firefox (with add-ons enabled, and then with add-ons disabled via --safe-mode) and Falkon browsers. Do you have access to a Windows system to see if the images load on that?

Upon cursory inspection, this seems to be the part of the source code that does not render the images:

<span
                                                class="Blush Pink color-swatch color-swatch--small color-swatch--blush-pink color-swatch--with-image"
                                                data-url="/products/401676805-chatelet-air-20-20inch-carry-on-spinner?variant=46438588121311"  data-price="$230.99" data-percent="-30%"
                                                
                                                    data-variant-id="46438588121311"
                                                    data-variant-image="//us.delsey.com/cdn/shop/files/40167680519-Main_400x.webp?v=1730908305"
                                                    data-variant-image2="//us.delsey.com/cdn/shop/files/40167680515-Chatelet-Air-20-Carry-On-Plus-Angora_1_400x.jpg?v=1723831132"
                                                
                                                style="background-color:#efdfdf">
                                                <span class="visually-hidden">Blush Pink</span>
                                            </span>

However, the image does display in the ā€œShop Allā€ hover menu as it uses standard HTML (<img src=):

<div class="site-header__drawer site-header__mobile-nav medium-up--hide" id="MobileNav">
            <div class="site-header__drawer-animate"><div class="slide-nav__wrapper" data-level="1">
  <ul class="slide-nav"><li class="slide-nav__item"><button type="button"
            class="slide-nav__button js-toggle-submenu"
            data-target="tier-2-shop-all1"
            >
            <span class="slide-nav__link"><div class="slide-nav__image">
            <img src="//us.delsey.com/cdn/shop/files/40167680515-Chatelet-Air-20-Carry-On-Plus-Angora_1_400x.jpg?v=1723831132" alt="Shop All">
          </div>

You might want to contact the site to advise them of the issue. Maybe they are not adhering to Web Standards | W3C.

Oddā€¦ they all appear for meā€¦ and I didnt even have to turn off anything like 3rd-party script blocking, etc.

( Firefox for what its worth )

At least if we are talking about the same images. Example scrot:

Imgur

Interesting. The site doesnā€™t appear to load fully for me even if I temporarily disable uBlock Origin. Not seeing the above images here, with Firefox. Just the smaller ones, when you hover the mouse pointer over the links.

1 Like

Had the thought.
But for now it could just as well be a real support query.


Back to the issue.

Heres an idea ā€¦ hardware acceleration?

Do users not able to view the image content have it properly configured?

Can the images be viewed with Hardware Acceleration toggle in settings flipped (turn off)?

Iā€™ve been able to rustle up some similar reports, though especially for chrom*, that seem to present similarly, that could be remedied by disabling the hardware acceleration option.

https://askubuntu.com/questions/1469580/ubuntu-22-04-chrome-broswer-cant-see-any-text-or-image-content-after-update


PS.
I forgot to address this earlier.
The span, data-url construct for serving the images is not in error.
See examples of data-url ( including image/extension ) here:

Though. Looking closer it would not appear that should matter. Iā€™m not sure where the original share came from, but in inspector, the images are in a span block but are a regular html img tag within it (bag, first image, top left);

<img class="photoswipe__image lazyautosizes lazyloaded" data-photoswipe-src="//us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_1800x1800.webp?v=1729020824" data-photoswipe-width="3000" data-photoswipe-height="3000" data-index="1" data-widths="[360, 540, 720, 900, 1080]" data-aspectratio="1.0" data-sizes="auto" alt="" data-srcset="//us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_360x.webp?v=1729020824 360w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_540x.webp?v=1729020824 540w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_720x.webp?v=1729020824 720w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_900x.webp?v=1729020824 900w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_1080x.webp?v=1729020824 1080w" sizes="405px" srcset="//us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_360x.webp?v=1729020824 360w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_540x.webp?v=1729020824 540w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_720x.webp?v=1729020824 720w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_900x.webp?v=1729020824 900w, //us.delsey.com/cdn/shop/files/40167680509-Chatelet-Air-20-Carry-On-Plus-Pink_1_1080x.webp?v=1729020824 1080w">

Just tried Firefox with hardware acceleration disabled & add-ons disabled - still canā€™t see the pictures.

1 Like

I have been able to replicate the behavior on both Falkon and a fresh FF profile.

So ā€¦ I guess the question becomes ā€¦ what have I done to make it work? :sweat_smile:

Maybe you did nothing - if you are in the USA, it might just work for you.

Maybe geo-blocking is the cause? Iā€™m in Australia & @BG405 is in the UK. We both canā€™t view that part of the web page. The OPā€™s forum profile time indicates they are on the same time as New York. However if they are in another country that is on the same time, or if they are using a VPN or proxy, the site might block access. Iā€™m fairly sure geo-blocking can apply to portions of a page.

1 Like

I had a similar thought ā€¦ and at least switching to various different regions via VPN didnt seem to make a difference.

What did make a difference was fresh/other browsers aside from my daily driver.

So it may have something to do with configuration. But I dont know what.

EDIT.

OK. Iā€™ve narrowed it down to my ublock:origin settings.
Turning it off made all the images disappear.

@scotty65 you are also a uBO user, correct?

Please try to add the following to My Rules;

* * 3p-script block
* * 3p-frame block

This will essentially make ublock work similar to NoScript by blocking third party scrips and frames by default. This can be disabled/enabled per page or source via the uBO drop-down settings.

From my observations it was in fact the 3rd-party script blocking that allowed the images to appear.

(for some extra info on this and related ā€˜blocking modesā€™ of uBO see: Blocking mode: medium mode Ā· gorhill/uBlock Wiki Ā· GitHub [ā€˜mediumā€™ is actually lighter than what I really use])

3 Likes

Not a Manjaro issue.

Maybe not.

But we wouldnt know without running down the issue.

Til about 2 minutes ago the scenario was ā€œmultiple manjaro users cannot view website images, even though they are present on the pageā€ this was reproducible by most other users (but not all).

Great detective work :male_detective:

I added your suggestions to uBlock Originā€™s Temporary Rules, and was able to see the images.

2 Likes

Just tested in Microsoft Edge (with no prior configuration on my part; installed in Manjaro not a VM). Not working there either.

Imgur

Somehow I managed to not make it a haiku. :facepalm:

1 Like

Not reproducable here on any of the mentioned browsers.

Even so, my first thought was (as suggested somewhere above) geo-blocking, or temporary DNS issue (somwhere) preventing images being sourced and rendered.

In uBO, ignore generic cosmetic filters is not checked. Neither are any regions or annoyances. None of theses would necessarily cause the issue (unless images are hosted in one of the region IP ranges that might be blocked).

As in you can see the images?

We seem to have isolated it to third party script loading.

If you have that disabled some other way then thats probably why.

Iā€™ve also managed to narrow it down to the loading from cdn.shopify.com.
(all other scripts may be allowed ā€¦ and images will still be served.)

This is likely a problem of the scripts themselves, an issue with shopify, or a problem with the way the website implements this connect/cdn/script.

But Iā€™m satisfied enough. :slight_smile:

1 Like

Indeed.

The images work fine for me on a windows machine.

Iā€™m not a spam bot, but okay lol :sweat_smile:

Iā€™m in the US, not using a VPN on either devices.

I tried with a fresh firefox profile that doesnā€™t have ublock, but images still donā€™t load for me.

For me, the images loaded as expected on Debian, MacOS, Manjaro and Windows (10). I didnā€™t (and wonā€™t) test on BSD.

Itā€™s difficult to take a guess, but I dare say, it has little to do with Manjaro. :man_shrugging:

Itā€™s always possible that a (temporary) outtage of some kind (somewhere on the Internet) can cause an apparent issue for some and not for others.

Depending on what the issue seems to be, I sometimes check the following link to get a quick overview of global outtages that might affect the site Iā€™m trying to view;