[Galleries] `index` is not taken into account, and sometimes as you switch images, the current one is stretched/shrinked horizontally to the width of the next one

[darkred]

Summary:

I have noticed two issues with galleries:

• hovered thumbnail is ignored not used as index
• as your switch to the next image, the current one is stretched/shrinked horizontally to the width of the next one.

Steps to reproduce the bug

• Install this rule: (ref)

  {"d": "twilightsite.com",
   "e": "td > a:first-child",
   "s": "gallery",
   "g": {
    "image": "td > a:first-child",
    "index": "return node.href"
   }
  }

• Open http://www.twilightsite.com/fantasy/Old/Royo/Royo.html

• Click "Disable cache" in devtools 'Network' in order to make it occur consistently.

• Mouseover 2nd thumb: notice that the 1st image is displayed full-size instead

• Now scroll until and then back and forth between 4th and 5th thumbs: notice that every time you switch images, the current full size is momentarily stretched horizontally to the width of the next/previous one

Screen capture:


Environment

• Browser: Chrome 127, Firefox 129
• Script manager: TM beta 5.3.6207, VM beta 2.20.2
• MPIV version: 1.4.1

[tophf]

Should be fixed now.

[darkred]

Yes, it's fixed. Thanks a lot for your quick response!

[darkred]

Hi @tophf . Unfortunately I recently see that it still occurs. If you reproduce the STR from OP, disable cache in Network devtools, mouseover 4nd thumb (wait for full image popup to complete) and scroll to 5th image, the issue occurs consistently. Tested with latest TM beta 5.3.6211 and VM beta 2.20.5 (Chrome 129/Firefox 130).

Screen capture:


[darkred]

Thanks a lot once again! I just noticed one thing: with the latest changes, now on mouseover there's a white placeholder initially, and then the image is gradually loaded. Is this necessary as part of the fix, or could it be avoided? (earlier the background was transparent)

Screen capture:


[tophf]

Is it Firefox? Looks like that ancient bug with images that always existed. I tried circumventing it by reusing the image, but it caused the problems with proportions.

[tophf]

You can enable Wait for complete image in MPIV options.

[darkred]

It occurs in both Chrome and Firefox, stable and even in nightly/canary. Ok, I see. Thanks for the tip, and again for the help!

[tophf]

It doesn't occur for me in Chrome.

[tophf]

I guess it's a bug in your GPU driver. Try installing a newer or a much older version.

[darkred]

My GPU is an NVidia GTX 1660Ti. The latest drivers 561.09 are very recent, released just two weeks ago. I'd prefer not to install an older driver because the current one supports a game I'm currently playing and another I'm interested in.

[darkred]

I just found that the issue with the white placeholder is essentially the same as #75 of four years ago (also reported by me four years ago, I had totally forgotten about it, sorry).

Anyway, regarding Firefox, there's this old and and unfortunately still open bugzilla bug 1556156 White background during image loading which I had mentioned in here https://github.com/tophf/mpiv/issues/75#issuecomment-942297323 . In other words, in Firefox the "white placeholder" issue always occurs, regardless of your latest commit. Sorry I got confused.

But, regarding Chrome, the "white placeholder" issue doesn't seem to be a browser bug: it started occurring with your https://github.com/tophf/mpiv/commit/e0b10f7d447ad3b7a17f653c237cfd9065be90fb commit. It didn't occur with previous commit https://github.com/tophf/mpiv/commit/64c59c43d4652604b88f7ad63df06020f1719d0c

Having in devtools 'Network':

• tick "Disable cache", as before, and
• enable Throttling to the slowest available preset, 3G

the white placeholder issue when mouseover 4th thumb occurs for me consistently with Chrome.

  I understand that this "white placeholder" issue must be a necessity in order not to have the problem with proportions, as you said, so I'd consider it something unavoidable.

[tophf]

it started occurring with your e0b10f7d447ad3b7a17f653c237cfd9065be90fb commit

This commit restored the ancient behavior, i.e. a new image is created when advancing in a gallery, so it is a bug in the browser that you reported in #75 and I still can't reproduce it. I'll try to understand the difference between the code back then, which fixed it for you, and now...

the white placeholder issue when mouseover 4th thumb occurs for me consistently with Chrome

Definitely a bug in Chrome or in GPU driver. Doesn't occur for me.

[tophf]

Regarding my "I'll try to understand the difference between the code back then, which fixed it for you, and now...", I've looked at the code and if I restore that, there'll be a bug in proportions.

[tophf]

BTW I've never seen it (the white background) in Chrome, and I can't even find any mentions of such a bug in Chrome in the internet...

[tophf]

Try adding #mpiv-popup.mpiv-show { background:none!important } to Custom CSS in options. And maybe #mpiv-popup.mpiv-show { box-shadow: none !important }

[darkred]

The combination of these two rules completely solved the issue in Chrome! Thank you so much!

Screen capture: