refactor: Data context cleanup & IPC bindings for data push (#18357)

scripts/gulp/tasks/gulpCypress.ts

@@ -4,8 +4,6 @@
  *
  * @summary Gulp tasks to run the Cypress app.
  */
-// @ts-expect-error - no types
-import rp from '@cypress/request-promise'
 import chokidar from 'chokidar'
 import path from 'path'
 import pDefer from 'p-defer'
@@ -33,23 +31,6 @@ export async function killExistingCypress () {
   child.on('exit', dfd.resolve)
 }
 
-export async function waitForTestGraphQLApi () {
-  let i = 0
-
-  // eslint-disable-next-line no-constant-condition
-  while (true) {
-    try {
-      return await rp.get('http://localhost:52300/graphql?query={__typename}')
-    } catch (e) {
-      if (i++ > 10) {
-        throw e
-      }
-
-      await new Promise((resolve) => setTimeout(resolve, 2000))
-    }
-  }
-}
-
 export async function openCypressLaunchpad () {
   return spawnCypressWithMode('open', 'dev', ENV_VARS.DEV_OPEN, ['--project', monorepoPaths.pkgLaunchpad])
 }
@@ -70,23 +51,6 @@ export async function runCypressProd () {
   return spawnCypressWithMode('run', 'prod', ENV_VARS.PROD)
 }
 
-/**------------------------------------------------------------------------
- *                             Testing Tasks
- * Building and running the Cypress app and graphql server for testing.
- *  * startCypressForTest - Start the Cypress server, but without watching
- *  * runCypressAgainstDist - Serve the dist'd frontend over file://
- *------------------------------------------------------------------------**/
-
-// Use the GQL Test Port (52300 by default, defined in ./gulp/gulpConstants)
-// Spawns Cypress in "Test Cypress within Cypress" mode
-export async function startCypressForTest () {
-  return spawnCypressWithMode('open', 'test', ENV_VARS.E2E_TEST_TARGET)
-}
-
-export async function runCypressAgainstDist () {
-  return spawnCypressWithMode('run', 'test', ENV_VARS.E2E_TEST_TARGET)
-}
-
 /**------------------------------------------------------------------------
  *                         Start and Watch Utils
  *  * spawnCypressWithMode - Formerly known as: `node ./scripts/cypress.js run`
@@ -126,6 +90,7 @@ async function spawnCypressWithMode (
     ...process.env,
     ...env,
     LAUNCHPAD: '1',
+    TS_NODE_COMPILER: 'typescript-cached-transpile',
   }
 
   return await forked(`cy:${mode}:${type}`, pathToCli, [mode, ...argv], {
@@ -142,15 +107,6 @@ async function spawnCypressWithMode (
  *------------------------------------------------------------------------**/
 
 export async function startCypressWatch () {
-  const watcher = chokidar.watch([
-    'packages/{graphql,data-context}/src/**/*.{js,ts}',
-    'packages/server/lib/graphql/**/*.{js,ts}',
-  ], {
-    cwd: monorepoPaths.root,
-    ignored: /\.gen\.ts/,
-    ignoreInitial: true,
-  })
-
   let isClosing = false
   let isRestarting = false
   let child: ChildProcess | null = null
@@ -194,15 +150,26 @@ export async function startCypressWatch () {
     isRestarting = false
   }
 
-  watcher.on('add', restartServer)
-  watcher.on('change', restartServer)
+  if (getGulpGlobal('shouldWatch')) {
+    const watcher = chokidar.watch([
+      'packages/{graphql,data-context}/src/**/*.{js,ts}',
+      'packages/server/lib/**/*.{js,ts}',
+    ], {
+      cwd: monorepoPaths.root,
+      ignored: /\.gen\.ts/,
+      ignoreInitial: true,
+    })
+
+    watcher.on('add', restartServer)
+    watcher.on('change', restartServer)
+
+    process.on('beforeExit', () => {
+      isClosing = true
+      watcher.close()
+    })
+  }
 
   await startCypressWithListeners()
-
-  process.on('beforeExit', () => {
-    isClosing = true
-    watcher.close()
-  })
 }
 
 export function wrapRunWithExit (proc: ChildProcess) {

scripts/gulp/tasks/gulpMakePackage.ts

@@ -68,9 +68,8 @@ export async function makePackage () {
               'test-integration': 'mocha -r @packages/ts/register test/integration/**/*.spec.ts --config ./test/.mocharc.js --exit',
             } : {}),
           },
