update all the things

.github/workflows/ci.yml

@@ -5,7 +5,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [10.x, 12.x, 14.x]
+        node-version: [12.x, 14.x, 16.x]
     steps:
       - uses: actions/checkout@v2
       - name: Use Node.js ${{ matrix.node-version }}

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "semi": false,
+  "trailingComma": "none",
+  "arrowParens": "avoid"
+}

.vscode/launch.json

@@ -14,7 +14,8 @@
         "--watch"
       ],
       "runtimeArgs": [
-        "--nolazy"
+        "--nolazy",
+        "--experimental-vm-modules"
       ],
       "console": "integratedTerminal",
       "internalConsoleOptions": "neverOpen"

README.md

@@ -1,9 +1,8 @@
 # Hyperapp FX
 
-[![Build Status](https://travis-ci.org/okwolf/hyperapp-fx.svg?branch=master)](https://travis-ci.org/okwolf/hyperapp-fx)
-[![codecov](https://codecov.io/gh/okwolf/hyperapp-fx/branch/master/graph/badge.svg)](https://codecov.io/gh/okwolf/hyperapp-fx)
-[![npm](https://img.shields.io/npm/v/hyperapp-fx.svg)](https://www.npmjs.org/package/hyperapp-fx)
-[![Slack](https://hyperappjs.herokuapp.com/badge.svg)](https://hyperappjs.herokuapp.com "Join us")
+[![Build Status](https://github.com/okwolf/hyperapp-fx/actions/workflows/ci.yml/badge.svg)](https://github.com/okwolf/hyperapp-fx/actions)
+[![Codecov](https://img.shields.io/codecov/c/github/okwolf/hyperapp-fx/master.svg)](https://codecov.io/gh/okwolf/hyperapp-fx)
+[![npm](https://img.shields.io/npm/v/hyperapp-fx.svg?maxAge=2592000?style=plastic)](https://www.npmjs.com/package/hyperapp-fx)
 
 A handy set of effects for use with [Hyperapp](https://github.com/jorgebucaran/hyperapp).
 
@@ -35,7 +34,7 @@ More [examples](https://github.com/okwolf/hyperapp-playground) are available to
 ## Installation
 
 <pre>
-npm i <a href=https://www.npmjs.com/package/hyperapp-fx/v/next>hyperapp-fx@next</a>
+npm i <a href=https://www.npmjs.com/package/hyperapp-fx>hyperapp-fx</a>
 </pre>
 
 Then with a module bundler like [Rollup](https://rollupjs.org) or [Webpack](https://webpack.js.org), use as you would anything else.
@@ -44,10 +43,10 @@ Then with a module bundler like [Rollup](https://rollupjs.org) or [Webpack](http
 import { Http } from "hyperapp-fx"
 ```
 
-If you don't want to set up a build environment, you can download Hyperapp FX from a CDN like [unpkg.com](https://unpkg.com/hyperapp-fx@next) and it will be globally available through the <samp>window.hyperappFx</samp> object. We support all ES5-compliant browsers, including Internet Explorer 10 and above. Use of the [`Http`](api.md#module_fx.exports.Http) effect requires a polyfill.
+If you don't want to set up a build environment, you can download Hyperapp FX from a CDN like [unpkg.com](https://unpkg.com/hyperapp-fx) and it will be globally available through the <samp>window.hyperappFx</samp> object. We support all ES5-compliant browsers, including Internet Explorer 10 and above. Use of the [`Http`](api.md#module_fx.exports.Http) effect requires a polyfill.
 
 ```html
-<script src="https://unpkg.com/hyperapp-fx@next"></script>
+<script src="https://unpkg.com/hyperapp-fx"></script>
 ```
 
 ## [API documentation](api.md)

package.json

@@ -3,49 +3,42 @@
   "version": "2.0.0-beta.2",
   "description": "Effects for use with Hyperapp",
   "main": "dist/hyperappFx.js",
+  "type": "module",
   "module": "src/index.js",
   "peerDependencies": {
     "hyperapp": "^2.0.0"
   },
   "devDependencies": {
-    "@babel/preset-env": "=7.4.2",
-    "eslint": "=5.15.3",
-    "eslint-plugin-compat": "=3.0.1",
-    "jest": "=24.5.0",
-    "jsdoc-to-markdown": "=4.0.1",
-    "jsdom": "=14.0.0",
-    "prettier": "=1.16.4",
-    "rollup": "=1.7.2",
-    "uglify-js": "=3.5.2"
+    "eslint": "=8.8.0",
+    "eslint-plugin-compat": "=4.0.2",
+    "jest": "=27.5.0",
+    "jsdoc-to-markdown": "=7.1.1",
+    "jsdom": "=19.0.0",
+    "prettier": "=2.5.1",
+    "rollup": "=2.67.0",
+    "uglify-js": "=3.15.0"
   },
   "scripts": {
     "clean": "npx --ignore-existing --quiet rimraf coverage dist node_modules",
-    "format": "prettier --write '{src,test}/**/*.js'",
-    "format:check": "prettier --list-different {src,test}/**/*.js",
+    "format": "prettier --write \"{src,test}/**/*.js\"",
+    "format:check": "prettier --list-different \"{src,test}/**/*.js\"",
     "lint": "eslint {src,test}/**/*.js",
-    "test": "jest --coverage --no-cache",
+    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --coverage --no-cache",
     "doc": "jsdoc2md src/fx/*.js src/subs/*.js > api.md",
     "bundle": "rollup -i src/index.js -o dist/hyperappFx.js -m -f umd -n hyperappFx",
     "minify": "uglifyjs dist/hyperappFx.js -o dist/hyperappFx.js -mc pure_funcs=['Object.defineProperty'] --source-map includeSources,url=hyperappFx.js.map",
     "check": "npm run format:check && npm run lint && npm t",
     "build": "npm run check && npm run bundle && npm run minify",
     "release:dry": "npm run clean && npm i && npm run check && npm run build && npm run doc",
-    "release": "node release"
-  },
-  "prettier": {
-    "semi": false
-  },
-  "babel": {
-    "presets": [
-      "@babel/env"
-    ]
+    "release": "node --experimental-json-modules release"
   },
   "eslintConfig": {
     "extends": "eslint:recommended",
     "plugins": [
       "compat"
     ],
     "parserOptions": {
+      "ecmaVersion": "latest",
       "sourceType": "module"
     },
     "env": {
@@ -64,6 +57,10 @@
   "browserslist": [
     "IE 10"
   ],
+  "jest": {
+    "testEnvironment": "jsdom",
+    "transform": {}
+  },
   "author": "Wolfgang Wedemeyer <wolf@okwolf.com>",
   "license": "MIT",
   "repository": "okwolf/hyperapp-fx",

release.js

@@ -1,32 +1,37 @@
-const { execSync } = require("child_process");
-const { version } = require("./package");
-const exec = command => execSync(command, { encoding: "utf8" }).trim();
+import { execSync } from "child_process"
+import packageJson from "./package.json"
+import { fileURLToPath } from "url"
+import { dirname } from "path"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+const exec = command => execSync(command, { encoding: "utf8" }).trim()
 
 const exitWithError = error => {
-  process.stderr.write(`\x1b[1;31m${error}\x1b[0m\n\n`);
-  process.exit(1);
-};
+  process.stderr.write(`\x1b[1;31m${error}\x1b[0m\n\n`)
+  process.exit(1)
+}
 
-const gitBranchName = exec("git rev-parse --abbrev-ref HEAD");
+const gitBranchName = exec("git rev-parse --abbrev-ref HEAD")
 if (gitBranchName !== "master") {
-  exitWithError("please checkout the master branch to make a release!");
+  exitWithError("please checkout the master branch to make a release!")
 }
 
-const workingCopyChanges = exec("git status --porcelain");
+const workingCopyChanges = exec("git status --porcelain")
 if (workingCopyChanges) {
-  exitWithError("please commit your changes before making a release!");
+  exitWithError("please commit your changes before making a release!")
 }
 
-const tagExists = exec(`git tag -l "${version}"`);
+const tagExists = exec(`git tag -l "${packageJson.version}"`)
 if (tagExists) {
-  exitWithError(`${version} has already been released!`);
+  exitWithError(`${packageJson.version} has already been released!`)
 }
 
 execSync(
-  `npm run release:dry && git tag ${version} && git push && git push --tags && npm publish`,
+  `npm run release:dry && git tag ${packageJson.version} && git push && git push --tags && npm publish`,
   {
     shell: true,
     stdio: "inherit",
     cwd: __dirname
   }
-);
+)

src/fx/Cookie.js

@@ -8,7 +8,7 @@ function nameEncoder(value) {
   return value
     .toString()
     .split("")
-    .map(function(c) {
+    .map(function (c) {
       return validCookieNameChars.indexOf(c) > -1 ? c : encodeURIComponent(c)
     })
     .join("")
@@ -18,15 +18,15 @@ function valueEncoder(value) {
   return value
     .toString()
     .split("")
-    .map(function(c) {
+    .map(function (c) {
       return validCookieValueChars.indexOf(c) > -1 ? c : encodeURIComponent(c)
     })
     .join("")
 }
 
 function writeCookie(name, value, attributes) {
   var attrs = Object.keys(attributes)
-    .map(function(k) {
+    .map(function (k) {
       return k + "=" + attributes[k]
     })
     .join(";")
@@ -35,7 +35,7 @@ function writeCookie(name, value, attributes) {
 
 function readCookieEffect(dispatch, props) {
   var cookies = document.cookie.split("; ")
-  var cookie = cookies.find(function(c) {
+  var cookie = cookies.find(function (c) {
     return c.substr(0, c.indexOf("=")) === props.nameEncoder(props.name)
   })
   if (cookie) {
@@ -96,7 +96,7 @@ export function ReadCookie(props) {
         converter:
           props.converter || props.json
             ? JSON.parse
-            : function(v) {
+            : function (v) {
                 return v
               },
         decoder: props.decoder || decodeURIComponent
@@ -142,7 +142,7 @@ export function WriteCookie(props) {
         converter:
           props.converter || props.json
             ? JSON.stringify
-            : function(v) {
+            : function (v) {
                 return v
               }
       },

src/fx/Debounce.js

@@ -1,6 +1,6 @@
 var debounceTimeouts = []
 function debounceEffect(dispatch, props) {
-  var timeout = debounceTimeouts.find(function(nextTimeout) {
+  var timeout = debounceTimeouts.find(function (nextTimeout) {
     return nextTimeout[0] === props.action
   })
   if (!timeout) {
@@ -10,7 +10,7 @@ function debounceEffect(dispatch, props) {
     clearTimeout(timeout[1])
   }
 
-  timeout[1] = setTimeout(function() {
+  timeout[1] = setTimeout(function () {
     dispatch(props.action)
   }, props.wait)
 }

src/fx/Geo.js

@@ -1,9 +1,9 @@
 function getCurrentPositionEffect(dispatch, props) {
   navigator.geolocation.getCurrentPosition(
-    function(result) {
+    function (result) {
       return dispatch(props.action, result)
     },
-    function(error) {
+    function (error) {
       return dispatch(props.error, error)
     },
     props.options

src/fx/Http.js

@@ -2,19 +2,19 @@ import { assign } from "../utils.js"
 
 function httpEffect(dispatch, props) {
   fetch(props.url, props.options)
-    .then(function(response) {
+    .then(function (response) {
       if (!response.ok) {
         throw response
       }
       return response
     })
-    .then(function(response) {
+    .then(function (response) {
       return response[props.response]()
     })
-    .then(function(result) {
+    .then(function (result) {
       dispatch(props.action, result)
     })
-    .catch(function(error) {
+    .catch(function (error) {
       dispatch(props.error, error)
     })
 }

src/fx/Merge.js

@@ -1,7 +1,7 @@
 import { assign } from "../utils.js"
 
 function mergeEffect(dispatch, props) {
-  dispatch(function(state) {
+  dispatch(function (state) {
     return assign(state, props.action(state))
   })
 }

src/fx/Throttle.js

@@ -1,6 +1,6 @@
 var throttleLocks = []
 function throttleEffect(dispatch, props) {
-  var lock = throttleLocks.find(function(nextLock) {
+  var lock = throttleLocks.find(function (nextLock) {
     return nextLock[0] === props.action
   })
   if (!lock) {
@@ -11,7 +11,7 @@ function throttleEffect(dispatch, props) {
   if (!lock[1]) {
     dispatch(props.action)
     lock[1] = true
-    setTimeout(function() {
+    setTimeout(function () {
       lock[1] = false
     }, props.rate)
   }

src/subs/Animation.js

@@ -7,7 +7,7 @@ function animationEffect(dispatch, action) {
   }
 
   cancelId = requestAnimationFrame(frame)
-  return function() {
+  return function () {
     cancelAnimationFrame(cancelId)
   }
 }

src/subs/Geo.js

@@ -1,15 +1,15 @@
 function watchPositionEffect(dispatch, props) {
   var cancelId = navigator.geolocation.watchPosition(
-    function(result) {
+    function (result) {
       return dispatch(props.action, result)
     },
-    function(error) {
+    function (error) {
       return dispatch(props.error, error)
     },
     props.options
   )
 
-  return function() {
+  return function () {
     navigator.geolocation.clearWatch(cancelId)
   }
 }

src/subs/Keyboard.js

@@ -10,7 +10,7 @@ function keyboardEffect(dispatch, props) {
   var removeDown = props.downs ? removeListenerForEvent("keydown") : null
   var removeUp = props.ups ? removeListenerForEvent("keyup") : null
   var removePress = props.presses ? removeListenerForEvent("keypress") : null
-  return function() {
+  return function () {
     removeDown && removeDown()
     removeUp && removeUp()
     removePress && removePress()

src/subs/Time.js

@@ -3,7 +3,7 @@ import { makeDispatchTime } from "../utils.js"
 function intervalEffect(dispatch, props) {
   var dispatchTime = makeDispatchTime(dispatch, props)
   var everyInterval = setInterval(dispatchTime, props.every)
-  return function() {
+  return function () {
     everyInterval && clearInterval(everyInterval)
   }
 }

src/subs/WebSocket.js

@@ -44,12 +44,12 @@ function webSocketListenEffect(dispatch, props) {
     connection.listeners.push(removeClose)
   }
 
-  return function() {
+  return function () {
     removeListen && removeListen()
     removeError && removeError()
     removeOpen && removeOpen()
     removeClose && removeClose()
-    connection.listeners = connection.listeners.filter(function(listener) {
+    connection.listeners = connection.listeners.filter(function (listener) {
       return (
         listener !== removeListen &&
         listener !== removeError &&

src/utils.js

@@ -9,13 +9,13 @@ export function assign(source, assignments) {
 export function makeRemoveListener(attachTo, dispatch, action, eventName) {
   var handler = dispatch.bind(null, action)
   attachTo.addEventListener(eventName, handler)
-  return function() {
+  return function () {
     attachTo.removeEventListener(eventName, handler)
   }
 }
 
 export function makeDispatchTime(dispatch, props) {
-  return function() {
+  return function () {
     dispatch(props.action, props.asDate ? new Date() : performance.now())
   }
 }