refactor: simplify test_verify.mjs and remove color formatting

- Remove red() function (not critical for tests)
- Extract testUrl() helper for testing URLs with badge count
- Add assertBadgeCount() for cleaner assertions
- Use testCases array for easier test case management
- Support '>0' as expected value for dynamic counts

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

.dockerignore

@@ -0,0 +1,16 @@
+.log
+node_modules
+sidebar.js
+web-ext-artifacts/
+lib/*
+yarn-error.log
+rentgen.zip
+
+# Generated PNG icons (build artifacts)
+assets/icons/*.png
+assets/icon-addon-*.png
+
+# Exception: do not ignore the `browser-api` directory inside `lib`
+!/lib/browser-api/
+
+Dockerfile

.gitignore

@@ -2,6 +2,7 @@
 node_modules
 sidebar.js
 /web-ext-artifacts/
+/artifacts/
 lib/*
 /yarn-error.log
 /rentgen.zip
@@ -11,4 +12,6 @@ lib/*
 /assets/icon-addon-*.png
 
 # Exception: do not ignore the `browser-api` directory inside `lib`
-!/lib/browser-api/
+!/lib/browser-api/
+
+.claude

.nvmrc

@@ -0,0 +1 @@
+25

Dockerfile

@@ -0,0 +1,106 @@
+# Rentgen Browser Extension - Docker Build
+# See README.md for detailed usage instructions
+
+# Build stage
+FROM node:lts AS builder
+
+WORKDIR /app
+
+# Copy package files for dependency installation (better layer caching)
+COPY package.json package-lock.json ./
+
+# Install dependencies
+RUN npm install
+
+# FIXME: COPY . . invalidates cache, so we need to optionally install Firefox
+# and jump back to the correct stage. It might be too complex though, so we
+# either need to use build args (if cache properly) or heavily document the
+# stage transitions, maybe even with a graph.
+
+# Copy source code (respecting .dockerignore)
+COPY . .
+
+# Build the extension for Firefox (default) - without tests
+RUN npm run build
+
+# Create the package
+RUN npm run create-package
+
+# Test builder stage - builds with ENABLE_TESTS=true
+FROM node:lts AS test_builder
+
+WORKDIR /app
+
+# Copy package files for dependency installation
+COPY package.json package-lock.json ./
+
+# Install dependencies
+RUN npm install
+
+# Copy source code
+COPY . .
+
+# Build with tests enabled
+RUN ENABLE_TESTS=true npm run build
+
+# Create the package
+RUN npm run create-package
+
+# Code quality stage - for running quality checks
+FROM builder AS code_quality
+COPY tests/run-checks.sh /app/tests/run-checks.sh
+RUN chmod +x /app/tests/run-checks.sh && /app/tests/run-checks.sh
+
+# Artifacts stage - only contains the built artifacts (for --output)
+FROM scratch AS artifacts
+
+# Copy only the built extension zip file to root
+COPY --from=builder /app/web-ext-artifacts/*.zip /
+
+# Default stage - full development environment
+FROM builder
+
+# Default command shows the built artifact
+CMD ["ls", "-lh", "/app/web-ext-artifacts/"]
+
+# Runtime stage - for running extension with Selenium WebDriver
+FROM node:lts AS runtime
+
+WORKDIR /app
+
+# Copy built extension from test_builder (includes test code)
+COPY --from=test_builder /app /app
+
+# Install Firefox and Xvfb for headless execution
+RUN apt-get update && apt-get install -y \
+    firefox-esr \
+    xvfb \
+    wget \
+    && rm -rf /var/lib/apt/lists/*
+
+# Install geckodriver for WebDriver protocol
+RUN wget -q https://github.com/mozilla/geckodriver/releases/download/v0.34.0/geckodriver-v0.34.0-linux64.tar.gz \
+    && tar -xzf geckodriver-v0.34.0-linux64.tar.gz \
+    && mv geckodriver /usr/local/bin/ \
+    && rm geckodriver-v0.34.0-linux64.tar.gz \
+    && chmod +x /usr/local/bin/geckodriver
+
+# Install Node.js test dependencies
+RUN npm install
+
+# Set display for Xvfb
+ENV DISPLAY=:99
+
+# Start script (not used in verify stage)
+CMD ["echo", "Use verify stage for testing"]
+
+# Integration test stage - automated testing with exit code
+FROM runtime AS integration_test
+
+# Copy verification scripts
+COPY tests/test_verify.mjs /app/tests/test_verify.mjs
+COPY tests/test-lib.js /app/tests/test-lib.js
+RUN chmod +x /app/tests/test_verify.mjs
+
+# Run verification and exit with proper exit code
+CMD ["node", "/app/tests/test_verify.mjs"]

README.md

@@ -21,9 +21,21 @@ Firefox: https://addons.mozilla.org/en-US/firefox/addon/rentgen/
 ### Pre-requirements
 
 -   OS: Linux x86_64
--   Node.js: 16.x version
+-   Node.js: 25.x version (recommended: use [fnm](https://github.com/Schniz/fnm) for automatic version management)
 -   npm: 7.x version or higher
 
+**Using fnm (recommended):**
+
+If you're using fnm, it will automatically use the correct Node.js version specified in `.nvmrc`:
+
+```bash
+# Install fnm (if not already installed)
+curl -fsSL https://fnm.vercel.app/install | bash
+
+# In the project directory, fnm will automatically use Node.js 25
+fnm use
+```
+
 ### Build steps
 
 1. Pull repository or download a zip package
@@ -82,9 +94,21 @@ Firefox: https://addons.mozilla.org/pl/firefox/addon/rentgen/
 ### Wymagania wstępne
 
 -   System operacyjny: Linux x86_64
--   Node.js: 16.x
+-   Node.js: 25.x (zalecane: użyj [fnm](https://github.com/Schniz/fnm) do automatycznego zarządzania wersją)
 -   npm: 7.x lub wyższy
 
+**Używanie fnm (zalecane):**
+
+Jeśli używasz fnm, automatycznie użyje prawidłowej wersji Node.js określonej w `.nvmrc`:
+
+```bash
+# Zainstaluj fnm (jeśli nie jest zainstalowane)
+curl -fsSL https://fnm.vercel.app/install | bash
+
+# W katalogu projektu fnm automatycznie użyje Node.js 25
+fnm use
+```
+
 ### Proces budowy
 
 1. Pobierz repozytorium przez `git pull https://git.internet-czas-dzialac.pl/icd/rentgen.git` lub pobierz archwium zip
@@ -112,3 +136,4 @@ Każdy problem zostanie sprawdzony i przeniesiony na wewnętrzną listę problem
 
 ---
 
+# Test pre-commit hook - without Docker check

background.ts

@@ -1,3 +1,35 @@
-import { init } from "./memory";
+import { init, getMemory } from "./memory";
+
+// Use global browser object directly (available in extension context)
+declare const browser: any;
+declare const ENABLE_TESTS: boolean;
 
 init();
+
+// Test verification handler for Marionette tests
+// Tests real Rentgen functionality: counting third-party domains
+if (ENABLE_TESTS) {
+    browser.runtime.onMessage.addListener((message: any, sender: any, sendResponse: any) => {
+        if (message.type === 'RENTGEN_TEST_VERIFICATION') {
+            // Get the origin from message (sent by content script)
+            const origin = message.origin;
+
+            // Access the memory to get clusters for this origin
+            const memory = getMemory();
+            const clusters = memory.getClustersForOrigin(origin);
+            const badgeCount = Object.keys(clusters).length;
+
+            // Send back the badge count (number of third-party domains)
+            const response = {
+                success: true,
+                badgeCount: badgeCount,
+                origin: origin,
+                clusterIds: Object.keys(clusters),
+                backgroundTimestamp: Date.now()
+            };
+
+            sendResponse(response);
+            return true;  // Keep channel open for async response
+        }
+    });
+}

components/report-window/use-survey.ts

@@ -8,7 +8,7 @@ import verbs, { v } from './verbs';
 export default function useSurvey(
     clusters: RequestCluster[],
     { onComplete }: { onComplete: (sender: { data: RawAnswers }) => void }
-): Survey.ReactSurveyModel | null {
+): Survey.Model | null {
     const [survey, setSurvey] = React.useState<Survey.Model | null>(null);
     React.useEffect(() => {
         const model = generateSurveyQuestions(clusters);

components/sidebar/stolen-data.tsx

@@ -43,7 +43,6 @@ export function StolenData({
                         origin={origin}
                         shorthost={cluster.id}
                         key={cluster.id + origin}
-                        refreshToken={eventCounts[cluster.id] || 0}
                         minValueLength={minValueLength}
                         cookiesOnly={cookiesOnly}
                         cookiesOrOriginOnly={cookiesOrOriginOnly}

compose.yml

@@ -0,0 +1,21 @@
+services:
+    rentgen_build:
+        build: .
+
+    rentgen_check:
+        build:
+            context: .
+            target: code_quality
+
+    rentgen_run:
+        build:
+            context: .
+            target: runtime
+        stdin_open: true
+        tty: true
+
+    rentgen_verify:
+        build:
+            context: .
+            target: integration_test
+        restart: "no"

esbuild.config.js

@@ -1,5 +1,7 @@
 import esbuild from 'esbuild';
 import scss from 'esbuild-plugin-sass';
+import fs from 'fs';
+import path from 'path';
 
 const watch = process.argv.includes('--watch') && {
     onRebuild(error) {
@@ -8,6 +10,8 @@ const watch = process.argv.includes('--watch') && {
     },
 };
 
+const ENABLE_TESTS = process.env.ENABLE_TESTS === 'true';
+
 // see https://github.com/evanw/esbuild/issues/806#issuecomment-779138268
 let skipReactImports = {
     name: 'skipReactImports',
@@ -41,17 +45,23 @@ let skipReactImports = {
     },
 };
 
+const entryPoints = [
+    'components/toolbar/toolbar.tsx',
+    'components/sidebar/sidebar.tsx',
+    'components/report-window/report-window.tsx',
+    'background.ts',
+    'diag.tsx',
+    'styles/global.scss',
+    'styles/fonts.scss',
+];
+
+if (ENABLE_TESTS) {
+    entryPoints.push('tests/inner-test-content-script.js');
+}
+
 esbuild
     .build({
-        entryPoints: [
-            'components/toolbar/toolbar.tsx',
-            'components/sidebar/sidebar.tsx',
-            'components/report-window/report-window.tsx',
-            'background.ts',
-            'diag.tsx',
-            'styles/global.scss',
-            'styles/fonts.scss',
-        ],
+        entryPoints,
         bundle: true,
         // minify: true,
         outdir: './lib',
@@ -60,9 +70,39 @@ esbuild
         define: {
             PLUGIN_NAME: '"Rentgen"',
             PLUGIN_URL: '"https://addons.mozilla.org/pl/firefox/addon/rentgen/"',
+            ENABLE_TESTS: String(ENABLE_TESTS),
         },
         external: ['react', 'react-dom', 'survey-react'],
         watch,
     })
-    .then(() => console.log('Add-on was built'))
+    .then(() => {
+        console.log('Add-on was built');
+
+        // Modify manifest.json to include test content script when ENABLE_TESTS=true
+        if (ENABLE_TESTS) {
+            const manifestPath = path.join(process.cwd(), 'manifest.json');
+            const manifest = JSON.parse(fs.readFileSync(manifestPath, 'utf-8'));
+
+            // Add content_scripts for testing
+            if (!manifest.content_scripts) {
+                manifest.content_scripts = [];
+            }
+
+            // Check if test script is already added
+            const hasTestScript = manifest.content_scripts.some(
+                cs => cs.js && cs.js.includes('lib/tests/inner-test-content-script.js')
+            );
+
+            if (!hasTestScript) {
+                manifest.content_scripts.push({
+                    matches: ['<all_urls>'],
+                    js: ['lib/tests/inner-test-content-script.js'],
+                    run_at: 'document_start'
+                });
+
+                fs.writeFileSync(manifestPath, JSON.stringify(manifest, null, 4));
+                console.log('Added test content script to manifest.json');
+            }
+        }
+    })
     .catch(() => process.exit(1));

manifest.json

@@ -3,8 +3,8 @@
     "manifest_version": 2,
     "name": "Rentgen",
     "short_name": "Rentgen",
-    "version": "0.1.10",
-    "author": "Kuba Orlik, Arkadiusz Wieczorek (Internet. Czas działać!)",
+    "version": "0.2.1",
+    "author": "Kuba Orlik, Arkadiusz Wieczorek (Internet. Time to act! Foundation)",
     "homepage_url": "https://git.internet-czas-dzialac.pl/icd/rentgen",
     "background": {
         "scripts": ["lib/background.js"]

memory.ts

@@ -13,6 +13,7 @@ function setDomainsCount(counter: number, tabId: number) {
 
 export default class Memory extends SaferEmitter {
     origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
+
     async register(request: ExtendedRequest) {
         await request.init();
         if (!request.isThirdParty()) {
@@ -45,7 +46,6 @@ export default class Memory extends SaferEmitter {
 
     constructor() {
         super();
-
         browser.webRequest.onBeforeRequest.addListener(
             async (request) => {
                 new ExtendedRequest(request);

package.json

@@ -1,6 +1,6 @@
 {
     "name": "rentgen",
-    "version": "0.1.10",
+    "version": "0.2.1",
     "description": "Rentgen is an add-on prepared for both Firefox-based and Chromium-based browsers. This extension will automatically visualize all the data that a given website sends to third parties.",
     "main": "esbuild.config.js",
     "type": "module",
@@ -16,10 +16,11 @@
         "build-addon:firefox": "npm i && npm run build:firefox && npm run create-package:firefox",
         "build-addon:chrome": "npm i && npm run build:chrome && npm run create-package:chrome",
         "create-package": "web-ext build --ignore-files '!**/node_modules' '!**/node_modules/**/react-dom' '!**/node_modules/**/react-dom/umd' '!**/node_modules/**/*/react-dom.production.min.js' '!**/node_modules/**/react' '!**/node_modules/**/react/umd' '!**/node_modules/**/*/react.production.min.js' '!**/node_modules/**/survey-react'  '!**/node_modules/**/survey-react/*.min.js' '!**/node_modules/**/survey-react/*.min.css' --overwrite-dest",
-        "create-package:firefox": "cd dist-firefox && web-ext build --overwrite-dest --artifacts-dir ../web-ext-artifacts",
+        "create-package:firefox": "web-ext build --overwrite-dest --artifacts-dir ../web-ext-artifacts",
         "create-package:chrome": "cd dist-chrome && 7z a -tzip ../web-ext-artifacts/rentgen-chrome-0.1.10.zip * && cd ..",
         "typecheck": "tsc --noEmit",
-        "lint": "web-ext lint"
+        "lint": "web-ext lint --ignore-files 'tests/**'",
+        "test": "ENABLE_TESTS=true npm run build && node tests/test_verify.mjs; git checkout manifest.json"
     },
     "repository": {
         "type": "git",
@@ -28,6 +29,9 @@
     "homepage": "https://git.internet-czas-dzialac.pl/icd/rentgen",
     "author": "Kuba Orlik, Arkadiusz Wieczorek",
     "license": "GPL-3.0-or-later",
+    "engines": {
+        "node": ">=25"
+    },
     "dependencies": {
         "@iabtcf/core": "^1.3.1",
         "@types/proposal-relative-indexing-method": "^0.1.0",
@@ -57,6 +61,7 @@
         "addons-linter": "^4.7.0",
         "esbuild": "^0.14.14",
         "esbuild-plugin-sass": "^1.0.1",
+        "selenium-webdriver": "^4.38.0",
         "typescript": "^4.6.4",
         "web-ext": "^6.7.0",
         "web-ext-types": "^3.2.1"

tests/inner-test-content-script.js

@@ -0,0 +1,48 @@
+// Test content script - RUNS INSIDE THE BROWSER EXTENSION
+// Only loaded during automated testing (ENABLE_TESTS=true)
+// This script proves bidirectional communication between content script and background
+
+// Browser API polyfill for Chrome/Chromium compatibility
+if (typeof browser === 'undefined') {
+    var browser = chrome;
+}
+
+// Set initial DOM marker to prove content script is injected
+(function() {
+    function setMarker() {
+        if (document.body) {
+            document.body.setAttribute('data-rentgen-injected', 'true');
+        } else {
+            // Wait for DOM ready
+            if (document.readyState === 'loading') {
+                document.addEventListener('DOMContentLoaded', () => {
+                    document.body.setAttribute('data-rentgen-injected', 'true');
+                });
+            }
+        }
+    }
+    setMarker();
+})();
+
+// Listen for test request from test script (test-lib.js)
+document.addEventListener('DEBUG_rentgen_test_request', async (event) => {
+    try {
+        // Send message to background script to get badge count for this origin
+        // This tests real Rentgen functionality: counting third-party domains
+        const response = await browser.runtime.sendMessage({
+            type: 'RENTGEN_TEST_VERIFICATION',
+            origin: window.location.origin,
+            url: window.location.href,
+            title: document.title,
+            timestamp: event.detail?.timestamp || Date.now()
+        });
+
+        // Store the badge count in DOM for the test script to read
+        if (response && response.success) {
+            document.body.setAttribute('data-rentgen-badge-count', String(response.badgeCount));
+        }
+    } catch (error) {
+        // If there's an error, the test will timeout waiting for badge count
+        console.error('Test verification error:', error);
+    }
+});

tests/pre-commit

@@ -0,0 +1,21 @@
+#!/bin/bash
+# Pre-commit hook for Rentgen extension
+# Builds and runs verification tests before allowing commit
+
+set -e
+
+echo "Running pre-commit checks..."
+
+# Build all stages
+echo "Building Docker images..."
+docker compose build
+
+# Run code quality checks (typecheck + lint)
+echo "Running code quality checks..."
+docker compose up --abort-on-container-exit --exit-code-from rentgen_check rentgen_check
+
+# Run integration tests
+echo "Running integration tests..."
+docker compose up --abort-on-container-exit --exit-code-from rentgen_verify rentgen_verify
+
+echo "✓ All pre-commit checks passed!"

tests/run-checks.sh

@@ -0,0 +1,16 @@
+#!/bin/bash
+# Code quality checks for Rentgen extension
+# Runs typecheck and lint
+
+set -e
+
+echo "Running type checking..."
+npm run typecheck
+
+echo "Running linter..."
+npm run lint
+
+echo "Running tests..."
+npm run test
+
+echo "✓ All code quality checks passed!"

tests/test-lib.js

@@ -0,0 +1,55 @@
+// Test library for Marionette-based extension verification
+// This JavaScript code runs in the browser context via Marionette
+
+/**
+ * Check if test content script is loaded
+ * The content script is automatically injected by manifest.json when ENABLE_TESTS=true
+ * @returns {Promise<boolean>} - True if content script is loaded
+ */
+async function waitForTestContentScript() {
+    // Wait for content script to set the marker
+    let attempts = 0;
+    while (attempts < 50) {
+        if (document.body && document.body.getAttribute('data-rentgen-injected') === 'true') {
+            return true;
+        }
+        await new Promise(resolve => setTimeout(resolve, 100));
+        attempts++;
+    }
+    return false;
+}
+
+/**
+ * Test that background script returns badge count correctly
+ * Tests real Rentgen functionality: counting third-party domains
+ * @returns {Promise<number|null>} - Badge count (number of third-party domains) or null on failure
+ */
+async function testBadgeCount() {
+    // Wait for content script to be loaded
+    const loaded = await waitForTestContentScript();
+    if (!loaded) {
+        return -1;  // Content script not loaded
+    }
+
+    // Dispatch test request to content script
+    document.dispatchEvent(new CustomEvent('DEBUG_rentgen_test_request', {
+        detail: { timestamp: Date.now() }
+    }));
+
+    // Wait for background response with badge count
+    return new Promise((resolve) => {
+        let attempts = 0;
+        const checkInterval = setInterval(() => {
+            attempts++;
+            const badgeCount = document.body.getAttribute('data-rentgen-badge-count');
+
+            if (badgeCount !== null) {
+                clearInterval(checkInterval);
+                resolve(parseInt(badgeCount));
+            } else if (attempts > 50) {
+                clearInterval(checkInterval);
+                resolve(null);
+            }
+        }, 100);
+    });
+}

