chore: Migrate CJS to ESM (#42070)

package.json

@@ -94,7 +94,7 @@
     "tsc": "tsc --noEmit",
     "site:test": "jest --config .jest.site.js --no-cache --force-exit",
     "test-image": "jest --config .jest.image.js --no-cache -i -u",
-    "argos": "node ./scripts/argos-upload.js",
+    "argos": "ts-node --esm --project tsconfig.node.json scripts/argos-upload.ts",
     "version": "ts-node --esm --project tsconfig.node.json scripts/generate-version.ts",
     "install-react-16": "npm i --no-save --legacy-peer-deps react@16 react-dom@16 @testing-library/react@12",
     "install-react-17": "npm i --no-save --legacy-peer-deps react@17 react-dom@17 @testing-library/react@12",
@@ -158,6 +158,7 @@
   "devDependencies": {
     "@ant-design/tools": "^17.0.0",
     "@antv/g6": "^4.8.5",
+    "@argos-ci/core": "^0.8.0",
     "@babel/eslint-plugin": "^7.19.1",
     "@dnd-kit/core": "^6.0.7",
     "@dnd-kit/sortable": "^7.0.2",

scripts/argos-upload.js → scripts/argos-upload.ts

@@ -1,17 +1,15 @@
 // Thanks to material-ui ❤️
 // Create chunks for Argos: https://github.com/mui/material-ui/pull/23518
 // https://github.com/mui/material-ui/blob/af81aae3b292ed180e7652a665fad1be2b38a7b3/scripts/pushArgos.js
-const util = require('util');
+import argos from '@argos-ci/core';
-const glob = require('fast-glob');
+import childProcess from 'child_process';
-const lodashChunk = require('lodash/chunk');
+import glob from 'fast-glob';
-const childProcess = require('child_process');
+import lodashChunk from 'lodash/chunk';
-
+import util from 'util';
-// eslint-disable-next-line import/no-unresolved
-const argos = require('@argos-ci/core');
 
 const execFileNode = util.promisify(childProcess.execFile);
 
-function execFile(command, args) {
+function execFile(command: string, args: string[]) {
   return execFileNode(command, args, {
     cwd: process.cwd(),
     env: process.env,
@@ -23,19 +21,21 @@ const screenshotsBase = 'imageSnapshots';
 const screenshotsChunks = `imageSnapshots-chunks`;
 const BATCH_SIZE = 200;
 
-async function cpToTemp(screenshot, target) {
+async function cpToTemp(screenshot: string, target: string) {
   await execFile('mkdir', ['-p', target]);
   await execFile('cp', [screenshot, target]);
 }
 
 async function run() {
   const screenshots = await glob(`${screenshotsBase}/**/*`);
-  const chunks = lodashChunk(screenshots, BATCH_SIZE);
+  const chunks = lodashChunk<string>(screenshots, BATCH_SIZE);
 
   await Promise.all(
     chunks.map((chunk, chunkIndex) =>
       Promise.all(
-        chunk.map((screenshot) => cpToTemp(screenshot, `${screenshotsChunks}/${chunkIndex}`)),
+        chunk.map<Promise<void>>((screenshot) =>
+          cpToTemp(screenshot, `${screenshotsChunks}/${chunkIndex}`),
+        ),
       ),
     ),
   );
@@ -47,7 +47,7 @@ async function run() {
       token: process.env.ARGOS_TOKEN,
       parallel: {
         total: chunks.length,
-        nonce: process.env.ARGOS_PARALLEL_NONCE || process.env.CIRCLE_BUILD_NUM,
+        nonce: process.env.ARGOS_PARALLEL_NONCE || process.env.CIRCLE_BUILD_NUM || '',
       },
     });
     // eslint-disable-next-line no-console -- pipe stdout