Page MenuHomePhabricator

Mobile page goes blank or flickers briefly when loading VE
Closed, ResolvedPublic

Details

Related Gerrit Patches:
mediawiki/extensions/MobileFrontend : masterVisualEditorOverlay: Fix flickering on load

Event Timeline

Esanders created this task.Aug 15 2019, 1:26 PM
Restricted Application added a project: VisualEditor. · View Herald TranscriptAug 15 2019, 1:26 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript

(I couldn't reproduce this, maybe I was testing on a different version than you.)

I tested again on master and I can reproduce it when looking more closely. It doesn't quite go blank, but the read mode content flashes for a few frames, which is definitely poor. Rummana also noticed it when testing T230237.

After my patches for T228159, the page indeed goes blank instead of showing read mode content. Possibly you were testing that?

This is because in VisualEditorOverlay, we initialize the target after the parent show() method is called – so the overlay is shown with no content first, and then the surface etc. is created. But we can't easily do it in the opposite order, because as part of the initialization, the target measures the toolbar and adjusts the surface based on it, so it has to already be visible. I actually did that in my patches and you noticed the bug it caused:

After this commit, the heading disappears under the toolbar when starting a section edit in VE.

matmarex renamed this task from Mobile page goes blank briefly when loading VE the second time. to Mobile page goes blank or flickers briefly when loading VE.Sep 5 2019, 11:55 PM

Still frames from the video in T230552#5433068:

Frames 2 and 3 should not be here.

I explained what causes frame 2 earlier: T230552#5433079

In frame 3 the content is covered by the toolbar. Maybe that's caused by rEVED9bc03837332b: Debounce calls to 'adjustContentPadding'?

Change 534880 had a related patch set uploaded (by Bartosz Dziewoński; owner: Bartosz Dziewoński):
[mediawiki/extensions/MobileFrontend@master] VisualEditorOverlay: Fix flickering on load

https://gerrit.wikimedia.org/r/534880

For the record, I git-bisected and found that I apparently caused this issue in rEMFRc7482167106a: mobile.init/editor: Simplify some loading code. I don't really understand how that change causes it though, and it would be difficult to revert since changes for T228159 depended on that. I like the new solution more.

Change 534880 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] VisualEditorOverlay: Fix flickering on load

https://gerrit.wikimedia.org/r/534880

Esanders added a project: Editing QA.
Ryasmeen edited projects, added Verified; removed Editing QA.Sep 13 2019, 7:08 PM
Ryasmeen moved this task from QA to Product owner review on the VisualEditor (Current work) board.
ppelberg closed this task as Resolved.Oct 22 2019, 12:53 AM
ppelberg claimed this task.