-          dependencies: {
-            'tslib': '2.3.0',
-          },
+          files: ['src'],
+          dependencies: {},
           devDependencies: results.scaffoldTests ? {
             'mocha': '7.0.1',
             'chai': '4.2.0',
@@ -94,7 +93,6 @@ export async function makePackage () {
             'script',
           ],
           'compilerOptions': {
-            'importHelpers': true,
             'strict': true,
             'allowJs': false,
             'rootDir': 'src',

scripts/gulp/tasks/gulpRegistry.ts

@@ -1,6 +1,7 @@
 import type { ChildProcess } from 'child_process'
 import pDefer from 'p-defer'
 import treeKill from 'tree-kill'
+import gulp from 'gulp'
 
 const childProcesses = new Set<ChildProcess>()
 const exitedPids = new Set<number>()
@@ -53,6 +54,19 @@ export async function exitAllProcesses () {
 
 process.stdin.resume() //so the program will not close instantly
 
+const _task = gulp.task
+
+// So that we auto-exit on single tasks
+// @ts-expect-error
+gulp.task = function () {
+  if (arguments.length === 1 && typeof arguments[0] === 'function') {
+    process.stdin.pause()
+  }
+
+  // @ts-ignore
+  return _task.apply(this, arguments)
+}
+
 export async function exitAfterAll () {
   process.stdin.pause()
 }

scripts/gulp/tasks/gulpVite.ts

@@ -22,26 +22,18 @@ import { AllSpawnableApps, spawned, spawnUntilMatch } from '../utils/childProces
  *------------------------------------------------------------------------**/
 
 export function viteApp () {
-  const GQL_PORT = ENV_VARS.DEV.CYPRESS_INTERNAL_GQL_PORT
   const APP_PORT = ENV_VARS.DEV.CYPRESS_INTERNAL_VITE_APP_PORT
 
   return spawnViteDevServer('vite-app', `yarn vite --port ${APP_PORT} --base /__vite__/`, {
     cwd: monorepoPaths.pkgApp,
-    env: {
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-    },
   })
 }
 
 export function viteLaunchpad () {
-  const GQL_PORT = ENV_VARS.DEV.CYPRESS_INTERNAL_GQL_PORT
   const LAUNCHPAD_PORT = ENV_VARS.DEV.CYPRESS_INTERNAL_VITE_LAUNCHPAD_PORT
 
   return spawnViteDevServer('vite-launchpad', `yarn vite --port ${LAUNCHPAD_PORT}`, {
     cwd: monorepoPaths.pkgLaunchpad,
-    env: {
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-    },
   })
 }
 
@@ -85,7 +77,17 @@ export function viteBuildApp () {
     cwd: monorepoPaths.pkgApp,
     waitForExit: true,
     env: {
-      ...process.env,
+      // ...process.env,
+      NODE_ENV: 'production',
+    },
+  })
+}
+
+export function viteBuildAndWatchApp () {
+  return watchViteBuild('vite:build-watch-app', `yarn vite build --watch`, {
+    cwd: monorepoPaths.pkgApp,
+    env: {
+      // ...process.env,
       NODE_ENV: 'production',
     },
   })
@@ -95,10 +97,12 @@ export function viteBuildLaunchpad () {
   return spawned('vite:build-launchpad', `yarn vite build`, {
     cwd: monorepoPaths.pkgLaunchpad,
     waitForExit: true,
-    env: {
-      ...process.env,
-      NODE_ENV: 'production',
-    },
+  })
+}
+
+export function viteBuildAndWatchLaunchpad () {
+  return watchViteBuild('vite:build-watch-launchpad', `yarn vite build --watch`, {
+    cwd: monorepoPaths.pkgLaunchpad,
   })
 }
 
@@ -115,84 +119,3 @@ export function viteCleanLaunchpad () {
     waitForExit: true,
   })
 }
