Javascript Touch Force on iPhone - javascript

I have implemented reading the touch force for haptic touchscreen as per https://developer.mozilla.org/en-US/docs/Web/API/Touch/force
If I test in chrome debug tools on a PC (set to mobile) then it will register the force as 1 (as far as I can tell there's no way to simulate a different pressure). So I know the code it correct.
However on my iPhone XR which does have a haptic screen it always registers as 0.
The compatibility table says Safari on iOS support it, and I haven't been able to find anything that says you need to request the user permission for the feature (like you would with device orientation).
Any ideas why it isn't working?

on caniuse you have more details on support for iOs Safari, please check your safari iOs version is >= 14.5.

Related

Scrolling differences on Safari and Chrome (iOS) can you test for them?

It used to be (before iOS 8) that Safari couldn't natively animate on scroll, you had to stop scrolling to see the animations. Safari solved that issue, but when accessing the same website on Chrome (running in iOS) the issue persists. I read that chrome hasn't yet updated this on iOS. I know that it works great on Android... so... Is there a way to test for this "feature" either with modernizr or other js? I would like to disable animations on scroll if they are not supported. I've been able to accomplish this by checking which browser the user is using, but it would be easier if I could just check whether the functionality is available.
Before iOS 8, iOS would pause painting while the user was scrolling. This behavior was discontinued for applications using WKWebView but remains for browsers using UIWebView — this is why you only see the old behavior for certain third-party applications.
One approach is to detect whether your page is loaded inside WKWebView or not. An answer to another question suggests testing for indexedDB support. indexedDB is the only HTML5 feature difference between the WKWebView and UIWebView.
The snippet from the other answer suggests how to do this:
if (navigator.platform.substr(0,2) === 'iP'){
//iOS (iPhone, iPod or iPad)
if (window.indexedDB) {
//WKWebView
}
}

Get continuous scroll events in iOS Chrome

In Safari Mobile on iOS <8, all Javascript was paused while the user was scrolling. Since the release of iOS 8, this is no longer the case, as you can read here:
http://developer.telerik.com/featured/scroll-event-change-ios-8-big-deal/
This is great news. Executing Javascript while scrolling (if done right), opens the possibility for many usability enhancements (like sticky menus) and effects (like parallax).
Is there a way to get the same thing in Chrome Mobile on iOS?
The same website states that the first mobile browser that supported live scroll events was Chrome on Android 4.0. If that's the case, why is it still disabled in the newest Chrome on iOS?
This might be the answer:
https://code.google.com/p/chromium/issues/detail?id=423444
If the new Javascript handling is tied to the new Nitro Javascript Engine used in Safari Mobile (and in WKWebView), then we will have continuous scroll events in Chrome Mobile as soon as they switch to use WKWebView instead of UIWebView.
EDIT: As of version 48.0.2564.87, Chrome uses WKWebView on iOS, and continuous scroll events are working!

How to make sure touch events are enabled in Firefox desktop browser?

I used a simple test on a windows 7 desktop with touch capabilities.
For simplicity it was something like this:
temp_div.addEventListener('touchstart', function(e){ /*confirm */ }, false)
temp_div.addEventListener('pointerdown', function(e){ /*confirm */ }, false)
temp_div.addEventListener('mousedown', function(e){ /*confirm */ }, false)
In chrome, the 'touchstart' was confirmed.
In IE, the 'pointerdown' was confirmed.
In Firefox, the 'mousedown' was confirmed.
After troubleshooting, I ultimately had to go to 'about:config' in Firefox and
change the 'dom.w3c_touch_events.enabled' value from 0 to 1. This caused the 'touchstart' to be confirmed in Firefox.
My questions are these:
Shouldn't this have already been enabled on a touch-capable machine?
IE and Chrome were configured properly and Firefox was not. (This was a brand new download of Firefox 31).
Is there anyway to enable touch events remotely in a case like this so that Firefox behaves similarly to the other browsers?
Thanks
In order to enable touch events in the desktop version of Firefox, type "about:config" into the address bar of the browser, click the "I'll be careful, I promise!" button and scroll down until you find "dom.w3c_touch_events.enabled" ....when you click this item, a dialog box will appear that allows you to change the value of the setting.
disable=(0) enable=(1) auto-detect=(2)
This should be set to "auto-detect" by default, but currently, the desktop version of Firefox is set to "disable" due to some bugginess.
Info about this setting can be found here:
https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Touch_events
excerpt:
The dom.w3c_touch_events.enabled tri-state preference can be used to disable (0), enable(1), and auto-detect(2) support for standard touch events; by default, they're on auto-detect(2). After changing the preference, you must restart the browser for the changes to take effect.
Note: As of Gecko 24.0, the touch events support introduced with Gecko 18.0 has been disabled on the desktop version of Firefox, as some popular sites including Google and Twitter are not working properly. Once the bug is fixed, the API will be enabled again.
The mobile versions including Firefox for Android and Firefox OS are not affected by this change. Also, the API has been enabled on the Metro-style version of Firefox for Windows 8.
Touch events are not working in Firefox currently (version 48.0.1) but it is possible to enable pointer events by browsing to about:config and setting dom.w3c_pointer_events.enabled to true. The event object passed to your handler will contain a pointerType property with the value of "touch" if it was a touch event.
See: https://mobiforge.com/design-development/html5-pointer-events-api-combining-touch-mouse-and-pen
There is a dom.w3c_touch_events.legacy_apis.enabled events configuration option in Firefox 72. It is off by default. Turning it on helps some websites with touch-based drag and drop. Atlassian Jira in particular.

How to enable javascript in smart search field of safari ios 7 on iphone

We can enable javascript execution in the smart search field (navigation bar) of Safari on Mac OS X for desktop, but how can we enable it in the Safari on iPhone? There's no such option in the Safari's configuration of iPhone.
Or, if that is totally forbidden on iPhone and can't no be configured, then how can we use a bookmarklet on Safari of iOS 7 on iPhone?
It doesn't appear that iOS will let you put javascript in the smart search bar, but you can create bookmark lets, sort of. Unfortunately, you need to add them on OS X and have them sync.
Here is a guide to create one for the popular web-comic XKCD for example. XKCD Descriptions inline
Also, this would have probably been a better question for the http://superuser.com stack exchange site.

Touch events available in Safari?

A friend and I were discussing Mozilla's latest touch support and got on the question of what Safari provides for this. Searches seem to turn up nothing.
Do you know of anything that provides touch events to Safari on desktop, either via multitouch trackpad or direct screen interaction (I guess a Windows multitouch environment would be the only relevant case here.)?
No, there is currently no support for touch events in the desktop version of Safari.
According to this documentation it is only supported on iOS 2.0 or later.

Categories

Resources