separate editor for each file

app/assets/javascripts/editor.js.erb

@@ -403,6 +403,8 @@ $(function() {
     $('.editor').each(function(index, element) {
       var editor = ace.edit(element);
 
+      console.log('ace', element)
+
       if (qa_api) {
         editor.getSession().on("change", function (deltaObject) {
           qa_api.executeCommand('syncEditor', [active_file, deltaObject]);
@@ -834,7 +836,8 @@ $(function() {
 
   var showFrame = function(frame) {
     active_frame = frame;
-    $('.frame').hide();
+    // should not be hidden to generate multiple ace editors in edit mode
+    //$('.frame').hide();
     frame.show();
   };