Merge branch 'main' into update-yarn

* main: meta: split Companion CI between Node.js legacy and supported versions (#3776) doc: update bundler recommendation (#3763) Setup Cypress Dashboard (#3691) @uppy/image-editor: remove CJS-interop hack in the source code (#3778) meta: remove `vite-plugin-jsx-commonjs` plugin on dev env (#3749) Add onKeyPress event handler to capture e.shiftKey, unavailable in onChange (#3768) meta: remove CJS-related hack in `build:locale-pack` script (#3764) meta: prepare test files for lint rule hardening (#3761) meta: prepare internal script files for lint rune hardening (#3760)
transloadit · May 24, 2022 · eb01b12 · eb01b12
2 parents 41082ff + e3c4339
commit eb01b12
Show file tree

Hide file tree

Showing 98 changed files with 144 additions and 386 deletions.
diff --git a/.github/workflows/companion.yml b/.github/workflows/companion.yml
@@ -7,17 +7,15 @@ on:
     types: [ opened, synchronize, reopened ]
 
 jobs:
-  test:
-    name: Unit tests
+  test-legacy:
+    name: Unit tests (legacy)
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [10.20.1, 12.x, 14.x, 16.x, 17.x]
+        node-version: [10.20.1, 12.x, 17.x]
     steps:
       - name: Checkout sources
         uses: actions/checkout@v3
-      - name: Install Corepack if needed
-        run: corepack -v || npm install -g corepack
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path
         run: echo "::set-output name=dir::$(corepack yarn config get cacheFolder)"
@@ -33,8 +31,10 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: ${{matrix.node-version}}
+      - name: Install Corepack if needed
+        run: corepack -v || npm install -g corepack
       - name: Install dependencies
-        run: corepack yarn install --immutable
+        run: corepack yarn@3.1.1 install --no-immutable
         env:
           # Necessary for Node.js v10.x
           NODE_OPTIONS: --experimental-worker
@@ -45,3 +45,32 @@ jobs:
           # Necessary for Node.js v10.x
           NODE_OPTIONS: --experimental-worker
           YARN_IGNORE_NODE: 1
+  test:
+    name: Unit tests
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [14.x, 16.x, 18.x]
+    steps:
+      - name: Checkout sources
+        uses: actions/checkout@v3
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(corepack yarn config get cacheFolder)"
+
+      - uses: actions/cache@v3
+        id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{matrix.node-version}}
+      - name: Install dependencies
+        run: corepack yarn install --immutable
+      - name: Run tests
+        run: corepack yarn run test:companion
+
diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
@@ -49,6 +49,7 @@ jobs:
           VITE_TRANSLOADIT_SECRET: ${{secrets.TRANSLOADIT_SECRET}}
           VITE_TRANSLOADIT_TEMPLATE: ${{secrets.TRANSLOADIT_TEMPLATE}}
           VITE_TRANSLOADIT_SERVICE_URL: ${{secrets.TRANSLOADIT_SERVICE_URL}}
+          CYPRESS_RECORD_KEY: ${{secrets.CYPRESS_RECORD_KEY}}
       - name: Remove 'pending end-to-end tests' label
         # Remove the 'pending end-to-end tests' label if tests ran successfully
         if: github.event.pull_request && contains(github.event.pull_request.labels.*.name, 'pending end-to-end tests')

