Listen to 'drag' to detect actual start of drag operation.

ui/file_manager/file_manager/foreground/js/file_manager.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 'use strict';
 
 /**
  * FileManager constructor.
  *
  * FileManager objects encapsulate the functionality of the file selector
@@ skipping 981 matching lines @@
         this.selectionHandler_.onFileSelectionChanged.bind(
             this.selectionHandler_));
 
     this.initList_(this.grid_);
     this.initList_(this.table_.list);
 
     var fileListFocusBound = this.onFileListFocus_.bind(this);
     this.table_.list.addEventListener('focus', fileListFocusBound);
     this.grid_.addEventListener('focus', fileListFocusBound);
 
-    var dragStartBound = this.onDragStart_.bind(this);
-    this.table_.list.addEventListener('dragstart', dragStartBound);
-    this.grid_.addEventListener('dragstart', dragStartBound);
+    var draggingBound = this.onDragging_.bind(this);
+    var dragEndBound = this.onDragEnd_.bind(this);
 
-    var dragEndBound = this.onDragEnd_.bind(this);
+    // Listen to drag events to hide preview panel while user is dragging files.
+    // Files.app prevents default actions in 'dragstart' in some situations,
+    // so we listen to 'drag' to know the list is actually being dragged.
+    this.table_.list.addEventListener('drag', draggingBound);
+    this.grid_.addEventListener('drag', draggingBound);
     this.table_.list.addEventListener('dragend', dragEndBound);
     this.grid_.addEventListener('dragend', dragEndBound);
-    // This event is published by DragSelector because drag end event is not
-    // published at the end of drag selection.
+
+    // Listen to dragselection events to hide preview panel while the user is
+    // selecting files by drag operation.
+    this.table_.list.addEventListener('dragselectionstart', draggingBound);
+    this.grid_.addEventListener('dragselectionstart', draggingBound);
     this.table_.list.addEventListener('dragselectionend', dragEndBound);
     this.grid_.addEventListener('dragselectionend', dragEndBound);
 
     // TODO(mtomasz, yoshiki): Create navigation list earlier, and here just
     // attach the directory model.
     this.initNavigationList_();
 
     this.table_.addEventListener('column-resize-end',
                                  this.updateStartupPrefs_.bind(this));
 
@@ skipping 375 matching lines @@
     if (this.table_)
       this.table_.setBottomMarginForPanel(panelHeight);
 
     if (this.directoryTree_) {
       this.directoryTree_.setBottomMarginForPanel(panelHeight);
       this.ensureDirectoryTreeItemNotBehindPreviewPanel_();
     }
   };
 
   /**
-   * Invoked when the drag is started on the list or the grid.
+   * Invoked while the drag is being performed on the list or the grid.
+   * Note: this method may be called multiple times before onDragEnd_().
    * @private
    */
-  FileManager.prototype.onDragStart_ = function() {
+  FileManager.prototype.onDragging_ = function() {
     // On open file dialog, the preview panel is always shown.
     if (DialogType.isOpenDialog(this.dialogType))
       return;
     this.previewPanel_.visibilityType =
         PreviewPanel.VisibilityType.ALWAYS_HIDDEN;
   };
 
   /**
    * Invoked when the drag is ended on the list or the grid.
    * @private
@@ skipping 2277 matching lines @@
       callback(this.preferences_);
       return;
     }
 
     chrome.fileBrowserPrivate.getPreferences(function(prefs) {
       this.preferences_ = prefs;
       callback(prefs);
     }.bind(this));
   };
 })();