Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dropdown menus rendering "under" the editor region in latest Safari on macOS #10821

Closed
4 tasks done
gtritchie opened this issue Mar 22, 2022 · 27 comments
Closed
4 tasks done
Assignees
Labels
backport Issues whose associated fixes will need to be backported for a previous release. backport-ghost-orchid backport-prairie-trillium macos

Comments

@gtritchie
Copy link
Member

@gtritchie gtritchie commented Mar 22, 2022

System details

RStudio Edition : Server
RStudio Version : Probably all, I only tested `main`
OS Version      : macOS 12.3 with Safari 15.4
R Version       : Any

Steps to reproduce the problem

  • update to macOS 12.3 with Safari 15.4
  • load RStudio Server in Safari
  • open a document (or create a new one, etc.)
  • try to use the main menu, e.g. click Help, or one of the dropdowns in the editor toolbar

Describe the problem in detail

  • the dropdown displays under the editor pane

Screen Shot 2022-03-22 at 09 36 57

Describe the behavior you expected

  • dropdown menus display as they always have
  • note they work fine on other browsers such as Chrome on the same macOS
  • I have read the guide for submitting good bug reports.
  • I have installed the latest version of RStudio, and confirmed that the issue still persists.
  • If I am reporting an RStudio crash, I have included a diagnostics report.
  • I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.
@mikebessuille mikebessuille added backport Issues whose associated fixes will need to be backported for a previous release. current labels Mar 22, 2022
@heath-r
Copy link

@heath-r heath-r commented Mar 23, 2022

Here are two tickets that have reported the issue at this point:
https://rstudioide.zendesk.com/agent/tickets/72850
https://rstudioide.zendesk.com/agent/#/tickets/73054

@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Mar 23, 2022

This issue appears to be more than just a simple z-index issue; the menu appears to come into view if you try to mouse over the menu after it is displayed. For example:

Screen.Recording.2022-03-23.at.12.39.38.PM.mov

We'll probably need some kind of gnarly CSS hack to tweak the way Safari tries to render these things, if we need a workaround.

@shrektan
Copy link

@shrektan shrektan commented Mar 25, 2022

Hi,

I noticed two issues on the latest macOS, one is reported in this issue, the other is that the left part of the pop-up help panel can't be displayed properly on Chrome and Edge (see the screenshot below). The only browser that RSW can work is Firefox, at the present.

I'm wondering if PR #10832 will resolve the pop-up help panel issue for Chrome and Edge on macOS as well?

image

@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Mar 25, 2022

Thanks @shrektan -- I think this is a different issue, so I've opened that separately. #10841

@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Mar 25, 2022

A separate rendering issue for tooltip popups:

Screen Shot 2022-03-25 at 11 43 43 AM

@ashwinikalantri
Copy link

@ashwinikalantri ashwinikalantri commented Mar 26, 2022

Hello @kevinushey, can you update when this fix will be available? The UI glitches are making using RStudio maddening.

@ashwinikalantri
Copy link

@ashwinikalantri ashwinikalantri commented Mar 26, 2022

As I have already submitted in my ticket, even the prompts for objects don't get rendered. They are there and selectable, but not visible.

Screen.Recording.2022-03-17.at.2.09.08.PM.mov

@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Mar 28, 2022

can you update when this fix will be available?

We're working on it, but to be clear, this is a bug in Safari, so if you have some ire to direct I'd recommend directing it towards Apple (via a bug report or similar).

@shrektan
Copy link

@shrektan shrektan commented Mar 28, 2022

Yes, I doubt it's a bug of Safari, as RStudio Workbench is not the only app that's not working after upgrading to the latest Safari. But I don't know how to report it to Apple and how to make them recognize this is a bug of their own.

@kevinushey kevinushey added test and removed current labels Mar 28, 2022
@kevinushey kevinushey modified the milestones: Spotted Wakerobin (2022.06.0), Prairie Trillium (2022.02.2) Mar 28, 2022
@ashwinikalantri
Copy link

@ashwinikalantri ashwinikalantri commented Mar 29, 2022

if you have some ire to direct

No ire @kevinushey, just impatience I guess 😃

