Drop support for npm v7 and node up to v16

This commit is contained in:
bjoluc 2022-11-18 23:08:46 +01:00
parent 810ed7a3d1
commit 2e40d013d4
7 changed files with 42 additions and 52 deletions

5
.changeset/node.md Normal file
View File

@ -0,0 +1,5 @@
---
"@jspsych/config": major
---
Require at least Node.js v18 and npm v8

View File

@ -9,26 +9,23 @@ jobs:
runs-on: ubuntu-latest runs-on: ubuntu-latest
strategy: strategy:
matrix: matrix:
node: [14, 16] node: [18]
steps: steps:
- uses: actions/checkout@v2 - uses: actions/checkout@v3
- name: Setup Node.js ${{ matrix.node }} - name: Setup Node.js ${{ matrix.node }}
uses: actions/setup-node@v2 uses: actions/setup-node@v3
with: with:
node-version: ${{ matrix.node }} node-version: ${{ matrix.node }}
cache: npm cache: npm
- name: Install npm@v7
run: npm install -g npm@7
- name: Install dependencies - name: Install dependencies
run: npm ci run: npm ci
# Running this after `npm ci` because `npm ci` removes `node_modules`: # Running this after `npm ci` because `npm ci` removes `node_modules`:
- name: Download Turborepo cache - name: Download Turborepo cache
uses: actions/cache@v2 uses: actions/cache@v3
with: with:
path: node_modules/.cache/turbo path: node_modules/.cache/turbo
key: ${{ runner.os }}-node-${{ matrix.node }}-turbo-${{ hashFiles('node_modules/.cache/turbo') }} key: ${{ runner.os }}-node-${{ matrix.node }}-turbo-${{ hashFiles('node_modules/.cache/turbo') }}

View File

@ -16,29 +16,30 @@ jobs:
name: Release name: Release
runs-on: ubuntu-latest runs-on: ubuntu-latest
steps: steps:
- uses: actions/checkout@v2 - uses: actions/checkout@v3
- name: Setup Node.js 16 - name: Setup Node.js
uses: actions/setup-node@v2 uses: actions/setup-node@v3
with: with:
node-version: 16 node-version: 18
cache: npm cache: npm
- name: Install dependencies - name: Install dependencies
run: npm ci run: npm ci
- name: Download Turborepo cache - name: Download Turborepo cache
uses: actions/cache@v2 uses: actions/cache@v3
with: with:
path: node_modules/.cache/turbo path: node_modules/.cache/turbo
key: ${{ runner.os }}-node-16-turbo-${{ hashFiles('node_modules/.cache/turbo') }} key: ${{ runner.os }}-node-18-turbo-${{ hashFiles('node_modules/.cache/turbo') }}
restore-keys: | restore-keys: |
${{ runner.os }}-node-16-turbo- ${{ runner.os }}-node-18-turbo-
- name: Check types
run: npm run tsc
- name: Run tests - name: Run tests
run: npm run test -- --ci --maxWorkers=2 run: npm run test -- --ci --maxWorkers=2
env:
NODE_OPTIONS: "--max-old-space-size=4096" # Increase heap size for jest
- name: Create Release Pull Request or Publish Packages - name: Create Release Pull Request or Publish Packages
id: changesets id: changesets

View File

