How to test ngx-toastr with protractor in Angular 2

I am using ngx-toastr with my angular 2 app and I started running some e2e tests against it. I am having difficulty testing toast when it appears and disappears after 5 seconds.

I have tried adding a few different selection methods as suggested on Stackoverflow with no luck.

What I have tried:

getToastr() {
    var EC = protractor.ExpectedConditions;
    var targetEle = element(by.css(".toast-message"));

    browser.wait(EC.visibilityOf(targetEle), 10000, 'NOT VISIBLE'); //wait until 
    //ele visible
    browser.wait(EC.presenceOf(targetEle), 10000, 'NOT PRESENT');
}

      

        
        
        
      

    

which makes it hit the invisible code even though I can see the toast is present in the window - it cannot find it in the dom. I took a screenshot to show you the position as I think it might have something to do with this.

Here is a screenshot of the dom Screenshot of the DOM , I am trying to make a toast in the start-signup section. Note that the default named outlet router does not carry over the initial registration even though it advertised in the router to use that outlet - I don't know if this is by design or not.

{
    path: 'signup',
    children: [
        { path: '', component: StartSignupComponent, outlet: 'default' }
    ]
},

      

        
        
        
      

    

It seems the toastr div is not in the start-signup tag. I was unable to move it inside, even using ngx-toastr's own method to move the toastr message inside a div "of your choice". Currently I have posted it in app.component and placed the toastr "holder" next to the router outlet. I've also tried placing the div holder inside the router with no luck.

The error I get from the protractor is:

    1) Create account page should have a toastr message
  - Failed: NOT VISIBLE
Wait timed out after 10334ms

Executed 28 of 28 specs (1 FAILED) in 18 secs.
[14:01:29] I/launcher - 0 instance(s) of WebDriver still running
[14:01:29] I/launcher - chrome #01 failed 1 test(s)
[14:01:29] I/launcher - overall: 1 failed spec(s)
[14:01:29] E/launcher - Process exited with error code 1
npm ERR! Test failed.  See above for more details.

      

        
        
        
      

    

I can provide additional information if required. This was the initial information I could think of.

Regards, Chris