Refactor kantine.js into modular ES6 structure

Moved `kantine.js` into a `src/` directory with multiple modularized files:
- `api.js`: All API calls and constants
- `state.js`: State management (auth, cache, theme, tags, etc.)
- `utils.js`: Helpers for UI and Date formatting
- `ui.js`: DOM manipulation logic
- `events.js`: Initial DOM event listeners and logic hooks
- `actions.js`: Data fetching actions, local processing logic
- `ui_helpers.js`: UI helper functions (rendering modals, handling DOM injections)

Updated the `build-bookmarklet.sh` to compile with Webpack via newly created `webpack.config.js`. Updated all relevant test scripts to use the new output `dist/kantine.bundle.js` and modified logic to work within Webpack scopes.

Co-authored-by: TauNeutrino <1600410+TauNeutrino@users.noreply.github.com>
This commit is contained in:
google-labs-jules[bot]
2026-03-10 11:55:36 +00:00
parent 86e2e51dc3
commit 2f08a951b4
22 changed files with 9970 additions and 5230 deletions

View File

@@ -5,7 +5,7 @@ const path = require('path');
console.log("=== Running Logic Unit Tests ===");
// 1. Load Source Code
const jsPath = path.join(__dirname, 'kantine.js');
const jsPath = path.join(__dirname, 'dist', 'kantine.bundle.js');
const code = fs.readFileSync(jsPath, 'utf8');
// Generic Mock Element
@@ -52,8 +52,8 @@ const sandbox = {
return { ok: true, json: async () => [{ name: 'v9.9.9' }] };
}
// Mock Menu API
if (url.includes('/food-menu/menu/')) {
return { ok: true, json: async () => ({ dates: [], menu: {} }) };
if (url.includes('/venues/') && url.includes('/menu/')) {
return { ok: true, json: async () => ({ dates: [], menu: {}, results: [] }) };
}
// Mock Orders API
if (url.includes('/user/orders')) {
@@ -102,8 +102,12 @@ const sandbox = {
try {
vm.createContext(sandbox);
// Execute the code
const instrumentedCode = code.replace(/\n\}\)\(\);/, ' window.splitLanguage = splitLanguage;\n})();');
vm.runInContext(instrumentedCode, sandbox);
vm.runInContext(code, sandbox);
// Execute module to get function reference, since IIFE creates private scope
// For test_logic.js we need to evaluate the raw utils.js code to test splitLanguage directly
const utilsCode = require('fs').readFileSync(require('path').join(__dirname, 'src', 'utils.js'), 'utf8');
const cleanedUtilsCode = utilsCode.replace(/export /g, '').replace(/import .*? from .*?;/g, '');
vm.runInContext(cleanedUtilsCode, sandbox);
// Regex Check: update icon appended to header
@@ -176,7 +180,7 @@ try {
// but they are inside the IIFE. We can instead check if the parsed data has the same number of courses visually.
// We can evaluate a function in the sandbox to do the splitting
for (const tc of testCases) {
const result = sandbox.window.splitLanguage(tc.input);
const result = sandbox.splitLanguage(tc.input);
const deGange = result.de.split('•').filter(x => x.trim()).length;
const enGange = result.en.split('•').filter(x => x.trim()).length;