iOS 11 | Mobile | JavaScript | Touch events don't always fire

Question

Good evening everyone,

I have found an issue on iOS 11. I've checked the following devices: iPhone 8 (11) and 6 (11.2). It was fine on an iPhone 7 (10).

Replicate:

• Go to a website where you are able to scroll vertically eg Google search.
• Add the script below (or something similar) via console.

• Scroll down the page and check the console for logs. It becomes unresponsive and only seems to work near the top of the page.

   function touchHandler(type) { console.log(type); } ['start', 'move', 'end'].forEach((type) => { document.body.addEventListener(`touch${type}`, ({ type }) => { touchHandler(type); }); }); 

Does anybody know why this is happening?

Let me know if a live example is required. I could replicate it easily with the above.

I hope this makes sense (I'm half asleep).

Edit:

On further investigation I have found out this extra information:

• Touch events won't fire constantly (unlike older iOS versions).
• The event has to end before they re-fire.

Try dragging twice. It won't output a log the second time. If you wait a couple seconds the touch event will work again.

Is there a way to get the touch events to work constantly on iOS 11?

Cheers!

Answer 1

On further investigation I have found out this extra information:

Touch events won't fire constantly (unlike older iOS versions). The event has to end before they re-fire. Try dragging twice. It won't output a log the second time. If you wait a couple seconds the touch event will work again.