@ronblum
Copy link
Contributor

@ronblum ronblum commented Apr 11, 2022

@mikebessuille & @kevinushey Do we want to backport this to Ghost Orchid, as well?

Problem reproduced on Ubuntu 20.04 in RStudio Server

  • Ghost Orchid 2021.09.2-382
  • Prairie Trillium 2022.02.0-443
  • Spotted Wakerobin 2022.06.0-daily+225

Verified fixed on Ubuntu 20.04 in RStudio Server

  • Prairie Trillium 2022.02.2+481
  • Spotted Wakerobin 2022.06.0-daily+284

File type matters. This isn't an issue with R scripts, but it is with R Markdown, C++, Shiny, and others. Tested by creating the following file types:

  • R script (baseline—never a problem)
  • R Markdown
  • Shiny
  • C++

Confirmed that this is fixed in Safari 15.4 on MacOS 12.3. Also confirmed that this didn't affect Chrome and Firefox.

@mikebessuille
Copy link
Contributor

@mikebessuille mikebessuille commented Apr 11, 2022

I'd be okay with patching this to Ghost Orchid as well.

@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Apr 12, 2022

Fix has now been backported to Ghost Orchid as well.

@timtmok
Copy link
Contributor

@timtmok timtmok commented Jun 23, 2022

Kevin's change was merged after this issue was created and does fix the problem. I'm unable to reproduce on Safari 15.5. I can see that the body element has the safari class which causes the menu element to inherit the transform property that force the element to the top of the Z layer.

That change was backported to prairie-trillium and exists in main now.

@timtmok
Copy link
Contributor

@timtmok timtmok commented Jun 23, 2022

Actually, I'll reopen for now because I don't think this was backported to Ghost Orchid.

@timtmok timtmok reopened this Jun 23, 2022
@kevinushey
Copy link
Contributor

@kevinushey kevinushey commented Jun 23, 2022

3ce52b8

@timtmok
Copy link
Contributor

@timtmok timtmok commented Jun 24, 2022

I've reproduced the issue and merged the change to PT and GO branches.

@ronblum
Copy link
Contributor

@ronblum ronblum commented Jun 24, 2022

Is this for the drop down menus, or one of the tooltip problems?

@ashwinikalantri
Copy link

@ashwinikalantri ashwinikalantri commented Jun 24, 2022

Screenshot 2022-06-24 at 10 48 01 PM

The search box in the help window also renders the auto-complete behind other elements.

@timtmok
Copy link
Contributor

@timtmok timtmok commented Jun 24, 2022

Is this for the drop down menus, or one of the tooltip problems?

This change fixes the tooltip. The drop down menu fix was merged back in March so that is available all the way back to Ghost Orchid (2021.09.3+396).

@timtmok
Copy link
Contributor

@timtmok timtmok commented Jun 24, 2022

The search box in the help window also renders the auto-complete behind other elements.

I've split this off as its own issue #11494. Any other issues with Safari compatibility can be a new issue so it can be tracked independently.

@ronblum
Copy link
Contributor

@ronblum ronblum commented Jun 27, 2022

@timtmok Thanks! I've follow up on the tooltip issue.

@ronblum
Copy link
Contributor

@ronblum ronblum commented Jun 27, 2022

Tool tips issues verified in RStudio Server 2022.07.0-preview+543 Spotted Wakerobin on MacOS 12.5 with the examples above of stack and write_csv in order to use the same reprex.

Verified using

  • Safari 15.5

Plus checked other browser to make sure that there are no regressions:

  • Chrome 103.0.5060.53
  • Safari 101.0.1

I'm leaving this open for testing the backports to Ghost Orchid and Prairie Trillium.

@ronblum
Copy link
Contributor

@ronblum ronblum commented Jun 28, 2022

Closing for Spotted Wakerobin. Opened new backport tickets:

  • Ghost Orchid backport: #11518
  • Prairie Trillium backport: #11517

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
backport Issues whose associated fixes will need to be backported for a previous release. backport-ghost-orchid backport-prairie-trillium macos
Projects
None yet
Development

No branches or pull requests

9 participants