How to simulate pinch zoom in Google Chrome?

Pinch gestures have different listeners in different browsers but there is an outstanding lightweight library named hammer.js which handles pinch,swipe and .... pretty easy and fine in all browsers, Unfortunately it does not support Desktop Chrome, so you can not debug your web-mobile codes easily,

Shift-Mouse click&dragging on Desktop Chrome with hammer library also does not work fine, it activates hammer's Pan event instead of pinch and works just once!, after that it keeps calling Pan event when you move your mouse through your viewport which is quite annoying and makes the debug impossible.

Solution : The only convenient way, that I know, to test your gestures on a mobile browser is to use either Safari to Safari connection on ios/osx devices or Chrome to Chrome connection for android devices.

I use to debug my JavaScript codes with Chrome DevTools but in web-mobile projects I use Safari Web Inspector, because I have an iphone and a Mac!. you also can not debug your ios device with Desktop Chrome.

Take a look at this article to find out how to setup your Safari Web Inspector.

Note: you need to connect your iphone to your mac using usb-cable and enable Web Inspector on your iphone (Settings-> Safari -> Advanced -> Web Inspector) If you are unable to see Develop menu on your Safari, Go to Preferences and in Advanced tab check "Show develop menu in menu bar". the rest are explained in the above mentioned article.

Update

It is not possible to debug an ios device on a Windows Desktop Safari.

On Chrome v.71.x.x, you can pinch zoom pressing 'Toggle Device toolbar' at dev tools and after hold SHIFT and click-drag your mouse.

Shift + mouse click & drag across the viewport

Works for me. Only problem is that the touchstart event will return 1 for originalEvent.touches

On Chrome 66, while in device simulation mode, double-click-drag up/down zooms out/in.