Chrome - type=file drag and drop - html

I have a weird situation. One of my users is using functionality of Chrome (current version, 49, 50), that he drags and drops a file from his folder on local computer to normal input type=file button in a form on the webpage. Once again, let me stress it even more, its normal html input, no fancy javascript, no drag&drop events and handlers, nothing like this. It just takes the name of the dragged file and puts it into the input field, as like he selected it via "normal" way, opening the file select window, locating file on harddrive, selecting the file and confirming.
In some specific situation, this stops working (while doing some edits in the page via javascript / ajax), and I need to "reenable" it.
But, and that is my question, I haven't found any documentation of this "feature" in Google Chrome (or maybe some other browsers as well, I don't know). Why it works, how it works, how it should work and what to do if it stops working :) Does anyone has any experience with this ? The only way how to "fix" it now is to reload the page. I'd love to solve it ... :)
EDIT 1 : I just did a quick test, it works and bugs the same way in Firefox on Win. It doesn't show any error in dev console or any message, it just doesn't add the file as expected.

I've found it. The previous discussion with deceze pointed me to test the javascripts I have on the page, that do not "interfere" with the input type=file ... they weren't any such scripts, but I've found that after doubleclick on the table (that I'm using for editing) this script is being called
$(document).bind('drop dragover', function (e) {
e.preventDefault();
});
and there wasn't any unbind action when table is saved ... this caused the drag and drop everywhere on the page to stop working after the edit.

Related

Html input of type "file" freeze the browser sometimes

i'm struggling with the classic HTML input of type file. I was using it on my angular application and i had freeze sometimes, the whole browser became unresponsive, and the only thing that works is the scroll.
You can't click any buttons, select any text or even change tab on the browser for about 5 seconds. I tried a lot of different file type and sizes and it doesn't change any of this, it even freeze sometimes when i don't select any file in the explorer and i click the close button directly.
So I thought it was my implementation that was bad and i went to the Mozilla developper website where you have an example and I have exactly the same behaviour. I also tried to take only the HTML from the Mozilla website and put it alone on a .html file and again, same behaviour.
This does not occur 100% of the time, but I would argue that on my end it does it about 60/70 % of the times.
I tried it on chrome and Firefox (both up to date), on multiple computer (all running Windows though) and i have the same behaviour on all of them.
I don't have any error or anyting in the consoles.
I don't know what to do with this, i'm pretty sure it can't be the file's input on the whole web that are bugged, but i tried a lot of various things with always the same results. Should i report it somewhere? ( if so, where? ) Or what would you suggest to do to investigate this further?
I couldn't find anyone discussing this issue on the internet apart for this thread that had no solution, they also say in this thread that the bug is not reproducible in Edge, but i just tried and it does the same thing.
Thanks for reading me and for any help about this.
Chrome freezes for few seconds when after any use of file field.
It was because I had a shortcut in "Quick Access" menu in windows explorer. This shortcut has been linked with a folder shared by network. I've removed this shortcut and everything is good now.
Same here, I have a mapped network drive that is not responding, this make a 5 seconds delay. After unmapping the drive, no more delay. The delay is the same in firefox or chrome.
Same here, if you want to remove it, on Windows 10, click on the icon Quick access (blue star), then right click on the dead link appearing in the "Frequent folders" panel on the right panel and choose "Unpin/Remove from Quick access". There should be no error message.

Chrome Extension -- Running executeScript in multiple new tabs at the same time

