Replace JSON imports with fetch for browser compatibility

src/cards.js

@@ -1,6 +1,12 @@
-import starterIronclad from "../data/starter-ironclad.json";
+let cardDb = {};
 
-const cardDb = { ...starterIronclad };
+export async function initCards() {
+  const url = new URL("../data/starter-ironclad.json", import.meta.url);
+  const res = await fetch(url);
+  if (!res.ok) throw new Error(`failed to load card data: ${res.status}`);
+  const starterIronclad = await res.json();
+  cardDb = { ...starterIronclad };
+}
 
 export function getCard(id) {
   return cardDb[id];

src/cards.test.js

@@ -1,5 +1,9 @@
-import { describe, expect, test } from "bun:test";
+import { beforeAll, describe, expect, test } from "bun:test";
-import { getCard, getStarterDeck } from "./cards.js";
+import { getCard, getStarterDeck, initCards } from "./cards.js";
+
+beforeAll(async () => {
+  await initCards();
+});
 
 describe("cards", () => {
   test("getCard returns card by id", () => {

src/combat.test.js

@@ -1,7 +1,13 @@
-import { describe, expect, test } from "bun:test";
+import { beforeAll, describe, expect, test } from "bun:test";
+import { initCards } from "./cards.js";
 import { checkCombatEnd, resolveEnemyTurn, startTurn } from "./combat.js";
+import { initEnemies } from "./enemies.js";
 import { createCombatState } from "./state.js";
 
+beforeAll(async () => {
+  await Promise.all([initCards(), initEnemies()]);
+});
+
 describe("startTurn", () => {
   test("resets energy and block, draws 5 cards", () => {
     let state = createCombatState("ironclad", "jaw_worm");

src/effects.test.js

@@ -1,7 +1,13 @@
-import { describe, expect, test } from "bun:test";
+import { beforeAll, describe, expect, test } from "bun:test";
+import { initCards } from "./cards.js";
 import { calculateHitDamage, resolveEffects } from "./effects.js";
+import { initEnemies } from "./enemies.js";
 import { createCombatState } from "./state.js";
 
+beforeAll(async () => {
+  await Promise.all([initCards(), initEnemies()]);
+});
+
 function makeState(overrides = {}) {
   const base = createCombatState("ironclad", "jaw_worm");
   return {

src/enemies.js

@@ -1,4 +1,11 @@
-import enemyDb from "../data/enemies.json";
+let enemyDb = {};
+
+export async function initEnemies() {
+  const url = new URL("../data/enemies.json", import.meta.url);
+  const res = await fetch(url);
+  if (!res.ok) throw new Error(`failed to load enemy data: ${res.status}`);
+  enemyDb = await res.json();
+}
 
 export function getEnemy(id) {
   return enemyDb[id];

src/enemies.test.js

@@ -1,5 +1,9 @@
-import { describe, expect, test } from "bun:test";
+import { beforeAll, describe, expect, test } from "bun:test";
-import { getEnemy, resolveEnemyAction } from "./enemies.js";
+import { getEnemy, initEnemies, resolveEnemyAction } from "./enemies.js";
+
+beforeAll(async () => {
+  await initEnemies();
+});
 
 describe("getEnemy", () => {
   test("returns enemy by id", () => {

src/main.js

@@ -1,11 +1,13 @@
-import { getCard } from "./cards.js";
+import { getCard, initCards } from "./cards.js";
 import { checkCombatEnd, resolveEnemyTurn, startTurn } from "./combat.js";
+import { initEnemies } from "./enemies.js";
 import { render } from "./render.js";
 import { createCombatState, endTurn, playCard } from "./state.js";
 
 let state = null;
 
-function init() {
+async function init() {
+  await Promise.all([initCards(), initEnemies()]);
   state = createCombatState("ironclad", "jaw_worm");
   state = startTurn(state);
   render(state);

src/state.test.js

@@ -1,6 +1,12 @@
-import { describe, expect, test } from "bun:test";
+import { beforeAll, describe, expect, test } from "bun:test";
+import { initCards } from "./cards.js";
+import { initEnemies } from "./enemies.js";
 import { createCombatState, drawCards, endTurn, playCard } from "./state.js";
 
+beforeAll(async () => {
+  await Promise.all([initCards(), initEnemies()]);
+});
+
 describe("createCombatState", () => {
   test("creates initial state with shuffled deck and correct values", () => {
     const state = createCombatState("ironclad", "jaw_worm");