Fix recompilation for cached modules (codesandbox#607)

* Fix recompilation for cached modules

* Fix test recompilation

Author: CompuIves

packages/app/src/sandbox/compile.js

@@ -220,7 +220,7 @@ async function updateManager(
   }
 
   manager.updateConfigurations(configurations);
-  return await manager.updateData(managerModules);
+  return manager.updateData(managerModules);
 }
 
 function initializeResizeListener() {
@@ -352,7 +352,14 @@ async function compile({
 
     resetScreen();
 
-    if (!manager.webpackHMR) {
+    const managerTranspiledModuleToTranspile = manager.getTranspiledModule(
+      managerModuleToTranspile
+    );
+
+    if (
+      !manager.webpackHMR &&
+      !managerTranspiledModuleToTranspile.compilation
+    ) {
       try {
         const children = document.body.children;
         // Do unmounting for react
@@ -372,20 +379,23 @@ async function compile({
         /* don't do anything with this error */
       }
     }
+
     if ((!manager.webpackHMR || firstLoad) && !manager.preset.htmlDisabled) {
-      const htmlModule =
-        modules[
-          templateDefinition
-            .getHTMLEntries(configurations)
-            .find(p => modules[p])
-        ];
-
-      const html = htmlModule
-        ? htmlModule.code
-        : template === 'vue-cli'
-          ? '<div id="app"></div>'
-          : '<div id="root"></div>';
-      document.body.innerHTML = html;
+      if (!managerTranspiledModuleToTranspile.compilation) {
+        const htmlModule =
+          modules[
+            templateDefinition
+              .getHTMLEntries(configurations)
+              .find(p => modules[p])
+          ];
+
+        const html = htmlModule
+          ? htmlModule.code
+          : template === 'vue-cli'
+            ? '<div id="app"></div>'
+            : '<div id="root"></div>';
+        document.body.innerHTML = html;
+      }
     }
 
     const tt = Date.now();
@@ -448,10 +458,6 @@ async function compile({
 
     debug(`Total time: ${Date.now() - startTime}ms`);
 
-    dispatch({
-      type: 'success',
-    });
-
     manager.save();
   } catch (e) {
     console.log('Error in sandbox:');

packages/app/src/sandbox/eval/manager.js

@@ -194,7 +194,7 @@ export default class Manager {
     debug(`Loaded manifest.`);
   }
 
-  evaluateModule(module: Module) {
+  evaluateModule(module: Module, force: boolean = false) {
     if (this.hardReload) {
       // Do a hard reload
       document.location.reload();
@@ -210,6 +210,10 @@ export default class Manager {
 
     const transpiledModule = this.getTranspiledModule(module);
 
+    if (force && transpiledModule.compilation) {
+      transpiledModule.compilation = null;
+    }
+
     try {
       const exports = this.evaluateTranspiledModule(transpiledModule);
 

packages/app/src/sandbox/eval/tests/jest-lite.js

@@ -208,7 +208,7 @@ export default class TestRunner {
 
     if (testModule) {
       await this.manager.transpileModules(testModule, true);
-      this.manager.evaluateModule(testModule);
+      this.manager.evaluateModule(testModule, true);
     }
 
     if (this.manager.modules) {
@@ -223,7 +223,7 @@ export default class TestRunner {
     await Promise.all(
       tests.map(async t => {
         try {
-          this.manager.evaluateModule(t);
+          this.manager.evaluateModule(t, true);
           this.ranTests.add(t.path);
         } catch (e) {
           this.ranTests.delete(t.path);