diff --git a/.yarn/patches/babel-plugin-transform-commonjs-npm-1.1.6-0007fa2809 b/.yarn/patches/babel-plugin-transform-commonjs-npm-1.1.6-0007fa2809
diff --git a/README.md b/README.md
@@ -67,9 +67,7 @@ const uppy = new Uppy({ autoProceed: false })
 $ npm install @uppy/core @uppy/dashboard @uppy/tus
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
-Add CSS [uppy.min.css](https://releases.transloadit.com/uppy/v2.10.0/uppy.min.css), either to your HTML page’s `<head>` or include in JS, if your bundler of choice supports it — transforms and plugins are available for Browserify and Webpack.
+Add CSS [uppy.min.css](https://releases.transloadit.com/uppy/v2.10.0/uppy.min.css), either to your HTML page’s `<head>` or include in JS, if your bundler of choice supports it.
 
 Alternatively, you can also use a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object.
 

diff --git a/bin/build-lib.js b/bin/build-lib.js
@@ -25,6 +25,7 @@ const META_FILES = [
 // So, if we are being built using rollup, this require() won't have a `.default` property.
 const esPackagesThatNeedSpecialTreatmentForRollupInterop = [
   'get-form-data',
+  'cropperjs',
 ]
 
 function lastModified (file, createParentDir = false) {

diff --git a/bin/update-contributors.mjs b/bin/update-contributors.mjs
@@ -1,7 +1,9 @@
 #!/usr/bin/env node
 
 import { spawn } from 'node:child_process'
+import { Buffer } from 'node:buffer'
 import fs from 'node:fs/promises'
+import process from 'node:process'
 
 const README_FILE_NAME = new URL('../README.md', import.meta.url)
 

diff --git a/e2e/cypress.json b/e2e/cypress.json
@@ -1,4 +1,5 @@
 {
+  "projectId": "mcijsj",
   "baseUrl": "http://localhost:1234",
   "defaultCommandTimeout": 16000
 }
diff --git a/e2e/package.json b/e2e/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "client:start": "parcel clients/index.html",
     "cypress:open": "cypress open",
-    "cypress:headless": "cypress run",
+    "cypress:headless": "cypress run --record",
     "generate-test": "yarn node generate-test.mjs"
   },
   "dependencies": {

diff --git a/package.json b/package.json
@@ -203,7 +203,6 @@
     "@types/react": "^17",
     "@types/webpack-dev-server": "^4",
     "[email protected]": "patch:npm-auth-to-token@npm:1.0.0#.yarn/patches/npm-auth-to-token-npm-1.0.0-c288ce201f",
-    "[email protected]": "patch:babel-plugin-transform-commonjs@npm:1.1.6#.yarn/patches/babel-plugin-transform-commonjs-npm-1.1.6-0007fa2809",
     "exifr": "patch:exifr@npm:7.1.3#.yarn/patches/exifr-npm-7.1.3-e3f1c7a57d"
   }
 }
diff --git a/packages/@uppy/angular/projects/uppy/angular/README.md b/packages/@uppy/angular/projects/uppy/angular/README.md
@@ -20,8 +20,6 @@ Uppy is being developed by the folks at [Transloadit](https://transloadit.com),
 $ npm install @uppy/angular --save
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/audio/README.md b/packages/@uppy/audio/README.md
@@ -24,8 +24,6 @@ uppy.use(Audio)
 $ npm install @uppy/audio
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/audio/package.json b/packages/@uppy/audio/package.json
@@ -29,6 +29,9 @@
     "@uppy/utils": "workspace:^",
     "preact": "^10.5.13"
   },
+  "devDependencies": {
+    "@jest/globals": "^27.4.2"
+  },
   "peerDependencies": {
     "@uppy/core": "workspace:^"
   },

diff --git a/packages/@uppy/audio/src/formatSeconds.test.js b/packages/@uppy/audio/src/formatSeconds.test.js
@@ -1,3 +1,4 @@
+import { describe, expect, it } from '@jest/globals'
 import formatSeconds from './formatSeconds.js'
 
 describe('formatSeconds', () => {

diff --git a/packages/@uppy/audio/src/supportsMediaRecorder.test.js b/packages/@uppy/audio/src/supportsMediaRecorder.test.js
@@ -1,22 +1,23 @@
 /* eslint-disable max-classes-per-file */
+import { describe, expect, it } from '@jest/globals'
 import supportsMediaRecorder from './supportsMediaRecorder.js'
 
 describe('supportsMediaRecorder', () => {
   it('should return true if MediaRecorder is supported', () => {
-    global.MediaRecorder = class MediaRecorder {
+    globalThis.MediaRecorder = class MediaRecorder {
       start () {} // eslint-disable-line
     }
     expect(supportsMediaRecorder()).toEqual(true)
   })
 
   it('should return false if MediaRecorder is not supported', () => {
-    global.MediaRecorder = undefined
+    globalThis.MediaRecorder = undefined
     expect(supportsMediaRecorder()).toEqual(false)
 
-    global.MediaRecorder = class MediaRecorder {}
+    globalThis.MediaRecorder = class MediaRecorder {}
     expect(supportsMediaRecorder()).toEqual(false)
 
-    global.MediaRecorder = class MediaRecorder {
+    globalThis.MediaRecorder = class MediaRecorder {
       foo () {} // eslint-disable-line
     }
     expect(supportsMediaRecorder()).toEqual(false)

diff --git a/packages/@uppy/aws-s3-multipart/README.md b/packages/@uppy/aws-s3-multipart/README.md
@@ -30,8 +30,6 @@ uppy.use(AwsS3Multipart, {
 $ npm install @uppy/aws-s3-multipart
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/aws-s3-multipart/src/index.test.js b/packages/@uppy/aws-s3-multipart/src/index.test.js
@@ -1,4 +1,4 @@
-import { describe, expect, it, jest } from '@jest/globals'
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
 
 import 'whatwg-fetch'
 import nock from 'nock'
@@ -97,7 +97,7 @@ describe('AwsS3Multipart', () => {
         source: 'jest',
         name: 'multitest.dat',
         type: 'application/octet-stream',
-        data: new File([Buffer.alloc(fileSize)], {
+        data: new File([new Uint8Array(fileSize)], {
           type: 'application/octet-stream',
         }),
       })
@@ -138,7 +138,7 @@ describe('AwsS3Multipart', () => {
         source: 'jest',
         name: 'multitest.dat',
         type: 'application/octet-stream',
-        data: new File([Buffer.alloc(fileSize)], {
+        data: new File([new Uint8Array(fileSize)], {
           type: 'application/octet-stream',
         }),
       })
@@ -217,7 +217,7 @@ describe('AwsS3Multipart', () => {
         source: 'jest',
         name: 'multitest.dat',
         type: 'application/octet-stream',
-        data: new File([Buffer.alloc(fileSize)], {
+        data: new File([new Uint8Array(fileSize)], {
           type: 'application/octet-stream',
         }),
       })

diff --git a/packages/@uppy/aws-s3/README.md b/packages/@uppy/aws-s3/README.md
@@ -31,8 +31,6 @@ uppy.use(AwsS3, {
 $ npm install @uppy/aws-s3
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/aws-s3/package.json b/packages/@uppy/aws-s3/package.json
@@ -29,6 +29,7 @@
     "nanoid": "^3.1.25"
   },
   "devDependencies": {
+    "@jest/globals": "^27.4.2",
     "whatwg-fetch": "3.6.2"
   },
   "peerDependencies": {

diff --git a/packages/@uppy/aws-s3/src/index.test.js b/packages/@uppy/aws-s3/src/index.test.js
@@ -1,3 +1,4 @@
+import { describe, expect, it } from '@jest/globals'
 import 'whatwg-fetch'
 import Core from '@uppy/core'
 import AwsS3 from './index.js'

diff --git a/packages/@uppy/aws-s3/src/isXml.test.js b/packages/@uppy/aws-s3/src/isXml.test.js
@@ -1,3 +1,4 @@
+import { describe, expect, it } from '@jest/globals'
 import isXml from './isXml.js'
 
 describe('AwsS3', () => {

diff --git a/packages/@uppy/box/README.md b/packages/@uppy/box/README.md
@@ -31,8 +31,6 @@ uppy.use(Box, {
 $ npm install @uppy/box
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/companion-client/src/Socket.test.js b/packages/@uppy/companion-client/src/Socket.test.js
@@ -1,4 +1,4 @@
-import { jest, describe, it, expect } from '@jest/globals'
+import { afterEach, beforeEach, jest, describe, it, expect } from '@jest/globals'
 import UppySocket from './Socket.js'
 
 describe('Socket', () => {
@@ -11,7 +11,7 @@ describe('Socket', () => {
     webSocketCloseSpy = jest.fn()
     webSocketSendSpy = jest.fn()
 
-    global.WebSocket = class WebSocket {
+    globalThis.WebSocket = class WebSocket {
       constructor (target) {
         webSocketConstructorSpy(target)
       }
@@ -36,7 +36,7 @@ describe('Socket', () => {
     }
   })
   afterEach(() => {
-    global.WebSocket = undefined
+    globalThis.WebSocket = undefined
   })
 
   it('should expose a class', () => {

diff --git a/packages/@uppy/core/README.md b/packages/@uppy/core/README.md
@@ -32,8 +32,6 @@ uppy.use(SomePlugin)
 $ npm install @uppy/core
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/dashboard/README.md b/packages/@uppy/dashboard/README.md
@@ -39,8 +39,6 @@ uppy.use(Dashboard, {
 $ npm install @uppy/dashboard
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/dashboard/src/index.test.js b/packages/@uppy/dashboard/src/index.test.js
@@ -1,4 +1,4 @@
-import { describe, it, expect } from '@jest/globals'
+import { afterAll, beforeAll, describe, it, expect } from '@jest/globals'
 
 import Core from '@uppy/core'
 import StatusBarPlugin from '@uppy/status-bar'

diff --git a/packages/@uppy/drag-drop/README.md b/packages/@uppy/drag-drop/README.md
@@ -31,8 +31,6 @@ uppy.use(DragDrop, {
 $ npm install @uppy/drag-drop
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/dropbox/README.md b/packages/@uppy/dropbox/README.md
@@ -31,8 +31,6 @@ uppy.use(Dropbox, {
 $ npm install @uppy/dropbox
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/facebook/README.md b/packages/@uppy/facebook/README.md
@@ -31,8 +31,6 @@ uppy.use(Facebook, {
 $ npm install @uppy/facebook
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation

diff --git a/packages/@uppy/file-input/README.md b/packages/@uppy/file-input/README.md
@@ -31,8 +31,6 @@ uppy.use(FileInput, {
 $ npm install @uppy/file-input
 ```
 
-We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
-
 Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
 
 ## Documentation