tests/test_verify.mjs

@@ -0,0 +1,140 @@
+#!/usr/bin/env node
+/**
+ * test_verify.mjs - Extension badge count verification test using Selenium WebDriver
+ *
+ * Verifies Rentgen's core functionality: counting third-party domains.
+ * Tests two scenarios:
+ * 1. Site without third-party domains (news.ycombinator.com) → badge = 0
+ * 2. Site with third-party domains (pudelek.pl) → badge > 0
+ */
+
+import { Builder } from 'selenium-webdriver';
+import firefox from 'selenium-webdriver/firefox.js';
+import { readFileSync } from 'fs';
+import { fileURLToPath } from 'url';
+import { dirname, join } from 'path';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+// Load test library once
+const testLibPath = join(__dirname, 'test-lib.js');
+const testLib = readFileSync(testLibPath, 'utf-8');
+
+/**
+ * Test badge count for a specific URL
+ * @param {WebDriver} driver - Selenium WebDriver instance
+ * @param {string} url - URL to test
+ * @param {number} waitMs - How long to wait after page load
+ * @returns {Promise<number|null>} Badge count or null on failure
+ */
+async function testUrl(driver, url, waitMs = 5000) {
+    await driver.get(url);
+    await driver.sleep(waitMs);
+
+    const badgeCount = await driver.executeAsyncScript(`
+        const testLibCode = arguments[0];
+        const callback = arguments[1];
+
+        eval(testLibCode);
+        testBadgeCount().then(callback).catch(err => callback(null));
+    `, testLib);
+
+    return badgeCount;
+}
+
+/**
+ * Verify badge count matches expected value
+ * @param {number|null} actual - Actual badge count
+ * @param {number|string} expected - Expected value (number or '>0')
+ * @returns {boolean} Whether assertion passed
+ */
+function assertBadgeCount(actual, expected) {
+    if (actual === null) return false;
+    if (expected === '>0') return actual > 0;
+    return actual === expected;
+}
+
+async function testBadgeCount() {
+    let driver = null;
+
+    try {
+        const extensionPath = join(__dirname, '..');
+
+        console.log('  Launching Firefox with extension...');
+
+        const options = new firefox.Options();
+        if (process.env.HEADLESS !== 'false') {
+            options.addArguments('-headless');
+        }
+
+        driver = await new Builder()
+            .forBrowser('firefox')
+            .setFirefoxOptions(options)
+            .build();
+
+        console.log('  Installing extension...');
+        await driver.installAddon(extensionPath, true);
+
+        // Test cases: [url, expectedBadgeCount, waitMs, name]
+        const testCases = [
+            ['https://news.ycombinator.com', 0, 5000, 'news.ycombinator.com'],
+            ['https://pudelek.pl', '>0', 10000, 'pudelek.pl']
+        ];
+
+        const results = {};
+
+        for (const [url, expected, waitMs, name] of testCases) {
+            console.log(`  Testing ${name} (expected: ${expected === '>0' ? '>0' : expected} third-party domains)...`);
+            const badgeCount = await testUrl(driver, url, waitMs);
+            results[name] = badgeCount;
+            console.log(`    → Badge count: ${badgeCount}`);
+
+            if (!assertBadgeCount(badgeCount, expected)) {
+                await driver.quit();
+                return {
+                    success: false,
+                    error: `${name}: expected ${expected}, got ${badgeCount}`
+                };
+            }
+        }
+
+        await driver.quit();
+        return { success: true, results };
+
+    } catch (error) {
+        if (driver) {
+            await driver.quit();
+        }
+        return { success: false, error: error.message };
+    }
+}
+
+async function main() {
+    console.log('Starting Rentgen badge count verification test...');
+    console.log('');
+
+    const result = await testBadgeCount();
+
+    console.log('');
+    if (!result.success) {
+        console.log(`FAIL: ${result.error}`);
+        process.exit(1);
+    }
+
+    console.log('PASS: Badge count test succeeded!');
+    const resultNames = Object.keys(result.results);
+    for (const name of resultNames) {
+        console.log(`  - ${name}: ${result.results[name]} third-party domains`);
+    }
+    process.exit(0);
+}
+
+// Handle signals
+process.on('SIGINT', () => process.exit(130));
+process.on('SIGTERM', () => process.exit(143));
+
+main().catch(error => {
+    console.error(`ERROR: ${error.message}`);
+    process.exit(1);
+});