+
diff --git a/popup.js b/popup.js
index 80efaf7..30a3b62 100644
--- a/popup.js
+++ b/popup.js
@@ -103,38 +103,71 @@ for (const id of PERSISTED_VALUE_IDS) {
}
// Quick Date Logic
+function formatDateInput(date) {
+ // Format as YYYY-MM-DD using local time
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ return `${year}-${month}-${day}`;
+}
+
+function quickRangeValues(range, now = new Date()) {
+ let start, end;
+
+ if (range === 'last-30' || range === 'last-90') {
+ const days = range === 'last-30' ? 30 : 90;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - days);
+ end = now;
+ } else if (range === 'ytd') {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = now;
+ } else if (range === 'last-month') {
+ start = new Date(now.getFullYear(), now.getMonth() - 1, 1);
+ end = new Date(now.getFullYear(), now.getMonth(), 0);
+ } else if (range === 'last-year') {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ }
+
+ return start && end ? { start: formatDateInput(start), end: formatDateInput(end) } : null;
+}
+
document.querySelectorAll('.pill-btn').forEach(btn => {
btn.addEventListener('click', () => {
- const range = btn.dataset.range;
- const now = new Date();
- let start, end;
-
- if (range === 'ytd') {
- start = new Date(now.getFullYear(), 0, 1);
- end = now;
- } else if (range === 'last-month') {
- start = new Date(now.getFullYear(), now.getMonth() - 1, 1);
- end = new Date(now.getFullYear(), now.getMonth(), 0);
- } else if (range === 'last-year') {
- start = new Date(now.getFullYear() - 1, 0, 1);
- end = new Date(now.getFullYear() - 1, 11, 31);
- }
-
- if (start && end) {
- // Format as YYYY-MM-DD using local time
- const formatDate = (date) => {
- const year = date.getFullYear();
- const month = String(date.getMonth() + 1).padStart(2, '0');
- const day = String(date.getDate()).padStart(2, '0');
- return `${year}-${month}-${day}`;
- };
- document.getElementById('start-date').value = formatDate(start);
- document.getElementById('end-date').value = formatDate(end);
+ const values = quickRangeValues(btn.dataset.range);
+ if (values) {
+ document.getElementById('start-date').value = values.start;
+ document.getElementById('end-date').value = values.end;
saveSettings();
}
});
});
+// Inline status line (replaces alert() dialogs, which are jarring in an extension popup)
+const statusLine = document.getElementById('status');
+
+// The status line lives in the fixed action bar so it is always visible without scrolling.
+// Keep the page padding in step with the bar so no content is hidden underneath it.
+function syncActionBarPadding() {
+ const bar = document.getElementById('action-bar');
+ if (bar && document.body.style) {
+ document.body.style.paddingBottom = `${bar.offsetHeight + 12}px`;
+ }
+}
+
+function showStatus(message, kind = 'info') {
+ statusLine.textContent = message;
+ statusLine.dataset.kind = kind;
+ statusLine.hidden = false;
+ syncActionBarPadding();
+}
+
+function clearStatus() {
+ statusLine.textContent = '';
+ statusLine.hidden = true;
+ syncActionBarPadding();
+}
+
/**
* Send a message to the content script. If it doesn't answer (stale or missing
* content script — e.g. the page was loaded before the extension was updated),
@@ -176,6 +209,7 @@ function sendMessageWithInjection(tab, message, callback) {
// Debug: dump raw API responses to a JSON file
document.getElementById('debug-raw-btn').addEventListener('click', () => {
+ clearStatus();
const btn = document.getElementById('debug-raw-btn');
const originalText = btn.textContent;
btn.textContent = 'Dumping...';
@@ -183,16 +217,16 @@ document.getElementById('debug-raw-btn').addEventListener('click', () => {
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
if (!tabs[0]) {
- alert('No active tab found.');
+ showStatus('No active tab found.', 'error');
btn.textContent = originalText;
btn.disabled = false;
return;
}
sendMessageWithInjection(tabs[0], { action: 'debugDumpRaw', maxHubPages: 5 }, (response, error) => {
if (error) {
- alert(`Connection error (${error}): Make sure you are on creditkarma.com and reload the page.`);
+ showStatus(`Connection error (${error}): Make sure you are on creditkarma.com and reload the page.`, 'error');
} else if (response?.status === 'error') {
- alert(`Raw API dump failed: ${response.message}`);
+ showStatus(`Raw API dump failed: ${response.message}`, 'error');
}
btn.textContent = originalText;
btn.disabled = false;
@@ -201,7 +235,23 @@ document.getElementById('debug-raw-btn').addEventListener('click', () => {
});
// Export Logic
+const exportBtn = document.getElementById('export-btn');
+const exportBtnText = exportBtn.textContent;
+
+function resetExportButton() {
+ exportBtn.textContent = exportBtnText;
+ exportBtn.disabled = false;
+}
+
+// The content script reports back when an export finishes (or fails)
+chrome.runtime.onMessage?.addListener(message => {
+ if (message?.action !== 'exportFinished') return;
+ showStatus(message.message, message.status === 'success' ? 'success' : 'error');
+ resetExportButton();
+});
+
document.getElementById('export-btn').addEventListener('click', () => {
+ clearStatus();
const startDate = document.getElementById('start-date').value;
const endDate = document.getElementById('end-date').value;
@@ -220,14 +270,14 @@ document.getElementById('export-btn').addEventListener('click', () => {
};
if (!Object.values(csvTypes).some(Boolean)) {
- alert('Please select at least one file to generate.');
+ showStatus('Please select at least one file to generate.', 'error');
return;
}
const needsDateRange = Object.entries(csvTypes)
.some(([type, selected]) => type !== 'wealthAccounts' && selected);
if (needsDateRange && (!startDate || !endDate)) {
- alert('Please select both start and end dates.');
+ showStatus('Please select both start and end dates.', 'error');
return;
}
@@ -244,16 +294,14 @@ document.getElementById('export-btn').addEventListener('click', () => {
};
// UI Feedback
- const exportBtn = document.getElementById('export-btn');
- const originalText = exportBtn.textContent;
exportBtn.textContent = 'Processing...';
exportBtn.disabled = true;
// Send to Content Script
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
if (!tabs[0]) {
- alert('No active tab found.');
- resetButton();
+ showStatus('No active tab found.', 'error');
+ resetExportButton();
return;
}
@@ -270,22 +318,18 @@ document.getElementById('export-btn').addEventListener('click', () => {
// Handle error (e.g. content script not loaded)
if (error) {
console.error(error);
- alert(`Connection error (${error}): Make sure you are on creditkarma.com and reload the page.`);
- resetButton();
+ showStatus(`Connection error (${error}): Make sure you are on creditkarma.com and reload the page.`, 'error');
+ resetExportButton();
return;
}
if (response && response.status === 'started') {
- // Keep button disabled for a bit to prevent double clicks
- setTimeout(resetButton, 3000);
+ // Stay disabled until the content script reports the export finished
+ showStatus('Exporting... keep this Credit Karma tab open.');
} else {
- resetButton();
+ if (response?.status === 'error') showStatus(response.message, 'error');
+ resetExportButton();
}
});
});
-
- function resetButton() {
- exportBtn.textContent = originalText;
- exportBtn.disabled = false;
- }
});
diff --git a/tests/content.test.js b/tests/content.test.js
index d35f169..eb24703 100644
--- a/tests/content.test.js
+++ b/tests/content.test.js
@@ -25,7 +25,8 @@ vm.runInContext(`${contentScript}\n;globalThis.testExports = {
convertWealthAccountsToCSV,
shouldExportCurrentWealth,
buildBudgetLensBundle,
- buildExportFileName
+ buildExportFileName,
+ convertToCSV
};`, context);
const {
@@ -40,7 +41,8 @@ const {
convertWealthAccountsToCSV,
shouldExportCurrentWealth,
buildBudgetLensBundle,
- buildExportFileName
+ buildExportFileName,
+ convertToCSV
} = context.testExports;
function point(date, value) {
@@ -421,3 +423,58 @@ test('custom file names are sanitized', () => {
assert.equal(buildExportFileName('income', 'csv', 'd', { income: ' ' }), 'income_d.csv');
assert.equal(buildExportFileName('income', 'csv', 'd', { income: '...' }), 'income_d.csv');
});
+
+test('transaction CSV includes the header and quotes every field', () => {
+ const csv = convertToCSV([{
+ date: '2026-07-04',
+ description: 'Coffee',
+ amount: '4.50',
+ category: 'Dining',
+ transactionType: 'debit',
+ accountName: 'Checking',
+ accountType: 'Bank',
+ provider: 'Example Bank'
+ }]);
+
+ assert.equal(csv.split('\n')[0],
+ 'Date,Description,Amount,Category,Transaction Type,Account Name,Account Type,Provider,Labels,Notes');
+ assert.equal(csv.split('\n')[1],
+ '"07/04/2026","Coffee","4.50","Dining","debit","Checking","Bank","Example Bank","",""');
+});
+
+test('transaction CSV keeps commas, quotes, and newlines inside a single quoted field', () => {
+ const csv = convertToCSV([{
+ date: '2026-07-04',
+ description: 'Smith, John "JJ" Cafe\nDowntown',
+ amount: '1.00',
+ category: 'A, B',
+ transactionType: 'debit'
+ }], { date: true, description: true, amount: true, category: true });
+
+ assert.equal(
+ csv,
+ 'Date,Description,Amount,Category\n"07/04/2026","Smith, John ""JJ"" Cafe\nDowntown","1.00","A, B"\n'
+ );
+});
+
+test('transaction CSV only includes the selected columns', () => {
+ const csv = convertToCSV([{
+ date: '2026-07-04',
+ description: 'Coffee',
+ amount: '4.50',
+ category: 'Dining',
+ transactionType: 'debit'
+ }], { date: true, amount: true });
+
+ assert.equal(csv, 'Date,Amount\n"07/04/2026","4.50"\n');
+});
+
+test('transaction CSV leaves missing optional fields empty and handles no transactions', () => {
+ const csv = convertToCSV([{ date: '2026-07-04', amount: '1', transactionType: 'credit' }]);
+
+ assert.equal(csv.split('\n')[1], '"07/04/2026","","1","","credit","","","","",""');
+ assert.equal(
+ convertToCSV([], { date: true, amount: true }),
+ 'Date,Amount\n'
+ );
+});
diff --git a/tests/manifest.test.js b/tests/manifest.test.js
index 801963d..aa0499f 100644
--- a/tests/manifest.test.js
+++ b/tests/manifest.test.js
@@ -21,7 +21,6 @@ test('every local file referenced by the manifest exists', () => {
const referencedFiles = [
manifest.action.default_popup,
...Object.values(manifest.action.default_icon),
- manifest.background.service_worker,
...manifest.content_scripts.flatMap(contentScript => contentScript.js || [])
];
@@ -35,3 +34,7 @@ test('content scripts are limited to Credit Karma pages', () => {
assert.deepEqual(contentScript.matches, ['*://www.creditkarma.com/*']);
}
});
+
+test('manifest does not register a background service worker', () => {
+ assert.equal(manifest.background, undefined);
+});
diff --git a/tests/popup.test.js b/tests/popup.test.js
index bd9134c..abd71d4 100644
--- a/tests/popup.test.js
+++ b/tests/popup.test.js
@@ -8,7 +8,7 @@ const popupScript = fs.readFileSync(path.join(__dirname, '..', 'popup.js'), 'utf
function createPopupContext(savedStorage = {}) {
const listeners = new Map();
- const alerts = [];
+ let runtimeListener = null;
const sentMessages = [];
const checkboxIds = [
'useApiCheckbox',
@@ -46,6 +46,8 @@ function createPopupContext(savedStorage = {}) {
}
element('theme-toggle');
+ element('status').hidden = true;
+ elements.get('status').dataset = {};
element('start-date');
element('end-date');
element('export-btn');
@@ -77,10 +79,12 @@ function createPopupContext(savedStorage = {}) {
getItem: key => savedStorage[key] ?? null,
setItem(key, value) { savedStorage[key] = value; }
},
- alert: message => alerts.push(message),
setTimeout: callback => callback(),
chrome: {
- runtime: { lastError: null },
+ runtime: {
+ lastError: null,
+ onMessage: { addListener(callback) { runtimeListener = callback; } }
+ },
scripting: { executeScript() {} },
tabs: {
query(_options, callback) {
@@ -96,16 +100,23 @@ function createPopupContext(savedStorage = {}) {
vm.createContext(context);
vm.runInContext(popupScript, context);
- return { alerts, elements, listeners, sentMessages, savedStorage };
+ const status = () => {
+ const el = elements.get('status');
+ return el.hidden ? null : { text: el.textContent, kind: el.dataset.kind };
+ };
+ return {
+ context, elements, listeners, sentMessages, savedStorage, status,
+ sendRuntimeMessage: message => runtimeListener(message)
+ };
}
test('current wealth account snapshots can export without a historical date range', () => {
- const { alerts, elements, listeners, sentMessages } = createPopupContext();
+ const { status, elements, listeners, sentMessages } = createPopupContext();
elements.get('wealthAccountsCheckbox').checked = true;
listeners.get('export-btn:click')();
- assert.deepEqual(alerts, []);
+ assert.notEqual(status()?.kind, 'error');
assert.equal(sentMessages.length, 1);
assert.equal(sentMessages[0].csvTypes.wealthAccounts, true);
assert.equal(sentMessages[0].startDate, '');
@@ -113,24 +124,25 @@ test('current wealth account snapshots can export without a historical date rang
});
test('historical exports still require both dates', () => {
- const { alerts, elements, listeners, sentMessages } = createPopupContext();
+ const { status, elements, listeners, sentMessages } = createPopupContext();
elements.get('netWorthCheckbox').checked = true;
listeners.get('export-btn:click')();
- assert.deepEqual(alerts, ['Please select both start and end dates.']);
+ assert.equal(status().text, 'Please select both start and end dates.');
+ assert.equal(status().kind, 'error');
assert.deepEqual(sentMessages, []);
});
test('BudgetLens bundle is sent as a distinct export type', () => {
- const { alerts, elements, listeners, sentMessages } = createPopupContext();
+ const { status, elements, listeners, sentMessages } = createPopupContext();
elements.get('budgetLensBundleCheckbox').checked = true;
elements.get('start-date').value = '2026-01-01';
elements.get('end-date').value = '2026-07-30';
listeners.get('export-btn:click')();
- assert.deepEqual(alerts, []);
+ assert.notEqual(status()?.kind, 'error');
assert.equal(sentMessages.length, 1);
assert.equal(sentMessages[0].csvTypes.budgetLensBundle, true);
assert.equal(sentMessages[0].csvTypes.allTransactions, false);
@@ -189,3 +201,83 @@ test('corrupt or partial saved settings fall back to the defaults', () => {
assert.equal(partial.elements.get('col-date').checked, true);
assert.equal(partial.elements.get('end-date').value, '');
});
+
+test('selecting no export shows an inline error instead of an alert', () => {
+ const { elements, listeners, sentMessages, status } = createPopupContext();
+ elements.get('budgetLensBundleCheckbox').checked = false;
+
+ listeners.get('export-btn:click')();
+
+ assert.equal(status().text, 'Please select at least one file to generate.');
+ assert.equal(status().kind, 'error');
+ assert.equal(sentMessages.length, 0);
+});
+
+test('export button stays disabled until the content script reports completion', () => {
+ const { elements, listeners, status, sendRuntimeMessage } = createPopupContext();
+ elements.get('wealthAccountsCheckbox').checked = true;
+
+ listeners.get('export-btn:click')();
+
+ assert.equal(elements.get('export-btn').disabled, true);
+ assert.equal(status().kind, 'info');
+
+ sendRuntimeMessage({ action: 'exportFinished', status: 'success', message: 'Export complete: 3 transactions.' });
+
+ assert.equal(elements.get('export-btn').disabled, false);
+ assert.equal(status().text, 'Export complete: 3 transactions.');
+ assert.equal(status().kind, 'success');
+});
+
+test('export failures reported by the content script are shown and re-enable the button', () => {
+ const { elements, listeners, status, sendRuntimeMessage } = createPopupContext();
+ elements.get('wealthAccountsCheckbox').checked = true;
+ listeners.get('export-btn:click')();
+
+ sendRuntimeMessage({ action: 'exportFinished', status: 'error', message: 'Error during data export: boom' });
+
+ assert.equal(elements.get('export-btn').disabled, false);
+ assert.equal(status().text, 'Error during data export: boom');
+ assert.equal(status().kind, 'error');
+});
+
+test('unrelated runtime messages are ignored', () => {
+ const { elements, listeners, status, sendRuntimeMessage } = createPopupContext();
+ elements.get('wealthAccountsCheckbox').checked = true;
+ listeners.get('export-btn:click')();
+
+ sendRuntimeMessage({ action: 'somethingElse' });
+
+ assert.equal(elements.get('export-btn').disabled, true);
+ assert.equal(status().kind, 'info');
+});
+
+test('quick date ranges cover the expected days', () => {
+ const { context } = createPopupContext();
+ const now = new Date(2026, 6, 30); // July 30, 2026
+ const range = name => {
+ const { start, end } = context.quickRangeValues(name, now);
+ return `${start}..${end}`;
+ };
+
+ assert.equal(range('last-30'), '2026-06-30..2026-07-30');
+ assert.equal(range('last-90'), '2026-05-01..2026-07-30');
+ assert.equal(range('ytd'), '2026-01-01..2026-07-30');
+ assert.equal(range('last-month'), '2026-06-01..2026-06-30');
+ assert.equal(range('last-year'), '2025-01-01..2025-12-31');
+});
+
+test('quick date ranges handle month and year boundaries', () => {
+ const { context } = createPopupContext();
+ const march = new Date(2026, 2, 1);
+ const january = new Date(2026, 0, 5);
+ const range = (name, now) => {
+ const { start, end } = context.quickRangeValues(name, now);
+ return `${start}..${end}`;
+ };
+
+ assert.equal(range('last-30', march), '2026-01-30..2026-03-01');
+ assert.equal(range('last-month', january), '2025-12-01..2025-12-31');
+ assert.equal(range('last-90', january), '2025-10-07..2026-01-05');
+ assert.equal(context.quickRangeValues('nonsense', march), null);
+});