Merge branch 'master' of https://github.com/codesandbox/codesandbox-client into use-overmind-modals

Author: avin_kumar

.circleci/config.yml

@@ -279,6 +279,7 @@ jobs:
       - build_prod
   test-integrations:
     executor: node-with-puppeteer
+    parallelism: 2
     steps:
       - checkout_with_cache
       - test_integrations

.yarnclean

@@ -9,7 +9,6 @@ docs
 doc
 website
 images
-assets
 
 # examples
 example

package.json

@@ -60,7 +60,7 @@
     "test:ci": "lerna run test --ignore codesandbox-browserfs -- --ci --testResultsProcessor=\"jest-junit\" ",
     "test:integrations": "lerna exec --scope app --stream -- yarn test:integrations",
     "test:jest-lite": "lerna exec --scope app --stream -- yarn run test jest-lite --watch --coverage",
-    "typecheck": "lerna run typecheck --scope app"
+    "typecheck": "lerna run typecheck"
   },
   "dependencies": {
     "@typescript-eslint/eslint-plugin": "^1.13.0",

packages/app/integration-tests/browser-tests/browsers.test.js

@@ -38,68 +38,76 @@ function testPageWitCapabilities(capabilities) {
     });
 }
 
+const PARALLEL_INDEX = Number.parseInt(process.env.CIRCLE_NODE_INDEX, 10) || 0;
+
 const usedDescribe = process.env.BROWSER_STACK_KEY ? describe : describe.skip;
 usedDescribe('browser-tests', () => {
-  test.skip('ie11', async () => {
-    // Input capabilities
-    const capabilities = {
-      browserName: 'IE',
-      browser_version: '11.0',
-      os: 'Windows',
-      os_version: '10',
-      resolution: '1024x768',
-    };
+  if (PARALLEL_INDEX === 0) {
+    test.skip('ie11', async () => {
+      // Input capabilities
+      const capabilities = {
+        browserName: 'IE',
+        browser_version: '11.0',
+        os: 'Windows',
+        os_version: '10',
+        resolution: '1024x768',
+      };
 
-    await testPageWitCapabilities(capabilities);
-  }, 130000);
+      await testPageWitCapabilities(capabilities);
+    }, 130000);
 
-  test.skip('ios', async () => {
-    // Input capabilities
-    const capabilities = {
-      browserName: 'iPhone',
-      device: 'iPhone X',
-      real_mobile: 'true',
-      os_version: '11.0',
-    };
+    test.skip('ios', async () => {
+      // Input capabilities
+      const capabilities = {
+        browserName: 'iPhone',
+        device: 'iPhone X',
+        real_mobile: 'true',
+        os_version: '11.0',
+      };
 
-    await testPageWitCapabilities(capabilities);
-  }, 130000);
+      await testPageWitCapabilities(capabilities);
+    }, 130000);
 
-  test('firefox', async () => {
-    // Input capabilities
-    const capabilities = {
-      browserName: 'Firefox',
-      browser_version: '58.0',
-      os: 'Windows',
-      os_version: '10',
-      resolution: '1024x768',
-    };
+    test('firefox', async () => {
+      // Input capabilities
+      const capabilities = {
+        browserName: 'Firefox',
+        browser_version: '58.0',
+        os: 'Windows',
+        os_version: '10',
+        resolution: '1024x768',
+      };
 
-    await testPageWitCapabilities(capabilities);
-  }, 130000);
+      await testPageWitCapabilities(capabilities);
+    }, 130000);
 
-  test('safari', async () => {
-    // Input capabilities
-    const capabilities = {
-      browserName: 'Safari',
-      browser_version: '11.0',
-      os: 'OS X',
-      os_version: 'High Sierra',
-      resolution: '1024x768',
-    };
+    test('safari', async () => {
+      // Input capabilities
+      const capabilities = {
+        browserName: 'Safari',
+        browser_version: '11.0',
+        os: 'OS X',
+        os_version: 'High Sierra',
+        resolution: '1024x768',
+      };
 
-    await testPageWitCapabilities(capabilities);
-  }, 130000);
+      await testPageWitCapabilities(capabilities);
+    }, 130000);
 
-  test.skip('android', async () => {
-    // Input capabilities
-    const capabilities = {
-      browserName: 'android',
-      device: 'Samsung Galaxy S8',
-      real_mobile: 'true',
-      os_version: '7.0',
-    };
+    test.skip('android', async () => {
+      // Input capabilities
+      const capabilities = {
+        browserName: 'android',
+        device: 'Samsung Galaxy S8',
+        real_mobile: 'true',
+        os_version: '7.0',
+      };
 
-    await testPageWitCapabilities(capabilities);
-  }, 130000);
+      await testPageWitCapabilities(capabilities);
+    }, 130000);
+  } else {
+    test('it just works', () => {
+      expect(1).toBe(1);
+    });
+  }
 });

