Revamp examples (#800)

ecies · Oct 17, 2024 · 0671d42 · 0671d42
1 parent a73eeeb
commit 0671d42
Show file tree

Hide file tree

Showing 17 changed files with 223 additions and 157 deletions.
diff --git a/.cspell.jsonc b/.cspell.jsonc
@@ -12,6 +12,7 @@
     "Codacy",
     "Codecov",
     "consts",
+    "deno",
     "ecies",
     "eciesjs",
     "eciespy",
@@ -39,7 +40,6 @@
     ".gitignore",
     ".cspell.jsonc",
     "LICENSE",
-    "package.json",
-    "yarn.lock"
+    "package.json"
   ]
 }
diff --git a/.github/workflows/cd.yml b/.github/workflows/cd.yml
@@ -12,9 +12,7 @@ jobs:
       id-token: write
     steps:
       - uses: actions/checkout@v4
-
       - uses: pnpm/action-setup@v4
-
       - uses: actions/setup-node@v4
         with:
           node-version: 22

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -16,9 +16,7 @@ jobs:
         node: [18, 20, 22]
     steps:
       - uses: actions/checkout@v4
-
       - uses: pnpm/action-setup@v4
-
       - uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node }}
@@ -32,6 +30,27 @@ jobs:
           token: ${{ secrets.CODECOV_TOKEN }}
       - run: pnpm run build && npm publish --dry-run
 
-      - run: cd example && pnpm install
-      - run: node example/index.js
-      - run: node example/import.js
+  check-runtimes:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: pnpm
+          cache-dependency-path: pnpm-lock.yaml
+
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+
+      - uses: denoland/setup-deno@v2
+        with:
+          deno-version: v2.x
+
+      - run: pnpm install && pnpm build
+      - run: cd example/runtime && bun install
+      - run: bun run example/runtime/main.js
+      - run: deno run --allow-read example/runtime/main.js
+      - run: node example/runtime/main.js
diff --git a/.gitignore b/.gitignore
@@ -116,4 +116,8 @@ dist
 .pnp.*
 
 .DS_Store
-*.html
+
+# example
+bun.lockb
+deno.lock
+example/runtime/pnpm-lock.yaml
diff --git a/example/README.md b/example/README.md
@@ -1,15 +1,21 @@
-# eciesjs-example
+# example
 
-Run `pnpm install` first
+Make sure `pnpm build` under the parent directory is run before.
 
-## Basic usage
+## Browser example
 
-Run `node index.js`
+Run `cd browser && pnpm install && pnpm dev`
 
-## Check import
+For production, run `pnpm build && pnpm preview`
 
-Run `node import.js`
+## Runtime example (Node/Bun/Deno)
 
-## Browser
+Run `cd runtime && bun install`
 
-Run `pnpm dev`
+### Basic usage
+
+Run `node main.js` or `bun run main.js` or `deno run --allow-read main.js`
+
+### Check import
+
+Run `node import.js` or `bun run import.js` or `deno run --allow-read import.js`
diff --git a/example/index.html → example/browser/index.html b/example/index.html → example/browser/index.html
@@ -9,7 +9,7 @@
 
 <body>
   <div id="app"></div>
-  <script type="module" src="/browser/script.js"></script>
+  <script type="module" src="/script.js"></script>
 </body>
 
 </html>
diff --git a/example/package.json → example/browser/package.json b/example/package.json → example/browser/package.json
@@ -1,8 +1,7 @@
 {
-  "name": "eciesjs-example",
-  "version": "1.0.0",
+  "name": "browser-example",
+  "version": "0.1.0",
   "description": "",
-  "main": "index.js",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -14,10 +13,10 @@
   "license": "MIT",
   "dependencies": {
     "buffer": "^6.0.3",
-    "eciesjs": "file:.."
+    "eciesjs": "file:../.."
   },
   "devDependencies": {
-    "vite": "^5.4.8",
+    "vite": "^5.4.9",
     "vite-bundle-visualizer": "^1.2.1"
   }
 }
diff --git a/example/pnpm-lock.yaml → example/browser/pnpm-lock.yaml b/example/pnpm-lock.yaml → example/browser/pnpm-lock.yaml
diff --git a/example/browser/script.js b/example/browser/script.js
@@ -4,42 +4,41 @@ import { PrivateKey, decrypt, encrypt } from "eciesjs";
 
 import "./style.css";
 
