Added named exports for browser and node implementation (#49)

browser/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "../dist/jdenticon-module",
+  "types": "../types/module.d.ts"
+}

node/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "../dist/jdenticon-node",
+  "types": "../types/module.d.ts"
+}

package.json

@@ -16,6 +16,16 @@
       },
       "default": "./dist/jdenticon-node.js"
     },
+    "./browser": {
+      "types": "./types/module.d.ts",
+      "import": "./dist/jdenticon-module.mjs",
+      "default": "./dist/jdenticon-module.js"
+    },
+    "./node": {
+      "types": "./types/module.d.ts",
+      "import": "./dist/jdenticon-node.mjs",
+      "default": "./dist/jdenticon-node.js"
+    },
     "./standalone": {
       "types": "./types/umd.d.ts",
       "default": "./dist/jdenticon.min.js"
@@ -93,6 +103,8 @@
     "bin/",
     "dist/",
     "standalone/",
+    "browser/",
+    "node/",
     "types/*.d.ts"
   ],
   "repository": {

test/e2e/rollup/app.js

@@ -3,5 +3,11 @@ import { testBrowser } from "../base-browser-test";
 import * as jdenticonEsm from "jdenticon";
 testBrowser(jdenticonEsm, "browser-esm");
 
+import * as jdenticonEsmBrowser from "jdenticon/browser";
+testBrowser(jdenticonEsmBrowser, "browser-esm");
+
+import * as jdenticonEsmNode from "jdenticon/node";
+testBrowser(jdenticonEsmNode, "node-esm");
+
 import * as jdenticonUmd from "jdenticon/standalone";
 testBrowser(jdenticonUmd, "browser-umd");

test/e2e/rollup/rollup.config.js

@@ -7,7 +7,11 @@ export default {
     output: {
         file: "./app.bundle.js",
         format: "iife",
+        globals: {
+            "canvas-renderer": "{}",
+        },
     },
+    external: ["canvas-renderer"],
     plugins: [
         commonjs(),
         nodeResolve({

test/e2e/webpack/app.js

@@ -3,5 +3,11 @@ import { testBrowser } from "../base-browser-test";
 import * as jdenticonEsm from "jdenticon";
 testBrowser(jdenticonEsm, "browser-esm");
 
+import * as jdenticonEsmBrowser from "jdenticon/browser";
+testBrowser(jdenticonEsmBrowser, "browser-esm");
+
+import * as jdenticonEsmNode from "jdenticon/node";
+testBrowser(jdenticonEsmNode, "node-esm");
+
 import * as jdenticonUmd from "jdenticon/standalone";
-testBrowser(jdenticonUmd, "browser-umd");
+testBrowser(jdenticonUmd, "browser-umd");

test/types/module-browser/module-test-explicit.ts

@@ -0,0 +1,59 @@
+import { configure, drawIcon, update, updateSvg, updateCanvas, toPng, toSvg, JdenticonConfig } from "jdenticon/browser";
+
+const newConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.40, 0.80],
+        grayscale: [0.30, 0.90]
+    },
+    saturation: {
+        color: 0.50,
+        grayscale: 0.00
+    },
+    hues: [45, 677],
+    padding: 0.3,
+    replaceMode: "observe",
+    backColor: "#86444400"
+};
+
+const oldConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.4, 0.8],
+        grayscale: [0.3, 0.9]
+    },
+    saturation: 0.5
+};
+
+window.jdenticon_config = oldConfig;
+
+configure(oldConfig);
+
+toPng("value to hash", 100);
+toSvg("value to hash", 100);
+
+toPng("value to hash", 100, 0.08);
+toSvg("value to hash", 100, 0.08);
+
+toPng("value to hash", 100, newConfig);
+toSvg("value to hash", 100, newConfig);
+
+var el = document.createElement("canvas");
+update(el, "value");
+update(el, "value", 0.08);
+update(el, "value", newConfig);
+update("#selector", "value");
+update("#selector", "value", 0.08);
+update("#selector", "value", newConfig);
+
+updateSvg("#selector", "value", newConfig);
+updateCanvas("#selector", "value", newConfig);
+
+var ctx = el.getContext("2d");
+if (ctx) {
+    drawIcon(ctx, "value", 100);
+    drawIcon(ctx, "value", 100, 0.08);
+    drawIcon(ctx, "value", 100, newConfig);
+}
+
+// Ensure Jdenticon dodn't leak Node typings.
+// setTimeout returns a NodeJS.Timeout when the Node typings are loaded.
+const timeoutRef: number = setTimeout(() => { }, 100);

test/types/module-node14/module-test-explicit.ts

@@ -0,0 +1,47 @@
+import { configure, update, updateSvg, updateCanvas, toPng, toSvg, JdenticonConfig } from "jdenticon/node";
+
+const newConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.40, 0.80],
+        grayscale: [0.30, 0.90]
+    },
+    saturation: {
+        color: 0.50,
+        grayscale: 0.00
+    },
+    hues: [45, 677],
+    padding: 0.3,
+    replaceMode: "observe",
+    backColor: "#86444400"
+};
+
+const oldConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.4, 0.8],
+        grayscale: [0.3, 0.9]
+    },
+    saturation: 0.5
+};
+
+configure(oldConfig);
+
+toPng("value to hash", 100);
+toSvg("value to hash", 100);
+
+toPng("value to hash", 100, 0.08);
+toSvg("value to hash", 100, 0.08);
+
+const buffer: Buffer = toPng("value to hash", 100, newConfig);
+
+toSvg("value to hash", 100, newConfig);
+
+// Check that Node typings are loaded
+buffer.swap64();
+
+update("#selector", "value");
+update("#selector", "value", 0.08);
+update("#selector", "value", newConfig);
+
+updateSvg("#selector", "value", newConfig);
+updateCanvas("#selector", "value", newConfig);
+

test/types/module-node16/module-test-explicit.ts

@@ -0,0 +1,47 @@
+import { configure, update, updateSvg, updateCanvas, toPng, toSvg, JdenticonConfig } from "jdenticon/node";
+
+const newConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.40, 0.80],
+        grayscale: [0.30, 0.90]
+    },
+    saturation: {
+        color: 0.50,
+        grayscale: 0.00
+    },
+    hues: [45, 677],
+    padding: 0.3,
+    replaceMode: "observe",
+    backColor: "#86444400"
+};
+
+const oldConfig: JdenticonConfig = {
+    lightness: {
+        color: [0.4, 0.8],
+        grayscale: [0.3, 0.9]
+    },
+    saturation: 0.5
+};
+
+configure(oldConfig);
+
+toPng("value to hash", 100);
+toSvg("value to hash", 100);
+
+toPng("value to hash", 100, 0.08);
+toSvg("value to hash", 100, 0.08);
+
+const buffer: Buffer = toPng("value to hash", 100, newConfig);
+
+toSvg("value to hash", 100, newConfig);
+
+// Check that Node typings are loaded
+buffer.swap64();
+
+update("#selector", "value");
+update("#selector", "value", 0.08);
+update("#selector", "value", newConfig);
+
+updateSvg("#selector", "value", newConfig);
+updateCanvas("#selector", "value", newConfig);
+