I am working on a Django project that utilizes Clusterize.js to dynamically load a list of "datapoints" in a div. On the Javascript/HTML side, the first 200 datapoints of a "blackbox" are initially loaded. If there are more, then a worker is started to load in 1000 datapoints at a time, until all datapoints are fetched and rendered in the scroll list. When a user clicks on a datapoint, the details of that datapoint are brought up.
Originally, there was a bug that would bring up the wrong details for any datapoint past 199. Once any new datapoints beyond 199 for any blackbox are loaded, the wrong datapoint ID would be passed to the Javascript function showDatapointDetail, and datapoint 200 would get the detail for datapoint 0, datapoint 201 would get the detail for datapoint 1, etc. until datapoint 1199 would get the detail for datapoint 999. Then datapoint 1200 would get 0 and the pattern would repeat. I have since fixed this bug in the Javascript code but now I'm working on writing a good test in tests.py to make sure that clicking on a datapoint past 200 gets the correct details. The project has been using Python selenium for numerous browser tests and now I'm trying to figure out how to use it to scroll to the bottom of a div that is dynamically generated. If I do something like:
dp_detail_199 = WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.ID, "datapoint199")))
then I can get that datapoint detail properly, since only 200 are initially loaded. However, if for example a blackbox has 787 datapoints, then the following won't work:
dp_detail_750 = WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.ID, "datapoint750")))
because one would need to scroll down in order for the next datapoints to start being loaded in. So how can I use Selenium to scroll to the bottom of the list generated by Clusterize? The div is named dp_pane and I'm able to locate it with Selenium, but I'm not sure how to properly scroll down, particularly to the bottom. One thing I've tried is to first scroll down dp_pane by doing:
driver.execute_script("arguments[0].scrollTop = 12000", dp_pane)
to get down to datapoint 200 and then scroll down a little to find datapoint 205:
while True:
dp_pane.send_keys(Keys.PAGE_DOWN)
try:
dp_detail_205 = driver.find_element_by_id("datapoint205")
except NoSuchElementException:
######## DEBUG OUTPUT #########
print "Couldn't find dp_detail_205"
continue
else:
######## DEBUG OUTPUT #########
print "Found it!"
break
but this seems to get stuck and never find datapoint 205; instead, I just keep getting the debug output of "Couldn't find dp_detail_205". What should I do so that I can get Selenium to scroll to the bottom of dp_pane so that I can find, for example, datapoint750 and verify that it has the correct details? Ultimately, what I need is for Selenium to get Clusterize to load more rows, because that is the one thing that I need for this test to work that hasn't been working at all. Even Clusterize's own method for programmatic scrolling doesn't work; the line I would be using would be something like:
document.getElementById('dp_pane').scrollTop = 12000;
but unfortunately no matter how large I make the scrollTop value, it only ever goes as low as datapoint 199 and won't automatically load more rows.
EDIT:
I recently upgraded the project to Django 1.9, which includes integration with QUnit. At first glance, I assumed that it would be an ideal replacement for Selenium for this test. However, now I am unsure after reading some of the documentation; for one, the test involves uploading a .dat file first, which I am not sure QUnit can be used for. Also, can it be easily automated in Travis CI? Trying to make a working test for this has proven to be arduous and I am unsure what more I can try at this point.