-globalThis.Buffer = Buffer
+globalThis.Buffer = Buffer;
 
 const sk = new PrivateKey();
 const encoder = new TextEncoder();
 const decoder = new TextDecoder();
 
 export function setup(encryptedElement, textElement, decryptedElement) {
-  const text = "hello eciesjs🔒"
+  const text = "hello eciesjs🔒";
   let encrypted;
 
-  encryptedElement.innerHTML = `click me to encrypt`
-  textElement.innerHTML = text
-  decryptedElement.innerHTML = `click me to decrypt`
+  encryptedElement.innerHTML = `click me to encrypt`;
+  textElement.innerHTML = text;
+  decryptedElement.innerHTML = `click me to decrypt`;
 
   const _encrypt = () => {
-    encrypted = encrypt(sk.publicKey.toHex(), encoder.encode(text))
-    encryptedElement.innerHTML = `encrypted:`
-    textElement.innerHTML = `${bytesToHex(encrypted)}`
-    decryptedElement.innerHTML = `click me to decrypt`
-  }
+    encrypted = encrypt(sk.publicKey.toHex(), encoder.encode(text));
+    encryptedElement.innerHTML = `encrypted:`;
+    textElement.innerHTML = `${bytesToHex(encrypted)}`;
+    decryptedElement.innerHTML = `click me to decrypt`;
+  };
   const _decrypt = () => {
-    encryptedElement.innerHTML = `click me to encrypt`
+    encryptedElement.innerHTML = `click me to encrypt`;
     if (encrypted) {
-      textElement.innerHTML = `${decoder.decode(decrypt(sk.secret, encrypted))}`
-      decryptedElement.innerHTML = `decrypted:`
-      encrypted = undefined
+      textElement.innerHTML = `${decoder.decode(decrypt(sk.secret, encrypted))}`;
+      decryptedElement.innerHTML = `decrypted:`;
+      encrypted = undefined;
     } else {
-      textElement.innerHTML = "click encrypt button first"
+      textElement.innerHTML = "click encrypt button first";
     }
-  }
-  encryptedElement.addEventListener('click', () => _encrypt())
-  decryptedElement.addEventListener('click', () => _decrypt())
+  };
+  encryptedElement.addEventListener("click", () => _encrypt());
+  decryptedElement.addEventListener("click", () => _decrypt());
 }
 
-
-document.querySelector('#app').innerHTML = `
+document.querySelector("#app").innerHTML = `
   <div>
     <h1>Hello eciesjs!</h1>
     <div class="card">
@@ -48,7 +47,10 @@ document.querySelector('#app').innerHTML = `
     </div>
     <p id="text"></p>
   </div>
-`
+`;
 
-setup(document.querySelector('#encrypted'), document.querySelector('#text'),
-  document.querySelector('#decrypted'))
+setup(
+  document.querySelector("#encrypted"),
+  document.querySelector("#text"),
+  document.querySelector("#decrypted")
+);
diff --git a/example/browser/vite.config.ts b/example/browser/vite.config.ts
@@ -0,0 +1,17 @@
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  build: {
+    rollupOptions: {
+      output: {
+        manualChunks(id) {
+          if (id.includes("@noble")) {
+            return "noble";
+          } else if (id.includes("buffer")) {
+            return "buffer";
+          }
+        },
+      },
+    },
+  },
+});
diff --git a/example/index.js b/example/index.js
diff --git a/example/import.js → example/runtime/import.js b/example/import.js → example/runtime/import.js
diff --git a/example/runtime/main.js b/example/runtime/main.js
@@ -0,0 +1,18 @@
+import { ECIES_CONFIG, PrivateKey, decrypt, encrypt } from "eciesjs";
+import { Buffer } from "node:buffer";
+
+globalThis.Buffer = Buffer;
+
+// because deno does not support indirect conditional exports
+// it falls to node:crypto's implementation
+// despite that @ecies/ciphers exports @noble/ciphers implementation to deno
+// see: https://github.com/denoland/deno/discussions/17964#discussioncomment-10917259
+// deno's node:crypto does not support 16 bytes iv
+// so aes-256-gcm (16 bytes iv) does not work
+ECIES_CONFIG.symmetricNonceLength = 12;
+// ECIES_CONFIG.symmetricAlgorithm = "xchacha20";
+
+const sk = new PrivateKey();
+const data = Buffer.from("hello world🌍");
+const decrypted = decrypt(sk.secret, encrypt(sk.publicKey.toHex(), data));
+console.log(Buffer.from(decrypted).toString());
diff --git a/example/runtime/package.json b/example/runtime/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "runtime-example",
+  "version": "0.1.0",
+  "description": "",
+  "main": "main.js",
+  "type": "module",
+  "scripts": {},
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "eciesjs": "file:../.."
+  }
+}
diff --git a/example/vite.config.ts b/example/vite.config.ts
diff --git a/package.json b/package.json
@@ -59,11 +59,11 @@
     "@noble/hashes": "^1.5.0"
   },
   "devDependencies": {
-    "@types/node": "^22.7.5",
-    "@vitest/coverage-v8": "2.1.2",
+    "@types/node": "^22.7.6",
+    "@vitest/coverage-v8": "^2.1.3",
     "typescript": "^5.6.3",
-    "undici": "^6.20.0",
-    "vitest": "^2.1.2"
+    "undici": "^6.20.1",
+    "vitest": "^2.1.3"
   },
-  "packageManager": "pnpm@9.12.1+sha512.e5a7e52a4183a02d5931057f7a0dbff9d5e9ce3161e33fa68ae392125b79282a8a8a470a51dfc8a0ed86221442eb2fb57019b0990ed24fab519bf0e1bc5ccfc4"
+  "packageManager": "pnpm@9.12.2+sha512.22721b3a11f81661ae1ec68ce1a7b879425a1ca5b991c975b074ac220b187ce56c708fe5db69f4c962c989452eee76c82877f4ee80f474cebd61ee13461b6228"
 }