گزارش خطاهای روزانه تکناو
تعداد خطاها در ۲۴ ساعت گذشته: ${count}
بیشترین تکرار:
-
${topMessages.map(([msg, cnt]) =>
`
${msg}(${cnt} بار) `
).join('')}
این گزارش از پنل خطاهای تکناو ارسال شده است.
Hello
World'), 'Hello World'); }); it('handles null/undefined', () => { assert.equal(cleanText(null), ''); assert.equal(cleanText(undefined), ''); }); it('trims the result', () => { assert.equal(cleanText(' hello '), 'hello'); }); }); describe('normalizeFa', () => { it('removes ZWNJ (U+200C)', () => { assert.equal(normalizeFa('می\u200Cروید'), 'میرود'); }); it('removes tatweel (U+0640)', () => { assert.equal(normalizeFa('ع\u0640رب'), 'عرب'); }); it('removes diacritics', () => { assert.equal(normalizeFa('كِتَابٌ'), 'کتاب'); }); it('normalizes Arabic yeh to Persian yeh', () => { assert.equal(normalizeFa('ي'), 'ی'); }); it('normalizes Arabic keaf to Persian keaf', () => { assert.equal(normalizeFa('ك'), 'ک'); }); it('normalizes alef variants', () => { assert.equal(normalizeFa('أإآٱ'), 'اااا'); }); it('collapses whitespace and lowercases', () => { assert.equal(normalizeFa(' HELLO WORLD '), 'hello world'); }); it('handles empty string', () => { assert.equal(normalizeFa(''), ''); }); }); // ... (47 total tests) ``` #### Execution ```bash cd backend && node --test tests/unit-logic.test.mjs # Tests 47/47 passed # Duration: ~318ms ``` --- ### 1b. Backend Integration Tests **File**: `backend/tests/integration.test.mjs` **Framework**: `node:test` **Count**: ~20 test assertions across 8 test groups Integration tests run against a live backend server. They **auto-skip** if the backend is not reachable, making them safe to run in CI environments without a backend. #### Test Groups | Group | What It Tests | |-------|---------------| | Health endpoints | `GET /api/health` returns 200, `GET /api/ready` returns 200 or 503 | | Public content | Articles, categories, tags, authors, series, search, newsletter, jobs | | Auth gates | 8 protected endpoints return 401 without session | | Request tracing | `x-request-id` header is echoed in response | | Security headers | X-Content-Type-Options, X-Frame-Options, CSP, Permissions-Policy present | | 404 handling | Unknown routes return 404 | | Input validation | Bad newsletter subscription, bad error report return 400 | | Optional auth tests | Comment creation with session (skipped if no auth) | #### Auto-Skip Pattern ```javascript const BASE = 'http://localhost:3010'; let serverUp = false; try { const res = await fetch(`${BASE}/api/health`); serverUp = res.ok; } catch {} if (!serverUp) { console.log('Backend not reachable — skipping integration tests'); process.exit(0); } ``` For strict validation against a running backend: ```bash TEST_REQUIRE_SERVER=1 node --test tests/integration.test.mjs ``` --- ### 1c. Frontend Vitest Tests **Files**: - `src/lib/api.test.js` (4 tests) - `src/lib/content-api.test.js` (7 tests) - `src/test/setup.js` (test setup) - `vitest.config.js` (configuration) **Framework**: Vitest 4.1.8 with jsdom environment **Total**: 11 tests, all passing #### api.test.js — API Client Tests Tests the `api` fetch wrapper and `ApiError` class: ```javascript import { describe, it, expect, vi } from 'vitest'; import { api, ApiError } from './api.js'; describe('ApiError', () => { it('stores status and body', () => { const err = new ApiError(404, { error: 'not_found' }); expect(err.status).toBe(404); expect(err.body).toEqual({ error: 'not_found' }); }); }); describe('api client', () => { it('sends GET with Accept header and credentials', async () => { // Mocks global fetch, verifies headers }); it('sends POST with CSRF token and Content-Type', async () => { // Verifies tek_csrf cookie is read and sent as header }); it('throws ApiError on non-OK response', async () => { // Verifies error class and status/body }); }); ``` #### content-api.test.js — Content API Tests Tests the `contentApi` public content client with mocked `api.js`: ```javascript import { describe, it, expect, vi } from 'vitest'; import { contentApi } from './content-api.js'; vi.mock('./api.js', () => ({ api: { get: vi.fn(), post: vi.fn(), }, ApiError: class ApiError extends Error { constructor(s, b) { super(); this.status = s; this.body = b; } }, })); describe('contentApi', () => { it('listArticles calls correct endpoint', async () => { /* ... */ }); it('getArticle caches results', async () => { /* ... */ }); it('search URL-encodes Persian query', async () => { /* ... */ }); it('listCategories returns items', async () => { /* ... */ }); it('toggleReaction sends POST', async () => { /* ... */ }); it('subscribeNewsletter sends email and captcha', async () => { /* ... */ }); it('trackEvent sends POST', async () => { /* ... */ }); }); ``` #### vitest.config.js ```javascript import { defineConfig } from 'vitest/config'; import react from '@vitejs/plugin-react'; export default defineConfig({ plugins: [react()], test: { environment: 'jsdom', globals: true, setupFiles: ['./src/test/setup.js'], include: ['src/**/*.{test,spec}.{js,jsx}'], }, }); ``` #### Execution ```bash npx vitest run # Test Files 2 passed (2) # Tests 11 passed (11) # Duration ~4.2s ``` --- ### 1d. CI Pipeline Script **File**: `scripts/ci.mjs` A unified CI pipeline that runs all checks in sequence, continuing on failure and reporting a summary. ```javascript #!/usr/bin/env node import { execSync } from 'node:child_process'; const passed = []; const failed = []; function run(name, cmd, opts = {}) { process.stdout.write(`\n▶ ${name}… `); try { execSync(cmd, { stdio: opts.silent ? 'pipe' : 'inherit', timeout: opts.timeout ?? 120_000 }); passed.push(name); console.log('✓'); } catch (e) { failed.push(name); console.log('✗'); if (!opts.continue) { console.error(`\nAborting: ${name} failed.`); process.exit(1); } } } console.log('=== Teknav CI Pipeline ===\n'); // Backend checks run('Backend TypeScript build', 'cd backend && npx tsc --noEmit', { continue: true }); run('Backend unit tests', 'cd backend && node --test tests/unit-logic.test.mjs', { continue: true }); // Frontend checks run('Frontend Vitest tests', 'npx vitest run', { continue: true, timeout: 60_000 }); run('Frontend Vite build', 'npm run build', { continue: true, timeout: 300_000 }); run('No CDN URLs in dist', 'node scripts/check-no-cdn.mjs', { continue: true }); run('Responsive layout check', 'node scripts/check-responsive.mjs', { continue: true }); run('Production readiness', 'npm run preflight:prod', { continue: true }); // Summary console.log('\n=== CI Summary ==='); console.log(`Passed: ${passed.length}`); console.log(`Failed: ${failed.length}`); if (failed.length > 0) { console.log('Failed steps:', failed.join(', ')); process.exit(1); } else { console.log('All checks passed!'); process.exit(0); } ``` #### package.json Scripts Added ```json { "test": "vitest run", "test:watch": "vitest", "ci": "node scripts/ci.mjs" } ``` --- ## 4. Step 2: Code Modernization ### 2a. History API Routing (Remove hashchange) **File**: `teknav-ui.jsx` The `NavProvider` component previously listened to both `popstate` and `hashchange` events. The `hashchange` listener was a legacy from when the app used hash-based routing. Since the app has been using the History API for all navigation, the `hashchange` listener was redundant and could cause duplicate page updates. #### Before ```jsx useEffect(() => { const handler = () => setPage(getCurrentPage()); window.addEventListener('popstate', handler); window.addEventListener('hashchange', handler); return () => { window.removeEventListener('popstate', handler); window.removeEventListener('hashchange', handler); }; }, []); ``` #### After ```jsx useEffect(() => { const handler = () => setPage(getCurrentPage()); window.addEventListener('popstate', handler); return () => { window.removeEventListener('popstate', handler); }; }, []); ``` This ensures the app uses **only** the History API for route changes, eliminating the possibility of hash-based navigation being triggered. --- ### 2b. React Context Store **File**: `src/lib/store.jsx` Replaced the legacy `teknav-store.js` IIFE (Immediately Invoked Function Expression) that used `localStorage` for state management with a proper React context-based store. #### The Problem with teknav-store.js The original store was: - A module-level IIFE that mutated `localStorage` directly - Not integrated with React's rendering cycle — state changes didn't trigger re-renders - Used `localStorage` as the source of truth, which is synchronous and blocks the main thread - Had no cleanup mechanism for stale data #### The New Store ```jsx import { createContext, useContext, useState, useCallback, useEffect } from 'react'; import { api, ApiError } from './api.js'; const StoreCtx = createContext(null); export function StoreProvider({ children }) { const [user, setUser] = useState(null); const [bootstrapping, setBootstrapping] = useState(true); useEffect(() => { let cancelled = false; api.get('/api/auth/me') .then((res) => { if (!cancelled) setUser(res?.user ?? null); }) .catch(() => { if (!cancelled) setUser(null); }) .finally(() => { if (!cancelled) setBootstrapping(false); }); return () => { cancelled = true; }; }, []); const login = useCallback(async (identifier, password, captchaId, userSolution) => { const res = await api.post('/api/auth/login', { identifier, password, captchaId, userSolution }); if (res?.user) setUser(res.user); return res?.twoFactorRequired ? res : (res?.user ?? null); }, []); const logout = useCallback(async () => { try { await api.post('/api/auth/logout', {}); } catch {} setUser(null); }, []); const refreshMe = useCallback(async () => { const res = await api.get('/api/auth/me'); const u = res?.user ?? null; setUser(u); return u; }, []); return (تعداد خطاها در ۲۴ ساعت گذشته: ${count}
${msg} (${cnt} بار)این گزارش از پنل خطاهای تکناو ارسال شده است.