it's been a while

Author: okwolf

.github/CODEOWNERS

@@ -0,0 +1 @@
+* @okwolf

.github/workflows/ci.yml

@@ -2,18 +2,18 @@ name: CI
 on: [push, pull_request]
 jobs:
   test:
-    runs-on: ubuntu-latest
+    runs-on: ${{ matrix.os }}
     strategy:
       matrix:
-        node-version: [12.x, 14.x, 16.x]
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        node: [18, 20, 22]
     steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - uses: actions/checkout@v4
+      - name: Use Node.js ${{ matrix.node }}
+        uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
-      - run: |
-          npm i -g codecov
-          npm i
-          npm run check
-          codecov
+          node-version: ${{ matrix.node }}
+      - run: npm run release:dry
+      - uses: codecov/codecov-action@v4
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}

.prettierrc

@@ -11,22 +11,22 @@ A handy set of effects for use with [Hyperapp](https://github.com/jorgebucaran/h
 Here's a taste of how to use a common effect for making HTTP requests. The app displays inspiring quotes about design, fetching a new quote each time the user clicks on the current one. Go ahead and [try it online here](https://codepen.io/okwolf/pen/vPbMaa?editors=0010).
 
 ```js
-import { app, h, text } from "hyperapp"
-import { Http } from "hyperapp-fx"
+import { app, h, text } from "hyperapp";
+import { Http } from "hyperapp-fx";
 
 const GetQuote = () => [
   "...",
   Http({
     url: "https://api.quotable.io/random",
     action: (_, { content }) => content
   })
-]
+];
 
 app({
   init: "Click here for quotes",
   view: quote => h("h1", { onclick: GetQuote }, text(quote)),
   node: document.getElementById("app")
-})
+});
 ```
 
 More [examples](https://github.com/okwolf/hyperapp-playground) are available to show other effects in action.
@@ -40,13 +40,13 @@ npm i <a href=https://www.npmjs.com/package/hyperapp-fx>hyperapp-fx</a>
 Then with a module bundler like [Rollup](https://rollupjs.org) or [Webpack](https://webpack.js.org), use as you would anything else.
 
 ```js
-import { Http } from "hyperapp-fx"
+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) 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 import Hyperapp FX from a CDN like [esm.sh](https://esm.sh/hyperapp-fx). We support all modern browsers used by at least 1% of the world.
 
-```html
-<script src="https://unpkg.com/hyperapp-fx"></script>
+```js
+import { Http } from "https://esm.sh/hyperapp-fx";
 ```
 
 ## [API documentation](api.md)

README.md

@@ -0,0 +1,34 @@
+import js from "@eslint/js";
+import globals from "globals";
+import compat from "eslint-plugin-compat";
+
+export default [
+  js.configs.recommended,
+  {
+    plugins: { compat },
+    rules: {
+      "no-use-before-define": "error",
+      "no-var": "error",
+      "prefer-const": "error",
+      "compat/compat": "error"
+    }
+  },
+  {
+    files: ["src/**/*.js", "test/**/*.js"],
+    languageOptions: {
+      globals: globals.browser
+    }
+  },
+  {
+    files: ["test/**/*.js", "*.js"],
+    languageOptions: {
+      globals: globals.node
+    }
+  },
+  {
+    files: ["test/**/*.js"],
+    languageOptions: {
+      globals: globals.jest
+    }
+  }
+];

eslint.config.js

@@ -2,60 +2,38 @@
   "name": "hyperapp-fx",
   "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": {
-    "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"
+    "eslint": "=8.57.0",
+    "eslint-plugin-compat": "=5.0.0",
+    "jest": "=29.7.0",
+    "jest-environment-jsdom": "=29.7.0",
+    "jsdoc-to-markdown": "=8.0.1",
+    "prettier": "=3.3.2",
+    "rollup": "=4.18.0",
+    "uglify-js": "=3.18.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\"",
-    "lint": "eslint {src,test}/**/*.js",
+    "clean": "npx --quiet rimraf coverage dist node_modules",
+    "format": "prettier --write \"**/*.js\"",
+    "format:check": "prettier --list-different \"**/*.js\"",
+    "lint": "eslint . --ignore-pattern dist",
     "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:dry": "npm run clean && npm i && npm run check && npm run doc",
     "release": "node --experimental-json-modules release"
   },
-  "eslintConfig": {
-    "extends": "eslint:recommended",
-    "plugins": [
-      "compat"
-    ],
-    "parserOptions": {
-      "ecmaVersion": "latest",
-      "sourceType": "module"
-    },
-    "env": {
-      "browser": true
-    },
-    "rules": {
-      "no-use-before-define": "error",
-      "compat/compat": "error"
-    },
-    "settings": {
-      "polyfills": [
-        "fetch"
-      ]
-    }
+  "prettier": {
+    "trailingComma": "none",
+    "arrowParens": "avoid"
   },
   "browserslist": [
-    "IE 10"
+    "> 1%"
   ],
   "jest": {
     "testEnvironment": "jsdom",

package.json

@@ -1,30 +1,30 @@
-import { execSync } from "child_process"
-import packageJson from "./package.json"
-import { fileURLToPath } from "url"
-import { dirname } from "path"
+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 __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 "${packageJson.version}"`)
+const tagExists = exec(`git tag -l "${packageJson.version}"`);
 if (tagExists) {
-  exitWithError(`${packageJson.version} has already been released!`)
+  exitWithError(`${packageJson.version} has already been released!`);
 }
 
 execSync(
@@ -34,4 +34,4 @@ execSync(
     stdio: "inherit",
     cwd: __dirname
   }
-)
+);

release.js

@@ -1,6 +1,6 @@
 function consoleEffect(_, args) {
   // eslint-disable-next-line no-console
-  console.log.apply(null, args)
+  console.log.apply(null, args);
 }
 
 /**
@@ -22,5 +22,5 @@ function consoleEffect(_, args) {
  * ]
  */
 export function Console() {
-  return [consoleEffect, arguments]
+  return [consoleEffect, arguments];
 }

src/fx/Console.js

@@ -1,63 +1,63 @@
-import { assign } from "../utils.js"
+import { assign } from "../utils.js";
 
-var validCookieNameChars =
-  "abdefghijklmnqrstuvxyzABDEFGHIJKLMNQRSTUVXYZ0123456789!#$%&'*+-.^_`|~"
-var validCookieValueChars = validCookieNameChars + "()/:<>?@[]{}"
+const validCookieNameChars =
+  "abdefghijklmnqrstuvxyzABDEFGHIJKLMNQRSTUVXYZ0123456789!#$%&'*+-.^_`|~";
+const validCookieValueChars = validCookieNameChars + "()/:<>?@[]{}";
 
 function nameEncoder(value) {
   return value
     .toString()
     .split("")
     .map(function (c) {
-      return validCookieNameChars.indexOf(c) > -1 ? c : encodeURIComponent(c)
+      return validCookieNameChars.indexOf(c) > -1 ? c : encodeURIComponent(c);
     })
-    .join("")
+    .join("");
 }
 
 function valueEncoder(value) {
   return value
     .toString()
     .split("")
     .map(function (c) {
-      return validCookieValueChars.indexOf(c) > -1 ? c : encodeURIComponent(c)
+      return validCookieValueChars.indexOf(c) > -1 ? c : encodeURIComponent(c);
     })
-    .join("")
+    .join("");
 }
 
 function writeCookie(name, value, attributes) {
-  var attrs = Object.keys(attributes)
+  const attrs = Object.keys(attributes)
     .map(function (k) {
-      return k + "=" + attributes[k]
+      return k + "=" + attributes[k];
     })
-    .join(";")
-  document.cookie = name + "=" + value + (attrs ? ";" + attrs : "")
+    .join(";");
+  document.cookie = name + "=" + value + (attrs ? ";" + attrs : "");
 }
 
 function readCookieEffect(dispatch, props) {
-  var cookies = document.cookie.split("; ")
-  var cookie = cookies.find(function (c) {
-    return c.substr(0, c.indexOf("=")) === props.nameEncoder(props.name)
-  })
+  const cookies = document.cookie.split("; ");
+  const cookie = cookies.find(function (c) {
+    return c.substr(0, c.indexOf("=")) === props.nameEncoder(props.name);
+  });
   if (cookie) {
-    var dispatchProps = assign({}, props.props || {})
+    const dispatchProps = assign({}, props.props || {});
     dispatchProps[props.prop || "value"] = props.converter(
       props.decoder(cookie.substr(props.nameEncoder(props.name).length + 1))
-    )
-    dispatch(props.action, dispatchProps)
+    );
+    dispatch(props.action, dispatchProps);
   }
 }
 
 function writeCookieEffect(dispatch, props) {
-  var name = (props.nameEncoder || nameEncoder)(props.name)
-  var value = (props.encoder || valueEncoder)(props.converter(props.value))
-  var attributes = {}
+  const name = (props.nameEncoder || nameEncoder)(props.name);
+  const value = (props.encoder || valueEncoder)(props.converter(props.value));
+  const attributes = {};
   if (props.ttl)
-    props.expires = new Date(new Date().getTime() + props.ttl * 1000)
-  if (props.path) attributes.path = props.path
-  if (props.domain) attributes.domain = props.domain
-  if (props.expires) attributes.expires = props.expires.toUTCString()
+    props.expires = new Date(new Date().getTime() + props.ttl * 1000);
+  if (props.path) attributes.path = props.path;
+  if (props.domain) attributes.domain = props.domain;
+  if (props.expires) attributes.expires = props.expires.toUTCString();
 
-  writeCookie(name, value, attributes)
+  writeCookie(name, value, attributes);
 }
 
 /**
@@ -97,13 +97,13 @@ export function ReadCookie(props) {
           props.converter || props.json
             ? JSON.parse
             : function (v) {
-                return v
+                return v;
               },
         decoder: props.decoder || decodeURIComponent
       },
       props
     )
-  ]
+  ];
 }
 
 /**
@@ -143,12 +143,12 @@ export function WriteCookie(props) {
           props.converter || props.json
             ? JSON.stringify
             : function (v) {
-                return v
+                return v;
               }
       },
       props
     )
-  ]
+  ];
 }
 
 /**
@@ -170,5 +170,5 @@ export function WriteCookie(props) {
  */
 
 export function DeleteCookie(props) {
-  return WriteCookie(assign(props, { ttl: -1, value: "" }))
+  return WriteCookie(assign(props, { ttl: -1, value: "" }));
 }