User icons don't load - Githubissues

kelson42 commented 3 months ago

User icons don't load properly in user lists... but once the force reloaded, then they load properly.

I believe this is not the only place with this bug around user icons.

benoit74 commented 3 months ago

I confirm bug is also present in questions.

For instance you can see it on https://library.kiwix.org/viewer#askubuntu.com_en_all_2024-03/questions/17823/how-to-list-all-installed-packages and https://askubuntu.com/questions/17823/how-to-list-all-installed-packages where anonymous2 and Ivan have a custom profile image in the online version but not inside the ZIM.

Looks like for each user image we get a 404 error on a webp resource (e.g. https://library.kiwix.org/content/askubuntu.com_en_all_2024-03/users/profiles/527350.webp)

When we force reload the webpage, we still have the 404 but the image is finally replaced by an inline SVG.

The inline SVG looks like a randomly generated image which is served when the user has no profile image

Looks like some JS code is not ran under all conditions.

This looks like a promising good first issue. I recommend to test it on the beer meta which is used in our automated tests (see https://github.com/openzim/sotoki/blob/3d8845d079d11ba41343a8ca1f63f779261e754b/.github/workflows/ci.yml#L15C57-L15C102), is way smaller than askubuntu and most probably also has the bug.

rgaudin commented 3 months ago

Haven't looked at it but might be linked to webp polyfill since that's async

benoit74 commented 2 months ago

Originally, profile image was sourced from "ProfileImageUrl".

This column seems to now systematically be blank in Users table of SO: https://data.stackexchange.com/stackoverflow/query/1840413

EmailHash were previously available but has been removed as well even before profileImageUrl: https://meta.stackexchange.com/questions/221027/where-did-emailhash-go

I think there is nothing we can do unfortunately ...

benoit74 commented 2 months ago

If fact, there is something to do to not have broken image. We cannot have the proper gravatar anymore, but users should not be presented with broken images. The only thing we can do it stop relying on the fallback / ensure fallback works immediately.

benoit74 commented 2 months ago

Problem seems to be that jidenticon.min.js behavior is quite unstable.

I created a very simple HTML file like this:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta content="utf-8" http-equiv="encoding">
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>TED Talks</title>
    <link id="favicon" rel="shortcut icon" href="favicon.png" type="image/png">
    <script src="./sotoki/jdenticon.min.js"></script>
    <script src="./sotoki/webp-hero.polyfill.js"></script>
</head>

<body>
    <svg width="80" height="80" data-jdenticon-value="Andrew Cheong"></svg>

</body>

</html>

jdenticon.min.js is sourced from https://raw.githubusercontent.com/dmester/jdenticon/3.1.0/dist/jdenticon.min.js
webp-hero.polyfill.js is sourced from https://unpkg.com/webp-hero@0.0.0-dev.27/dist-cjs/polyfills.js

Simply serving the file from python -m http.server allows to see the bug.

The bug is very random:

sometimes it works, sometimes it doesn't
inverting the order of JS scripts helps to have the image displayed (i.e. it is better when jidenticon.min.js is last) but there is still few random issues (which is not acceptable)
replacing the second (webp-hero.polyfill.js) by a file which does not exists at all causes a mostly systematic bug

🤯🤯🤯🤯

benoit74 commented 2 months ago

Maybe we should consider replacing jdenticon with something else: https://github.com/topics/identicons

benoit74 commented 2 months ago

I opened https://github.com/dmester/jdenticon/issues/54

kelson42 commented 2 months ago

Bug fixed upstream, we should upgrade to https://github.com/dmester/jdenticon/releases/tag/3.3.0

openzim / sotoki

User icons don't load #301