-
-/**------------------------------------------------------------------------
- *                             Testing Tasks
- * Build and serve the Vite frontend(s) as web apps on a static server.
- *  * viteBuildLaunchpadForTest
- *  * viteBuildAppForTest
- *  * serveBuiltLaunchpadForTest
- *  * serveBuiltAppForTest
- *------------------------------------------------------------------------**/
-
-// After running `serveBuiltLaunchpadForTest`, you're able to visit
-// `http://localhost:5555` to access the Launchpad frontend.
-export function serveBuiltLaunchpadForTest () {
-  return spawnUntilMatch('serve:launchpad-for-test', {
-    command: `yarn serve ./dist-e2e -p 5555`,
-    match: 'Accepting connections',
-    options: {
-      cwd: monorepoPaths.pkgLaunchpad,
-    },
-  })
-}
-
-export function viteBuildLaunchpadForTest () {
-  const GQL_PORT = ENV_VARS.E2E_TEST_TARGET.CYPRESS_INTERNAL_GQL_PORT
-
-  return spawned('vite:build-launchpad-for-test', `yarn vite build --outDir=./dist-e2e`, {
-    cwd: monorepoPaths.pkgLaunchpad,
-    waitForExit: true,
-    env: {
-      NODE_ENV: 'production',
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-    },
-  })
-}
-
-export async function viteBuildAndWatchLaunchpadForTest () {
-  const GQL_PORT = ENV_VARS.E2E_TEST_TARGET.CYPRESS_INTERNAL_GQL_PORT
-
-  return watchViteBuild('vite:build-watch-launchpad-for-test', `yarn vite build --watch --outDir=./dist-e2e`, {
-    cwd: monorepoPaths.pkgLaunchpad,
-    env: {
-      NODE_ENV: 'production',
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-    },
-  })
-}
-
-/**----------------------
- *todo    Implement E2E tests for the App.
- *------------------------**/
-
-export function viteBuildAppForTest () {
-  const GQL_PORT = ENV_VARS.E2E_TEST_TARGET.CYPRESS_INTERNAL_GQL_PORT
-
-  return spawned('vite:build-app-for-test', `yarn vite build --outDir=./dist-e2e`, {
-    cwd: monorepoPaths.pkgApp,
-    waitForExit: true,
-    env: {
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-      ...process.env,
-    },
-  })
-}
-
-export function serveBuiltAppForTest () {
-  return spawned('serve:app-for-test', `yarn serve ./dist-e2e -p 5556`, {
-    cwd: monorepoPaths.pkgApp,
-  })
-}
-
-export async function viteBuildAndWatchAppForTest () {
-  const GQL_PORT = ENV_VARS.E2E_TEST_TARGET.CYPRESS_INTERNAL_GQL_PORT
-
-  return watchViteBuild('vite:build-watch-app-for-test', `yarn vite build --watch --outDir=./dist-e2e`, {
-    cwd: monorepoPaths.pkgApp,
-    env: {
-      NODE_ENV: 'production',
-      VITE_CYPRESS_INTERNAL_GQL_PORT: GQL_PORT,
-    },
-  })
-}

scripts/gulp/tasks/gulpWebpack.ts

@@ -0,0 +1,70 @@
+import chalk from 'chalk'
+import { spawn } from 'child_process'
+import pDefer from 'p-defer'
+import { monorepoPaths } from '../monorepoPaths'
+import { addChildProcess } from './gulpRegistry'
+
+export function webpackRunner () {
+  return runWebpack({
+    cwd: monorepoPaths.pkgRunner,
+    prefix: 'webpack:runner',
+    args: ['-w'],
+  })
+}
+
+type RunWebpackCfg = {
+  cwd: string
+  prefix: string
+  args?: string[]
+  env?: object
+  devServer?: boolean
+}
+
+export async function runWebpack (cfg: RunWebpackCfg) {
+  const { cwd, args = [], env = process.env, devServer = false, prefix } = cfg
+  const dfd = pDefer()
+  const spawned = spawn(
+    devServer
+      ? './node_modules/.bin/webpack-dev-server'
+      : './node_modules/.bin/webpack',
+    args,
+    {
+      cwd,
+      env: {
+        ...(env || process.env),
+        FORCE_COLOR: '1',
+      },
+    },
+  )
+
+  addChildProcess(spawned)
+
+  spawned.stdout.on('data', (chunk) => {
+    process.stdout.write('\n')
+    String(chunk)
+    .split('\n')
+    .forEach((line) => {
+      if (
+        line.includes('Compiled successfully') ||
+          line.includes('Compiled with warnings') ||
+          line.includes('Failed to compile') ||
+          line.includes('Built at: ')
+      ) {
+        dfd.resolve({})
+      }
+
+      process.stdout.write(`${chalk.cyan(`${prefix}: `)}${line}\n`)
+    })
+  })
+
+  spawned.stderr.on('data', (chunk) => {
+    process.stderr.write('\n')
+    String(chunk)
+    .split('\n')
+    .forEach((line) => {
+      process.stderr.write(`${chalk.red(`${prefix}: `)}${line}\n`)
+    })
+  })
+
+  return dfd.promise
+}