Page MenuHomePhabricator

[BUG] Image overlaps its description and contents
Closed, ResolvedPublicBUG REPORT

Assigned To
Authored By
cooltey
Aug 6 2019, 11:57 PM
Referenced Files
F30020250: 註解 2019-08-13 123759.jpg
Aug 13 2019, 7:40 PM
F30020164: image.png
Aug 13 2019, 7:30 PM
F30009309: image.png
Aug 12 2019, 7:45 PM
F30009311: image.png
Aug 12 2019, 7:45 PM
F29984639: good_1.jpg
Aug 6 2019, 11:57 PM
F29984577: Screenshot_1565135509.png
Aug 6 2019, 11:57 PM
F29984601: broken_1.jpg
Aug 6 2019, 11:57 PM

Description

This is an issue about mobile-html.

Article: https://zh.wikipedia.org/wiki/日报

Screenshot_1565135509.png (2×1 px, 2 MB)

From the Chrome inspect tool:

broken_1.jpg (273×1 px, 55 KB)

and compare with the current production:

good_1.jpg (263×1 px, 57 KB)

Not sure why <figure class="mw-default-size"></figure> is being added into the thumbinner div, and it breaks the layout.

Event Timeline

Restricted Application changed the subtype of this task from "Task" to "Bug Report". · View Herald Transcript
Restricted Application added subscribers: Stang, Aklapper. · View Herald Transcript

mobile-html url: https://zh.m.wikipedia.org/api/rest_v1/page/mobile-html/%E6%97%A5%E6%8A%A5

@cooltey The HTML is different because the desktop uses the mediawiki parser and mobile-html uses parsoid, so there are differences on the structure and classes.

We'll have a look and see what the issue is!

You're right, I shouldn't put the desktop version of the wiki page.

Thanks, @Jhernandez

MSantos subscribed.

@cooltey I can't reproduce it, it looks correct to me. Are you testing with a different version of PCS other than production?

image.png (1×540 px, 668 KB)
image.png (1×540 px, 680 KB)

Hi @MSantos, thanks for taking care of this issue.

I think the version you've tested is not the version implementing with the mobile-html.

You can download the APK (version with mobile-html implemented) to test the issue:
https://drive.google.com/open?id=1x_vFdsUpOsH6nAe8_0motsZnlbNqAqml

or you can git pull from the mobile-html branch here and install it through the Android Studio (if you wish): https://github.com/wikimedia/apps-android-wikipedia/tree/mobile_html

Hi @MSantos, thanks for taking care of this issue.

I think the version you've tested is not the version implementing with the mobile-html.

You can download the APK (version with mobile-html implemented) to test the issue:
https://drive.google.com/open?id=1x_vFdsUpOsH6nAe8_0motsZnlbNqAqml

or you can git pull from the mobile-html branch here and install it through the Android Studio (if you wish): https://github.com/wikimedia/apps-android-wikipedia/tree/mobile_html

Thanks for the additional info, I tested with the provided APK and I have the following output:

image.png (1×540 px, 570 KB)

The image is a bit smaller, but it's not overlapping the content. The same happens with the chrome dev tools emulator (any device).

Thanks for the test, @MSantos

I would like to clarify, the one I've provided to you is a Dev version of the app, which you can see a green dot on the Wikipedia app icon.

註解 2019-08-13 123759.jpg (1×738 px, 112 KB)

Thanks for the test, @MSantos

I would like to clarify, the one I've provided to you is a Dev version of the app, which you can see a green dot on the Wikipedia app icon.

註解 2019-08-13 123759.jpg (1×738 px, 112 KB)

Yes, that's all correct, are you still experiencing this bug? Maybe it's different with a fresh install (like my case), I'm not sure how cache works in the webview.

I'm saying that because a while ago I submitted a fix for the adjustThumbWidths transformation, and maybe it fixes this issue as well.

Hi @MSantos

I am seeing it has been fixed on my Pixel 3 XL device, but I am also still seeing the issue on the emulators (Android 8 and Android 9).

Maybe it is because of the cache, or because of the emulator is still running an older version of the WebView. (https://play.google.com/store/apps/details?id=com.google.android.webview&hl=en_US).

I can revisit this issue again tomorrow to see if it still happens on the emulators, thank you!

Hi @MSantos

Not sure how this happened that I can not reproduce on my other devices, but still can reproduce it on the emulator, which would probably match my assumption above.

I think it would be good to have @ABorbaWMF to test this issue after the mobile-html is implemented with our app.

I'm moving it blocked, for now, to reflect reality.

Moving to tracking until it is QAd.

If it is not fixed and we need to look into it again please ping us and we will move it out.