type=module; update dependencies

.github/workflows/node.js.yml

@@ -15,7 +15,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [14.x]
 
     steps:
     - uses: actions/checkout@v2

CONTRIBUTING.md

@@ -25,10 +25,8 @@ This should open http://localhost:8008/ where you can browse the tests.
 Plot has both unit tests and snapshot tests.
 
 **Unit tests** live in `test` and have the `-test.js` extension. These tests are
-written using [Tape](https://github.com/substack/tape) (more precisely,
-[tape-await](https://github.com/mbostock/tape-await) for easier async testing).
-Generally speaking, unit tests make specific assertions about the behavior of
-Plot’s internals and helper methods.
+written using [Mocha](https://mochajs.org). Generally speaking, unit tests make
+specific assertions about the behavior of Plot’s internals and helper methods.
 
 **Snapshot tests** live in `test/plots`; these also serve as examples of how to
 use the Plot API. Each snapshot test defines a plot by exporting a default async

package.json

@@ -7,10 +7,16 @@
     "url": "https://observablehq.com"
   },
   "license": "ISC",
-  "main": "dist/plot.cjs.js",
+  "type": "module",
+  "main": "src/index.js",
+  "module": "src/index.js",
   "jsdelivr": "dist/plot.umd.min.js",
   "unpkg": "dist/plot.umd.min.js",
-  "module": "src/index.js",
+  "exports": {
+    "require": "./dist/plot.cjs.js",
+    "umd": "./dist/plot.umd.min.js",
+    "default": "./src/index.js"
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/observablehq/plot.git"
@@ -20,35 +26,38 @@
     "src/**/*.js"
   ],
   "scripts": {
-    "bundle": "rm -rf dist && rollup -c",
-    "test": "mkdir -p test/output && tape -r ./esm.js -r esm -r module-alias/register 'test/**/*-test.js' | tap-dot && node -r ./esm.js -r esm -r module-alias/register test/plot.js | tap-dot && eslint src test",
-    "prepublishOnly": "yarn bundle",
+    "test": "mkdir -p test/output && mocha -r module-alias/register 'test/**/*-test.js' && mocha -r module-alias/register test/plot.js && eslint src test",
+    "prepublishOnly": "rm -rf dist && rollup -c",
     "postpublish": "git push && git push --tags",
     "dev": "snowpack dev"
   },
   "_moduleAliases": {
     "@observablehq/plot": "./src/index.js"
   },
+  "sideEffects": false,
   "devDependencies": {
     "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^11.2.1",
+    "@rollup/plugin-node-resolve": "^13.0.4",
     "clean-css": "^5.1.1",
     "eslint": "^7.12.1",
-    "esm": "^3.2.25",
-    "htl": "^0.2.5",
+    "htl": "^0.3.0",
     "js-beautify": "^1.13.0",
     "jsdom": "^16.4.0",
     "jsesc": "^3.0.2",
+    "mocha": "^9.0.3",
     "module-alias": "^2.2.2",
     "rollup": "^2.32.1",
     "rollup-plugin-terser": "^7.0.2",
-    "snowpack": "^3.0.11",
-    "tap-dot": "^2.0.0",
-    "tape": "^4.13.3",
-    "tape-await": "^0.1.2"
+    "snowpack": "^3.0.11"
   },
   "dependencies": {
-    "d3": "^6.7.0",
+    "d3": "^7.0.0",
     "isoformat": "^0.1.0"
+  },
+  "engines": {
+    "node": ">=12"
+  },
+  "publishConfig": {
+    "registry": "https://npm.pkg.github.com"
   }
 }

snowpack.config.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   alias: {
     "@observablehq/plot": "./src/index.js"
   },

test/.eslintrc.json

@@ -0,0 +1,5 @@
+{
+  "env": {
+    "mocha": true
+  }
+}

test/marks/area-test.js

@@ -1,132 +1,132 @@
 import * as Plot from "@observablehq/plot";
 import {curveLinear, curveStep} from "d3";
-import tape from "tape-await";
+import assert from "assert";
 
-tape("area(data, options) has the expected defaults", test => {
+it("area(data, options) has the expected defaults", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1"});
-  test.strictEqual(area.data, undefined);
-  // test.strictEqual(area.transform, undefined);
-  test.deepEqual(area.channels.map(c => c.name), ["x1", "y1"]);
-  test.deepEqual(area.channels.map(c => c.value), ["0", "1"]);
-  test.deepEqual(area.channels.map(c => c.scale), ["x", "y"]);
-  test.strictEqual(area.curve, curveLinear);
-  test.strictEqual(area.fill, undefined);
-  test.strictEqual(area.fillOpacity, undefined);
-  test.strictEqual(area.stroke, undefined);
-  test.strictEqual(area.strokeWidth, undefined);
-  test.strictEqual(area.strokeOpacity, undefined);
-  test.strictEqual(area.strokeLinejoin, undefined);
-  test.strictEqual(area.strokeLinecap, undefined);
-  test.strictEqual(area.strokeMiterlimit, undefined);
-  test.strictEqual(area.strokeDasharray, undefined);
-  test.strictEqual(area.mixBlendMode, undefined);
-});
-
-tape("area(data, {x1, y1, y2}) specifies an optional y2 channel", test => {
+  assert.strictEqual(area.data, undefined);
+  // assert.strictEqual(area.transform, undefined);
+  assert.deepStrictEqual(area.channels.map(c => c.name), ["x1", "y1"]);
+  assert.deepStrictEqual(area.channels.map(c => c.value), ["0", "1"]);
+  assert.deepStrictEqual(area.channels.map(c => c.scale), ["x", "y"]);
+  assert.strictEqual(area.curve, curveLinear);
+  assert.strictEqual(area.fill, undefined);
+  assert.strictEqual(area.fillOpacity, undefined);
+  assert.strictEqual(area.stroke, undefined);
+  assert.strictEqual(area.strokeWidth, undefined);
+  assert.strictEqual(area.strokeOpacity, undefined);
+  assert.strictEqual(area.strokeLinejoin, undefined);
+  assert.strictEqual(area.strokeLinecap, undefined);
+  assert.strictEqual(area.strokeMiterlimit, undefined);
+  assert.strictEqual(area.strokeDasharray, undefined);
+  assert.strictEqual(area.mixBlendMode, undefined);
+});
+
+it("area(data, {x1, y1, y2}) specifies an optional y2 channel", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", y2: "2"});
   const y2 = area.channels.find(c => c.name === "y2");
-  test.strictEqual(y2.value, "2");
-  test.strictEqual(y2.scale, "y");
+  assert.strictEqual(y2.value, "2");
+  assert.strictEqual(y2.scale, "y");
 });
 
-tape("area(data, {x1, x2, y1}) specifies an optional x2 channel", test => {
+it("area(data, {x1, x2, y1}) specifies an optional x2 channel", () => {
   const area = Plot.area(undefined, {x1: "0", x2: "1", y1: "2"});
   const x2 = area.channels.find(c => c.name === "x2");
-  test.strictEqual(x2.value, "1");
-  test.strictEqual(x2.scale, "x");
+  assert.strictEqual(x2.value, "1");
+  assert.strictEqual(x2.scale, "x");
 });
 
-tape("area(data, {z}) specifies an optional z channel", test => {
+it("area(data, {z}) specifies an optional z channel", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", z: "2"});
   const z = area.channels.find(c => c.name === "z");
-  test.strictEqual(z.value, "2");
-  test.strictEqual(z.scale, undefined);
+  assert.strictEqual(z.value, "2");
+  assert.strictEqual(z.scale, undefined);
 });
 
-tape("area(data, {title}) specifies an optional title channel", test => {
+it("area(data, {title}) specifies an optional title channel", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", title: "2"});
   const title = area.channels.find(c => c.name === "title");
-  test.strictEqual(title.value, "2");
-  test.strictEqual(title.scale, undefined);
+  assert.strictEqual(title.value, "2");
+  assert.strictEqual(title.scale, undefined);
 });
 
-tape("area(data, {fill}) allows fill to be a constant color", test => {
+it("area(data, {fill}) allows fill to be a constant color", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", fill: "red"});
-  test.strictEqual(area.fill, "red");
+  assert.strictEqual(area.fill, "red");
 });
 
-tape("area(data, {fill}) allows fill to be null", test => {
+it("area(data, {fill}) allows fill to be null", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", fill: null});
-  test.strictEqual(area.fill, "none");
+  assert.strictEqual(area.fill, "none");
 });
 
-tape("area(data, {fill}) allows fill to be a variable color", test => {
+it("area(data, {fill}) allows fill to be a variable color", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", fill: "x"});
-  test.strictEqual(area.fill, undefined);
+  assert.strictEqual(area.fill, undefined);
   const fill = area.channels.find(c => c.name === "fill");
-  test.strictEqual(fill.value, "x");
-  test.strictEqual(fill.scale, "color");
+  assert.strictEqual(fill.value, "x");
+  assert.strictEqual(fill.scale, "color");
 });
 
-tape("area(data, {fill}) implies a default z channel if fill is variable", test => {
+it("area(data, {fill}) implies a default z channel if fill is variable", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", fill: "2", stroke: "3"}); // fill takes priority
   const z = area.channels.find(c => c.name === "z");
-  test.strictEqual(z.value, "2");
-  test.strictEqual(z.scale, undefined);
+  assert.strictEqual(z.value, "2");
+  assert.strictEqual(z.scale, undefined);
 });
 
-tape("area(data, {stroke}) allows stroke to be a constant color", test => {
+it("area(data, {stroke}) allows stroke to be a constant color", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", stroke: "red"});
-  test.strictEqual(area.stroke, "red");
+  assert.strictEqual(area.stroke, "red");
 });
 
-tape("area(data, {stroke}) allows stroke to be null", test => {
+it("area(data, {stroke}) allows stroke to be null", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", stroke: null});
-  test.strictEqual(area.stroke, undefined);
+  assert.strictEqual(area.stroke, undefined);
 });
 
-tape("area(data, {stroke}) allows stroke to be a variable color", test => {
+it("area(data, {stroke}) allows stroke to be a variable color", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", stroke: "x"});
-  test.strictEqual(area.stroke, undefined);
+  assert.strictEqual(area.stroke, undefined);
   const stroke = area.channels.find(c => c.name === "stroke");
-  test.strictEqual(stroke.value, "x");
-  test.strictEqual(stroke.scale, "color");
+  assert.strictEqual(stroke.value, "x");
+  assert.strictEqual(stroke.scale, "color");
 });
 
-tape("area(data, {stroke}) implies a default z channel if stroke is variable", test => {
+it("area(data, {stroke}) implies a default z channel if stroke is variable", () => {
   const area = Plot.area(undefined, {x1: "0", y1: "1", stroke: "2"});
   const z = area.channels.find(c => c.name === "z");
-  test.strictEqual(z.value, "2");
-  test.strictEqual(z.scale, undefined);
+  assert.strictEqual(z.value, "2");
+  assert.strictEqual(z.scale, undefined);
 });
 
-tape("area(data, {curve}) specifies a named curve or function", test => {
-  test.strictEqual(Plot.area(undefined, {x1: "0", y1: "1", curve: "step"}).curve, curveStep);
-  test.strictEqual(Plot.area(undefined, {x1: "0", y1: "1", curve: curveStep}).curve, curveStep);
+it("area(data, {curve}) specifies a named curve or function", () => {
+  assert.strictEqual(Plot.area(undefined, {x1: "0", y1: "1", curve: "step"}).curve, curveStep);
+  assert.strictEqual(Plot.area(undefined, {x1: "0", y1: "1", curve: curveStep}).curve, curveStep);
 });
 
-tape("areaX(data, {x, y}) defaults x1 to zero, x2 to x, and y1 to y", test => {
+it("areaX(data, {x, y}) defaults x1 to zero, x2 to x, and y1 to y", () => {
   const area = Plot.areaX(undefined, {x: "0", y: "1"});
   const x1 = area.channels.find(c => c.name === "x1");
-  // test.strictEqual(x1.value, 0);
-  test.strictEqual(x1.scale, "x");
+  // assert.strictEqual(x1.value, 0);
+  assert.strictEqual(x1.scale, "x");
   const x2 = area.channels.find(c => c.name === "x2");
-  test.strictEqual(x2.value.label, "0");
-  test.strictEqual(x2.scale, "x");
+  assert.strictEqual(x2.value.label, "0");
+  assert.strictEqual(x2.scale, "x");
   const y1 = area.channels.find(c => c.name === "y1");
-  test.strictEqual(y1.value, "1");
-  test.strictEqual(y1.scale, "y");
+  assert.strictEqual(y1.value, "1");
+  assert.strictEqual(y1.scale, "y");
 });
 
-tape("areaY(data, {x, y}) defaults x1 to x, y1 to zero, and y2 to y", test => {
+it("areaY(data, {x, y}) defaults x1 to x, y1 to zero, and y2 to y", () => {
   const area = Plot.areaY(undefined, {x: "0", y: "1"});
   const x1 = area.channels.find(c => c.name === "x1");
-  test.strictEqual(x1.value, "0");
-  test.strictEqual(x1.scale, "x");
+  assert.strictEqual(x1.value, "0");
+  assert.strictEqual(x1.scale, "x");
   const y1 = area.channels.find(c => c.name === "y1");
-  // test.strictEqual(y1.value, 0);
-  test.strictEqual(y1.scale, "y");
+  // assert.strictEqual(y1.value, 0);
+  assert.strictEqual(y1.scale, "y");
   const y2 = area.channels.find(c => c.name === "y2");
-  test.strictEqual(y2.value.label, "1");
-  test.strictEqual(y2.scale, "y");
+  assert.strictEqual(y2.value.label, "1");
+  assert.strictEqual(y2.scale, "y");
 });