Swipeout fires wrong events on _first_ click

1

Dear all,
if have the following issue that swipeout fires events (swipeout/swipeout:close) on first click. I am using Windows10/Chrome for development:

HTML:

	<ul id="id_list">
	   <li class="swipeout">
	      <div class="swipeout-content">
	         <a href="#" data-callback="item" class="item-link item-content">
	            <div class="item-inner">
	               <div class="item-title">test</div>
	            </div>
	         </a>
	     </div>
	     <div class="swipeout-actions-left">
	        <a href="#" class="color-blue">
	           <i class="f7-icons">compose</i>
	        </a>
	        <a href="#" class="color-red">
	           <i class="f7-icons">close_round</i>
	        </a>
 	    </div>
	   </li>
	</ul>

JS Code

	$('#id_list').on('swipeout:close', 'li', function () {
		console.info("event swipeout:close");
	});
	$('#id_list').on('swipeout', 'li', function () {
		console.info("event swipeout");
	});
	$('#id_list').on('click', 'a', function () {
		console.info("event click");
	});

On the first click I receive the following events:
event swipeout
event swipeout close
event click

Afterwards I receive for all events
event click

So, it seems that at the beginning something is not initalized!
I used a delegated event handler since li object are added dynamically.

Best regards
Andreas

2

It doesn’t mean to work correct on desktop with mouse events. Do you have same issue if you are in device emulation mode?

3

Funny: in case of device emulation mode everything is perfect. I just receive the click event in case if I click on the elements.

When turn off the device emulation mode (without reloading the page), everthing still works (clicking -> click events)

But reloading the page (device emulation mode off) causes the same issue (1st click > swipeout, close and click events; all clicks afterwards -> click event).

So it seems that the first mouse event is handled different than a touch event. But a touch event results in initialize something…

Best regards
Andreas

4

Additional finding: it seems that after calling “app.swipeout.close” the same issue is caused:

device emulation mode = off

n-th mouse click > just a “click” (a) event is triggered
app.swipeout.close(app.swipeout.el)
(n+1)-th mouse click > “swipeout” (li), “swipeout:close” (li) and “click” (a) is triggered
(n+2)-th mouse clicke > “click” (a) event is triggered

device emulation mode = on
n-th touch > “click” (a) event
app.swipeout.close(app.swipeout.el)
(n+1)-th touch > “click” (a) event

My assumption would be that the behavious is the same and should be like with device emulation mode enabled, correct? Is it a bug?

I am using “chrome” (windows 10), 64.0.3282.186 (64-Bit)