eclipse-theia/theia

Context menus are not dismissible on iPad (iOS 12)

Open

#6,322 opened on Oct 3, 2019

View on GitHub
 (3 comments) (1 reaction) (0 assignees)TypeScript (2,478 forks)batch import
help wantedipad

Repository metrics

Stars
 (18,676 stars)
PR merge metrics
 (Avg merge 15d 4h) (75 merged PRs in 30d)

Description

Description

#3557 reports that:

Context menus are not dismissible without reloading the page.

Indeed, on iPad, it's quite easy to open context menus by mistake (e.g. with a long-press inside the Editor), and contrary to desktop, the context menus stay open even when you tap outside of them.

Furthermore, you can even open more than one context menu, so at some point you may fill your entire screen with un-dismissible context menus.

A workaround is to trigger any item to close the context menu (Copy is a pretty safe item to trigger), but this isn't a great UX.

Reproduction Steps

  1. Open Theia on iPad (I tried iOS 12), in any browser (they're all Safari anyway)
  2. Open any file in a code editor
  3. Long-press on the code (e.g. as if you were trying to select it). This opens a context menu.
  4. Try dismissing the context menu, by "clicking" (or "tapping") outside of it. This doesn't work.
  5. Long-press on another part of the code. You'll now see two context menus open.

OS and Theia version: master

Diagnostics:

Contributor guide

Research direction
Investigate how context menus are displayed and dismissed in Theia on iPad. Identify the missing event handler for tap outside. Consider using pointer events or touch events to close the menu on blur or dismiss on touch outside.
Tech stack
typescript
Domain
frontend
Issue type
Bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
Half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
TypeScriptWeb development
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40