small fix for resize dispatch and moving the sandpack projects out (#5562)

* small fix for resize dispatch and moving the sandpack projects out

* remove commented code

Author: alexnm

.prettierignore

@@ -18,6 +18,3 @@ www/
 *.html
 
 .drone.yml
-
-!/standalone-packages/react-sandpack
-!/standalone-packages/sandpack

package.json

@@ -43,6 +43,7 @@
     "build:components": "lerna run build:dev --scope @codesandbox/components --stream",
     "build:deps": "lerna run build:dev",
     "build:dynamic": "lerna run build --scope dynamic-pages --stream",
+    "build:sandpack": "lerna run build:sandpack-sandbox --scope app --stream",
     "build:embed": "lerna run build:embed --scope app --stream && gulp",
     "build:prod": "cross-env NODE_OPTIONS=\"--max-old-space-size=4096\" lerna run build  --scope homepage --stream && lerna run build --scope app --stream && lerna run copy-assets --scope app --stream",
     "commit": "concurrently \"yarn typecheck\" \"yarn lint\" && git commit -m",

packages/app/src/sandbox/compile.ts

@@ -37,7 +37,6 @@ import setScreen, { resetScreen } from './status-screen';
 import { showRunOnClick } from './status-screen/run-on-click';
 import { SCRIPT_VERSION } from '.';
 
-let initializedDOMMutationListener = false;
 let manager: Manager | null = null;
 let actionsEnabled = false;
 
@@ -402,7 +401,7 @@ function initializeDOMMutationListener() {
   // When a change is found, the sendResize function will determine if a message is dispatched
   const observer = new MutationObserver(sendResize);
 
-  observer.observe(document.body, {
+  observer.observe(document, {
     attributes: true,
     childList: true,
     subtree: true,
@@ -411,8 +410,6 @@ function initializeDOMMutationListener() {
   window.addEventListener('unload', () => {
     observer.disconnect();
   });
-
-  initializedDOMMutationListener = true;
 }
 
 function overrideDocumentClose() {
@@ -760,10 +757,6 @@ async function compile({
 
     await manager.preset.teardown(manager, updatedModules);
 
-    if (!initializedDOMMutationListener && !manager.preset.htmlDisabled) {
-      initializeDOMMutationListener();
-    }
-
     if (firstLoad && showOpenInCodeSandbox) {
       createCodeSandboxOverlay(modules);
     }
@@ -863,16 +856,16 @@ async function compile({
         });
     }
   }
+
+  if (!hadError && firstLoad) {
+    initializeDOMMutationListener();
+  }
+
   firstLoad = false;
 
   dispatch({ type: 'status', status: 'idle' });
   dispatch({ type: 'done', compilatonError: hadError });
 
-  if (!hadError) {
-    // If compile is successful, compute the size of the content after a small delay and dispatch that
-    setTimeout(sendResize, 100);
-  }
-
   if (typeof (window as any).__puppeteer__ === 'function') {
     setTimeout(() => {
       // Give everything some time to evaluate