@ -9,9 +9,7 @@ In order to work on code in the jsPsych or the jspsych-contrib repository, it is
### Install Node.js ### Install Node.js
The jsPsych development setup requires Node.js >= v14 to be installed on your machine. The jsPsych development setup requires [Node.js](https://nodejs.org/en/) >= v18 to be installed on your machine.
We recommend that you [install version 16](https://nodejs.org/en/) since it includes version 7 of NPM (required for the workspaces feature that the jsPsych repositories use).
If you are bound to Node.js v14, make sure to install NPM v7 manually (via `npm install -g npm@7`).
### Clone the repository and install the dependencies ### Clone the repository and install the dependencies
@ -26,15 +24,12 @@ or
```sh ```sh
git clone https://github.com/jspsych/jspsych-contrib.git && cd jspsych-contrib git clone https://github.com/jspsych/jspsych-contrib.git && cd jspsych-contrib
``` ```
in a terminal. in a terminal.
Then run `npm install`. Then run `npm install`.
This will create a `node_modules` directory and install all the dependencies into it that are required to build and test jsPsych. This will create a `node_modules` directory and install all the dependencies into it that are required to build and test jsPsych.
!!! attention
It is important that `npm install` is only run in the root directory of the repository (due to the NPM workspaces feature).
If you accidentally ran `npm install` anywhere else, remove the `node_modules` directory and the `package-lock.json` file that were created at that location and run `npm install` in the root directory again.
!!! info !!! info
If you are running `npm install` in the core jsPsych repository, this will also execute the build chain for all packages in the jsPsych repository. If you are running `npm install` in the core jsPsych repository, this will also execute the build chain for all packages in the jsPsych repository.
This step may take a few minutes. This step may take a few minutes.
@ -44,7 +39,7 @@ This will create a `node_modules` directory and install all the dependencies int
A Node.js package is a directory that contains a `package.json` file describing it. A Node.js package is a directory that contains a `package.json` file describing it.
Most importantly, a `package.json` file lists other packages that the package depends on. Most importantly, a `package.json` file lists other packages that the package depends on.
The jsPsych and jspsych-contrib repositories use NPM *workspaces*. The jsPsych and jspsych-contrib repositories use NPM _workspaces_.
That means, running `npm install` in the repository root will install the dependencies for all packages in the `packages` directory. That means, running `npm install` in the repository root will install the dependencies for all packages in the `packages` directory.
The core jsPsych library and every jsPsych plugin or extension is laid out as an individual package. The core jsPsych library and every jsPsych plugin or extension is laid out as an individual package.
These packages are published to the [NPM registry](https://www.npmjs.com/) where they can be downloaded by NPM or any CDN (such as [unpkg](https://unpkg.com/)). These packages are published to the [NPM registry](https://www.npmjs.com/) where they can be downloaded by NPM or any CDN (such as [unpkg](https://unpkg.com/)).
@ -54,37 +49,36 @@ These packages are published to the [NPM registry](https://www.npmjs.com/) where
JsPsych comes with a build chain (specified in the `@jspsych/config` package) that can be executed by running `npm run build` in a package's directory. JsPsych comes with a build chain (specified in the `@jspsych/config` package) that can be executed by running `npm run build` in a package's directory.
The build chain will read the package (starting at its `src/index.ts` file) and create the following build artifacts in the package's `dist` directory: The build chain will read the package (starting at its `src/index.ts` file) and create the following build artifacts in the package's `dist` directory:
* **`index.js`** - **`index.js`**
This file contains everything from `index.ts`, but as plain JavaScript and bundled in a single file (i.e. without `import`ing files from the same package). This file contains everything from `index.ts`, but as plain JavaScript and bundled in a single file (i.e. without `import`ing files from the same package).
It is used by bundlers like [webpack](https://webpack.js.org/). It is used by bundlers like [webpack](https://webpack.js.org/).
* **`index.cjs`** - **`index.cjs`**
Like `index.js`, but using the old CommonJS standard to support backwards-compatible tools like the [Jest](https://jestjs.io/) testing framework. Like `index.js`, but using the old CommonJS standard to support tools like the [Jest](https://jestjs.io/) testing framework.
* **`index.browser.js`** - **`index.browser.js`**
This file, like `index.js`, contains the entire package as plain JavaScript, but this time wrapped in a function so that it can be included directly by browsers using the `<script>` tag. This file, like `index.js`, contains the entire package as plain JavaScript, but this time wrapped in a function so that it can be included directly by browsers using the `<script>` tag.
For plugins or extensions, the default export of a module (i.e. whatever statement comes after `export default` in the `index.ts` file) is assigned to a global variable. For plugins or extensions, the default export of a module (i.e. whatever statement comes after `export default` in the `index.ts` file) is assigned to a global variable.
The name of this global variable is specified in the package's `rollup.config.mjs` file, as a parameter to the `makeRollupConfig()` function. The name of this global variable is specified in the package's `rollup.config.mjs` file, as a parameter to the `makeRollupConfig()` function.
Hence, for instance, including the `index.browser.js` file from the `plugin-html-keyboard-response` package would assign the `HtmlKeyboardResponsePlugin` class to the global `jsPsychHtmlKeyboardResponse` variable. Hence, for instance, including the `index.browser.js` file from the `plugin-html-keyboard-response` package would assign the `HtmlKeyboardResponsePlugin` class to the global `jsPsychHtmlKeyboardResponse` variable.
Because the code in `index.browser.js` looks very similar to the `index.ts` code but is fully supported by modern web browsers, all examples in the `examples` directory reference the `index.browser.js` files so users can also modify the source code directly without running the build chain. Because the code in `index.browser.js` looks very similar to the `index.ts` code but is fully supported by modern web browsers, all examples in the `examples` directory reference the `index.browser.js` files so users can also modify the source code directly without running the build chain.
* **`index.browser.min.js`** - **`index.browser.min.js`**
There are different versions of the JavaScript language specification and not all web browsers and browser versions support all JavaScript features. There are different versions of the JavaScript language specification and not all web browsers and browser versions support all JavaScript features.
That's why the jsPsych build chain uses [Babel](https://babeljs.io/) to translate the source files into code that a majority of web browsers can understand. That's why the jsPsych build chain uses [esbuild](https://esbuild.github.io/) to translate the source files into code that a majority of web browsers can understand.
The result of this operation is `index.browser.min.js`. The result of this operation is `index.browser.min.js`.
It behaves just like `index.browser.js`, but adds support for older browsers by substituting new JavaScript features using older ones. It behaves just like `index.browser.js`, but adds support for older browsers by substituting new JavaScript features using older ones.
Because this is the recommended build artifact for production usage (and is automatically served by unpkg), the code in `index.browser.min.js` is also processed by [Terser](https://terser.org/) to reduce its size and speed up experiment loading times. Because this is the recommended build artifact for production use (and is automatically served by unpkg), the code in `index.browser.min.js` is also minified to reduce its size and speed up experiment loading times.
* **`*.js.map`** - **`*.js.map`**
When debugging code in a browser (especially `index.browser.min.js`, which is not easily readable due to Terser and Babel), it is important to be able to read the original source code in the debugger. When debugging code in a browser (especially `index.browser.min.js`, which is minified and hence not easily readable), it is important to be able to read the original source code in the debugger.
For every build artifact, there is a `.map` file which contains a mapping of the generated code to the original source code. For every build artifact, there is a `.map` file which contains a mapping of the generated code to the original source code.
Browsers automatically read these `.map` files and display the original code in their debuggers instead of the generated one. Browsers automatically read these `.map` files and display the original code in their debuggers instead of the generated one.
* **`*.d.ts`** - **`index.d.ts`**
The `.d.ts` files contain the TypeScript type definitions that would otherwise be lost during compilation to plain JavaScript. This file contains the TypeScript type definitions that would otherwise be lost during compilation to plain JavaScript.
They are read by Typescript and editors when a package is imported into another TypeScript project. They are read by Typescript and editors when a package is imported into another TypeScript project.
## Testing ## Testing
Automated code testing for jsPsych is implemented with [Jest](https://jestjs.io/). Automated code testing for jsPsych is implemented with [Jest](https://jestjs.io/).
@ -95,4 +89,4 @@ Tests for the core jsPsych library are located in `/packages/jspsych/tests`.
Tests for plugins and extensions are located in the `/src` folder of the corresponding package. Test files for plugins and extensions are named `index.spec.ts`. Tests for plugins and extensions are located in the `/src` folder of the corresponding package. Test files for plugins and extensions are named `index.spec.ts`.
There are helper functions for testing in `/packages/jspsych/tests/utils.ts`. We recommend looking at other test files to observe conventions for testing. There are helper functions for testing in `/packages/test-utils`. We recommend looking at other test files to observe conventions for testing.

7
package-lock.json generated
View File

@ -17,10 +17,6 @@
"prettier": "^2.7.1", "prettier": "^2.7.1",
"prettier-plugin-import-sort": "^0.0.7", "prettier-plugin-import-sort": "^0.0.7",
"turbo": "^1.6.3" "turbo": "^1.6.3"
},
"engines": {
"node": ">=14.0.0",
"npm": ">=7.0.0"
} }
}, },
"node_modules/@ampproject/remapping": { "node_modules/@ampproject/remapping": {
@ -17405,7 +17401,8 @@
"typescript": "4.6.4" "typescript": "4.6.4"
}, },
"engines": { "engines": {
"node": ">=14.0.0" "node": ">=18",
"npm": ">=8"
} }
}, },
"packages/extension-mouse-tracking": { "packages/extension-mouse-tracking": {

View File

@ -19,11 +19,6 @@
"docs:deploy": "poetry install && poetry run mike deploy -u", "docs:deploy": "poetry install && poetry run mike deploy -u",
"docs:serve": "poetry install && poetry run mike serve" "docs:serve": "poetry install && poetry run mike serve"
}, },
"engines": {
"node": ">=14.0.0",
"npm": ">=7.0.0"
},
"packageManager": "npm@8.3.1",
"devDependencies": { "devDependencies": {
"@changesets/changelog-github": "^0.4.7", "@changesets/changelog-github": "^0.4.7",
"@changesets/cli": "^2.25.2", "@changesets/cli": "^2.25.2",

View File

@ -21,7 +21,8 @@
"./tsconfig.contrib.json": "./tsconfig.contrib.json" "./tsconfig.contrib.json": "./tsconfig.contrib.json"
}, },
"engines": { "engines": {
"node": ">=14.0.0" "node": ">=18",
"npm": ">=8"
}, },
"repository": { "repository": {
"type": "git", "type": "git",