Run CI sandbox with Bun

Author: jakeboone02

ci/.codesandbox/tasks.json

@@ -0,0 +1,26 @@
+{
+  "setupTasks": [
+    {
+      "name": "Install Bun",
+      "command": "npm install --global bun"
+    },
+    {
+      "name": "Install Dependencies",
+      "command": "bun install"
+    }
+  ],
+  "tasks": {
+    "build": {
+      "name": "build",
+      "command": "bun run build"
+    },
+    "dev": {
+      "name": "dev",
+      "command": "bun start",
+      "runAtStart": true,
+      "preview": {
+        "port": 3000
+      }
+    }
+  }
+}

ci/package.json

@@ -4,18 +4,13 @@
   "description": "numeric-quantity Test Page",
   "main": "index.html",
   "scripts": {
-    "start": "parcel index.html --open",
-    "build": "parcel build index.html"
+    "start": "bun index.html",
+    "build": "bun build index.html"
   },
   "dependencies": {
-    "numeric-quantity": "^2.0.0",
-    "parcel-bundler": "^1.12.5"
+    "numeric-quantity": "^2.0.1"
   },
   "devDependencies": {
-    "typescript": "^5.1.3"
-  },
-  "resolutions": {
-    "@babel/preset-env": "7.13.8"
-  },
-  "keywords": []
+    "typescript": "^5.8.3"
+  }
 }

ci/src/index.ts

@@ -123,24 +123,21 @@ const strings = [
   'I',
 ];
 
-const app = document.getElementById('app')!;
+const tbodyInnerHTML = strings
+  .map(str => {
+    const nq = `${numericQuantity(str)}`;
+    const nqa = `${numericQuantity(str, { allowTrailingInvalid: true })}`;
+    const nqr = `${numericQuantity(str, { romanNumerals: true })}`;
+    return `<tr><td>numericQuantity("${str}")</td><td>${nq}</td><td${nqa !== nq ? ' class="diff"' : ''}>${nqa}</td><td${nqr !== nq ? ' class="diff"' : ''}>${nqr}</td></tr>`;
+  })
+  .join('');
 
-app.innerHTML = `<h1>numeric-quantity CI</h1>
+document.getElementById('app')!.innerHTML = `<h1>numeric-quantity CI</h1>
 <table>
-  <thead><tr><th>Expression</th><th>Result</th></tr></thead>
+  <thead><tr><th>Expression</th><th>Default</th><th>allowTrailingInvalid</th><th>romanNumerals</th></tr></thead>
+  <tbody>${tbodyInnerHTML}</tbody>
 </table>`;
 
-const table = document.querySelector('table')!;
-const tbody = document.createElement('tbody')!;
-
-for (const s of strings) {
-  const tr = document.createElement('tr');
-  const result = numericQuantity(s, {
-    romanNumerals: true,
-    allowTrailingInvalid: true,
-  });
-  tr.innerHTML = `<td>numericQuantity("${s}")</td><td>${result}</td>`;
-  tbody.appendChild(tr);
-}
-
-table.appendChild(tbody);
+Object.defineProperty(globalThis, 'numericQuantity', {
+  value: numericQuantity,
+});

ci/src/styles.css

@@ -8,7 +8,11 @@ td {
   padding: 4px;
 }
 
-th:first-child,
-td:first-child {
+th:not(:last-child),
+td:not(:last-child) {
   border-right: 1px solid lightgray;
 }
+
+.diff {
+  background-color: color-mix(in srgb, rebeccapurple, transparent 90%);
+}