Initialize an initial sandbox fs sync (codesandbox#3145)

Author: christianalfoni

packages/app/src/app/overmind/effects/vscode/SandboxFsSync/index.ts

@@ -14,9 +14,9 @@ import {
 import { isAbsoluteVersion } from '@codesandbox/common/lib/utils/dependencies';
 import { getGlobal } from '@codesandbox/common/lib/utils/global';
 import { protocolAndHost } from '@codesandbox/common/lib/utils/url-generator';
+import { getSavedCode } from 'app/overmind/utils/sandbox';
 import { json } from 'overmind';
 
-import { getSavedCode } from 'app/overmind/utils/sandbox';
 import { WAIT_INITIAL_TYPINGS_MS } from '../constants';
 import { appendFile, mkdir, rename, rmdir, unlink, writeFile } from './utils';
 
@@ -286,15 +286,15 @@ class SandboxFsSync {
       try {
         browserFs.stat('/sandbox/package.json', (packageJsonError, stat) => {
           if (packageJsonError) {
-            reject(packageJsonError);
+            resolve(null);
             return;
           }
 
           browserFs.readFile(
             '/sandbox/package.json',
             async (packageJsonReadError, rv) => {
               if (packageJsonReadError) {
-                reject(packageJsonReadError);
+                resolve(null);
                 return;
               }
 
@@ -417,12 +417,17 @@ class SandboxFsSync {
 
     kids.forEach(kid => {
       const path = join(dir, kid);
-      const lstat = browserFs.lstatSync(path);
 
-      if (lstat.isDirectory()) {
-        this.clearSandboxFiles(path);
-      } else {
-        browserFs.unlinkSync(path);
+      try {
+        const lstat = browserFs.lstatSync(path);
+
+        if (lstat.isDirectory()) {
+          this.clearSandboxFiles(path);
+        } else {
+          browserFs.unlinkSync(path);
+        }
+      } catch {
+        // Do nothing
       }
     });
 

packages/app/src/app/overmind/effects/vscode/index.ts

@@ -19,13 +19,13 @@ import prettify from 'app/src/app/utils/prettify';
 import { blocker } from 'app/utils/blocker';
 import { listen } from 'codesandbox-api';
 import FontFaceObserver from 'fontfaceobserver';
+import { debounce } from 'lodash-es';
 import * as childProcess from 'node-services/lib/child_process';
 
-import { debounce } from 'lodash-es';
 import { EXTENSIONS_LOCATION, VIM_EXTENSION_ID } from './constants';
 import {
-  initializeCustomTheme,
   initializeCodeSandboxTheme,
+  initializeCustomTheme,
   initializeExtensionsFolder,
   initializeSettings,
   initializeThemeCache,
@@ -120,6 +120,13 @@ export class VSCodeEffect {
 
     this.prepareElements();
 
+    // We instantly create a sandbox sync, as we want our
+    // extension host to get its messages handled to initialize
+    // correctly
+    this.sandboxFsSync = new SandboxFsSync({
+      getSandboxFs: () => ({}),
+    });
+
     import(
       // @ts-ignore
       'worker-loader?publicPath=/&name=ext-host-worker.[hash:8].worker.js!./extensionHostWorker/bootstrappers/ext-host'
@@ -285,8 +292,6 @@ export class VSCodeEffect {
   public async changeSandbox(sandbox: Sandbox, setFs: (fs: SandboxFs) => void) {
     await this.initialized;
 
-    const isFirstSync = !this.sandboxFsSync;
-
     if (this.modelsHandler) {
       this.modelsHandler.dispose();
     }
@@ -306,15 +311,10 @@ export class VSCodeEffect {
 
     setFs(this.sandboxFsSync.create(sandbox));
 
-    // We do not stop the extension host on first sync
-    if (isFirstSync) {
-      this.sandboxFsSync.sync(() => {});
-    } else {
-      this.editorApi.extensionService.stopExtensionHost();
-      this.sandboxFsSync.sync(() => {
-        this.editorApi.extensionService.startExtensionHost();
-      });
-    }
+    this.editorApi.extensionService.stopExtensionHost();
+    this.sandboxFsSync.sync(() => {
+      this.editorApi.extensionService.startExtensionHost();
+    });
   }
 
   public async setModuleCode(module: Module) {