T263584 T263544 Fix bug from gallery row

[hueitan]

Phabricator Ticket 1 : https://phabricator.wikimedia.org/T263584
Phabricator Ticket 2 : https://phabricator.wikimedia.org/T263544

Problem

The gallery sometimes show duplicate or show empty row

Solution

Reorder the method calling and remove the empty row when nothing from the media list API

Note

Task different but Code are relevant, so one fix for both.

[medied]

LGTM

[jpita]

repeated gallery in popup

[hueitan]

To reproduce this, follow this case

1. on Desktop browser,
2. Go to https://wikimedia.github.io/wikipedia-preview/articles/demo/spanish.html
3. Set your internet speed to be very slow
4. Hover Smiljan
5. Leave it immediately (when it is in loading animation)
6. Hover Smiljan back immediately and wait
7. You should see the first gallery comes up, after a while the second gallery comes

This is due to the race condition that we didn't clear the previous api request; or the loading state shouldn't have the onshow event to load gallery.

[hueitan]

Another case

1. on Desktop browser,
2. Go to https://wikimedia.github.io/wikipedia-preview/articles/demo/swahili.html
3. (Optional Step) Set your internet speed to be very slow
4. Hover Roma ya Kale
5. Leave it immediately (when it is in loading animation)
6. Hover Bahari immediately and wait
7. You will see the gallery from btoh Bahari and Roma ya Kale

Dismiss approval

[hueitan]

The latest commit fix the specific edge case, a better solution can be a better management for the popup status (loading, article, error, disambiguation), but it's out of scope right now.

[stephanebisson]

@jpita ready for more testing