Q:

Protractor: Dashboard filters not being selected

I'm using Protractor to do some automated UI testing for my Qlik dashboards.  Currently using this sample dashboard to run some tests.  I plan to just try different combinations of filters to see if any dashboard graphs fail to render. 
For the case of the sample dashboard, I intend to just click on each of the 4 filters at the top of the page and select the first option. 
For some reason I just can't get protractor to select the filters for me.  I always get a timeout error. 
I've tried using browser.driver instead of the default browser.  I realized that I have to use browser.driver.get('url') or the page won't load.  I have no idea why this is so. 
Shown below is my current code:
describe('Qlik Dashboard Test', function() {
    it('Primary Filter Testing',function(){
        var url = 'https://sense-demo.qlik.com/sso/sense/app/dcb7c95a-9ecd-43e2-8786-cae00108a324/sheet/54b60312-68c5-4d92-a225-79326b68ad5a/state/analysis';
        var EC = protractor. ExpectedConditions;
        // Reference to all filters
        var filter = element.all(by.className('title ng-binding'));
        // Reference to first option in each filter
        var first_opt = element(by.repeater('textItem in item.textItems'));
        // Reference to backbutton
        var bb = element.all(by.className('lui-clear-all lui-icon lui-icon--remove'));
        // Go to website
        browser.driver.get(url);
        // Wait for all filters to be visible
        browser.wait(EC.visibilityOf(filter , 10000));

        // Click on each filter, and select the first avaiable option
        filter.each(function(main_filter){
            browser.actions().mouseMove(main_filter).click().perform().then(function(){
                browser.driver.wait(EC.visibilityOf(first_opt,15000));
            }).then(function(){
                browser.actions().mouseMove(first_opt).click().perform();
            });

        });

        // Click on back button
        bb.each(function(backbutton){
            browser.actions().mouseMove(backbutton).click().perform();
        }).then(function(){
            browser.sleep(2000);
        });

    })
})

This is the error message that I keep receiving:
    Failed: script timeout: result was not received in 11 seconds
      (Session info: chrome=71.0.3578.98)
      (Driver info: chromedriver=2.45.615355 (d5698f682d8b2742017df6c81e0bd8e6a3063189),platform=Mac OS X 10.14.0 x86_64)

Any help would be greatly appreciated! 

A:

Managed to get it working with this:
describe('Qlik Dashboard Test', function () {
    it('Primary Filter Testing', async function () {
        await browser.waitForAngularEnabled(false);

        var url = 'https://sense-demo.qlik.com/sso/sense/app/dcb7c95a-9ecd-43e2-8786-cae00108a324/sheet/54b60312-68c5-4d92-a225-79326b68ad5a/state/analysis';
        var EC = protractor. ExpectedConditions;
        var rain = element(by.className('rain rain-loader qv-block-ui ng-scope qv-fade-out'));
        // Reference to all filters
        var filters = element.all(by.css('.title-wrapper'));
        // Reference to backbutton
        var bb = element.all(by.className('lui-clear-all lui-icon lui-icon--remove'));

        // Go to website
        await browser.get(url);
        await browser.wait(EC.presenceOf(filters,15000));
        await browser.wait(EC.invisibilityOf(rain,15000));
        // Wait for all filters to be visible
        let numFilter = await filters.count();
        console.log(numFilter);

        for (let i = 0; i < numFilter; i++) {
            await filters.get(i).click();
            // Reference to first option in each filter
             var first_opt = element(by.repeater('textItem in item.textItems'));
             var all_opt = element.all(by.repeater('textItem in item.textItems'));
             await browser.wait(EC.presenceOf(first_opt, 15000));
             const text = all_opt.get(1).getText();
             console.log(text);
             await first_opt.click();
             await browser.sleep(1000);
        }
    },120000)
})

Credit to DublinDev for suggesting sync/async, really made writing tests alot easier. 
Also edited the default expected duration of the test, seems like it was too short. 
It seems there is a ui blocking component (see rain variable ), that blocks the UI until everything is loaded, so you just gotta wait for the filters to be visible in the DOM, and for the UI blocker to go away, and it'll work.