Build a personal finance dashboard as a static web app in this directory: index.html, s…

claude-codeclaude-fable-5 · 113 steps · 23m 10s · 8 filessession aaf47577-736@patrick-toulme
Build a personal finance dashboard as a static web app in this directory: index.html, style.css, app.js, data.js, charts.js. Transactions table with add/edit/delete + localStorage, monthly budget bars, a canvas spending-over-time chart, category filters, CSV import/export, dark theme, keyboard shortcuts, and a self-test page (tests.html) that exercises the core logic. Run your tests with a headless check (node) and fix what fails.
same matchclaude-code · 113 steps codex · 56 steps pi · 22 steps antigravity · 33 steps
compare in arena
step 79 / 113
tests.jschange 1/2
/*
 * tests.js — self-tests for the core logic in data.js and charts.js.
 * Runs two ways:
 *   node tests.js          → prints results, exit code 1 on any failure
 *   tests.html             → renders the same results in the browser
 */
(function (global, factory) {
  if (typeof module === 'object' && module.exports) {
    module.exports = factory;
  } else {
    global.runFinanceTests = factory;
  }
})(typeof self !== 'undefined' ? self : this, function (FD, FC) {
  'use strict';
 
  var results = [];
 
  function test(name, fn) {
    try {
      fn();
      results.push({ name: name, pass: true });
    } catch (e) {
      results.push({ name: name, pass: false, message: e.message });
    }
  }
 
  function ok(cond, msg) {
    if (!cond) { throw new Error(msg || 'expected truthy'); }
  }
 
  function eq(actual, expected, msg) {
    if (actual !== expected) {
      throw new Error((msg || 'mismatch') + ' — expected ' + JSON.stringify(expected) + ', got ' + JSON.stringify(actual));
    }
  }
 
  function deepEq(actual, expected, msg) {
    var a = JSON.stringify(actual);
    var b = JSON.stringify(expected);
    if (a !== b) {
      throw new Error((msg || 'deep mismatch') + ' — expected ' + b + ', got ' + a);
    }
  }
 
  function approx(actual, expected, msg) {
    if (Math.abs(actual - expected) > 1e-9) {
      throw new Error((msg || 'approx mismatch') + ' — expected ~' + expected + ', got ' + actual);
    }
  }
 
  function throws(fn, msg) {
    try {
      fn();
    } catch (e) {
      return e;
    }
    throw new Error(msg || 'expected an exception');
  }
 
  function MemStorage() { this.map = {}; }
  MemStorage.prototype.getItem = function (k) { return k in this.map ? this.map[k] : null; };
  MemStorage.prototype.setItem = function (k, v) { this.map[k] = String(v); };
 
  function sample() {
    var list = [];
    list = FD.addTransaction(list, { date: '2026-06-01', description: 'Salary', category: 'Income', amount: 3800 });
    list = FD.addTransaction(list, { date: '2026-06-01', description: 'Rent', category: 'Rent', amount: 1600 });
    list = FD.addTransaction(list, { date: '2026-06-08', description: 'Weekly groceries', category: 'Groceries', amount: 92.4 });
    list = FD.addTransaction(list, { date: '2026-07-03', description: 'Groceries at market', category: 'Groceries', amount: 110.1 });
    list = FD.addTransaction(list, { date: '2026-07-10', description: 'Pizza night', category: 'Dining', amount: 42 });
    return list;
  }
 
  // ── CSV parsing ───────────────────────────────────────────────────────────
 
  test('parseCSV: basic rows and fields', function () {
    deepEq(FD.parseCSV('a,b,c\n1,2,3'), [['a', 'b', 'c'], ['1', '2', '3']]);
  });
 
  test('parseCSV: quoted field containing commas', function () {
    deepEq(FD.parseCSV('a,"b, with comma",c'), [['a', 'b, with comma', 'c']]);
  });
 
  test('parseCSV: escaped double quotes inside quoted field', function () {
    deepEq(FD.parseCSV('"say ""hi""",x'), [['say "hi"', 'x']]);
  });
 
  test('parseCSV: newline inside quoted field', function () {
    deepEq(FD.parseCSV('"line1\nline2",x\ny,z'), [['line1\nline2', 'x'], ['y', 'z']]);
  });
 
  test('parseCSV: CRLF endings and trailing newline ignored', function () {
    deepEq(FD.parseCSV('a,b\r\nc,d\r\n'), [['a', 'b'], ['c', 'd']]);
  });
 
  test('parseCSV: empty fields preserved, empty input → no rows', function () {
    deepEq(FD.parseCSV('a,,c'), [['a', '', 'c']]);
    deepEq(FD.parseCSV(''), []);
  });
 
  // ── CSV serialization & round-trip ────────────────────────────────────────
 
  test('toCSV: header plus escaping of commas and quotes', function () {
    var csv = FD.toCSV([{ id: 'x', date: '2026-07-01', description: 'Lunch, "special"', category: 'Dining', amount: -12.5 }]);
    var lines = csv.trim().split('\n');
    eq(lines[0], 'date,description,category,amount');
    eq(lines[1], '2026-07-01,"Lunch, ""special""",Dining,-12.50');
  });
 
  test('CSV round-trip: export then import preserves every field', function () {
    var list = sample();
    var back = FD.transactionsFromCSV(FD.toCSV(list));
    eq(back.errors.length, 0, 'round-trip should produce no errors');
    eq(back.transactions.length, list.length);
    for (var i = 0; i < list.length; i++) {
      eq(back.transactions[i].date, list[i].date, 'date ' + i);
      eq(back.transactions[i].description, list[i].description, 'description ' + i);
      eq(back.transactions[i].category, list[i].category, 'category ' + i);
      approx(back.transactions[i].amount, list[i].amount, 'amount ' + i);
    }
  });
 
  // ── CSV import mapping ────────────────────────────────────────────────────
 
  test('import: header order flexible, $ and thousands commas parsed', function () {
    var r = FD.transactionsFromCSV('amount,category,description,date\n"-$1,234.56",Rent,June rent,2026-06-01');
    eq(r.errors.length, 0);
    eq(r.transactions.length, 1);
    approx(r.transactions[0].amount, -1234.56);
    eq(r.transactions[0].category, 'Rent');
  });
 
  test('import: parentheses accounting style is negative', function () {
    var r = FD.transactionsFromCSV('date,description,category,amount\n2026-06-02,Coffee,Dining,(4.50)');
    eq(r.errors.length, 0);
    approx(r.transactions[0].amount, -4.5);
  });
 
  test('import: category matching is case-insensitive; unknown → Other', function () {
    var r = FD.transactionsFromCSV('date,description,category,amount\n2026-06-02,A,dining,-5\n2026-06-03,B,Spaceships,-6');
    eq(r.transactions[0].category, 'Dining');
    eq(r.transactions[1].category, 'Other');
  });
 
  test('import: no category column → sign decides Income vs Other', function () {
    var r = FD.transactionsFromCSV('date,description,amount\n2026-06-01,Paycheck,2000\n2026-06-02,Snacks,-8');
    eq(r.transactions[0].category, 'Income');
    ok(r.transactions[0].amount > 0, 'income stays positive');
    eq(r.transactions[1].category, 'Other');
    ok(r.transactions[1].amount < 0, 'expense goes negative');
  });
 
  test('import: bad rows reported with row numbers, good rows kept', function () {
    var r = FD.transactionsFromCSV('date,description,category,amount\nnot-a-date,A,Dining,-5\n2026-06-02,B,Dining,abc\n2026-06-03,C,Dining,-7');
    eq(r.transactions.length, 1);
    eq(r.transactions[0].description, 'C');
    eq(r.errors.length, 2);
    ok(r.errors[0].indexOf('Row 2') === 0, 'first error names row 2: ' + r.errors[0]);
    ok(r.errors[1].indexOf('Row 3') === 0, 'second error names row 3: ' + r.errors[1]);
  });
 
  test('import: empty file and missing required columns are errors', function () {
    eq(FD.transactionsFromCSV('').errors.length, 1);
    var r = FD.transactionsFromCSV('foo,bar\n1,2');
    eq(r.transactions.length, 0);
    ok(r.errors[0].indexOf('Missing required column') !== -1, r.errors[0]);
  });
 
  // ── CRUD ──────────────────────────────────────────────────────────────────
 
  test('addTransaction: appends, assigns id, leaves original untouched', function () {
    var orig = [];
    var next = FD.addTransaction(orig, { date: '2026-07-01', description: 'Coffee', category: 'Dining', amount: 4.5 });
    eq(orig.length, 0, 'original array must not change');
    eq(next.length, 1);
    ok(typeof next[0].id === 'string' && next[0].id.length > 0, 'id assigned');
  });
 
  test('addTransaction: sign derived from category (expense −, Income +)', function () {
    var list = FD.addTransaction([], { date: '2026-07-01', description: 'Coffee', category: 'Dining', amount: 4.5 });
    approx(list[0].amount, -4.5);
    list = FD.addTransaction(list, { date: '2026-07-01', description: 'Paycheck', category: 'Income', amount: -2000 });
    approx(list[1].amount, 2000, 'Income is always positive, even if entered negative');
  });
 
  test('addTransaction: invalid input throws with a message', function () {
    var e1 = throws(function () {
      FD.addTransaction([], { date: '07/01/2026', description: 'X', category: 'Dining', amount: 5 });
    });
    ok(/date/.test(e1.message), 'message mentions the date: ' + e1.message);
    throws(function () {
      FD.addTransaction([], { date: '2026-07-01', description: 'X', category: 'Dining', amount: 0 });
    }, 'zero amount must throw');
  });
 
  test('updateTransaction: merges patch, re-validates, immutable', function () {
    var list = sample();
    var id = list[4].id;
    var next = FD.updateTransaction(list, id, { amount: 55, description: 'Pizza & wings' });
    eq(list[4].description, 'Pizza night', 'original untouched');
    var updated = FD.getTransaction(next, id);
    eq(updated.description, 'Pizza & wings');
    approx(updated.amount, -55);
    eq(updated.date, '2026-07-10', 'unpatched fields survive');
  });
 
  test('updateTransaction: unknown id and invalid patch both throw', function () {
    var list = sample();
    throws(function () { FD.updateTransaction(list, 'nope', { amount: 5 }); });
    throws(function () { FD.updateTransaction(list, list[0].id, { date: 'garbage' }); });
  });
 
  test('deleteTransaction: removes only the matching id', function () {
    var list = sample();
    var next = FD.deleteTransaction(list, list[0].id);
    eq(next.length, list.length - 1);
    eq(FD.getTransaction(next, list[0].id), null);
    eq(FD.deleteTransaction(list, 'missing').length, list.length, 'missing id is a no-op');
  });
 
  // ── validation ────────────────────────────────────────────────────────────
 
  test('validateTransaction: rejects bad formats and impossible dates', function () {
    function errsFor(t) { return FD.validateTransaction(FD.normalizeTransaction(t)); }
    ok(errsFor({ date: '2026-1-5', description: 'X', category: 'Dining', amount: 5 }).length > 0, 'non-padded date');
    ok(errsFor({ date: '2026-02-31', description: 'X', category: 'Dining', amount: 5 }).length > 0, 'Feb 31 is not real');
    ok(errsFor({ date: '2026-07-01', description: '   ', category: 'Dining', amount: 5 }).length > 0, 'blank description');
    ok(errsFor({ date: '2026-07-01', description: 'X', category: 'Blimps', amount: 5 }).length > 0, 'unknown category');
    ok(errsFor({ date: '2026-07-01', description: 'X', category: 'Dining', amount: 'abc' }).length > 0, 'non-numeric amount');
  });
 
  test('validateTransaction: a normal transaction passes clean', function () {
    var t = FD.normalizeTransaction({ date: '2026-02-29', description: ' Coffee ', category: 'Dining', amount: '4.50' });
    deepEq(FD.validateTransaction(t), []);
    eq(t.description, 'Coffee', 'whitespace trimmed');
  });
 
  // ── filtering ─────────────────────────────────────────────────────────────
 
  test('filterTransactions: by category', function () {
    var list = sample();
    eq(FD.filterTransactions(list, { category: 'Groceries' }).length, 2);
    eq(FD.filterTransactions(list, { category: 'all' }).length, list.length);
  });
 
  test('filterTransactions: search is case-insensitive on description', function () {
    var list = sample();
    eq(FD.filterTransactions(list, { search: 'PIZZA' }).length, 1);
    eq(FD.filterTransactions(list, { search: 'groceries' }).length, 2);
    eq(FD.filterTransactions(list, { search: 'zebra' }).length, 0);
  });
 
  test('filterTransactions: date range bounds are inclusive', function () {
    var list = sample();
    var r = FD.filterTransactions(list, { from: '2026-06-01', to: '2026-06-30' });
    eq(r.length, 3);
    eq(FD.filterTransactions(list, { from: '2026-07-03' }).length, 2, 'from includes its own date');
    eq(FD.filterTransactions(list, { to: '2026-06-01' }).length, 2, 'to includes its own date');
  });
 
  // ── months & aggregation ──────────────────────────────────────────────────
 
  test('monthKey / monthAdd / monthRange handle year boundaries', function () {
    eq(FD.monthKey('2026-07-28'), '2026-07');
    eq(FD.monthAdd('2026-01', -1), '2025-12');
    eq(FD.monthAdd('2025-11', 3), '2026-02');
    deepEq(FD.monthRange('2025-11', '2026-02'), ['2025-11', '2025-12', '2026-01', '2026-02']);
    deepEq(FD.monthRange('2026-05', '2026-01'), [], 'inverted range is empty');
  });
 
  test('monthlySeries: expenses only, gap months filled with zero', function () {
    var list = [];
    list = FD.addTransaction(list, { date: '2026-03-10', description: 'A', category: 'Dining', amount: 50 });
    list = FD.addTransaction(list, { date: '2026-03-20', description: 'B', category: 'Dining', amount: 25 });
    list = FD.addTransaction(list, { date: '2026-04-05', description: 'Pay', category: 'Income', amount: 1000 });
    list = FD.addTransaction(list, { date: '2026-05-15', description: 'C', category: 'Rent', amount: 800 });
    var s = FD.monthlySeries(list);
    deepEq(s, [
      { month: '2026-03', total: 75 },
      { month: '2026-04', total: 0 },
      { month: '2026-05', total: 800 }
    ], 'income excluded; April present as zero');
  });
 
  test('monthlySeries: explicit fromMonth/toMonth bounds are honored', function () {
    var list = FD.addTransaction([], { date: '2026-06-10', description: 'A', category: 'Dining', amount: 30 });
    var s = FD.monthlySeries(list, { fromMonth: '2026-04', toMonth: '2026-07' });
    eq(s.length, 4);
    eq(s[0].month, '2026-04');
    approx(s[0].total, 0);
    approx(s[2].total, 30);
    deepEq(FD.monthlySeries([], {}), [], 'no data and no bounds → empty');
  });
 
  test('spendingByCategory: month-scoped, expenses only', function () {
    var list = sample();
    var june = FD.spendingByCategory(list, '2026-06');
    approx(june.Rent, 1600);
    approx(june.Groceries, 92.4);
    ok(!('Income' in june), 'income never counts as spending');
    var all = FD.spendingByCategory(list, null);
    approx(all.Groceries, 202.5, 'null month = all time');
  });
 
  test('totals: spent / income / net for a month', function () {
    var t = FD.totals(sample(), '2026-06');
    approx(t.spent, 1692.4);
    approx(t.income, 3800);
    approx(t.net, 2107.6);
  });
 
  // ── budgets ───────────────────────────────────────────────────────────────
 
  test('budgetStatus: ok under 80%, warning at 80%–100%', function () {
    eq(FD.budgetStatus(79.9, 100).level, 'ok');
    eq(FD.budgetStatus(80, 100).level, 'warning');
    eq(FD.budgetStatus(100, 100).level, 'warning', 'exactly at budget is not over');
    approx(FD.budgetStatus(50, 100).ratio, 0.5);
  });
 
  test('budgetStatus: over past 100%; zero/absent budget is "none"', function () {
    eq(FD.budgetStatus(100.01, 100).level, 'over');
    eq(FD.budgetStatus(5, 0).level, 'none');
    eq(FD.budgetStatus(5, undefined).level, 'none');
    eq(FD.budgetStatus(5, 0).ratio, null);
  });
 
  // ── formatting ────────────────────────────────────────────────────────────
 
  test('formatCurrency and formatCompactCurrency', function () {
    eq(FD.formatCurrency(1234.5), '$1,234.50');
    ok(FD.formatCurrency(-42).indexOf('42') !== -1 && FD.formatCurrency(-42).indexOf('-') !== -1, 'negative keeps sign');
    eq(FD.formatCompactCurrency(0), '$0');
    eq(FD.formatCompactCurrency(250), '$250');
    eq(FD.formatCompactCurrency(1000), '$1K');
    eq(FD.formatCompactCurrency(1500), '$1.5K');
  });
 
  test('round2 snaps float dust', function () {
    approx(FD.round2(0.1 + 0.2), 0.3);
    approx(FD.round2(10.005), 10.01);
  });
 
  // ── storage ───────────────────────────────────────────────────────────────
 
  test('storage: save/load round-trip', function () {
    var mem = new MemStorage();
    var list = sample();
    FD.saveTransactions(mem, list);
    deepEq(FD.loadTransactions(mem), list);
  });
 
  test('storage: never-saved → null, corrupt JSON → []', function () {
    var mem = new MemStorage();
    eq(FD.loadTransactions(mem), null, 'null signals "seed demo data"');
    mem.setItem(FD.STORAGE_KEYS.transactions, '{oops');
    deepEq(FD.loadTransactions(mem), [], 'corrupt data must not crash');
  });
 
  test('storage: malformed entries are dropped, valid ones kept', function () {
    var mem = new MemStorage();
    var good = { id: 'a1', date: '2026-07-01', description: 'Keep me', category: 'Dining', amount: -5 };
    mem.setItem(FD.STORAGE_KEYS.transactions, JSON.stringify([good, { id: 'a2', date: 'bad' }, 'junk', null]));
    var loaded = FD.loadTransactions(mem);
    eq(loaded.length, 1);
    eq(loaded[0].id, 'a1');
  });
 
  test('storage: budgets merge over defaults and round-trip', function () {
    var mem = new MemStorage();
    deepEq(FD.loadBudgets(mem), FD.DEFAULT_BUDGETS, 'defaults when nothing saved');
    var edited = FD.loadBudgets(mem);
    edited.Dining = 300;
    FD.saveBudgets(mem, edited);
    eq(FD.loadBudgets(mem).Dining, 300);
    eq(FD.loadBudgets(mem).Rent, FD.DEFAULT_BUDGETS.Rent, 'untouched categories keep defaults');
    mem.setItem(FD.STORAGE_KEYS.budgets, JSON.stringify({ Dining: -50, Rocketry: 900 }));
    var guarded = FD.loadBudgets(mem);
    eq(guarded.Dining, FD.DEFAULT_BUDGETS.Dining, 'negative values rejected');
    ok(!('Rocketry' in guarded), 'unknown categories ignored');
  });
 
  // ── demo data ─────────────────────────────────────────────────────────────
 
  test('demoData: valid, dated in the past, deterministic', function () {
    var today = '2026-07-28';
    var demo = FD.demoData(today);
    ok(demo.length > 20, 'a healthy amount of demo data');
    demo.forEach(function (t) {
      deepEq(FD.validateTransaction(t), [], 'demo txn valid: ' + t.description);
      ok(t.date <= today, 'no future dates');
    });
    ok(demo.some(function (t) { return t.amount > 0; }), 'has income');
    ok(demo.some(function (t) { return t.amount < 0; }), 'has expenses');
    var a = FD.demoData(today).map(function (t) { return t.date + t.description + t.amount; }).join('|');
    var b = FD.demoData(today).map(function (t) { return t.date + t.description + t.amount; }).join('|');
    eq(a, b, 'same input → same demo data');
  });
 
  // ── charts (pure math) ────────────────────────────────────────────────────
 
  test('niceTicks: clean money steps', function () {
    var t = FC.niceTicks(970);
    eq(t.top, 1000);
    eq(t.step, 250);
    deepEq(t.ticks, [0, 250, 500, 750, 1000]);
    eq(FC.niceTicks(4).top, 4);
    deepEq(FC.niceTicks(0).ticks, [0, 25, 50, 75, 100], 'zero/empty guard');
  });
 
  test('niceTicks: top always covers the max', function () {
    var samples = [0.4, 1, 7, 12, 82, 99.9, 250, 970, 1234.56, 88000];
    samples.forEach(function (m) {
      var t = FC.niceTicks(m);
      ok(t.top >= m - 1e-9, 'top ' + t.top + ' covers ' + m);
      ok(t.ticks[0] === 0, 'ticks start at zero');
      approx(t.ticks[t.ticks.length - 1], t.top, 'ticks end at top');
    });
  });
 
  test('monthTickLabel: short names, optional year', function () {
    eq(FC.monthTickLabel('2026-07'), 'Jul');
    eq(FC.monthTickLabel('2026-01', true), 'Jan ’26');
  });
 
  test('drawSpendingChart: safe no-op without a canvas (headless)', function () {
    eq(FC.drawSpendingChart(null, [], {}), null);
    eq(FC.drawSpendingChart({}, [], {}), null, 'object without getContext');
  });
 
  var passed = results.filter(function (r) { return r.pass; }).length;
  return { results: results, passed: passed, failed: results.length - passed };
});
 
// Headless entry point: `node tests.js`
if (typeof module === 'object' && module.exports && typeof require === 'function' && typeof process !== 'undefined' && require.main === module) {
  var FD = require('./data.js');
  var FC = require('./charts.js');
  var out = module.exports(FD, FC);
  out.results.forEach(function (r) {
    console.log((r.pass ? '  ✓ ' : '  ✗ ') + r.name + (r.pass ? '' : '\n      ' + r.message));
  });
  console.log('\n' + out.passed + '/' + out.results.length + ' tests passed' + (out.failed ? ' — ' + out.failed + ' FAILED' : ''));
  process.exitCode = out.failed ? 1 : 0;
}
 
446 linesjs
Writes …/tests.js
Files at this step
drag the rail to scrub
Discussion

1 comment on this trajectory. Recorded by @patrick-toulme.
@patrick-toulme7/28/2026, 5:35:41 AM
Dogfood artifact — this 4-way comparison was recorded, exported, and uploaded entirely through the agentsage pipeline as part of full-coverage testing. Safe to delete.
#claude #claude-code #claude-fable-5 #css #graphics #html #javascript #medium #skills #subagents #testing
r1-claude
← all sessions