Testing Event tracking in Angular applications

TLDR:

Im Searching for

  1. A way of e2e (protractor) testing Http requests made in a Angular application by external scripts without mocking to get the real values passed to the http request.
  2. A way to stop Page Execution in newly created tab/window when e2e testing events in Angular application

I couldn't find any way to do these things so far and i searched a lot.. i hope i don't duplicate any other question.. but i think i read nearly every issue that may be related to what i want to do.. Sorry for not opening two Issues, but so far this is all tracking related stuff and can also be issued in one question ;)

So heres the scenario:

I've got an Application where clicks and views are tracked. They are tracked in a "multi-angle" like principle where we as the creators, the providers (equals the client we do this for), and the publishers which implement the application into their's each track for themselves.

Besides of this "multi-angle-tracking" there are also different ways of tracking lets call this "multi-purpose-tracking"

  • Tracking Pixels
  • Tracking Callbacks
  • Clickthrough Urls

Tracking with Tracking Pixels

Not much to say about this. Each "angle" can provide tracking pixels which are bound to an img tag in the view when evens are triggered. No issues in testing, both unit and e2e


Tracking with Callback Functions

Each "angle" can provide scripts like google-analytics that are executed when events are triggered. Unit testing these is no problem. When it comes to e2e testing i want to be able to do the following:

  • Request a Page
    • View Tracker gets initialized
    • ga.send is executed
    • check the http requests made (THIS IS WHERE THE STRUGGLING STARTS)
    • test if the attributes in the request url are ok

After researching a lot i couldn't find a way to list http request that were made by the application after the view is loaded and tracked. There are many ways to mock requests but thats not what i need. I need the real request to be made and test it then.


Clickthrough Urls

Each "angle" can provide clickthrough Urls which are preceded in front of the final target. When a Click is triggered which redirects out of the application a new window/tab is opened with this Url. Like with the Callback, unit testing this is no problem at all.. But the e2e part gets in the way here. This is what i want to do.

  • Request a Page
    • Perform a Click
    • Switch to new Window handle
    • Make Browser STOP execution
    • Check Page Url
    • Make the Browser proceed
    • Test the Final Url

This is what i tried so far, but it doesnt work:

describe('CTR', function() {
    beforeEach(function() {
        el = element.all(by.repeater('result in ttip.event.result_set.result').row(0));
        el.all(by.css('.hs-tooltip-bet-param')).click();
        browser.ignoreSynchronization = true;
    });
    it('should contain ctr strings', function(done) {
        browser.getAllWindowHandles().then(function(handles) {
            var newWindowHandle = handles[1];
            browser.switchTo().window(newWindowHandle).then(function() {
                browser.driver.executeScript('window.stop()');
                browser.driver.actions().sendKeys(protractor.Key.ENTER).perform();
                // browser.sleep(1000);

                expect(browser.driver.getCurrentUrl()).toContain(config.prefix);
                expect(browser.driver.getCurrentUrl()).toContain('https://ad.doubleclick.net/ddm/');
                expect(browser.driver.getCurrentUrl()).toContain('dc_lat');
                expect(browser.driver.getCurrentUrl()).toContain('dc_rdid');
                expect(browser.driver.getCurrentUrl()).toContain('dc_rdtag_for_child_directed_treatmentid');
            }).then(function() {
                browser.close();
            }).then(function() {
                browser.switchTo().window(handles[0]);
                done();
            });
        });
    });
});

When i run this test on my machine i can see the url changing from Clickthrough to target url. But the Test seems to be executed when the final target is loaded which is way to late. The Tests Return the Final Target and the attributes mentioned in the test are not longer available here.

So those two things are still not testable for me but i need to test them in any way because its crucial that these things work properly. You may say it shouldn't be my concern what happens outside of the application but publishers and providers are mostly untalented in my case.. I need to assure them that everything works like they image :D. You may also say that integrating that much tracking logic makes no sense but it was not my decision to do this..

Sorry for the long post and thanks for the help.


I managed to get the clickthrough testing to work on a specific clickthrough Url. It seems like this Url takes lot longer to resolve the redirect so Protractor can grab the url before it changes... But there must be a way to control this.. otherwise its just based on timing and luck and is really inconsistent for this purpose :/

Answers:

Answer

For those who are interested: I reconsidered my approach and ended up including a debug mode which disables all outgoing urls and prints them into the console. These can then be tested by unit and e2e tests.

After facing many issues on the "redirect" pages where the clickthrough urls pointed at (publishers disabled the clickthrough urls, given urls were broken, campaigns were not managed properly, etc..), this seemed to be the most sane way to test it.

Still, if the url the publisher provides is broken my applications don't redirect properly. But i decided that although i would like to ensure that the redirect works properly, that shouldn't be something i should rack my brain about..

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.