packages/app/integration-tests/tests/__image_snapshots__/sebn6-snap.png

@@ -38,10 +38,22 @@ const SANDBOXES = [
   '31kn7voz4q', // cxjs
   'zw9zjy0683', // aurelia
   'zx22owojr3', // vue v-slot test
-  '4888omqqz7', // material-ui https://github.com/codesandbox/codesandbox-client/issues/1741
+  '4888omqqz7', // material-ui https://github.com/codesandbox/codesandbox-client/issues/1741,
+  'sebn6', // babel plugin dynamically downloaded
+  'utmms', // babel plugin pragmatic-jsx which requires other babel plugin
 ];
 const SANDBOXES_REPO = 'codesandbox/integration-sandboxes';
 
+// Logic for parallelizing the tests
+const PARALLEL_NODES = Number.parseInt(process.env.CIRCLE_NODE_TOTAL, 10) || 1;
+const PARALLEL_INDEX = Number.parseInt(process.env.CIRCLE_NODE_INDEX, 10) || 0;
+
+const batchSize = Math.floor(SANDBOXES.length / PARALLEL_NODES);
+const sandboxesToTest = SANDBOXES.slice(
+  batchSize * PARALLEL_INDEX,
+  batchSize * (PARALLEL_INDEX + 1)
+);
+
 function pageLoaded(page) {
   return new Promise(async resolve => {
     await page.exposeFunction('__puppeteer__', () => {
@@ -110,7 +122,7 @@ describe('sandboxes', () => {
     browser.close();
   });
 
-  SANDBOXES.forEach(sandbox => {
+  sandboxesToTest.forEach(sandbox => {
     const id = sandbox.id || sandbox;
     const threshold = sandbox.threshold || 0.01;
 

packages/app/integration-tests/tests/__image_snapshots__/utmms-snap.png

@@ -156,9 +156,9 @@
     "normalizr": "^3.2.3",
     "onigasm": "^2.2.1",
     "ot": "^0.0.15",
-    "overmind": "^20.0.0",
+    "overmind": "^20.1.0-1572182984474",
     "overmind-devtools": "^19.0.0",
-    "overmind-react": "^21.0.0",
+    "overmind-react": "^21.1.0-1572182984474",
     "phoenix": "^1.3.0",
     "postcss": "^6.0.9",
     "postcss-selector-parser": "^2.2.3",

packages/app/integration-tests/tests/sandboxes.test.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import {
   Container,
+  Cube,
   DeployAnimationContainer,
+  DeployText,
   GitHubLogo,
-  Cube,
   OpaqueLogo,
-  DeployText,
   Result,
 } from './elements';
 
 interface IGitProgressProps {
-  result: string;
+  result: string | null;
   message: string;
 }
 

packages/app/package.json

@@ -19,6 +19,8 @@ export const searchMounted: AsyncAction = withLoadApp();
 
 export const codesadboxMounted: AsyncAction = withLoadApp();
 
+export const genericPageMounted: AsyncAction = withLoadApp();
+
 export const cliMounted: AsyncAction = withLoadApp(
   async ({ state, actions }) => {
     if (state.user) {
@@ -72,7 +74,6 @@ type ModalName =
   | 'netlifyLogs'
   | 'newSandbox'
   | 'preferences'
-  | 'privacyServerWarning'
   | 'share'
   | 'searchDependencies'
   | 'signInForTemplates';