I think this is because once we scroll the page, we wait for the restaurants to be updated on the map. This is modeled by waiting for waiting for the "loading" event followed by "loaded" event. If "loading" has finished by the time we actually we wait for an element then we will timeout waiting for that event. Dropping wait for "loading" doesn't work in all cases. Since the initial state is "loaded", so if we skip waiting for "loading" there is a chance that we don't wait for refreshing the restaurants. I am not sure what is a good way to handle it. 

In the maps page set when we scroll the page it updates the list of restaurants on the map. It updates the status of a particular button to say "loading" when it is updating and finally sets it to "loaded" when it is done. So, I was waiting for the "loading" event and the "loaded" event. Just waiting only for the "loaded" does not work, because that is the initial state of the button. This implementation makes the page flaky. So, I tried to look for something else but couldn't find a good way of doing this. 

@ned, @perezju do you have any suggestions how we usually do it. May be something like checking to see if there was an update on a particular button. For example having some callback when an element changes? 

Relevant bit of code:
https://cs.chromium.org/chromium/src/tools/perf/page_sets/system_health/browsing_stories.py?rcl=251a3311605b4f065b84d26a150ff1a3feb4abd0&l=684

Yes, the wait for LOADING then wait for LOADED look pretty brittle.

I think we should change each of those pairs for a single wait for _some_ element which was not present before loading, but is present after loaded. E.g. scroll and then wait for a specific new restaurant to appear in the new list?

Also note, if needed, you can also WaitForJavaScriptCondition to wait for some arbitrary and maybe more complex javascript condition that may depend on multiple elements.

+1 to wait for some element(s) before scrolling.

Thanks for the suggestions. I will try to wait for an update on the restaurant name. The restaurant elements are already there, but the names get updated after the scroll. So, I plan to save the name of the first restaurant before the scroll and then wait for till the name gets updated after scroll.

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/577103092661a3b6c2545e47a2681bef214fc64e

commit 577103092661a3b6c2545e47a2681bef214fc64e
Author: Mythri Alle <mythria@chromium.org>
Date: Fri Sep 15 15:45:02 2017

Update maps page in system health's browse page set.

In the maps page we used to wait for "loading" followed by "loaded"
events on the same button to check if the restaurants are loaded after
zooming / scrolling. This makes it brittle depending on when the
events happen. This cl changes it so that we actually wait for the
restaurant's id have been updated. This is not timing dependent and
hence more stable than earlier.

Drive by fix: Also removed an unused constant from earth's page.

Bug:  chromium:763853 
Change-Id: Ied029eed2869f293106cb3aaa1a39bc694d155d6
Reviewed-on: https://chromium-review.googlesource.com/663159
Commit-Queue: Mythri Alle <mythria@chromium.org>
Reviewed-by: Ned Nguyen <nednguyen@google.com>
Reviewed-by: Juan Antonio Navarro Pérez <perezju@chromium.org>
Cr-Commit-Position: refs/heads/master@{#502266}
[modify] https://crrev.com/577103092661a3b6c2545e47a2681bef214fc64e/tools/perf/page_sets/system_health/browsing_stories.py