Map Pan/Drag in Tablet/Mobile mode not working about angular-cli-esri-map HOT 12 CLOSED

@dimpyvirk Can you duplicate the behavior using this sample app in tablet or mobile mode? https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=intro-mapview.

If the sample app works then the ArcGIS API for JavaScript is most likely not the issue. Usually these issues are related to CSS problems such as a DIV obscuring the map.

Be sure to update the CSS to the corresponding ArcGIS JS API version. Also note, 4.15 is the latest API version: https://www.npmjs.com/package/@arcgis/webpack-plugin

from angular-cli-esri-map.

@andygup the javascript code works fine https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=intro-mapview.
The issue comes when running with angular. It works fine on Mozilla (in tablet) but not on chrome.

from angular-cli-esri-map.

Interesting, it could be a zone.js issue. It works on my machine with "zone.js": "~0.10.2"

• Did you try with ArcGIS JS API 4.15?
• Which version of zone.js? Angular? Chrome?

from angular-cli-esri-map.

Closing, no activity.

from angular-cli-esri-map.

I noticed this problem emerged when upgrading from API 4.13 to 4.14. Seems to be related to this "Embedded map navigation enhancements" introduced in 4.14 as stated here since when pan fails the window is actually scrolled.
I tryied forcing my "zone.js" to "0.10.2" but the issue persists. I'm trying to tweak a workaround on this, otherwise am stuck with 4.13. Any help on this would be much appreciated.

from angular-cli-esri-map.

I noticed this problem emerged when upgrading from API 4.13 to 4.14. Seems to be related to this "Embedded map navigation enhancements" introduced in 4.14 as stated here since when pan fails the window is actually scrolled.
I tryied forcing my "zone.js" to "0.10.2" but the issue persists. I'm trying to tweak a workaround on this, otherwise am stuck with 4.13. Any help on this would be much appreciated.

@joaopaschoal can you try 4.16?

from angular-cli-esri-map.

@dimpyvirk , I've already tryied the latest 4.17 and the problem is still. Anyhow I've just tryied esri-loader 2.15.0 which ships with api 4.16 with no success. Have you ever managed to workaround this?

from angular-cli-esri-map.

@joaopaschoal what is your dojo version?

from angular-cli-esri-map.

@joaopaschoal we'll also need the following info, thanks:

• Device make/model
• OS version
• Browser and version

from angular-cli-esri-map.

@dimpyvirk I belive Esri API uses dojo v5.0.4 since API v4.12, as noted here.
@andygup my current environment is:

• Windows 10 x64
• Angular CLI: 7.3.10
• Node: 10.20.1
• Device: You can reproduce it directly from Chrome Dev Tools (toggle device mode) but it also happened in all Android devices we have tested so far :( take mine for instance: Xiaomi Redmi 4 Pro - Android 6.0.1 - MIUI Global 10.2.2.0.
• Browser: Google Chrome 86.0.4240.75 64 bit

Thank you guys so much for any help, if there is anything I can do to assist or additional info I'll be glad to provide it.

from angular-cli-esri-map.

@joaopaschoal thanks for the info. My first suggestion is to build this webpack branch of the repo and see if you have the same issues. Clone and npm install shouldn't take long.

It's possible Angular 7 is the culprit, it's a little over 2 years old now. This repo is using Angular 10. I tested it okay on an Android Pixel 2 - Android 11 - Chrome 86.

from angular-cli-esri-map.

I've managed to isolate the problem, it was just a silly mistake of mine: I've found the imported css was still pointing to v4.13 (doh!)
@dimpyvirk , in case you are still stuck with this issue, make sure to also upgrade the css url. Mine seems stable now.
Thanks one more time for valuable help :) and sorry for this silly mistake.

from angular-cli-esri-map.