not working properly with 'addEventListner'

since 0.2.0 driver.js was not working to be properly with addEventLister method, just blinking.

I tested with Firefox and Google Chorme on Mac, either same results…

var driver = new Driver();
document.getElementById('btn1')
        .addEventListener('click', function(event) {
  
    driver.highlight({
      element: '#form1',
      popover: {
        title: 'Title for the Popover',
        description: 'Description for it',
      }
    });
});

[kamranahmedse]

Hey @kei0719 you need to add event.stopPropagation() on the button click

var driver = new Driver();
document.getElementById('btn1')
        .addEventListener('click', function(event) {
    event.stopPropagation();

    driver.highlight({
      element: '#form1',
      popover: {
        title: 'Title for the Popover',
        description: 'Description for it',
      }
    });
});

Also, it is obvious but, if the button is anchor with href="#"', you may also have to do event.preventDefault() to make the page not scroll to top

[kamranahmedse]

Hey, yes it is mentioned in the readme also, you need to add that. It is how the driver is implemented. Since the element is located out of the element to be highlighted, clicking this displays the overlay and immediately catches this click event if you don’t use e.stopPropagation() and clears it. I need to handle it better but for now, you need to add this