UI Drag/Drop CSV Upload Fails for Ubuntu/FireFox

[stanbrub]

Drag and Drop for CSV upload fails with either a no-op or Leave Page / Stay Page message. Attached a video showing it happening.

System:

• Firefox 113.0.2 (64-bit)
• Ubuntu Desktop 22.04.2 LTS
• DHC docker edge as of 2023-06-13

Steps:

1. Start DHC (I used last night's edge build)
2. Load UI localhost:10000/ide
3. Run the "Files" app
4. Drag a csv file from "Files" onto the Console
5. Notice the upload screen does not appear like in Chrome
6. Click on the overflow menu for Console and select Upload Table From File
7. Drag CSV file to the upload overlay and Drop it
8. A message pops up asking if you want to Leave the page
9. (Using Select File and uploading that way works.)

This happens consistently for me.

FirefoxDragAndDropUploadFails.webm

[dsmmcken]

Not reproducible on windows/firefox, so it's probably specific to ubuntu/firefox.

Assigning to @mofojed since he has the same environment.

[mofojed]

@stanbrub is there an example CSV you can attach reproducing the issue?

[stanbrub]

Sorry, should have uploaded. It's a basic and small CSV file.
ui-import-example.csv

[mofojed]

@stanbrub I'm unable to reproduce this on Ubuntu 22.04, Firefox 114.0.1. Ubuntu 17 is pretty old - perhaps it's a problem with older Ubuntu? Or can you not reproduce it in Chrome either?

The behaviour you're observing is consistent with the web UI not being aware there is anything being dragged over, and then the browser just trying to open the file that you just dragged into it. To help narrow down the issue, can you check the following:

• Does clicking the "Select File" instead of trying to drag the CSV in work correctly?
• Can you drag/drop in other sites (e.g. in GitHub into a comment)
• Can you export the support logs after reproducing the issue? In the Deephaven settings menu, Export Support Logs is a button near the bottom.

[stanbrub]

I inadvertently put the Java version in for the Ubuntu version, which is Ubuntu 22.04.2 LTS. Fixed in the description.

• Selecting the file for upload works correctly
• I can drag and drop into other sites. For example, I used drag and drop to add the video to this issue
• Drag and drop on Chrome does usually work, though it can be a little flaky (occasionally the upload overlay doesn't come up)
• Something else to note. Even though I've been able to dnd into this github site, when I tried drag the support log zip into this comment for the support logs, it didn't work. I had to select the file.

2023-06-14-104135_support_logs.zip

[mofojed]

I'm still unable to reproduce on my machine (Ubuntu 22.04.1, Firefox 114.0.1). Debugged with @stanbrub a little bit. A few things we observed

• Setting a breakpoint in CsvOverlay.handleDragOver was getting triggered, but I never actually saw the CsvOverlay render...
  • Maybe we should set a breakpoint in Console.handleDragLeave to see if the CsvOverlay is getting hidden immediately again??
• Stan is using Firefox v113, whereas I'm on v114. I've asked him to update and try again.
• Stan also observes some strange behaviour in Chrome, where if he drags from Files to the console, it appears, but if he continues dragging and goes back over the files window, then back over console, it no longer appears.

We did also observe an exception at one point, that was in the react library:

function se(a,b){b=0!==(b&4);for(var c=0;c<a.length;c++){var d=a[c],e=d.event;d=d.listeners;a:{var f=void 0;if(b)for(var g=d.length-1;0<=g;g--){var h=d[g],k=h.instance,l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;Ze(e,h,l);f=k}else for(g=0;g<d.length;g++){h=d[g];k=h.instance;l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;Ze(e,h,l);f=k}}}if(Ub)throw a=Vb,Ub=!1,Vb=null,a;}