I'm building a Chrome Extension that has a popup.html with a search form. Like Travelocity or Kayak, the form includes checkboxes so the user can select which sites they want to query.
On submit, popup.js launches multiple new tabs based on the selected checkboxes. In the tabs.create() callback for each new tab I use executeScript to:
- (A) inject the user's query into the search form on each of the new pages, and
- (B) submit the search form on those pages.
My code is working when one checkbox is selected (i.e. new tab is launched), but when multiple new tabs are created simultaneously it appears that the executeScript isn't running consistently. Sometimes it works, and sometimes it doesn't.
This leads me to believe that there's some sort of issue with the timing of the script execution, but I'm not sure.
If you have any idea what's going on I'd love to hear your advice.
Also, I'd appreciate any resources on how to debug this sort of issue in the future.
Here's my code on github...
whole repo: https://github.com/rossmorey/SongSearch
manifest.json
popup.html
popup.js (most relevant file)
Many thanks!
Seems like when you open multiple tabs - your popup.html loses the focus and closes, so on tabs.create callbacks which injects your code will not be executed.
Try to create tabs with "active:false" option, like this:
chrome.tabs.create({url: stringToObj[org], active:false} ...
I think it would help you.
And also...
It's a bug in your SeSac inject-code: if no search type defined in popup window, block
input[value="undefined"]
will not be found, so "checked" property will be called on "undefined" and this will stop you inject script execution.

Chrome: waiting for www.site.com, how to know which resource is delaying the page load?

When a site gets stuck in chrome with the 'loading www.site.com' status, Is there anyway to know which of the elements on the DOM is delaying the load? for example, it can be an external js file or image that is taking long time to load. I tried using the network tab in the DeveloperTools, but it only shows the elements already loaded and the time they took. I couldn't find a way to see which element is stuck.
I found a way that I'm not sure it works in all cases, but it did for me. I used the Timeline tab (now shown in the Performance tab), it's one of the tabs in Chrome Dev Tools.
Open Chrome Developer tools (F12 or CMD + Alt + I in Mac) and click the Performance tab
Make sure you drag the grey timeline bar all the way to the right, you want to see the most recent section of events so you can find what's getting stuck:
Check just down below the records sidebar. If you don't see this like in the capture below, try toggling the icons, there are different view modes. Now, going all the way down I found these. It doesn't look like that's going well. Obviously some kind of infinite loop in some random code:
I couldn't find out if it was an extension itself or some other bit of code. Clicking through I only could find // Copyright 2014 The Chromium Authors. All rights reserved..
Checking in Incognito mode clear of extensions, the website loads just fine.
I'd also advise to check the Console tab to see if there are were any errors that might cause the infinite loading thing. You'll often find clues there.

Firefox drag to file form element not triggering change event listener

In an HTML form file field, as you may know, you can drag a file and drop it on the 'Choose File' button or the text field displaying the file selected. This selects the file without using the dialog. I was using this behavior, with an invisible and enlarged file field area to simulate a 'drop zone' for instant uploading without the need for HTML5.
I just updated to Firefox 15.0.1, and found out my file field HTML form element is no longer triggering the change event when a file is dropped from the desktop. This continues to function for me in Chrome 21.0.1180.89, and Safari 5.1.6, and was working in Firefox last friday before I updated.
CoffeeScript
$ ->
fileField = document.getElementById 'file-field'
fileField.addEventListener 'change', file_changed, false
The interesting thing is that Firefox is allowing the drag and drop to occur, and thus populating the file field with my file, but since the 'change' event is not triggering, I cannot auto submit the form for the instant upload effect. If anyone has any idea what is going on, or can suggest a lean alternative, I would greatly appreciate it :)
After filing a bug to Mozilla, I was informed the bug had already been reported and it should be fixed in a future release. Just happy they did not intentionally remove this feature!

Creating Chrome popup with a C++ program

Problem context:
I have a C++ program and a web presence. Currently the way things are working I have made a control panel with javascript and html. And it send commands via an unimportant communication medium to control things or get information from the C++ program.
Now, when the C++ program launches, I'm making it run a
ShellExecute(NULL, "open", addressBuffer," --new-window", NULL, SW_NORMAL);
This is a way of launching the default browser with the given address. The addressBuffer in this case points to an intermediate HTML file that quickly turns around and uses the
window.open()
in Javascript to open the final popup, then closes itself.
The result is the user now has the popup control panel that I want them to have but the user's main browser window also gets given focus, un-minimized, and placed on a different tab than the one they had selected. (Basically pops up out of nowhere and selects a another tab)
Problem:
I'm looking for a way to launch a Chrome popup, without disturbing a previously open browser window. Any ideas or solutions would be very helpful.
Lastly, it's worth noting that the " --new-window" from the code above doesn't actually open a new window like you would expect. In this case it's actually doing nothing... If it did work, none of this would really be an issue.
I know this is wordy so thanks in advance for you time!
-Michael
Alright, I came up with a solution.
Something about how ShellExecute processes it's commands was preventing the command line args to be passed in correctly.
My work-around includes grabbing the path to Chrome from the registry,
HKET_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\App Paths\chrome.exe
Then simply doing a system() command with the chrome path "--new-window" and the web path.
Then I let the intermediate html page open it's popup and close itself.
Tada done.
Thanks.