3

In an angular application using angular-ui-bootstrap, we have some icons which provide some information to the user:

<i class="icon-info ng-scope" popover="Popovertext goes here" popover-trigger="mouseenter" popover-append-to-body="false" data-original-title="" title=""></i>

I'm using phantomjs to create screenshots of the application, and I need the popover to be visable on the screenshot.

While in the angular-ui documentation there is nothing mentioned about showing a popover programmatically, I found a section in the bootstrap documentation which mentioned the popover method, so I tried:

$('.icon-info').popover('show')

which is not working (but jQuery is available in the application).

How do I open the popover programmatically (from the context of PhantomJS / browser console)?

soerface
  • 6,417
  • 6
  • 29
  • 50
  • possible duplicate of [How to Open and Close Angular-UI popovers programmatically](http://stackoverflow.com/questions/23073156/how-to-open-and-close-angular-ui-popovers-programmatically) – rageandqq Jan 21 '15 at 18:19

1 Answers1

4

A simple workaround is to manually trigger the event that is used to show it.

Since you are using jQuery this will be enough in your case:

$('.icon-info').trigger('mouseenter');

Demo: http://plnkr.co/edit/J3hwUXA65orsenL2plbY?p=preview

tasseKATT
  • 38,470
  • 8
  • 84
  • 65