Closed Bug 1367821 Opened 3 years ago Closed 3 years ago

Elements cannot disable action sheet via -webkit-touch-callout: none CSS property or touchEvent.preventDefault()

Categories

(Firefox for iOS :: Menu and Toolbar, defect, P1)

Other
iOS
defect

Tracking

()

RESOLVED FIXED
Iteration:
1.24
Tracking Status
fxios 8.0+ ---
fxios-v8.0 --- verified

People

(Reporter: info, Assigned: justindarc)

References

Details

(Keywords: compat, Whiteboard: [MobileCore])

Attachments

(1 file)

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/603.2.4 (KHTML, like Gecko) Version/10.1.1 Safari/603.2.4

Steps to reproduce:

The long tap touching gesture on an image opens a context menu for downloading it.

I would suggest that the waiting time should be longer, for I did not find a way how a web designer can deactivate the feature for a specific image.



Actual results:

My problem is that we have a website where you touch-drag a pin for setting a location. 
There, the download contextual menu, which covers half of the screen on an iPhone comes in the way and interrupts the dragging of the pin.

I tried the code from this example to deactivate the contextual menu for the map page:
https://developer.mozilla.org/de/docs/Web/API/GlobalEventHandlers/oncontextmenu


Expected results:

Either:
A longer waiting time before the contextual menu appears, so the pin on the map can be dragged without interruptions

Or:
a way how a web designer can deactivate the contextual menu for specific elements like the  pin icon.
What does Safari do?
Safari IOS is fine....

Problem is in Chrome/Firefox Mobile and the like...

Just tab-hold the pin without moving/dragging and you see what happens.
Do you need screenshots?
Priority: -- → P1
Summary: long tap touching conflicts with mobing pins on a map → long tap touching conflicts with moving pins on a map
Whiteboard: [MobileCore]
Assignee: nobody → jdarcangelo
Can you please provide a link to your website or an example where this behavior can be observed?
Flags: needinfo?(info)
1st example (scroll down to the map):
https://safeplace.berlin/en/
Library: leafletjs/OpenStreetMap

2nd example (scroll down to the map with the movable marker):
http://angular-ui.github.io/ui-leaflet/#!/examples/dragging-markers
Confirmed. This is definitely happening and is 100% reproducible. This behavior doesn't happen in Mobile Safari. Also, setting `body { -webkit-touch-callout: none; }` in CSS does not have any effect.
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
Summary: long tap touching conflicts with moving pins on a map → -webkit-touch-callout: none CSS property does not disable long-press action sheet
Keywords: compat
Summary: -webkit-touch-callout: none CSS property does not disable long-press action sheet → Elements cannot disable action sheet via -webkit-touch-callout: none CSS property or touchEvent.preventDefault()
Iteration: --- → 1.23
Attached file GitHub Pull Request
This is a simple fix, but the diff is a little hard to read because the `touchstart` event handler needed wrapped in a `setTimeout()` in order to bump execution off to the next tick so we can check if the default behavior was prevented.
Attachment #8875467 - Flags: review?(sarentz)
Thanks for providing a test case, carldeberlin. Clearing the ni? flag :-)
Flags: needinfo?(info)
Thank you for looking into it. :)
Whiteboard: [MobileCore] → [MobileCore][b3]
Iteration: 1.23 → 1.24
Comment on attachment 8875467 [details] [review]
GitHub Pull Request

LGTM Can we give QA a list of sites to test?
Attachment #8875467 - Flags: review?(sarentz) → review+
Whiteboard: [MobileCore][b3] → [MobileCore][b3][needsuplift]
(In reply to Stefan Arentz [:st3fan] from comment #9)
> Comment on attachment 8875467 [details] [review]
> GitHub Pull Request
> 
> LGTM Can we give QA a list of sites to test?

QA can test the sites listed in Comment 4. STR is in Comment 0.
Flags: needinfo?(simion.basca)
Landed on master:

https://github.com/mozilla-mobile/firefox-ios/commit/7c53e235c56c2537a09726de607de8de887161ae

NOTE: Still needs uplifted to v8.x.
Status: ASSIGNED → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Verifying as fixed on master ae4175905. The context menu is no longer displayed while dragging the pin or long tapping on the map view.
Flags: needinfo?(simion.basca)
Uplifted to v8.x
Whiteboard: [MobileCore][b3][needsuplift] → [MobileCore]
See Also: → 1349183
You need to log in before you can comment on or make changes to this bug.