fix expand logic on file tab click

src/app.js

@@ -498,9 +498,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
       fileManager.switchFile(path)
     },
     event: fileManager.event,
-    currentFile: function () {
-      return config.get('currentFile')
-    },
+    config: config,
     currentContent: function () {
       return editor.get(config.get('currentFile'))
     },
@@ -516,18 +514,14 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
 
   filePanel.event.register('resize', delta => self._adjustLayout('left', delta))
 
-  var previouslyOpenedFile = config.get('currentFile')
-  if (previouslyOpenedFile) {
+  setTimeout(function initOpenFile () {
+    var previouslyOpenedFile = config.get('currentFile') || 'browser/ballot.sol'
+    config.set('currentFile', null)
     filesProviders['browser'].get(previouslyOpenedFile, (error, content) => {
-      if (!error && content) {
-        fileManager.switchFile(previouslyOpenedFile)
-      } else {
-        fileManager.switchFile()
-      }
+      if (!error && content) fileManager.switchFile(previouslyOpenedFile)
+      else fileManager.switchFile('browser/ballot.sol')
     })
-  } else {
-    fileManager.switchFile()
-  }
+  }, 0)
 
   // ----------------- Renderer -----------------
   var rendererAPI = {

src/app/files/file-explorer.js

@@ -149,6 +149,8 @@ function fileExplorer (appAPI, files) {
     if (explorer === files) {
       fileFocus(newFile)
     } else {
+      var currentFile = appAPI.config.get('currentFile')
+      if (currentFile === newFile) return
       unfocus(focusElement)
     }
   })
@@ -157,7 +159,6 @@ function fileExplorer (appAPI, files) {
   fileEvents.register('fileRenamedError', fileRenamedError)
   fileEvents.register('fileAdded', fileAdded)
 
-  var filepath = null
   var textUnderEdit = null
   var textInRename = false
 
@@ -332,15 +333,41 @@ function fileExplorer (appAPI, files) {
     })
   }
 
+  function expandPathTo (filePath, cb) {
+    var label = self.element.querySelector(`label[data-path="${filePath}"]`)
+    if (label) cb()
+    var arr = filePath.split('/')
+    var filename = arr.pop()
+    var path = arr.shift()
+    var fullpath = path
+    expand(fullpath, path, function next () {
+      path = arr.shift()
+      if (path) {
+        fullpath += '/' + path
+        expand(fullpath, path, next)
+      } else {
+        var label = self.element.querySelector(`label[data-path$="${filename}"]`)
+        focus.call(getLiFrom(label), {})
+        cb()
+      }
+    })
+    function expand (path, step, next) {
+      label = self.element.querySelector(`label[data-path="${step}"]`) ||
+        self.element.querySelector(`label[data-path="${path}"]`)
+      if (label) var li = label.parentElement.parentElement.parentElement
+      if (!label || path === step && !li.children[1].children.length) {
+        var currentTree = self.treeView.nodeAt(path)
+        var caret = currentTree.parentElement.firstElementChild.firstElementChild
+        caret.click()
+        next()
+      } else next()
+    }
+  }
+
   function fileFocus (path) {
+    var filepath = appAPI.config.get('currentFile')
     if (filepath === path) return
-    filepath = path
-    setTimeout(function focusNode () {
-      // @TODO: fix file tree expand logic to account for async remixd loading logic 
-      var el = getElement(filepath)
-      expandPathTo(el)
-      setTimeout(function focusNode () { el.click() }, 0)
-    }, 0)
+    expandPathTo(path, function () { appAPI.config.set('currentFile', path) })
   }
 
   function fileRemoved (filepath) {
@@ -435,13 +462,6 @@ function removeSubtree (files, path, isFolder) {
   if (isFolder) files.remove(path)
 }
 
-function expandPathTo (li) {
-  while ((li = li.parentElement.parentElement) && li.tagName === 'LI') {
-    var caret = li.firstChild.firstChild
-    if (caret.classList.contains('fa-caret-right')) caret.click() // expand
-  }
-}
-
 fileExplorer.prototype.init = function () {
   var self = this
   self.files.resolveDirectory('/', (error, files) => {

src/app/files/fileManager.js

@@ -47,6 +47,7 @@ class FileManager {
         self.switchFile(Object.keys(self.tabbedFiles)[0])
       } else {
         opt.editor.displayEmptyReadOnlySession()
+        self.opt.config.set('currentFile', '')
       }
       return false
     })
@@ -98,7 +99,6 @@ class FileManager {
 
   // Display files that have already been selected
   refreshTabs (newfile) {
-    var self = this
     if (newfile) {
       this.tabbedFiles[newfile] = newfile
     }
@@ -109,14 +109,14 @@ class FileManager {
     for (var file in this.tabbedFiles) {
       $filesEl.append(yo`<li class="file"><span class="name">${file}</span><span class="remove"><i class="fa fa-close"></i></span></li>`)
     }
-    var currentFileOpen = !!this.opt.config.get('currentFile')
 
-    if (currentFileOpen) {
-      var active = $('#files .file').filter(function () { return $(this).find('.name').text() === self.opt.config.get('currentFile') })
-      active.addClass('active')
-    }
-    $('#input').toggle(currentFileOpen)
-    $('#output').toggle(currentFileOpen)
+    var active = $('#files .file').filter(function () {
+      return $(this).find('.name').text() === newfile
+    })
+    if (active.length) active.addClass('active')
+    else this.switchFile()
+    // $('#input').toggle(active)
+    $('#output').toggle(active)
   }
 
   switchFile (file) {
@@ -128,12 +128,15 @@ class FileManager {
         if (fileList.length) {
           file = fileList[0]
           if (file) _switchFile(file)
+        } else {
+          self.event.trigger('currentFileChanged', [])
         }
       })
     } else _switchFile(file)
-    function _switchFile () {
+    function _switchFile (file) {
       self.saveCurrentFile()
-      self.opt.config.set('currentFile', file)
+      var currentFile = self.opt.config.get('currentFile')
+      if (file === currentFile) return
       self.refreshTabs(file)
       self.fileProviderOf(file).get(file, (error, content) => {
         if (error) {