synapse-hub 2.2.3 → 2.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.agents/agents/failure-analyst.md +11 -0
- package/.agents/agents/live-explorer.md +28 -0
- package/.agents/agents/orchestrator.md +20 -4
- package/.agents/agents/pom-crafter.md +12 -0
- package/.agents/agents/quality-gatekeeper.md +19 -4
- package/.agents/agents/test-runner.md +11 -0
- package/.agents/rules/communication-style.md +40 -0
- package/.agents/rules/context-engineering.md +23 -0
- package/.agents/rules/git-push-protocol.md +11 -17
- package/.agents/rules/graphify.md +14 -14
- package/.agents/rules/lessons-learned.md +3 -3
- package/.agents/rules/mandatory-playwright-live.md +29 -29
- package/.agents/rules/mobile_appium_rules.md +132 -0
- package/.agents/rules/performance_testing_rules.md +74 -0
- package/.agents/rules/skill-precedence.md +1 -1
- package/.agents/rules/systematic-debugging.md +6 -6
- package/.agents/skills/agent-orchestration-multi-agent-optimize/SKILL.md +64 -215
- package/.agents/skills/agent-orchestration-multi-agent-optimize/examples/swarm_workload_config.json +12 -0
- package/.agents/skills/antigravity-test-sentinel/SKILL.md +3 -3
- package/.agents/skills/antigravity-test-sentinel/examples/dod_gate_policy.json +11 -0
- package/.agents/skills/api-network-mocking-interception/SKILL.md +1 -1
- package/.agents/skills/api-network-mocking-interception/examples/network_route_stub.json +9 -0
- package/.agents/skills/api-spec-to-e2e-matrix/SKILL.md +9 -9
- package/.agents/skills/api-spec-to-e2e-matrix/examples/sample_openapi.json +19 -0
- package/.agents/skills/architecture-decision-records/SKILL.md +35 -412
- package/.agents/skills/architecture-decision-records/examples/0001-record-architecture-decisions.md +12 -0
- package/.agents/skills/auth-session-and-cookie-manager/SKILL.md +4 -1
- package/.agents/skills/auth-session-and-cookie-manager/examples/storage_state_sample.json +11 -0
- package/.agents/skills/backend-load-and-stress-patterns/SKILL.md +80 -186
- package/.agents/skills/backend-load-and-stress-patterns/examples/k6_load_test_sample.js +13 -0
- package/.agents/skills/bats-testing-patterns/SKILL.md +1 -1
- package/.agents/skills/bats-testing-patterns/examples/cli_runner_test.bats +6 -0
- package/.agents/skills/bats-testing-patterns/resources/implementation-playbook.md +614 -614
- package/.agents/skills/clean-pom-crafter/SKILL.md +21 -3
- package/.agents/skills/clean-pom-crafter/examples/standard_test_case.groovy +28 -28
- package/.agents/skills/clean-pom-crafter/references/pom_patterns.groovy +138 -138
- package/.agents/skills/code-refactoring-refactor-clean/SKILL.md +2 -2
- package/.agents/skills/code-refactoring-refactor-clean/examples/refactored_page_sample.groovy +9 -0
- package/.agents/skills/code-refactoring-refactor-clean/resources/implementation-playbook.md +9 -7
- package/.agents/skills/db-state-verifier-and-seeder/SKILL.md +5 -5
- package/.agents/skills/db-state-verifier-and-seeder/examples/db_fixture_seed.json +12 -0
- package/.agents/skills/e2e-testing-patterns/SKILL.md +1 -1
- package/.agents/skills/e2e-testing-patterns/examples/playwright_sharded_config.ts +12 -0
- package/.agents/skills/e2e-testing-patterns/resources/implementation-playbook.md +522 -522
- package/.agents/skills/failure-autopsy-and-healing/SKILL.md +17 -3
- package/.agents/skills/failure-autopsy-and-healing/examples/sample_junit_failure.xml +8 -0
- package/.agents/skills/failure-autopsy-and-healing/references/healing_matrix.md +64 -64
- package/.agents/skills/failure-autopsy-and-healing/references/qa_investigation_protocol.md +56 -56
- package/.agents/skills/failure-autopsy-and-healing/scripts/triage_failures.sh +98 -98
- package/.agents/skills/file-and-report-validator/SKILL.md +1 -1
- package/.agents/skills/file-and-report-validator/examples/sample_export_schema.json +14 -0
- package/.agents/skills/flaky-test-sentinel-and-quarantine/SKILL.md +3 -3
- package/.agents/skills/flaky-test-sentinel-and-quarantine/examples/quarantine_registry.json +11 -0
- package/.agents/skills/gherkin-to-suite/SKILL.md +103 -0
- package/.agents/skills/gherkin-to-suite/examples/checkout.feature +39 -0
- package/.agents/skills/gherkin-to-suite/examples/suite_report_sample.json +334 -0
- package/.agents/skills/github-actions-templates/SKILL.md +47 -304
- package/.agents/skills/github-actions-templates/examples/matrix_test_pipeline.yml +8 -0
- package/.agents/skills/graphify-impact-analyzer/SKILL.md +6 -6
- package/.agents/skills/graphify-impact-analyzer/examples/dependency_blast_radius.json +8 -0
- package/.agents/skills/katalon-cli-runner/SKILL.md +2 -2
- package/.agents/skills/katalon-cli-runner/examples/headless_kre_exec.sh +3 -0
- package/.agents/skills/katalon-cli-runner/references/groovy-patterns.md +209 -209
- package/.agents/skills/katalon-cli-runner/references/katalon-api.md +155 -155
- package/.agents/skills/katalon-cli-runner/references/runner_commands.md +67 -67
- package/.agents/skills/lam-script-generator/SKILL.md +42 -1
- package/.agents/skills/lam-script-generator/examples/user_story_sample.md +8 -0
- package/.agents/skills/lean-code-ladder/SKILL.md +83 -0
- package/.agents/skills/lean-code-ladder/examples/ladder_walkthrough.md +37 -0
- package/.agents/skills/meta-prompt-crafter/SKILL.md +107 -0
- package/.agents/skills/meta-prompt-crafter/examples/qa_prompt_template.md +35 -0
- package/.agents/skills/persistent-planning-files/SKILL.md +108 -0
- package/.agents/skills/persistent-planning-files/examples/task_plan_example.md +56 -0
- package/.agents/skills/playwright-live-interaction/SKILL.md +49 -1
- package/.agents/skills/playwright-live-interaction/examples/live_probe_script.js +5 -0
- package/.agents/skills/playwright-live-interaction/references/advanced_superpowers.md +160 -160
- package/.agents/skills/playwright-live-interaction/references/compact_accessibility_snapshots.md +75 -75
- package/.agents/skills/playwright-live-interaction/references/recipes.md +388 -388
- package/.agents/skills/playwright-live-interaction/references/swarm_orchestration.md +134 -134
- package/.agents/skills/playwright-webapp-testing/SKILL.md +93 -0
- package/.agents/skills/playwright-webapp-testing/examples/server_lifecycle_playwright.py +63 -0
- package/.agents/skills/rbt-manual-testing/SKILL.md +150 -0
- package/.agents/skills/rbt-manual-testing/examples/checkout_rbt_manual_suite.md +25 -0
- package/.agents/skills/security-dast-sentinel/SKILL.md +57 -135
- package/.agents/skills/security-dast-sentinel/examples/dast_scan_config.json +10 -0
- package/.agents/skills/self-healing-locator/SKILL.md +24 -10
- package/.agents/skills/self-healing-locator/examples/aom_diff_sample.json +16 -0
- package/.agents/skills/skillspector-security-guard/SKILL.md +32 -90
- package/.agents/skills/skillspector-security-guard/examples/safe_mcp_config.json +12 -0
- package/.agents/skills/surgical-coding-principles/SKILL.md +89 -0
- package/.agents/skills/surgical-coding-principles/examples/surgical_vs_scope_creep.md +46 -0
- package/.agents/skills/synthetic-test-data-generator/SKILL.md +3 -3
- package/.agents/skills/synthetic-test-data-generator/examples/idempotent_data_recipe.json +9 -0
- package/.agents/skills/systematic-debugging/SKILL.md +100 -0
- package/.agents/skills/systematic-debugging/examples/four_phase_case.md +44 -0
- package/.agents/skills/test-driven-development/SKILL.md +114 -0
- package/.agents/skills/test-driven-development/examples/red_green_refactor_qa.md +78 -0
- package/.agents/skills/token-and-context-optimizer/SKILL.md +1 -1
- package/.agents/skills/token-and-context-optimizer/examples/distilled_log_sample.txt +3 -0
- package/.agents/skills/verification-before-completion/SKILL.md +100 -0
- package/.agents/skills/verification-before-completion/examples/evidence_log_example.md +46 -0
- package/.agents/skills/visual-regression-sentinel/SKILL.md +21 -1
- package/.agents/skills/visual-regression-sentinel/examples/visual_mask_rules.json +9 -0
- package/.agents/skills/wcag-audit-patterns/SKILL.md +3 -3
- package/.agents/skills/wcag-audit-patterns/examples/wcag_compliance_checklist.json +10 -0
- package/.agents/skills/wcag-audit-patterns/resources/implementation-playbook.md +541 -541
- package/.agents/skills/web-vitals-and-performance-profiler/SKILL.md +1 -1
- package/.agents/skills/web-vitals-and-performance-profiler/examples/cwv_budget_policy.json +6 -0
- package/.agents/templates/completion_report.md +57 -57
- package/.agents/workflows/analyze_requirement_document.md +18 -0
- package/.agents/workflows/export_testcases_excel.md +32 -0
- package/.agents/workflows/generate_combinatorial_test_data.md +28 -0
- package/.agents/workflows/generate_cross_module_test_plan.md +37 -0
- package/.agents/workflows/generate_manual_testcases_rbt.md +56 -0
- package/.agents/workflows/generate_requirements_from_website.md +25 -0
- package/.agents/workflows/generate_testcases_from_requirements.md +21 -0
- package/.agents/workflows/graphify.md +10 -10
- package/.agents/workflows/verify.md +2 -2
- package/.cursor/rules/language.mdc +7 -7
- package/.cursor/rules/synapse-qa.mdc +23 -0
- package/.cursorrules +7 -0
- package/.pre-commit-hooks.yaml +14 -0
- package/.windsurfrules +7 -0
- package/AGENTS.md +54 -15
- package/CLAUDE.md +35 -12
- package/LICENSE +30 -0
- package/NOTICE +180 -0
- package/README.en.md +325 -0
- package/README.md +247 -512
- package/action.yml +51 -0
- package/benchmarks/qa_eval/README.md +71 -0
- package/benchmarks/qa_eval/build_dataset.py +677 -0
- package/benchmarks/qa_eval/dataset/api_contract_drift/qa-challenge-06_api_contract_drift.json +22 -0
- package/benchmarks/qa_eval/dataset/api_contract_drift/qa-challenge-07_api_contract_drift.json +22 -0
- package/benchmarks/qa_eval/dataset/api_contract_drift/qa-challenge-08_api_contract_drift.json +22 -0
- package/benchmarks/qa_eval/dataset/api_contract_drift/qa-challenge-09_api_contract_drift.json +22 -0
- package/benchmarks/qa_eval/dataset/api_contract_drift/qa-challenge-10_api_contract_drift.json +22 -0
- package/benchmarks/qa_eval/dataset/fake_pass_tautology/qa-challenge-21_fake_pass_tautology.json +21 -0
- package/benchmarks/qa_eval/dataset/fake_pass_tautology/qa-challenge-22_fake_pass_tautology.json +21 -0
- package/benchmarks/qa_eval/dataset/fake_pass_tautology/qa-challenge-23_fake_pass_tautology.json +21 -0
- package/benchmarks/qa_eval/dataset/fake_pass_tautology/qa-challenge-24_fake_pass_tautology.json +21 -0
- package/benchmarks/qa_eval/dataset/fake_pass_tautology/qa-challenge-25_fake_pass_tautology.json +21 -0
- package/benchmarks/qa_eval/dataset/locator_drift/qa-challenge-01_locator_drift.json +23 -0
- package/benchmarks/qa_eval/dataset/locator_drift/qa-challenge-02_locator_drift.json +23 -0
- package/benchmarks/qa_eval/dataset/locator_drift/qa-challenge-03_locator_drift.json +23 -0
- package/benchmarks/qa_eval/dataset/locator_drift/qa-challenge-04_locator_drift.json +23 -0
- package/benchmarks/qa_eval/dataset/locator_drift/qa-challenge-05_locator_drift.json +23 -0
- package/benchmarks/qa_eval/dataset/stale_and_mutation/qa-challenge-16_stale_and_mutation.json +22 -0
- package/benchmarks/qa_eval/dataset/stale_and_mutation/qa-challenge-17_stale_and_mutation.json +22 -0
- package/benchmarks/qa_eval/dataset/stale_and_mutation/qa-challenge-18_stale_and_mutation.json +22 -0
- package/benchmarks/qa_eval/dataset/stale_and_mutation/qa-challenge-19_stale_and_mutation.json +22 -0
- package/benchmarks/qa_eval/dataset/stale_and_mutation/qa-challenge-20_stale_and_mutation.json +23 -0
- package/benchmarks/qa_eval/dataset/timing_and_race/qa-challenge-11_timing_and_race.json +22 -0
- package/benchmarks/qa_eval/dataset/timing_and_race/qa-challenge-12_timing_and_race.json +22 -0
- package/benchmarks/qa_eval/dataset/timing_and_race/qa-challenge-13_timing_and_race.json +22 -0
- package/benchmarks/qa_eval/dataset/timing_and_race/qa-challenge-14_timing_and_race.json +22 -0
- package/benchmarks/qa_eval/dataset/timing_and_race/qa-challenge-15_timing_and_race.json +22 -0
- package/benchmarks/qa_eval/eval_runner.py +418 -0
- package/benchmarks/qa_eval/reports/AB_METHODOLOGY_REPORT.md +83 -0
- package/benchmarks/qa_eval/reports/BENCHMARK_REPORT.md +69 -0
- package/benchmarks/qa_eval/reports/eval_results.json +105 -0
- package/bin/agent-qa.js +10 -3
- package/docs/ARCHITECTURE.md +107 -0
- package/docs/CI_CD_INTEGRATION.md +94 -0
- package/docs/CLI_REFERENCE.md +157 -0
- package/docs/CONTRIBUTING.md +91 -0
- package/docs/PLUGIN_DEVELOPMENT_GUIDE.md +126 -0
- package/docs/TOKEN_QUOTA_PLAYBOOK.md +41 -0
- package/docs/adopted-ecosystem-tools.md +87 -0
- package/docs/schemas/synapse.config.schema.json +64 -0
- package/examples/cypress-ecommerce-suite/README.md +45 -0
- package/examples/cypress-ecommerce-suite/cypress/e2e/checkout.cy.js +17 -0
- package/examples/cypress-ecommerce-suite/cypress/pages/BasePage.js +29 -0
- package/examples/cypress-ecommerce-suite/cypress/pages/CartPage.js +51 -0
- package/examples/cypress-ecommerce-suite/cypress.config.js +13 -0
- package/examples/cypress-ecommerce-suite/package.json +13 -0
- package/examples/katalon-suite/Keywords/pages/BasePage.groovy +19 -0
- package/examples/katalon-suite/Keywords/pages/DashboardPage.groovy +29 -0
- package/examples/katalon-suite/Keywords/pages/LoginPage.groovy +45 -0
- package/examples/katalon-suite/Profiles/default.glbl +12 -0
- package/examples/katalon-suite/README.md +18 -0
- package/examples/katalon-suite/Scripts/Auth/TC_LoginSuccess/Script1234567890.groovy +12 -0
- package/examples/katalon-suite/Scripts/Dashboard/TC_ViewSummary/Script1234567891.groovy +15 -0
- package/examples/katalon-suite/katalon_suite.prj +21 -0
- package/examples/playwright-crm-suite/README.md +40 -0
- package/examples/playwright-crm-suite/package.json +14 -0
- package/examples/playwright-crm-suite/pages/BasePage.ts +37 -0
- package/examples/playwright-crm-suite/pages/CustomerPage.ts +57 -0
- package/examples/playwright-crm-suite/pages/LoginPage.ts +32 -0
- package/examples/playwright-crm-suite/playwright.config.ts +27 -0
- package/examples/playwright-crm-suite/tests/auth.spec.ts +22 -0
- package/examples/playwright-crm-suite/tests/customers.spec.ts +33 -0
- package/examples/plugins/sample-custom-plugin/README.md +14 -0
- package/examples/plugins/sample-custom-plugin/plugin.json +16 -0
- package/examples/plugins/sample-custom-plugin/skills/custom-security-headers-audit/SKILL.md +29 -0
- package/examples/plugins/sample-custom-plugin/skills/custom-security-headers-audit/examples/audit_fixture.json +8 -0
- package/examples/plugins/sample-custom-plugin/tools/custom_security_headers.py +125 -0
- package/examples/practices/README.md +22 -0
- package/examples/practices/requirements/crm/requirements_contracts.md +292 -0
- package/examples/practices/requirements/crm/requirements_customers.md +462 -0
- package/examples/practices/requirements/crm/requirements_login.md +202 -0
- package/examples/practices/requirements/crm/requirements_projects.md +396 -0
- package/examples/practices/requirements/crm/requirements_tasks.md +343 -0
- package/examples/practices/requirements/ecommerce/requirements_category_brand.txt +402 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-1/2026-04-03_04-28-27.png +0 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-1/KAN-1_requirement.md +52 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-4/2026-04-03_04-28-19.png +0 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-4/2026-04-03_04-28-57.png +0 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-4/KAN-4_requirement.md +119 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-5_overview.md +9 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-6/2026-04-03_05-58-08.png +0 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-6/2026-04-03_05-58-23.png +0 -0
- package/examples/practices/requirements/jira/KAN-5/KAN-6/KAN-6_requirement.md +32 -0
- package/examples/practices/testcases/api/book_management_api_test_cases.md +144 -0
- package/examples/practices/testcases/api/user_management_api_test_cases.md +139 -0
- package/examples/practices/testcases/crm/test_cases_crm_login.md +148 -0
- package/examples/practices/testcases/crm/test_cases_customers.md +156 -0
- package/examples/pytest-api-suite/README.md +45 -0
- package/examples/pytest-api-suite/conftest.py +31 -0
- package/examples/pytest-api-suite/pages/user_api_client.py +36 -0
- package/examples/pytest-api-suite/requirements.txt +2 -0
- package/examples/pytest-api-suite/tests/test_user_api.py +44 -0
- package/examples/selenium-suite/README.md +18 -0
- package/examples/selenium-suite/pages/base_page.py +27 -0
- package/examples/selenium-suite/pages/login_page.py +29 -0
- package/examples/selenium-suite/pages/order_page.py +25 -0
- package/examples/selenium-suite/pytest.ini +6 -0
- package/examples/selenium-suite/requirements.txt +2 -0
- package/examples/selenium-suite/tests/test_login.py +10 -0
- package/examples/selenium-suite/tests/test_order.py +10 -0
- package/package.json +22 -7
- package/scripts/generate_skill_examples.py +244 -0
- package/scripts/install.ps1 +112 -0
- package/scripts/install_global_plugin.ps1 +94 -0
- package/scripts/install_global_plugin.sh +49 -0
- package/scripts/lint_skills.ps1 +57 -0
- package/scripts/package_dist.py +323 -0
- package/scripts/setup.sh +59 -0
- package/scripts/update_hub.ps1 +19 -0
- package/scripts/update_hub.sh +15 -0
- package/skills_manifest.json +209 -6
- package/synapse.config.json +30 -0
- package/templates/PROJECT_AI_GUIDE_TEMPLATE.md +7 -7
- package/templates/PROJECT_STATE_TEMPLATE.md +1 -1
- package/templates/ai_bridges/CLAUDE.md +33 -16
- package/templates/ai_bridges/copilot-instructions.md +14 -21
- package/templates/ai_bridges/cursor_synapse_qa.mdc +17 -20
- package/templates/ai_bridges/windsurfrules +21 -21
- package/templates/ci/github-actions-synapse.yml +71 -4
- package/templates/welcome.html.tmpl +1674 -0
- package/tools/.infer_baseline.json +1102 -0
- package/tools/TOOLS_RUNBOOK.md +92 -130
- package/tools/__init__.py +26 -0
- package/tools/agent_canary.py +501 -501
- package/tools/analyze_project.py +31 -17
- package/tools/api_fuzzer.py +278 -6
- package/tools/author_integrity.py +6 -6
- package/tools/auto_heal.py +1 -1
- package/tools/browser_helpers.js +105 -7
- package/tools/bug_reporter.py +31 -1
- package/tools/bump_version.py +23 -3
- package/tools/cache_resolver.py +248 -14
- package/tools/check_env.py +55 -14
- package/tools/check_version_sync.py +153 -0
- package/tools/ci_healing_hook.py +1 -1
- package/tools/cli.py +263 -13
- package/tools/count_tokens.py +1257 -0
- package/tools/dashboard_generator.py +2638 -0
- package/tools/db_sandbox.py +198 -20
- package/tools/e2e_flow_prober.ps1 +12 -64
- package/tools/e2e_flow_prober.py +99 -0
- package/tools/e2e_flow_prober.sh +4 -0
- package/tools/export_postman_collection.py +29 -7
- package/tools/flaky_detector.py +4 -3
- package/tools/generate_allure_report.ps1 +12 -29
- package/tools/generate_allure_report.py +77 -0
- package/tools/generate_allure_report.sh +4 -0
- package/tools/generate_jmx_plan.py +299 -68
- package/tools/generate_test_reports.ps1 +12 -134
- package/tools/generate_test_reports.py +133 -0
- package/tools/generate_test_reports.sh +4 -0
- package/tools/gherkin_suite.py +758 -0
- package/tools/git_pre_commit_guard.py +12 -6
- package/tools/goldfish_review.py +366 -0
- package/tools/heal_pr_automator.py +1 -1
- package/tools/heuristic_locator_matcher.py +170 -21
- package/tools/infer_linter.py +612 -70
- package/tools/jtl_analyzer.py +1 -1
- package/tools/lint_ai_docs.py +64 -0
- package/tools/matrix_sharder.py +1 -1
- package/tools/mcp_excel_server.ps1 +12 -250
- package/tools/mcp_excel_server.py +249 -0
- package/tools/mcp_excel_server.sh +4 -0
- package/tools/mcp_server.py +368 -144
- package/tools/md_to_xlsx.py +307 -0
- package/tools/micro_mutator.py +300 -69
- package/tools/omni_transpiler.py +2 -2
- package/tools/output_formatter.py +128 -0
- package/tools/pinpoint_failure.py +88 -88
- package/tools/project_state.py +2 -2
- package/tools/repo_map.py +1 -1
- package/tools/safety_firewall.py +197 -33
- package/tools/setup_project.py +294 -30
- package/tools/skillspector.py +8 -8
- package/tools/spec_drift_sentinel.py +439 -0
- package/tools/sync_agent_rules.py +248 -0
- package/tools/telemetry_correlator.py +45 -0
- package/tools/test_impact.py +51 -12
- package/tools/tms_sync_bridge.py +21 -5
- package/tools/universal_ir.py +3 -0
- package/tools/update_sentinel.py +87 -15
- package/tools/verify_all.ps1 +13 -0
- package/tools/verify_all.py +463 -79
- package/tools/visual_diff_canvas.py +1 -0
- package/tools/visual_som_helper.py +1 -1
- package/tools/watch_mode.py +305 -0
- package/tools/welcome_page.py +291 -0
|
@@ -0,0 +1,1674 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="__DEFAULT_LANG__">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Chào mừng đến với Synapse Hub — Trung Tâm Trí Tuệ QA Toàn Diện</title>
|
|
7
|
+
<style>
|
|
8
|
+
:root {
|
|
9
|
+
--bg-primary: #07090e;
|
|
10
|
+
--bg-secondary: #0d121d;
|
|
11
|
+
--bg-card: rgba(17, 24, 39, 0.75);
|
|
12
|
+
--bg-card-hover: rgba(30, 41, 59, 0.85);
|
|
13
|
+
--border-color: rgba(255, 255, 255, 0.08);
|
|
14
|
+
--border-highlight: rgba(99, 102, 241, 0.35);
|
|
15
|
+
--text-main: #f8fafc;
|
|
16
|
+
--text-secondary: #94a3b8;
|
|
17
|
+
--text-muted: #64748b;
|
|
18
|
+
--accent-cyan: #06b6d4;
|
|
19
|
+
--accent-indigo: #6366f1;
|
|
20
|
+
--accent-emerald: #10b981;
|
|
21
|
+
--accent-amber: #f59e0b;
|
|
22
|
+
--accent-rose: #f43f5e;
|
|
23
|
+
--accent-purple: #a855f7;
|
|
24
|
+
--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
25
|
+
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
29
|
+
body {
|
|
30
|
+
background: var(--bg-primary);
|
|
31
|
+
color: var(--text-main);
|
|
32
|
+
font-family: var(--font-sans);
|
|
33
|
+
line-height: 1.6;
|
|
34
|
+
overflow-x: hidden;
|
|
35
|
+
background-image:
|
|
36
|
+
radial-gradient(circle at 15% 15%, rgba(99, 102, 241, 0.12) 0%, transparent 40%),
|
|
37
|
+
radial-gradient(circle at 85% 25%, rgba(6, 182, 212, 0.10) 0%, transparent 45%),
|
|
38
|
+
radial-gradient(circle at 50% 80%, rgba(16, 185, 129, 0.08) 0%, transparent 50%);
|
|
39
|
+
background-attachment: fixed;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.container {
|
|
43
|
+
max-width: 1280px;
|
|
44
|
+
margin: 0 auto;
|
|
45
|
+
padding: 0 24px;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
/* Navbar */
|
|
49
|
+
nav {
|
|
50
|
+
position: sticky;
|
|
51
|
+
top: 0;
|
|
52
|
+
z-index: 100;
|
|
53
|
+
background: rgba(7, 9, 14, 0.90);
|
|
54
|
+
backdrop-filter: blur(16px);
|
|
55
|
+
-webkit-backdrop-filter: blur(16px);
|
|
56
|
+
border-bottom: 1px solid var(--border-color);
|
|
57
|
+
padding: 12px 0;
|
|
58
|
+
}
|
|
59
|
+
.nav-inner {
|
|
60
|
+
display: flex;
|
|
61
|
+
align-items: center;
|
|
62
|
+
justify-content: space-between;
|
|
63
|
+
gap: 16px;
|
|
64
|
+
}
|
|
65
|
+
.brand {
|
|
66
|
+
display: flex;
|
|
67
|
+
align-items: center;
|
|
68
|
+
gap: 10px;
|
|
69
|
+
text-decoration: none;
|
|
70
|
+
color: var(--text-main);
|
|
71
|
+
flex-shrink: 0;
|
|
72
|
+
}
|
|
73
|
+
.brand-icon {
|
|
74
|
+
width: 34px;
|
|
75
|
+
height: 34px;
|
|
76
|
+
background: linear-gradient(135deg, var(--accent-cyan), var(--accent-indigo));
|
|
77
|
+
border-radius: 9px;
|
|
78
|
+
display: flex;
|
|
79
|
+
align-items: center;
|
|
80
|
+
justify-content: center;
|
|
81
|
+
font-size: 18px;
|
|
82
|
+
box-shadow: 0 0 16px rgba(99, 102, 241, 0.4);
|
|
83
|
+
}
|
|
84
|
+
.brand-name {
|
|
85
|
+
font-size: 17px;
|
|
86
|
+
font-weight: 800;
|
|
87
|
+
letter-spacing: -0.5px;
|
|
88
|
+
background: linear-gradient(to right, #fff, #cbd5e1);
|
|
89
|
+
-webkit-background-clip: text;
|
|
90
|
+
-webkit-text-fill-color: transparent;
|
|
91
|
+
white-space: nowrap;
|
|
92
|
+
}
|
|
93
|
+
.version-tag {
|
|
94
|
+
font-size: 11px;
|
|
95
|
+
background: rgba(99, 102, 241, 0.15);
|
|
96
|
+
color: #818cf8;
|
|
97
|
+
padding: 2px 7px;
|
|
98
|
+
border-radius: 10px;
|
|
99
|
+
border: 1px solid rgba(99, 102, 241, 0.3);
|
|
100
|
+
font-weight: 700;
|
|
101
|
+
font-family: var(--font-mono);
|
|
102
|
+
white-space: nowrap;
|
|
103
|
+
}
|
|
104
|
+
.nav-links {
|
|
105
|
+
display: flex;
|
|
106
|
+
align-items: center;
|
|
107
|
+
gap: 18px;
|
|
108
|
+
list-style: none;
|
|
109
|
+
flex-wrap: nowrap;
|
|
110
|
+
margin: 0 8px;
|
|
111
|
+
}
|
|
112
|
+
.nav-links a {
|
|
113
|
+
color: var(--text-secondary);
|
|
114
|
+
text-decoration: none;
|
|
115
|
+
font-size: 13.5px;
|
|
116
|
+
font-weight: 600;
|
|
117
|
+
transition: color 0.2s;
|
|
118
|
+
white-space: nowrap;
|
|
119
|
+
}
|
|
120
|
+
.nav-links a:hover { color: var(--accent-cyan); }
|
|
121
|
+
.nav-actions {
|
|
122
|
+
display: flex;
|
|
123
|
+
align-items: center;
|
|
124
|
+
gap: 10px;
|
|
125
|
+
flex-shrink: 0;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
/* Language Switcher */
|
|
129
|
+
.lang-switch {
|
|
130
|
+
display: inline-flex;
|
|
131
|
+
align-items: center;
|
|
132
|
+
background: rgba(255, 255, 255, 0.05);
|
|
133
|
+
border: 1px solid var(--border-color);
|
|
134
|
+
border-radius: 20px;
|
|
135
|
+
padding: 3px;
|
|
136
|
+
}
|
|
137
|
+
.lang-btn {
|
|
138
|
+
background: transparent;
|
|
139
|
+
border: none;
|
|
140
|
+
color: var(--text-muted);
|
|
141
|
+
font-size: 12px;
|
|
142
|
+
font-weight: 700;
|
|
143
|
+
padding: 4px 10px;
|
|
144
|
+
border-radius: 16px;
|
|
145
|
+
cursor: pointer;
|
|
146
|
+
transition: all 0.2s ease;
|
|
147
|
+
}
|
|
148
|
+
.lang-btn.active {
|
|
149
|
+
background: linear-gradient(135deg, var(--accent-indigo), #4f46e5);
|
|
150
|
+
color: #ffffff;
|
|
151
|
+
box-shadow: 0 2px 8px rgba(79, 70, 229, 0.4);
|
|
152
|
+
}
|
|
153
|
+
.lang-btn:hover:not(.active) {
|
|
154
|
+
color: var(--text-main);
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
/* Buttons */
|
|
158
|
+
.btn {
|
|
159
|
+
display: inline-flex;
|
|
160
|
+
align-items: center;
|
|
161
|
+
gap: 8px;
|
|
162
|
+
padding: 9px 18px;
|
|
163
|
+
border-radius: 8px;
|
|
164
|
+
font-size: 13px;
|
|
165
|
+
font-weight: 600;
|
|
166
|
+
text-decoration: none;
|
|
167
|
+
cursor: pointer;
|
|
168
|
+
transition: all 0.2s ease;
|
|
169
|
+
border: 1px solid transparent;
|
|
170
|
+
}
|
|
171
|
+
.btn-primary {
|
|
172
|
+
background: linear-gradient(135deg, var(--accent-indigo), #4f46e5);
|
|
173
|
+
color: #ffffff;
|
|
174
|
+
box-shadow: 0 4px 14px rgba(79, 70, 229, 0.4);
|
|
175
|
+
}
|
|
176
|
+
.btn-primary:hover {
|
|
177
|
+
background: linear-gradient(135deg, #4f46e5, #4338ca);
|
|
178
|
+
transform: translateY(-1px);
|
|
179
|
+
box-shadow: 0 6px 20px rgba(79, 70, 229, 0.6);
|
|
180
|
+
}
|
|
181
|
+
.btn-secondary {
|
|
182
|
+
background: rgba(255, 255, 255, 0.05);
|
|
183
|
+
color: var(--text-main);
|
|
184
|
+
border: 1px solid var(--border-color);
|
|
185
|
+
}
|
|
186
|
+
.btn-secondary:hover {
|
|
187
|
+
background: rgba(255, 255, 255, 0.1);
|
|
188
|
+
border-color: rgba(255, 255, 255, 0.2);
|
|
189
|
+
}
|
|
190
|
+
.btn-emerald {
|
|
191
|
+
background: rgba(16, 185, 129, 0.15);
|
|
192
|
+
color: var(--accent-emerald);
|
|
193
|
+
border: 1px solid rgba(16, 185, 129, 0.3);
|
|
194
|
+
}
|
|
195
|
+
.btn-emerald:hover {
|
|
196
|
+
background: rgba(16, 185, 129, 0.25);
|
|
197
|
+
border-color: var(--accent-emerald);
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
/* Hero Section */
|
|
201
|
+
.hero {
|
|
202
|
+
padding: 72px 0 48px;
|
|
203
|
+
text-align: center;
|
|
204
|
+
}
|
|
205
|
+
/* Animations */
|
|
206
|
+
@keyframes fadeInUp {
|
|
207
|
+
from {
|
|
208
|
+
opacity: 0;
|
|
209
|
+
transform: translateY(20px);
|
|
210
|
+
}
|
|
211
|
+
to {
|
|
212
|
+
opacity: 1;
|
|
213
|
+
transform: translateY(0);
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
@keyframes pulseGlow {
|
|
217
|
+
0%, 100% {
|
|
218
|
+
box-shadow: 0 0 16px rgba(99, 102, 241, 0.35);
|
|
219
|
+
}
|
|
220
|
+
50% {
|
|
221
|
+
box-shadow: 0 0 28px rgba(6, 182, 212, 0.55);
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
@keyframes shimmerBorder {
|
|
225
|
+
0%, 100% { border-color: rgba(99, 102, 241, 0.3); }
|
|
226
|
+
50% { border-color: rgba(6, 182, 212, 0.65); }
|
|
227
|
+
}
|
|
228
|
+
@keyframes floatSubtle {
|
|
229
|
+
0%, 100% { transform: translateY(0); }
|
|
230
|
+
50% { transform: translateY(-4px); }
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
.hero-pill {
|
|
234
|
+
display: inline-flex;
|
|
235
|
+
align-items: center;
|
|
236
|
+
gap: 8px;
|
|
237
|
+
background: rgba(99, 102, 241, 0.1);
|
|
238
|
+
border: 1px solid rgba(99, 102, 241, 0.25);
|
|
239
|
+
padding: 6px 16px;
|
|
240
|
+
border-radius: 20px;
|
|
241
|
+
font-size: 12px;
|
|
242
|
+
font-weight: 600;
|
|
243
|
+
color: #a5b4fc;
|
|
244
|
+
margin-bottom: 24px;
|
|
245
|
+
animation: fadeInUp 0.5s ease both, shimmerBorder 3s infinite;
|
|
246
|
+
}
|
|
247
|
+
.hero h1 {
|
|
248
|
+
font-size: 46px;
|
|
249
|
+
font-weight: 800;
|
|
250
|
+
letter-spacing: -1.2px;
|
|
251
|
+
line-height: 1.2;
|
|
252
|
+
margin-bottom: 20px;
|
|
253
|
+
background: linear-gradient(135deg, #ffffff 20%, #cbd5e1 60%, var(--accent-cyan) 100%);
|
|
254
|
+
-webkit-background-clip: text;
|
|
255
|
+
-webkit-text-fill-color: transparent;
|
|
256
|
+
animation: fadeInUp 0.6s 0.1s ease both;
|
|
257
|
+
}
|
|
258
|
+
.hero p {
|
|
259
|
+
font-size: 17px;
|
|
260
|
+
color: var(--text-secondary);
|
|
261
|
+
max-width: 820px;
|
|
262
|
+
margin: 0 auto 32px;
|
|
263
|
+
line-height: 1.6;
|
|
264
|
+
animation: fadeInUp 0.7s 0.2s ease both;
|
|
265
|
+
}
|
|
266
|
+
.hero-buttons {
|
|
267
|
+
display: flex;
|
|
268
|
+
align-items: center;
|
|
269
|
+
justify-content: center;
|
|
270
|
+
gap: 16px;
|
|
271
|
+
margin-bottom: 48px;
|
|
272
|
+
flex-wrap: wrap;
|
|
273
|
+
animation: fadeInUp 0.8s 0.3s ease both;
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
/* Stats Ribbon */
|
|
277
|
+
.stats-ribbon {
|
|
278
|
+
display: grid;
|
|
279
|
+
grid-template-columns: repeat(4, 1fr);
|
|
280
|
+
gap: 16px;
|
|
281
|
+
background: var(--bg-card);
|
|
282
|
+
backdrop-filter: blur(12px);
|
|
283
|
+
border: 1px solid var(--border-color);
|
|
284
|
+
border-radius: 16px;
|
|
285
|
+
padding: 24px;
|
|
286
|
+
margin-bottom: 64px;
|
|
287
|
+
animation: fadeInUp 0.9s 0.4s ease both;
|
|
288
|
+
}
|
|
289
|
+
.stat-item {
|
|
290
|
+
text-align: center;
|
|
291
|
+
padding: 8px 16px;
|
|
292
|
+
border-right: 1px solid var(--border-color);
|
|
293
|
+
}
|
|
294
|
+
.stat-item:last-child { border-right: none; }
|
|
295
|
+
.stat-val {
|
|
296
|
+
font-size: 32px;
|
|
297
|
+
font-weight: 800;
|
|
298
|
+
font-family: var(--font-mono);
|
|
299
|
+
letter-spacing: -1px;
|
|
300
|
+
margin-bottom: 4px;
|
|
301
|
+
}
|
|
302
|
+
.stat-label {
|
|
303
|
+
font-size: 13px;
|
|
304
|
+
color: var(--text-muted);
|
|
305
|
+
text-transform: uppercase;
|
|
306
|
+
font-weight: 600;
|
|
307
|
+
letter-spacing: 0.5px;
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
/* Section Headers */
|
|
311
|
+
.section-header {
|
|
312
|
+
text-align: center;
|
|
313
|
+
margin-bottom: 40px;
|
|
314
|
+
}
|
|
315
|
+
.section-tag {
|
|
316
|
+
font-size: 12px;
|
|
317
|
+
font-weight: 700;
|
|
318
|
+
text-transform: uppercase;
|
|
319
|
+
letter-spacing: 1px;
|
|
320
|
+
color: var(--accent-cyan);
|
|
321
|
+
margin-bottom: 8px;
|
|
322
|
+
display: block;
|
|
323
|
+
}
|
|
324
|
+
.section-title {
|
|
325
|
+
font-size: 32px;
|
|
326
|
+
font-weight: 800;
|
|
327
|
+
letter-spacing: -0.8px;
|
|
328
|
+
margin-bottom: 12px;
|
|
329
|
+
}
|
|
330
|
+
.section-desc {
|
|
331
|
+
font-size: 15px;
|
|
332
|
+
color: var(--text-secondary);
|
|
333
|
+
max-width: 680px;
|
|
334
|
+
margin: 0 auto;
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
/* 4 Pillars Grid */
|
|
338
|
+
.pillars-grid {
|
|
339
|
+
display: grid;
|
|
340
|
+
grid-template-columns: repeat(2, 1fr);
|
|
341
|
+
gap: 24px;
|
|
342
|
+
margin-bottom: 80px;
|
|
343
|
+
}
|
|
344
|
+
.pillar-card {
|
|
345
|
+
background: var(--bg-card);
|
|
346
|
+
backdrop-filter: blur(12px);
|
|
347
|
+
border: 1px solid var(--border-color);
|
|
348
|
+
border-radius: 16px;
|
|
349
|
+
padding: 32px;
|
|
350
|
+
transition: all 0.25s ease;
|
|
351
|
+
position: relative;
|
|
352
|
+
overflow: hidden;
|
|
353
|
+
}
|
|
354
|
+
.pillar-card:hover {
|
|
355
|
+
background: var(--bg-card-hover);
|
|
356
|
+
border-color: var(--border-highlight);
|
|
357
|
+
transform: translateY(-3px);
|
|
358
|
+
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
|
|
359
|
+
}
|
|
360
|
+
.pillar-icon-box {
|
|
361
|
+
width: 48px;
|
|
362
|
+
height: 48px;
|
|
363
|
+
border-radius: 12px;
|
|
364
|
+
display: flex;
|
|
365
|
+
align-items: center;
|
|
366
|
+
justify-content: center;
|
|
367
|
+
font-size: 24px;
|
|
368
|
+
margin-bottom: 20px;
|
|
369
|
+
}
|
|
370
|
+
.pillar-title {
|
|
371
|
+
font-size: 20px;
|
|
372
|
+
font-weight: 700;
|
|
373
|
+
margin-bottom: 12px;
|
|
374
|
+
display: flex;
|
|
375
|
+
align-items: center;
|
|
376
|
+
justify-content: space-between;
|
|
377
|
+
}
|
|
378
|
+
.pillar-desc {
|
|
379
|
+
font-size: 14px;
|
|
380
|
+
color: var(--text-secondary);
|
|
381
|
+
margin-bottom: 20px;
|
|
382
|
+
line-height: 1.6;
|
|
383
|
+
}
|
|
384
|
+
.pillar-features {
|
|
385
|
+
list-style: none;
|
|
386
|
+
display: flex;
|
|
387
|
+
flex-direction: column;
|
|
388
|
+
gap: 10px;
|
|
389
|
+
}
|
|
390
|
+
.pillar-features li {
|
|
391
|
+
font-size: 13px;
|
|
392
|
+
color: #cbd5e1;
|
|
393
|
+
display: flex;
|
|
394
|
+
align-items: flex-start;
|
|
395
|
+
gap: 8px;
|
|
396
|
+
}
|
|
397
|
+
.pillar-features li span.check {
|
|
398
|
+
color: var(--accent-emerald);
|
|
399
|
+
font-weight: bold;
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
/* Hero Highlights (3 Cards) */
|
|
403
|
+
.highlights-grid {
|
|
404
|
+
display: grid;
|
|
405
|
+
grid-template-columns: repeat(3, 1fr);
|
|
406
|
+
gap: 20px;
|
|
407
|
+
margin-bottom: 80px;
|
|
408
|
+
}
|
|
409
|
+
.highlight-card {
|
|
410
|
+
background: var(--bg-secondary);
|
|
411
|
+
border: 1px solid var(--border-color);
|
|
412
|
+
border-radius: 14px;
|
|
413
|
+
padding: 24px;
|
|
414
|
+
display: flex;
|
|
415
|
+
flex-direction: column;
|
|
416
|
+
justify-content: space-between;
|
|
417
|
+
}
|
|
418
|
+
.highlight-badge {
|
|
419
|
+
display: inline-block;
|
|
420
|
+
font-size: 11px;
|
|
421
|
+
font-weight: 700;
|
|
422
|
+
padding: 3px 8px;
|
|
423
|
+
border-radius: 6px;
|
|
424
|
+
margin-bottom: 14px;
|
|
425
|
+
align-self: flex-start;
|
|
426
|
+
}
|
|
427
|
+
.highlight-title {
|
|
428
|
+
font-size: 16px;
|
|
429
|
+
font-weight: 700;
|
|
430
|
+
margin-bottom: 8px;
|
|
431
|
+
}
|
|
432
|
+
.highlight-desc {
|
|
433
|
+
font-size: 13px;
|
|
434
|
+
color: var(--text-secondary);
|
|
435
|
+
margin-bottom: 16px;
|
|
436
|
+
line-height: 1.5;
|
|
437
|
+
}
|
|
438
|
+
.code-snippet {
|
|
439
|
+
background: #05070a;
|
|
440
|
+
border: 1px solid rgba(255, 255, 255, 0.05);
|
|
441
|
+
padding: 10px 12px;
|
|
442
|
+
border-radius: 8px;
|
|
443
|
+
font-family: var(--font-mono);
|
|
444
|
+
font-size: 12px;
|
|
445
|
+
color: #38bdf8;
|
|
446
|
+
overflow-x: auto;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
/* Terminal Cheatsheet */
|
|
450
|
+
.terminal-box {
|
|
451
|
+
background: #05070b;
|
|
452
|
+
border: 1px solid var(--border-color);
|
|
453
|
+
border-radius: 16px;
|
|
454
|
+
overflow: hidden;
|
|
455
|
+
margin-bottom: 80px;
|
|
456
|
+
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6);
|
|
457
|
+
}
|
|
458
|
+
.terminal-header {
|
|
459
|
+
background: #0b0f17;
|
|
460
|
+
padding: 12px 16px;
|
|
461
|
+
display: flex;
|
|
462
|
+
align-items: center;
|
|
463
|
+
justify-content: space-between;
|
|
464
|
+
border-bottom: 1px solid var(--border-color);
|
|
465
|
+
}
|
|
466
|
+
.terminal-dots {
|
|
467
|
+
display: flex;
|
|
468
|
+
gap: 6px;
|
|
469
|
+
}
|
|
470
|
+
.terminal-dot {
|
|
471
|
+
width: 10px;
|
|
472
|
+
height: 10px;
|
|
473
|
+
border-radius: 50%;
|
|
474
|
+
}
|
|
475
|
+
.dot-red { background: #ef4444; }
|
|
476
|
+
.dot-yellow { background: #f59e0b; }
|
|
477
|
+
.dot-green { background: #10b981; }
|
|
478
|
+
.terminal-title {
|
|
479
|
+
font-size: 12px;
|
|
480
|
+
color: var(--text-muted);
|
|
481
|
+
font-family: var(--font-mono);
|
|
482
|
+
}
|
|
483
|
+
.terminal-tabs {
|
|
484
|
+
display: flex;
|
|
485
|
+
background: #090d14;
|
|
486
|
+
border-bottom: 1px solid var(--border-color);
|
|
487
|
+
overflow-x: auto;
|
|
488
|
+
}
|
|
489
|
+
.terminal-tab {
|
|
490
|
+
padding: 10px 18px;
|
|
491
|
+
font-size: 13px;
|
|
492
|
+
font-weight: 600;
|
|
493
|
+
color: var(--text-secondary);
|
|
494
|
+
cursor: pointer;
|
|
495
|
+
border-right: 1px solid var(--border-color);
|
|
496
|
+
border-bottom: 2px solid transparent;
|
|
497
|
+
transition: all 0.2s;
|
|
498
|
+
white-space: nowrap;
|
|
499
|
+
}
|
|
500
|
+
.terminal-tab.active {
|
|
501
|
+
color: var(--text-main);
|
|
502
|
+
background: #05070b;
|
|
503
|
+
border-bottom: 2px solid var(--accent-cyan);
|
|
504
|
+
}
|
|
505
|
+
.terminal-body {
|
|
506
|
+
padding: 24px;
|
|
507
|
+
min-height: 180px;
|
|
508
|
+
font-family: var(--font-mono);
|
|
509
|
+
}
|
|
510
|
+
.cmd-line {
|
|
511
|
+
display: flex;
|
|
512
|
+
align-items: center;
|
|
513
|
+
justify-content: space-between;
|
|
514
|
+
background: rgba(255, 255, 255, 0.03);
|
|
515
|
+
border: 1px solid rgba(255, 255, 255, 0.06);
|
|
516
|
+
padding: 12px 16px;
|
|
517
|
+
border-radius: 10px;
|
|
518
|
+
margin-bottom: 12px;
|
|
519
|
+
}
|
|
520
|
+
.cmd-text {
|
|
521
|
+
font-size: 14px;
|
|
522
|
+
color: #a5f3fc;
|
|
523
|
+
}
|
|
524
|
+
.cmd-text span.prompt {
|
|
525
|
+
color: var(--accent-indigo);
|
|
526
|
+
user-select: none;
|
|
527
|
+
margin-right: 8px;
|
|
528
|
+
}
|
|
529
|
+
.copy-btn {
|
|
530
|
+
background: rgba(255, 255, 255, 0.08);
|
|
531
|
+
border: 1px solid rgba(255, 255, 255, 0.12);
|
|
532
|
+
color: var(--text-secondary);
|
|
533
|
+
padding: 6px 12px;
|
|
534
|
+
border-radius: 6px;
|
|
535
|
+
font-size: 11px;
|
|
536
|
+
font-family: var(--font-sans);
|
|
537
|
+
font-weight: 600;
|
|
538
|
+
cursor: pointer;
|
|
539
|
+
transition: all 0.2s;
|
|
540
|
+
}
|
|
541
|
+
.copy-btn:hover {
|
|
542
|
+
background: rgba(255, 255, 255, 0.15);
|
|
543
|
+
color: #fff;
|
|
544
|
+
}
|
|
545
|
+
.cmd-desc {
|
|
546
|
+
font-size: 13px;
|
|
547
|
+
color: var(--text-muted);
|
|
548
|
+
margin-top: 4px;
|
|
549
|
+
font-family: var(--font-sans);
|
|
550
|
+
padding-left: 4px;
|
|
551
|
+
}
|
|
552
|
+
|
|
553
|
+
/* Comparison Table */
|
|
554
|
+
.comparison-table-wrap {
|
|
555
|
+
overflow-x: auto;
|
|
556
|
+
margin-bottom: 80px;
|
|
557
|
+
background: var(--bg-card);
|
|
558
|
+
border: 1px solid var(--border-color);
|
|
559
|
+
border-radius: 16px;
|
|
560
|
+
padding: 8px;
|
|
561
|
+
}
|
|
562
|
+
table.comparison-table {
|
|
563
|
+
width: 100%;
|
|
564
|
+
border-collapse: collapse;
|
|
565
|
+
text-align: left;
|
|
566
|
+
font-size: 13px;
|
|
567
|
+
}
|
|
568
|
+
table.comparison-table th, table.comparison-table td {
|
|
569
|
+
padding: 14px 18px;
|
|
570
|
+
border-bottom: 1px solid var(--border-color);
|
|
571
|
+
}
|
|
572
|
+
table.comparison-table th {
|
|
573
|
+
font-weight: 700;
|
|
574
|
+
color: #cbd5e1;
|
|
575
|
+
background: rgba(255, 255, 255, 0.02);
|
|
576
|
+
text-transform: uppercase;
|
|
577
|
+
font-size: 11px;
|
|
578
|
+
letter-spacing: 0.5px;
|
|
579
|
+
}
|
|
580
|
+
table.comparison-table tr:last-child td { border-bottom: none; }
|
|
581
|
+
table.comparison-table tr:hover td {
|
|
582
|
+
background: rgba(255, 255, 255, 0.02);
|
|
583
|
+
}
|
|
584
|
+
.col-synapse {
|
|
585
|
+
background: rgba(99, 102, 241, 0.08);
|
|
586
|
+
font-weight: 600;
|
|
587
|
+
}
|
|
588
|
+
.pill-win {
|
|
589
|
+
background: rgba(16, 185, 129, 0.15);
|
|
590
|
+
color: var(--accent-emerald);
|
|
591
|
+
padding: 2px 8px;
|
|
592
|
+
border-radius: 10px;
|
|
593
|
+
font-size: 11px;
|
|
594
|
+
font-weight: 700;
|
|
595
|
+
display: inline-block;
|
|
596
|
+
}
|
|
597
|
+
|
|
598
|
+
/* 9 Quality Gates Grid */
|
|
599
|
+
.gates-grid {
|
|
600
|
+
display: grid;
|
|
601
|
+
grid-template-columns: repeat(3, 1fr);
|
|
602
|
+
gap: 16px;
|
|
603
|
+
margin-bottom: 80px;
|
|
604
|
+
}
|
|
605
|
+
.gate-card {
|
|
606
|
+
background: var(--bg-card);
|
|
607
|
+
border: 1px solid var(--border-color);
|
|
608
|
+
border-radius: 12px;
|
|
609
|
+
padding: 18px;
|
|
610
|
+
display: flex;
|
|
611
|
+
flex-direction: column;
|
|
612
|
+
justify-content: space-between;
|
|
613
|
+
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease;
|
|
614
|
+
}
|
|
615
|
+
.gate-card:hover {
|
|
616
|
+
transform: translateY(-4px);
|
|
617
|
+
border-color: rgba(99, 102, 241, 0.45);
|
|
618
|
+
box-shadow: 0 12px 28px -6px rgba(99, 102, 241, 0.22);
|
|
619
|
+
}
|
|
620
|
+
.gate-top {
|
|
621
|
+
display: flex;
|
|
622
|
+
align-items: center;
|
|
623
|
+
justify-content: space-between;
|
|
624
|
+
margin-bottom: 8px;
|
|
625
|
+
}
|
|
626
|
+
.gate-badge {
|
|
627
|
+
font-size: 10px;
|
|
628
|
+
font-family: var(--font-mono);
|
|
629
|
+
font-weight: 700;
|
|
630
|
+
background: rgba(6, 182, 212, 0.15);
|
|
631
|
+
color: var(--accent-cyan);
|
|
632
|
+
padding: 2px 6px;
|
|
633
|
+
border-radius: 4px;
|
|
634
|
+
}
|
|
635
|
+
.gate-pass {
|
|
636
|
+
font-size: 11px;
|
|
637
|
+
font-weight: 700;
|
|
638
|
+
color: var(--accent-emerald);
|
|
639
|
+
}
|
|
640
|
+
.gate-name {
|
|
641
|
+
font-size: 14px;
|
|
642
|
+
font-weight: 700;
|
|
643
|
+
margin-bottom: 4px;
|
|
644
|
+
}
|
|
645
|
+
.gate-desc {
|
|
646
|
+
font-size: 12px;
|
|
647
|
+
color: var(--text-muted);
|
|
648
|
+
line-height: 1.4;
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
/* Swarm Agents Grid */
|
|
652
|
+
.swarm-grid {
|
|
653
|
+
display: grid;
|
|
654
|
+
grid-template-columns: repeat(3, 1fr);
|
|
655
|
+
gap: 16px;
|
|
656
|
+
margin-bottom: 80px;
|
|
657
|
+
}
|
|
658
|
+
.agent-card {
|
|
659
|
+
background: var(--bg-secondary);
|
|
660
|
+
border: 1px solid var(--border-color);
|
|
661
|
+
border-radius: 12px;
|
|
662
|
+
padding: 20px;
|
|
663
|
+
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease;
|
|
664
|
+
}
|
|
665
|
+
.agent-card:hover {
|
|
666
|
+
transform: translateY(-4px);
|
|
667
|
+
border-color: rgba(6, 182, 212, 0.45);
|
|
668
|
+
box-shadow: 0 12px 28px -6px rgba(6, 182, 212, 0.22);
|
|
669
|
+
}
|
|
670
|
+
.agent-icon {
|
|
671
|
+
font-size: 24px;
|
|
672
|
+
margin-bottom: 12px;
|
|
673
|
+
}
|
|
674
|
+
.agent-role {
|
|
675
|
+
font-size: 15px;
|
|
676
|
+
font-weight: 700;
|
|
677
|
+
margin-bottom: 4px;
|
|
678
|
+
}
|
|
679
|
+
.agent-id {
|
|
680
|
+
font-size: 11px;
|
|
681
|
+
font-family: var(--font-mono);
|
|
682
|
+
color: var(--accent-indigo);
|
|
683
|
+
margin-bottom: 8px;
|
|
684
|
+
display: block;
|
|
685
|
+
}
|
|
686
|
+
.agent-desc {
|
|
687
|
+
font-size: 12px;
|
|
688
|
+
color: var(--text-secondary);
|
|
689
|
+
line-height: 1.5;
|
|
690
|
+
}
|
|
691
|
+
|
|
692
|
+
/* Footer */
|
|
693
|
+
footer {
|
|
694
|
+
border-top: 1px solid var(--border-color);
|
|
695
|
+
padding: 48px 0 32px;
|
|
696
|
+
background: #040609;
|
|
697
|
+
margin-top: 40px;
|
|
698
|
+
}
|
|
699
|
+
.footer-grid {
|
|
700
|
+
display: flex;
|
|
701
|
+
align-items: center;
|
|
702
|
+
justify-content: space-between;
|
|
703
|
+
flex-wrap: wrap;
|
|
704
|
+
gap: 24px;
|
|
705
|
+
margin-bottom: 32px;
|
|
706
|
+
}
|
|
707
|
+
.footer-brand p {
|
|
708
|
+
font-size: 13px;
|
|
709
|
+
color: var(--text-muted);
|
|
710
|
+
margin-top: 4px;
|
|
711
|
+
}
|
|
712
|
+
.footer-links {
|
|
713
|
+
display: flex;
|
|
714
|
+
gap: 20px;
|
|
715
|
+
list-style: none;
|
|
716
|
+
}
|
|
717
|
+
.footer-links a {
|
|
718
|
+
color: var(--text-secondary);
|
|
719
|
+
font-size: 13px;
|
|
720
|
+
text-decoration: none;
|
|
721
|
+
transition: color 0.2s;
|
|
722
|
+
}
|
|
723
|
+
.footer-links a:hover { color: var(--accent-cyan); }
|
|
724
|
+
.footer-bottom {
|
|
725
|
+
border-top: 1px solid rgba(255, 255, 255, 0.05);
|
|
726
|
+
padding-top: 24px;
|
|
727
|
+
text-align: center;
|
|
728
|
+
font-size: 12px;
|
|
729
|
+
color: var(--text-muted);
|
|
730
|
+
}
|
|
731
|
+
.footer-bottom a {
|
|
732
|
+
color: #818cf8;
|
|
733
|
+
text-decoration: none;
|
|
734
|
+
}
|
|
735
|
+
.footer-bottom a:hover { text-decoration: underline; }
|
|
736
|
+
|
|
737
|
+
/* Toast notification */
|
|
738
|
+
.toast {
|
|
739
|
+
position: fixed;
|
|
740
|
+
bottom: 24px;
|
|
741
|
+
right: 24px;
|
|
742
|
+
background: rgba(16, 185, 129, 0.95);
|
|
743
|
+
color: #fff;
|
|
744
|
+
padding: 10px 18px;
|
|
745
|
+
border-radius: 8px;
|
|
746
|
+
font-size: 13px;
|
|
747
|
+
font-weight: 600;
|
|
748
|
+
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
|
|
749
|
+
transform: translateY(100px);
|
|
750
|
+
opacity: 0;
|
|
751
|
+
transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
|
|
752
|
+
z-index: 1000;
|
|
753
|
+
}
|
|
754
|
+
.toast.show {
|
|
755
|
+
transform: translateY(0);
|
|
756
|
+
opacity: 1;
|
|
757
|
+
}
|
|
758
|
+
|
|
759
|
+
@media (max-width: 900px) {
|
|
760
|
+
.hero h1 { font-size: 34px; }
|
|
761
|
+
.pillars-grid, .highlights-grid, .gates-grid, .swarm-grid { grid-template-columns: 1fr; }
|
|
762
|
+
.stats-ribbon { grid-template-columns: repeat(2, 1fr); gap: 20px; }
|
|
763
|
+
.stat-item { border-right: none; }
|
|
764
|
+
.nav-links { display: none; }
|
|
765
|
+
}
|
|
766
|
+
</style>
|
|
767
|
+
</head>
|
|
768
|
+
<body>
|
|
769
|
+
|
|
770
|
+
<!-- Sticky Navigation -->
|
|
771
|
+
<nav>
|
|
772
|
+
<div class="container nav-inner">
|
|
773
|
+
<a href="#" class="brand">
|
|
774
|
+
<div class="brand-icon">⚡</div>
|
|
775
|
+
<div>
|
|
776
|
+
<span class="brand-name">SYNAPSE HUB</span>
|
|
777
|
+
<span class="version-tag">v__VERSION__</span>
|
|
778
|
+
</div>
|
|
779
|
+
</a>
|
|
780
|
+
<ul class="nav-links">
|
|
781
|
+
<li><a href="#pillars" data-i18n="nav_pillars">4 Trụ Cột</a></li>
|
|
782
|
+
<li><a href="#hero-features" data-i18n="nav_features">Tính Năng</a></li>
|
|
783
|
+
<li><a href="#quickstart" data-i18n="nav_quickstart">Lệnh CLI</a></li>
|
|
784
|
+
<li><a href="#quality-gates" data-i18n="nav_gates">9 Quality Gates</a></li>
|
|
785
|
+
<li><a href="#comparison" data-i18n="nav_compare">So Sánh</a></li>
|
|
786
|
+
</ul>
|
|
787
|
+
<div class="nav-actions">
|
|
788
|
+
<!-- Bilingual Language Switcher -->
|
|
789
|
+
<div class="lang-switch">
|
|
790
|
+
<button id="btn-vi" class="lang-btn active" onclick="setLanguage('vi')">🇻🇳 VN</button>
|
|
791
|
+
<button id="btn-en" class="lang-btn" onclick="setLanguage('en')">🇬🇧 EN</button>
|
|
792
|
+
</div>
|
|
793
|
+
<a href="PROJECT_DASHBOARD.html" class="btn btn-secondary" title="Open Standalone Health Dashboard">📊 Dashboard</a>
|
|
794
|
+
<a href="__REPO__" target="_blank" rel="noopener" class="btn btn-primary">⭐ GitHub</a>
|
|
795
|
+
</div>
|
|
796
|
+
</div>
|
|
797
|
+
</nav>
|
|
798
|
+
|
|
799
|
+
<!-- Hero Section -->
|
|
800
|
+
<header class="hero">
|
|
801
|
+
<div class="container">
|
|
802
|
+
<div class="hero-pill">
|
|
803
|
+
__HERO_PILL_CONTENT__
|
|
804
|
+
</div>
|
|
805
|
+
<h1 data-i18n="hero_title">Trung Tâm Trí Tuệ QA Toàn Diện<br>Dành Cho AI Coding Agents</h1>
|
|
806
|
+
<p data-i18n="hero_desc">
|
|
807
|
+
Tăng cường sức mạnh cho QA Engineers và các Autonomous AI Agent trên cả 4 mảng:
|
|
808
|
+
<strong>Manual</strong>, <strong>Automation</strong>, <strong>API</strong> và <strong>Performance Testing</strong>.
|
|
809
|
+
Trang bị các Sentinel phân tích cú pháp AST 100% offline, 6 hồ sơ Swarm Agent, và 9 Quality Gates Definition-of-Done.
|
|
810
|
+
</p>
|
|
811
|
+
<div class="hero-modes" style="display: flex; justify-content: center; gap: 16px; margin: 0 auto 32px; max-width: 820px; flex-wrap: wrap;">
|
|
812
|
+
<div style="background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; padding: 14px 18px; text-align: left; flex: 1; min-width: 260px;">
|
|
813
|
+
<div style="font-weight: 700; font-size: 13px; color: var(--accent-cyan); margin-bottom: 4px;" data-i18n="mode_cli_title">🛠️ Cách 1: CLI Độc Lập (Zero AI)</div>
|
|
814
|
+
<div style="font-size: 12.5px; color: var(--text-secondary); line-height: 1.45;" data-i18n="mode_cli_desc">Chạy <code>npx synapse-hub lint</code> phát hiện test pass ảo, nén log CI hoặc xuất Excel chuẩn mà không cần cấu hình.</div>
|
|
815
|
+
</div>
|
|
816
|
+
<div style="background: rgba(99, 102, 241, 0.06); border: 1px solid rgba(99, 102, 241, 0.2); border-radius: 12px; padding: 14px 18px; text-align: left; flex: 1; min-width: 260px;">
|
|
817
|
+
<div style="font-weight: 700; font-size: 13px; color: #a5b4fc; margin-bottom: 4px;" data-i18n="mode_agent_title">🧠 Cách 2: Chốt Chặn Cho AI Coding</div>
|
|
818
|
+
<div style="font-size: 12.5px; color: var(--text-secondary); line-height: 1.45;" data-i18n="mode_agent_desc">Tích hợp vào Cursor, Antigravity, Claude Code làm bộ quy chuẩn — ngăn AI sinh mã nguồn cẩu thả hoặc bỏ qua ngoại lệ ngầm.</div>
|
|
819
|
+
</div>
|
|
820
|
+
</div>
|
|
821
|
+
<div class="hero-buttons">
|
|
822
|
+
<a href="#quickstart" class="btn btn-primary" style="padding: 12px 24px; font-size: 15px;" data-i18n="btn_quickstart">🚀 Bắt Đầu Trong 5 Giây</a>
|
|
823
|
+
<a href="#pillars" class="btn btn-secondary" style="padding: 12px 24px; font-size: 15px;" data-i18n="btn_pillars">🎯 Khám Phá 4 Trụ Cột</a>
|
|
824
|
+
<a href="#quality-gates" class="btn btn-emerald" style="padding: 12px 24px; font-size: 15px;" data-i18n="btn_gates">🛡️ Xem 9 Quality Gates</a>
|
|
825
|
+
</div>
|
|
826
|
+
|
|
827
|
+
<!-- Stats Ribbon -->
|
|
828
|
+
<div class="stats-ribbon">
|
|
829
|
+
<div class="stat-item">
|
|
830
|
+
<div class="stat-val" style="color: var(--accent-cyan);">__TOTAL_SKILLS__+</div>
|
|
831
|
+
<div class="stat-label" data-i18n="stat_skills">Kỹ Năng AI Tiêu Chuẩn</div>
|
|
832
|
+
</div>
|
|
833
|
+
<div class="stat-item">
|
|
834
|
+
<div class="stat-val" style="color: var(--accent-emerald);">9 / 9</div>
|
|
835
|
+
<div class="stat-label" data-i18n="stat_gates">Cổng Kiểm Soát DoD</div>
|
|
836
|
+
</div>
|
|
837
|
+
<div class="stat-item">
|
|
838
|
+
<div class="stat-val" style="color: var(--accent-indigo);">6</div>
|
|
839
|
+
<div class="stat-label" data-i18n="stat_swarm">Vai Trò Swarm Tự Trị</div>
|
|
840
|
+
</div>
|
|
841
|
+
<div class="stat-item">
|
|
842
|
+
<div class="stat-val" style="color: var(--accent-amber);">100%</div>
|
|
843
|
+
<div class="stat-label" data-i18n="stat_offline">Hoàn Toàn Offline & Air-Gapped</div>
|
|
844
|
+
</div>
|
|
845
|
+
</div>
|
|
846
|
+
</div>
|
|
847
|
+
</header>
|
|
848
|
+
|
|
849
|
+
<main class="container">
|
|
850
|
+
|
|
851
|
+
<!-- 4 Core Pillars Section -->
|
|
852
|
+
<section id="pillars" style="scroll-margin-top: 100px;">
|
|
853
|
+
<div class="section-header">
|
|
854
|
+
<span class="section-tag" data-i18n="sec_pillars_tag">Bao Quát Toàn Diện</span>
|
|
855
|
+
<h2 class="section-title" data-i18n="sec_pillars_title">4 Trụ Cột Trí Tuệ QA Cốt Lõi</h2>
|
|
856
|
+
<p class="section-desc" data-i18n="sec_pillars_desc">Synapse Hub kết nối giữa kiểm thử khám phá thủ công, tự động hóa bằng AI tiên tiến, kiểm thử hợp đồng API vững chắc và đánh giá hiệu năng backend chuyên sâu.</p>
|
|
857
|
+
</div>
|
|
858
|
+
|
|
859
|
+
<div class="pillars-grid">
|
|
860
|
+
<!-- Pillar 1: Manual -->
|
|
861
|
+
<div class="pillar-card">
|
|
862
|
+
<div class="pillar-icon-box" style="background: rgba(6, 182, 212, 0.15); color: var(--accent-cyan);">🎯</div>
|
|
863
|
+
<div class="pillar-title">
|
|
864
|
+
<span data-i18n="p1_title">1. Manual Testing (AI-RBT)</span>
|
|
865
|
+
<span class="pill-win" data-i18n="p1_badge">Theo Rủi Ro</span>
|
|
866
|
+
</div>
|
|
867
|
+
<p class="pillar-desc" data-i18n="p1_desc">Chuyển hóa các yêu cầu mơ hồ thành bộ test case kiểm thử biên chặt chẽ, ngăn ngừa triệt để tình trạng AI suy đoán sai lệch (hallucination).</p>
|
|
868
|
+
<ul class="pillar-features">
|
|
869
|
+
<li><span class="check">✓</span> <span data-i18n="p1_f1"><strong>6 Giai đoạn kiểm thử theo rủi ro:</strong> Phân loại độ ưu tiên dựa trên bán kính ảnh hưởng kinh doanh và xác suất lỗi.</span></li>
|
|
870
|
+
<li><span class="check">✓</span> <span data-i18n="p1_f2"><strong>Ma trận 15 loại trường nhập liệu:</strong> Kiểm tra giá trị biên triệt để (Email, SĐT, Tiền tệ, Regex, Ký tự SQLi).</span></li>
|
|
871
|
+
<li><span class="check">✓</span> <span data-i18n="p1_f3"><strong>Bộ xuất Excel 12 cột chuẩn mực:</strong> 1-click chuyển đổi Markdown sang Excel chuyên nghiệp có công thức và định dạng có điều kiện.</span></li>
|
|
872
|
+
<li><span class="check">✓</span> <span data-i18n="p1_f4"><strong>Phát hiện kịch bản biên phi chức năng:</strong> Tự động gắn cờ submit đúp (double-click), tranh chấp dữ liệu (race conditions), và quá hạn phiên.</span></li>
|
|
873
|
+
</ul>
|
|
874
|
+
</div>
|
|
875
|
+
|
|
876
|
+
<!-- Pillar 2: Automation -->
|
|
877
|
+
<div class="pillar-card">
|
|
878
|
+
<div class="pillar-icon-box" style="background: rgba(99, 102, 241, 0.15); color: #818cf8);">⚡</div>
|
|
879
|
+
<div class="pillar-title">
|
|
880
|
+
<span data-i18n="p2_title">2. Test Automation & Clean POM</span>
|
|
881
|
+
<span class="pill-win" data-i18n="p2_badge">Kiến Trúc Phẳng</span>
|
|
882
|
+
</div>
|
|
883
|
+
<p class="pillar-desc" data-i18n="p2_desc">Chuẩn hóa kiến trúc Clean Page Object Model, nơi test script chỉ gọi các phương thức nghiệp vụ từ Page Class.</p>
|
|
884
|
+
<ul class="pillar-features">
|
|
885
|
+
<li><span class="check">✓</span> <span data-i18n="p2_f1"><strong>Test Script Không Chứa Locator:</strong> Cấm tuyệt đối raw XPath hay CSS selector bên trong các file test case.</span></li>
|
|
886
|
+
<li><span class="check">✓</span> <span data-i18n="p2_f2"><strong>Quy trình Swarm FSM 5 Giai Đoạn:</strong> Quy trình tất định từ dò tìm element trực tiếp đến tự động phục hồi kịch bản.</span></li>
|
|
887
|
+
<li><span class="check">✓</span> <span data-i18n="p2_f3"><strong>Dò Tìm DOM Trực Tiếp Dưới 200ms:</strong> Khảo sát live DOM/AOM bằng headless Playwright trước khi sinh locator, tỷ lệ trúng 100%.</span></li>
|
|
888
|
+
<li><span class="check">✓</span> <span data-i18n="p2_f4"><strong>Đa Nền Tảng Đa Ngôn Ngữ:</strong> Hỗ trợ mượt mà Playwright (TS/JS), Cypress, Selenium, Pytest, và Katalon.</span></li>
|
|
889
|
+
</ul>
|
|
890
|
+
</div>
|
|
891
|
+
|
|
892
|
+
<!-- Pillar 3: API & Contract -->
|
|
893
|
+
<div class="pillar-card">
|
|
894
|
+
<div class="pillar-icon-box" style="background: rgba(16, 185, 129, 0.15); color: var(--accent-emerald);">🌐</div>
|
|
895
|
+
<div class="pillar-title">
|
|
896
|
+
<span data-i18n="p3_title">3. Kiểm Thử API & Chuẩn Hợp Đồng</span>
|
|
897
|
+
<span class="pill-win" data-i18n="p3_badge">Không Sai Lệch</span>
|
|
898
|
+
</div>
|
|
899
|
+
<p class="pillar-desc" data-i18n="p3_desc">Kiểm thử toàn diện vòng đời API từ hợp đồng OpenAPI/Swagger đến mô phỏng mạng lỗi và hỗn loạn (Chaos injection).</p>
|
|
900
|
+
<ul class="pillar-features">
|
|
901
|
+
<li><span class="check">✓</span> <span data-i18n="p3_f1"><strong>Sinh Ma Trận Test Từ OpenAPI:</strong> Biên dịch đặc tả OpenAPI thành các bộ test case phân luồng tích cực, biên và tiêu cực.</span></li>
|
|
902
|
+
<li><span class="check">✓</span> <span data-i18n="p3_f2"><strong>Sentinel Chống Trôi Hợp Đồng (API Drift):</strong> Phân tích cú pháp AST để phát hiện sớm các breaking change trước khi CI thất bại.</span></li>
|
|
903
|
+
<li><span class="check">✓</span> <span data-i18n="p3_f3"><strong>Chặn Bắt & Mock API (Mock Shield):</strong> Chặn bắt và làm giả HTTP/GraphQL trong trình duyệt, giả lập giật lag và lỗi 500.</span></li>
|
|
904
|
+
<li><span class="check">✓</span> <span data-i18n="p3_f4"><strong>Tích Hợp Postman & Newman:</strong> Tự động chuyển đổi bộ sưu tập Postman và phân tích chẩn đoán kết quả thực thi.</span></li>
|
|
905
|
+
</ul>
|
|
906
|
+
</div>
|
|
907
|
+
|
|
908
|
+
<!-- Pillar 4: Performance -->
|
|
909
|
+
<div class="pillar-card">
|
|
910
|
+
<div class="pillar-icon-box" style="background: rgba(245, 158, 11, 0.15); color: var(--accent-amber);">📈</div>
|
|
911
|
+
<div class="pillar-title">
|
|
912
|
+
<span data-i18n="p4_title">4. Hiệu Năng & Độ Ổn Định</span>
|
|
913
|
+
<span class="pill-win" data-i18n="p4_badge">Bảo Vệ SLA</span>
|
|
914
|
+
</div>
|
|
915
|
+
<p class="pillar-desc" data-i18n="p4_desc">Kiểm thử chịu tải backend, đo lường chỉ số Core Web Vitals, và quản lý cách ly các test case chập chờn.</p>
|
|
916
|
+
<ul class="pillar-features">
|
|
917
|
+
<li><span class="check">✓</span> <span data-i18n="p4_f1"><strong>Bộ Sinh Kịch Bản Đa Công Cụ:</strong> Tự động tạo kịch bản tải cho k6, Locust, và Apache JMeter (.jmx).</span></li>
|
|
918
|
+
<li><span class="check">✓</span> <span data-i18n="p4_f2"><strong>Đo Lường Core Web Vitals:</strong> Đánh giá chi tiết các chỉ số LCP, CLS, và INP thông qua Chrome DevTools Protocol.</span></li>
|
|
919
|
+
<li><span class="check">✓</span> <span data-i18n="p4_f3"><strong>Sentinel Bắt Test Chập Chờn (Flaky):</strong> Tính điểm phương sai không tất định và tự động cách ly vào khu vực kiểm dịch.</span></li>
|
|
920
|
+
<li><span class="check">✓</span> <span data-i18n="p4_f4"><strong>Phân Mảnh Tải Song Song (Matrix Sharder):</strong> Thuật toán phân bổ tối ưu (Bin Packing) cân bằng thời gian chạy CI giữa các máy runner với sai số dưới 5%.</span></li>
|
|
921
|
+
</ul>
|
|
922
|
+
</div>
|
|
923
|
+
</div>
|
|
924
|
+
</section>
|
|
925
|
+
|
|
926
|
+
<!-- 3 Hero Highlights -->
|
|
927
|
+
<section id="hero-features" style="scroll-margin-top: 100px;">
|
|
928
|
+
<div class="section-header">
|
|
929
|
+
<span class="section-tag" data-i18n="sec_hero_tag">Độ Chính Xác Thực Tế</span>
|
|
930
|
+
<h2 class="section-title" data-i18n="sec_hero_title">3 Siêu Năng Lực Đột Phá</h2>
|
|
931
|
+
<p class="section-desc" data-i18n="sec_hero_desc">Các đột phá kiến trúc giúp ngăn chặn AI suy đoán sai lệch, loại bỏ các test case vô nghĩa (test luôn pass / tautological tests), và dập tắt lỗi pipeline chập chờn.</p>
|
|
932
|
+
</div>
|
|
933
|
+
|
|
934
|
+
<div class="highlights-grid">
|
|
935
|
+
<div class="highlight-card">
|
|
936
|
+
<div>
|
|
937
|
+
<span class="highlight-badge" style="background: rgba(244, 63, 94, 0.15); color: var(--accent-rose); border: 1px solid rgba(244, 63, 94, 0.3);" data-i18n="h1_badge">SIÊU TÍNH NĂNG 1 • LINTER AST</span>
|
|
938
|
+
<h3 class="highlight-title" data-i18n="h1_title">Bắt Test Pass Ảo (Fake-Pass Sentinel)</h3>
|
|
939
|
+
<p class="highlight-desc" data-i18n="h1_desc">AI coding agents thường sinh test case rỗng hoặc bọc try/catch bỏ qua lỗi để tạo kết quả pass giả. Linter AST phân tích cây cú pháp trong 0.02s giúp phát hiện ngay các bài test thiếu assertion hoặc bỏ qua ngoại lệ ngầm.</p>
|
|
940
|
+
</div>
|
|
941
|
+
<div class="code-snippet">npx synapse-hub lint</div>
|
|
942
|
+
</div>
|
|
943
|
+
|
|
944
|
+
<div class="highlight-card">
|
|
945
|
+
<div>
|
|
946
|
+
<span class="highlight-badge" style="background: rgba(168, 85, 247, 0.15); color: var(--accent-purple); border: 1px solid rgba(168, 85, 247, 0.3);" data-i18n="h2_badge">SIÊU TÍNH NĂNG 2 • ĐỘT BIẾN MÃ</span>
|
|
947
|
+
<h3 class="highlight-title" data-i18n="h2_title">Đo Độ Nhạy Assert (Micro-Mutator)</h3>
|
|
948
|
+
<p class="highlight-desc" data-i18n="h2_desc">Tự động biến đổi logic (đảo toán tử, sửa điều kiện) để kiểm tra xem các câu lệnh assert có thực sự bắt được lỗi hay không (yêu cầu Mutation Score ≥ 80%).</p>
|
|
949
|
+
</div>
|
|
950
|
+
<div class="code-snippet">npx synapse-hub mutate --min-score 80</div>
|
|
951
|
+
</div>
|
|
952
|
+
|
|
953
|
+
<div class="highlight-card">
|
|
954
|
+
<div>
|
|
955
|
+
<span class="highlight-badge" style="background: rgba(6, 182, 212, 0.15); color: var(--accent-cyan); border: 1px solid rgba(6, 182, 212, 0.3);" data-i18n="h3_badge">SIÊU TÍNH NĂNG 3 • TỐI ƯU NGỮ CẢNH</span>
|
|
956
|
+
<h3 class="highlight-title" data-i18n="h3_title">Lọc 95% Nhiễu Log CI/CD</h3>
|
|
957
|
+
<p class="highlight-desc" data-i18n="h3_desc">Log CLI và Gradle dài hàng nghìn dòng làm AI bị tràn bộ nhớ và mất tập trung. Bộ lọc thông minh cô đọng dữ liệu còn vài dòng chứa đúng dòng gây lỗi, exception gốc và 3 request gần nhất.</p>
|
|
958
|
+
</div>
|
|
959
|
+
<div class="code-snippet">npx synapse-hub distill <log_file></div>
|
|
960
|
+
</div>
|
|
961
|
+
</div>
|
|
962
|
+
</section>
|
|
963
|
+
|
|
964
|
+
<!-- Interactive Terminal / Quickstart Cheatsheet -->
|
|
965
|
+
<section id="quickstart" style="scroll-margin-top: 100px;">
|
|
966
|
+
<div class="section-header">
|
|
967
|
+
<span class="section-tag" data-i18n="sec_cli_tag">Hiệu Quả Tức Thì</span>
|
|
968
|
+
<h2 class="section-title" data-i18n="sec_cli_title">Bảng Tra Cứu Lệnh CLI (Không Cần Cấu Hình)</h2>
|
|
969
|
+
<p class="section-desc" data-i18n="sec_cli_desc">Thực thi mọi tính năng mạnh mẽ của Synapse Hub trực tiếp qua npx hoặc npm mà không cần cài đặt phức tạp.</p>
|
|
970
|
+
</div>
|
|
971
|
+
|
|
972
|
+
<div class="terminal-box">
|
|
973
|
+
<div class="terminal-header">
|
|
974
|
+
<div class="terminal-dots">
|
|
975
|
+
<div class="terminal-dot dot-red"></div>
|
|
976
|
+
<div class="terminal-dot dot-yellow"></div>
|
|
977
|
+
<div class="terminal-dot dot-green"></div>
|
|
978
|
+
</div>
|
|
979
|
+
<div class="terminal-title">synapse-hub-cli • zsh</div>
|
|
980
|
+
<div style="font-size: 11px; color: var(--accent-emerald);" data-i18n="status_ready">● Sẵn sàng</div>
|
|
981
|
+
</div>
|
|
982
|
+
|
|
983
|
+
<div class="terminal-tabs">
|
|
984
|
+
<div class="terminal-tab active" onclick="switchTab(event, 'tab-doctor')" data-i18n="t_doctor">1. Chẩn Đoán (Doctor)</div>
|
|
985
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-setup')" data-i18n="t_setup">2. Cài Đặt (Setup)</div>
|
|
986
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-verify')" data-i18n="t_verify">3. Kiểm Tra 9 Cổng</div>
|
|
987
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-lint')" data-i18n="t_lint">4. Quét Fake-Pass</div>
|
|
988
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-excel')" data-i18n="t_excel">5. Xuất Excel</div>
|
|
989
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-dashboard')" data-i18n="t_dashboard">6. Dashboard</div>
|
|
990
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-review')" data-i18n="t_review">7. Soát Spec</div>
|
|
991
|
+
<div class="terminal-tab" onclick="switchTab(event, 'tab-watch')" data-i18n="t_watch">8. Giám Sát Real-Time</div>
|
|
992
|
+
</div>
|
|
993
|
+
|
|
994
|
+
<div class="terminal-body">
|
|
995
|
+
<!-- Tab Doctor -->
|
|
996
|
+
<div id="tab-doctor" class="tab-pane">
|
|
997
|
+
<div class="cmd-line">
|
|
998
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub doctor</div>
|
|
999
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub doctor')">Copy</button>
|
|
1000
|
+
</div>
|
|
1001
|
+
<p class="cmd-desc" data-i18n="t_desc_doctor">🩺 Quét chẩn đoán 1-click kiểm tra môi trường Python 3.9+, Node.js, Git hook, trình duyệt, và Bộ nhớ Agent Trung tâm.</p>
|
|
1002
|
+
</div>
|
|
1003
|
+
|
|
1004
|
+
<!-- Tab Setup -->
|
|
1005
|
+
<div id="tab-setup" class="tab-pane" style="display:none;">
|
|
1006
|
+
<div class="cmd-line">
|
|
1007
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub setup</div>
|
|
1008
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub setup')">Copy</button>
|
|
1009
|
+
</div>
|
|
1010
|
+
<p class="cmd-desc" data-i18n="t_desc_setup">⚡ Cài đặt dự án 1-click: sinh hướng dẫn PROJECT_AI_GUIDE.md, cầu nối Universal AI bridges, bản đồ AST, và git hook chặn rò rỉ.</p>
|
|
1011
|
+
</div>
|
|
1012
|
+
|
|
1013
|
+
<!-- Tab Verify -->
|
|
1014
|
+
<div id="tab-verify" class="tab-pane" style="display:none;">
|
|
1015
|
+
<div class="cmd-line">
|
|
1016
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub verify</div>
|
|
1017
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub verify')">Copy</button>
|
|
1018
|
+
</div>
|
|
1019
|
+
<p class="cmd-desc" data-i18n="t_desc_verify">🛡️ Thực thi toàn bộ 9 Quality Gates Definition-of-Done (UTF-8 No BOM, Clean POM, Đường dẫn khả chuyển, Mutation ≥ 80%).</p>
|
|
1020
|
+
</div>
|
|
1021
|
+
|
|
1022
|
+
<!-- Tab Lint -->
|
|
1023
|
+
<div id="tab-lint" class="tab-pane" style="display:none;">
|
|
1024
|
+
<div class="cmd-line">
|
|
1025
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub lint</div>
|
|
1026
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub lint')">Copy</button>
|
|
1027
|
+
</div>
|
|
1028
|
+
<p class="cmd-desc" data-i18n="t_desc_lint">🔍 Quét AST phát hiện các test case pass ảo (0 assertion), khối catch rỗng và ngoại lệ bị bỏ qua ngầm (swallowed exceptions) trên toàn bộ test script.</p>
|
|
1029
|
+
</div>
|
|
1030
|
+
|
|
1031
|
+
<!-- Tab Excel -->
|
|
1032
|
+
<div id="tab-excel" class="tab-pane" style="display:none;">
|
|
1033
|
+
<div class="cmd-line">
|
|
1034
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub export-excel <path_to_markdown></div>
|
|
1035
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub export-excel')">Copy</button>
|
|
1036
|
+
</div>
|
|
1037
|
+
<p class="cmd-desc" data-i18n="t_desc_excel">📊 Biên dịch tài liệu test case markdown sang file bảng tính Excel 12 cột chuyên nghiệp có công thức và danh sách chọn trạng thái.</p>
|
|
1038
|
+
</div>
|
|
1039
|
+
|
|
1040
|
+
<!-- Tab Dashboard -->
|
|
1041
|
+
<div id="tab-dashboard" class="tab-pane" style="display:none;">
|
|
1042
|
+
<div class="cmd-line">
|
|
1043
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub dashboard</div>
|
|
1044
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub dashboard')">Copy</button>
|
|
1045
|
+
</div>
|
|
1046
|
+
<p class="cmd-desc" data-i18n="t_desc_dashboard">📈 Khởi tạo và mở trang Báo cáo QA Tổng thể dạng HTML độc lập ngay trong trình duyệt của bạn.</p>
|
|
1047
|
+
</div>
|
|
1048
|
+
|
|
1049
|
+
<!-- Tab Review Spec -->
|
|
1050
|
+
<div id="tab-review" class="tab-pane" style="display:none;">
|
|
1051
|
+
<div class="cmd-line">
|
|
1052
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub review-spec <spec_file></div>
|
|
1053
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub review-spec')">Copy</button>
|
|
1054
|
+
</div>
|
|
1055
|
+
<p class="cmd-desc" data-i18n="t_desc_review">🐟 Soát xét đặc tả độc lập theo mô hình Elephant-Goldfish, bóc tách chính xác 5 dạng lỗ hổng mơ hồ trước khi viết code.</p>
|
|
1056
|
+
</div>
|
|
1057
|
+
|
|
1058
|
+
<!-- Tab Watch -->
|
|
1059
|
+
<div id="tab-watch" class="tab-pane" style="display:none;">
|
|
1060
|
+
<div class="cmd-line">
|
|
1061
|
+
<div class="cmd-text"><span class="prompt">$</span>npx synapse-hub watch</div>
|
|
1062
|
+
<button class="copy-btn" onclick="copyCmd('npx synapse-hub watch')">Copy</button>
|
|
1063
|
+
</div>
|
|
1064
|
+
<p class="cmd-desc" data-i18n="t_desc_watch">👁️ Bảng điều khiển TUI HUD trực quan thời gian thực, tích hợp cơ chế giám sát tự động chống treo/kẹt mạng và chống vòng lặp thao tác.</p>
|
|
1065
|
+
</div>
|
|
1066
|
+
</div>
|
|
1067
|
+
</div>
|
|
1068
|
+
</section>
|
|
1069
|
+
|
|
1070
|
+
<!-- Comparison Table Section -->
|
|
1071
|
+
<section id="comparison" style="scroll-margin-top: 100px;">
|
|
1072
|
+
<div class="section-header">
|
|
1073
|
+
<span class="section-tag" data-i18n="sec_comp_tag">Định Vị Giá Trị</span>
|
|
1074
|
+
<h2 class="section-title" data-i18n="sec_comp_title">So Sánh Synapse Hub Với Các Lựa Chọn Khác</h2>
|
|
1075
|
+
<p class="section-desc" data-i18n="sec_comp_desc">Lý do các đội ngũ kỹ thuật doanh nghiệp lựa chọn Synapse Hub làm trung tâm trí tuệ đồng nhất thay vì chắp vá các công cụ đơn lẻ.</p>
|
|
1076
|
+
</div>
|
|
1077
|
+
|
|
1078
|
+
<div class="comparison-table-wrap">
|
|
1079
|
+
<table class="comparison-table">
|
|
1080
|
+
<thead>
|
|
1081
|
+
<tr>
|
|
1082
|
+
<th data-i18n="th_dimension">Tiêu chí / Khía cạnh</th>
|
|
1083
|
+
<th class="col-synapse" style="color: var(--accent-cyan);">⚡ Synapse Hub</th>
|
|
1084
|
+
<th>ESLint Plugin (Playwright)</th>
|
|
1085
|
+
<th>Stryker Mutator</th>
|
|
1086
|
+
<th>Allure Framework</th>
|
|
1087
|
+
<th>Healenium</th>
|
|
1088
|
+
</tr>
|
|
1089
|
+
</thead>
|
|
1090
|
+
<tbody>
|
|
1091
|
+
<tr>
|
|
1092
|
+
<td><strong data-i18n="tr1_dim">Phạm vi & Vòng đời</strong></td>
|
|
1093
|
+
<td class="col-synapse"><span class="pill-win" data-i18n="tr1_syn">Toàn diện 4 Trụ Cột QA</span></td>
|
|
1094
|
+
<td data-i18n="tr1_es">Chỉ là Linter JS/TS</td>
|
|
1095
|
+
<td data-i18n="tr1_st">Chỉ là Engine Đột Biến</td>
|
|
1096
|
+
<td data-i18n="tr1_al">Chỉ là Báo Cáo Test</td>
|
|
1097
|
+
<td data-i18n="tr1_he">Chỉ là Proxy Tự Phục Hồi</td>
|
|
1098
|
+
</tr>
|
|
1099
|
+
<tr>
|
|
1100
|
+
<td><strong data-i18n="tr2_dim">Đối tượng phục vụ</strong></td>
|
|
1101
|
+
<td class="col-synapse"><span class="pill-win" data-i18n="tr2_syn">AI Agents + Kỹ sư QA</span></td>
|
|
1102
|
+
<td data-i18n="tr2_es">Lập trình viên Frontend</td>
|
|
1103
|
+
<td data-i18n="tr2_st">Senior Developers</td>
|
|
1104
|
+
<td data-i18n="tr2_al">QA Leads / Quản lý</td>
|
|
1105
|
+
<td data-i18n="tr2_he">Selenium SDETs</td>
|
|
1106
|
+
</tr>
|
|
1107
|
+
<tr>
|
|
1108
|
+
<td><strong data-i18n="tr3_dim">Cú pháp AST Đa Ngôn Ngữ</strong></td>
|
|
1109
|
+
<td class="col-synapse"><span class="pill-win">Python, TS, JS, Groovy, Java</span></td>
|
|
1110
|
+
<td>JavaScript / TypeScript</td>
|
|
1111
|
+
<td>JS, C#, Scala</td>
|
|
1112
|
+
<td>Polyglot (Output only)</td>
|
|
1113
|
+
<td>Java / Python (Selenium)</td>
|
|
1114
|
+
</tr>
|
|
1115
|
+
<tr>
|
|
1116
|
+
<td><strong data-i18n="tr4_dim">Bắt Test Pass Ảo (AST Linter)</strong></td>
|
|
1117
|
+
<td class="col-synapse"><span class="pill-win" data-i18n="tr4_syn">Tích hợp sẵn (Quét 0.02s)</span></td>
|
|
1118
|
+
<td>Partial (expect rules)</td>
|
|
1119
|
+
<td>❌ No (High execution cost)</td>
|
|
1120
|
+
<td>❌ No</td>
|
|
1121
|
+
<td>❌ No</td>
|
|
1122
|
+
</tr>
|
|
1123
|
+
<tr>
|
|
1124
|
+
<td><strong data-i18n="tr5_dim">Chạy 100% Offline (Air-Gapped)</strong></td>
|
|
1125
|
+
<td class="col-synapse"><span class="pill-win" data-i18n="tr5_syn">100% Offline (Không tốn token API)</span></td>
|
|
1126
|
+
<td>100% Offline</td>
|
|
1127
|
+
<td>100% Offline</td>
|
|
1128
|
+
<td>100% Offline</td>
|
|
1129
|
+
<td>Requires DB / Backend</td>
|
|
1130
|
+
</tr>
|
|
1131
|
+
<tr>
|
|
1132
|
+
<td><strong data-i18n="tr6_dim">QA Thủ Công (AI-RBT & Excel)</strong></td>
|
|
1133
|
+
<td class="col-synapse"><span class="pill-win" data-i18n="tr6_syn">Xuất Excel 12 cột tích hợp sẵn</span></td>
|
|
1134
|
+
<td>❌ No</td>
|
|
1135
|
+
<td>❌ No</td>
|
|
1136
|
+
<td>❌ No</td>
|
|
1137
|
+
<td>❌ No</td>
|
|
1138
|
+
</tr>
|
|
1139
|
+
</tbody>
|
|
1140
|
+
</table>
|
|
1141
|
+
</div>
|
|
1142
|
+
</section>
|
|
1143
|
+
|
|
1144
|
+
<!-- 9 Quality Gates DoD Section -->
|
|
1145
|
+
<section id="quality-gates" style="scroll-margin-top: 100px;">
|
|
1146
|
+
<div class="section-header">
|
|
1147
|
+
<span class="section-tag" data-i18n="sec_gates_tag">Kiểm Định Toàn Diện</span>
|
|
1148
|
+
<h2 class="section-title" data-i18n="sec_gates_title">9 Cổng Kiểm Soát Chất Lượng (DoD Sentinel)</h2>
|
|
1149
|
+
<p class="section-desc" data-i18n="sec_gates_desc">Mọi kịch bản test do AI sinh ra bắt buộc phải vượt qua toàn bộ 9 Quality Gates trước khi được commit hoặc merge code.</p>
|
|
1150
|
+
</div>
|
|
1151
|
+
|
|
1152
|
+
<div class="gates-grid">
|
|
1153
|
+
<div class="gate-card">
|
|
1154
|
+
<div class="gate-top"><span class="gate-badge">GATE 0</span><span class="gate-pass">✓ PASS</span></div>
|
|
1155
|
+
<div class="gate-name" data-i18n="g0_name">Bảo Đảm Bản Quyền & Tác Giả</div>
|
|
1156
|
+
<div class="gate-desc" data-i18n="g0_desc">Bảo chứng nguồn gốc tác quyền Thế Vị (@TeeVee998) theo chuẩn Giấy phép MIT.</div>
|
|
1157
|
+
</div>
|
|
1158
|
+
<div class="gate-card">
|
|
1159
|
+
<div class="gate-top"><span class="gate-badge">GATE 1</span><span class="gate-pass">✓ PASS</span></div>
|
|
1160
|
+
<div class="gate-name" data-i18n="g1_name">Chuẩn Mã Hóa UTF-8 No BOM</div>
|
|
1161
|
+
<div class="gate-desc" data-i18n="g1_desc">100% file không chứa UTF-8 BOM hoặc lỗi vỡ font chữ trên toàn bộ dự án.</div>
|
|
1162
|
+
</div>
|
|
1163
|
+
<div class="gate-card">
|
|
1164
|
+
<div class="gate-top"><span class="gate-badge">GATE 2</span><span class="gate-pass">✓ PASS</span></div>
|
|
1165
|
+
<div class="gate-name" data-i18n="g2_name">Đường Dẫn Linh Hoạt (Path Portability)</div>
|
|
1166
|
+
<div class="gate-desc" data-i18n="g2_desc">Không gắn cứng đường dẫn máy cá nhân (/Users/..., C:\\...), chạy mượt trên mọi môi trường.</div>
|
|
1167
|
+
</div>
|
|
1168
|
+
<div class="gate-card">
|
|
1169
|
+
<div class="gate-top"><span class="gate-badge">GATE 3</span><span class="gate-pass">✓ PASS</span></div>
|
|
1170
|
+
<div class="gate-name" data-i18n="g3_name">Kiến Trúc Clean POM Phẳng</div>
|
|
1171
|
+
<div class="gate-desc" data-i18n="g3_desc">Cấm tuyệt đối raw XPath hay CSS selector trong test script; bắt buộc đóng gói trong Page.</div>
|
|
1172
|
+
</div>
|
|
1173
|
+
<div class="gate-card">
|
|
1174
|
+
<div class="gate-top"><span class="gate-badge">GATE 4</span><span class="gate-pass">✓ PASS</span></div>
|
|
1175
|
+
<div class="gate-name" data-i18n="g4_name">Chống Lệch Tài Liệu AI (Anti-Drift)</div>
|
|
1176
|
+
<div class="gate-desc" data-i18n="g4_desc">Đảm bảo không phát sinh PageClass ảo hay test suite sai lệch giữa mã nguồn thực và PROJECT_AI_GUIDE.md.</div>
|
|
1177
|
+
</div>
|
|
1178
|
+
<div class="gate-card">
|
|
1179
|
+
<div class="gate-top"><span class="gate-badge">GATE 5</span><span class="gate-pass">✓ PASS</span></div>
|
|
1180
|
+
<div class="gate-name" data-i18n="g5_name">Bộ Lọc Chặn File Rác & File Tạm</div>
|
|
1181
|
+
<div class="gate-desc" data-i18n="g5_desc">Không để rò rỉ file build tạm (*.tmp, *.db, memory dump) làm bẩn không gian làm việc.</div>
|
|
1182
|
+
</div>
|
|
1183
|
+
<div class="gate-card">
|
|
1184
|
+
<div class="gate-top"><span class="gate-badge">GATE 6</span><span class="gate-pass">✓ PASS</span></div>
|
|
1185
|
+
<div class="gate-name" data-i18n="g6_name">Bảo Vệ Bí Mật & Thông Tin Đăng Nhập</div>
|
|
1186
|
+
<div class="gate-desc" data-i18n="g6_desc">Không lưu mật khẩu dạng plaintext, private key hoặc token bí mật trong kịch bản.</div>
|
|
1187
|
+
</div>
|
|
1188
|
+
<div class="gate-card">
|
|
1189
|
+
<div class="gate-top"><span class="gate-badge">GATE 7</span><span class="gate-pass">✓ PASS</span></div>
|
|
1190
|
+
<div class="gate-name" data-i18n="g7_name">Quét Tĩnh & Phát Hiện Test Pass Ảo</div>
|
|
1191
|
+
<div class="gate-desc" data-i18n="g7_desc">Tự động quét phát hiện test thiếu assertion, sleep cố định và try-catch bỏ qua ngoại lệ ngầm.</div>
|
|
1192
|
+
</div>
|
|
1193
|
+
<div class="gate-card">
|
|
1194
|
+
<div class="gate-top"><span class="gate-badge">GATE 8</span><span class="gate-pass">✓ PASS</span></div>
|
|
1195
|
+
<div class="gate-name" data-i18n="g8_name">Kiểm Thử Đột Biến Mã (Micro-Mutation)</div>
|
|
1196
|
+
<div class="gate-desc" data-i18n="g8_desc">Yêu cầu điểm Mutation ≥ 80% để loại bỏ các bài test pass ảo nhưng không kiểm tra logic thực tế.</div>
|
|
1197
|
+
</div>
|
|
1198
|
+
</div>
|
|
1199
|
+
</section>
|
|
1200
|
+
|
|
1201
|
+
<!-- Subagent Swarm Architecture -->
|
|
1202
|
+
<section id="swarm" style="scroll-margin-top: 100px;">
|
|
1203
|
+
<div class="section-header">
|
|
1204
|
+
<span class="section-tag" data-i18n="sec_swarm_tag">Hệ Thống AI Agent Tự Động (Swarm)</span>
|
|
1205
|
+
<h2 class="section-title" data-i18n="sec_swarm_title">6 Hồ Sơ Subagent Chuyên Biệt</h2>
|
|
1206
|
+
<p class="section-desc" data-i18n="sec_swarm_desc">Phối hợp nhịp nhàng thông qua kiến trúc Single Front-Door FSM, loại bỏ hoàn toàn sự lúng túng khi điều phối agent.</p>
|
|
1207
|
+
</div>
|
|
1208
|
+
|
|
1209
|
+
<div class="swarm-grid">
|
|
1210
|
+
<div class="agent-card">
|
|
1211
|
+
<div class="agent-icon">👑</div>
|
|
1212
|
+
<div class="agent-role" data-i18n="a1_role">Trưởng Nhóm Điều Phối (Lead QA)</div>
|
|
1213
|
+
<span class="agent-id">@orchestrator</span>
|
|
1214
|
+
<p class="agent-desc" data-i18n="a1_desc">Tiếp nhận yêu cầu người dùng, phân tích phạm vi ảnh hưởng, cài đặt dự án và điều khiển chuyển trạng thái FSM.</p>
|
|
1215
|
+
</div>
|
|
1216
|
+
<div class="agent-card">
|
|
1217
|
+
<div class="agent-icon">🔍</div>
|
|
1218
|
+
<div class="agent-role" data-i18n="a2_role">Khảo Sát DOM Trực Tiếp</div>
|
|
1219
|
+
<span class="agent-id">@live-explorer</span>
|
|
1220
|
+
<p class="agent-desc" data-i18n="a2_desc">Dò tìm DOM/AOM trực tiếp dưới 200ms bằng headless Playwright. Không bao giờ đoán mò selector.</p>
|
|
1221
|
+
</div>
|
|
1222
|
+
<div class="agent-card">
|
|
1223
|
+
<div class="agent-icon">🏛️</div>
|
|
1224
|
+
<div class="agent-role" data-i18n="a3_role">Kỹ Sư Thiết Kế Clean POM</div>
|
|
1225
|
+
<span class="agent-id">@pom-crafter</span>
|
|
1226
|
+
<p class="agent-desc" data-i18n="a3_desc">Thiết kế Page Class và test script đa ngôn ngữ, áp dụng nghiêm ngặt kiến trúc Clean POM phẳng.</p>
|
|
1227
|
+
</div>
|
|
1228
|
+
<div class="agent-card">
|
|
1229
|
+
<div class="agent-icon">⚡</div>
|
|
1230
|
+
<div class="agent-role" data-i18n="a4_role">Kỹ Sư Chạy Test Tự Động</div>
|
|
1231
|
+
<span class="agent-id">@test-runner</span>
|
|
1232
|
+
<p class="agent-desc" data-i18n="a4_desc">Thực thi test headless qua CLI, cân bằng phân mảnh CI runner và lọc bỏ 95% nhiễu log.</p>
|
|
1233
|
+
</div>
|
|
1234
|
+
<div class="agent-card">
|
|
1235
|
+
<div class="agent-icon">🩺</div>
|
|
1236
|
+
<div class="agent-role" data-i18n="a5_role">Chuyên Gia Phân Tích & Điều Tra Lỗi (Failure Autopsy)</div>
|
|
1237
|
+
<span class="agent-id">@failure-analyst</span>
|
|
1238
|
+
<p class="agent-desc" data-i18n="a5_desc">Chẩn đoán nguyên nhân gốc (RCA) từ JUnit XML và ảnh chụp lỗi; tự động đề xuất giải pháp và tạo PR khắc phục lỗi.</p>
|
|
1239
|
+
</div>
|
|
1240
|
+
<div class="agent-card">
|
|
1241
|
+
<div class="agent-icon">🛡️</div>
|
|
1242
|
+
<div class="agent-role" data-i18n="a6_role">Chốt Chặn Kiểm Soát Chất Lượng (Quality Gatekeeper)</div>
|
|
1243
|
+
<span class="agent-id">@quality-gatekeeper</span>
|
|
1244
|
+
<p class="agent-desc" data-i18n="a6_desc">Kiểm định nghiêm ngặt toàn bộ 9 Quality Gates DoD và điểm mutation ≥ 80% trước khi hoàn tất công việc.</p>
|
|
1245
|
+
</div>
|
|
1246
|
+
</div>
|
|
1247
|
+
</section>
|
|
1248
|
+
|
|
1249
|
+
</main>
|
|
1250
|
+
|
|
1251
|
+
<!-- Footer -->
|
|
1252
|
+
<footer>
|
|
1253
|
+
<div class="container">
|
|
1254
|
+
<div class="footer-grid">
|
|
1255
|
+
<div class="footer-brand">
|
|
1256
|
+
<div class="brand">
|
|
1257
|
+
<div class="brand-icon">⚡</div>
|
|
1258
|
+
<span class="brand-name">SYNAPSE HUB</span>
|
|
1259
|
+
</div>
|
|
1260
|
+
<p data-i18n="footer_subtitle">Mạng Lưới Kỹ Thuật Chất Lượng & Kỹ Năng Tự Trị Cho AI Agent Doanh Nghiệp.</p>
|
|
1261
|
+
</div>
|
|
1262
|
+
<ul class="footer-links">
|
|
1263
|
+
<li><a href="PROJECT_DASHBOARD.html">Dashboard</a></li>
|
|
1264
|
+
<li><a href="__REPO__">GitHub Repository</a></li>
|
|
1265
|
+
<li><a href="__REPO__/issues">Report an Issue</a></li>
|
|
1266
|
+
<li><a href="__REPO__/blob/develop/docs/CONTRIBUTING.md">Contributing</a></li>
|
|
1267
|
+
</ul>
|
|
1268
|
+
</div>
|
|
1269
|
+
<div class="footer-bottom">
|
|
1270
|
+
<p>
|
|
1271
|
+
<span data-i18n="footer_creator">Tác giả sáng lập</span>: <strong>__AUTHOR__</strong> • <span data-i18n="footer_license">Phát hành theo</span>
|
|
1272
|
+
<a href="__REPO__/blob/develop/LICENSE" target="_blank" rel="noopener">MIT License</a>.
|
|
1273
|
+
<span data-i18n="footer_legal">Mọi quyền tác giả và nguồn gốc mã nguồn được bảo toàn theo đúng quy định giấy phép mở.</span>
|
|
1274
|
+
</p>
|
|
1275
|
+
<p style="margin-top: 6px; font-size: 11px; color: var(--text-muted);" data-i18n="footer_meta">Tạo lúc __NOW_STR__ • Hoàn toàn Offline & Sẵn sàng cho Môi trường Độc lập</p>
|
|
1276
|
+
</div>
|
|
1277
|
+
</div>
|
|
1278
|
+
</footer>
|
|
1279
|
+
|
|
1280
|
+
<!-- Toast Notification -->
|
|
1281
|
+
<div id="toast" class="toast">✓ Đã sao chép vào bộ nhớ tạm!</div>
|
|
1282
|
+
|
|
1283
|
+
<!-- Bilingual i18n Dictionary & Interactive Script -->
|
|
1284
|
+
<script>
|
|
1285
|
+
const translations = {
|
|
1286
|
+
vi: {
|
|
1287
|
+
nav_pillars: "4 Trụ Cột",
|
|
1288
|
+
nav_features: "Tính Năng",
|
|
1289
|
+
nav_quickstart: "Lệnh CLI",
|
|
1290
|
+
nav_gates: "9 Quality Gates",
|
|
1291
|
+
nav_compare: "So Sánh",
|
|
1292
|
+
status_ready: "● Sẵn sàng",
|
|
1293
|
+
hero_pill_tag: "🛡️ Trung Tâm Trí Tuệ Chất Lượng AI Doanh Nghiệp",
|
|
1294
|
+
hero_pill_status: "Sẵn Sàng 100% Offline",
|
|
1295
|
+
hero_target_label: "Dự án mục tiêu",
|
|
1296
|
+
hero_title: "Trung Tâm Trí Tuệ QA Toàn Diện<br>Dành Cho AI Coding Agents",
|
|
1297
|
+
hero_desc: "Tăng cường sức mạnh cho QA Engineers và các Autonomous AI Agent trên cả 4 mảng: <strong>Manual</strong>, <strong>Automation</strong>, <strong>API</strong> và <strong>Performance Testing</strong>. Trang bị các Sentinel phân tích cú pháp AST 100% offline, 6 hồ sơ Swarm Agent, và 9 Quality Gates Definition-of-Done.",
|
|
1298
|
+
mode_cli_title: "🛠️ Cách 1: CLI Độc Lập (Zero AI)",
|
|
1299
|
+
mode_cli_desc: "Chạy <code>npx synapse-hub lint</code> phát hiện test pass ảo, nén log CI hoặc xuất Excel chuẩn mà không cần cấu hình.",
|
|
1300
|
+
mode_agent_title: "🧠 Cách 2: Chốt Chặn Cho AI Coding",
|
|
1301
|
+
mode_agent_desc: "Tích hợp vào Cursor, Antigravity, Claude Code làm bộ quy chuẩn — ngăn AI sinh mã nguồn cẩu thả hoặc bỏ qua ngoại lệ ngầm.",
|
|
1302
|
+
btn_quickstart: "🚀 Bắt Đầu Trong 5 Giây",
|
|
1303
|
+
btn_pillars: "🎯 Khám Phá 4 Trụ Cột",
|
|
1304
|
+
btn_gates: "🛡️ Xem 9 Quality Gates",
|
|
1305
|
+
stat_skills: "Kỹ Năng AI Tiêu Chuẩn",
|
|
1306
|
+
stat_gates: "Cổng Kiểm Soát DoD",
|
|
1307
|
+
stat_swarm: "Vai Trò AI Chuyên Biệt",
|
|
1308
|
+
stat_offline: "Hoàn Toàn Offline & Air-Gapped",
|
|
1309
|
+
sec_pillars_tag: "Bao Quát Toàn Diện",
|
|
1310
|
+
sec_pillars_title: "4 Trụ Cột Trí Tuệ QA Cốt Lõi",
|
|
1311
|
+
sec_pillars_desc: "Synapse Hub kết nối giữa kiểm thử khám phá thủ công, tự động hóa bằng AI tiên tiến, kiểm thử hợp đồng API vững chắc và đánh giá hiệu năng backend chuyên sâu.",
|
|
1312
|
+
p1_title: "1. Manual Testing (AI-RBT)",
|
|
1313
|
+
p1_badge: "Theo Rủi Ro",
|
|
1314
|
+
p1_desc: "Chuyển hóa các yêu cầu kinh doanh thành bộ test case kiểm thử biên chặt chẽ, ngăn ngừa triệt để tình trạng AI suy đoán sai lệch (hallucination).",
|
|
1315
|
+
p1_f1: "<strong>6 Giai đoạn kiểm thử theo rủi ro:</strong> Phân loại độ ưu tiên dựa trên bán kính ảnh hưởng kinh doanh và xác suất lỗi.",
|
|
1316
|
+
p1_f2: "<strong>Ma trận 15 loại trường nhập liệu:</strong> Kiểm tra giá trị biên triệt để (Email, SĐT, Tiền tệ, Regex, Ký tự SQLi).",
|
|
1317
|
+
p1_f3: "<strong>Bộ xuất Excel 12 cột chuẩn mực:</strong> 1-click chuyển đổi Markdown sang Excel chuyên nghiệp có công thức và định dạng có điều kiện.",
|
|
1318
|
+
p1_f4: "<strong>Phát hiện kịch bản biên phi chức năng:</strong> Tự động gắn cờ submit đúp (double-click), tranh chấp dữ liệu (race conditions), và quá hạn phiên.",
|
|
1319
|
+
p2_title: "2. Test Automation & Clean POM",
|
|
1320
|
+
p2_badge: "Kiến Trúc Phẳng",
|
|
1321
|
+
p2_desc: "Chuẩn hóa kiến trúc Clean Page Object Model, nơi test script chỉ gọi các phương thức nghiệp vụ từ Page Class.",
|
|
1322
|
+
p2_f1: "<strong>Test Script Không Chứa Locator:</strong> Cấm tuyệt đối raw XPath hay CSS selector bên trong các file test case.",
|
|
1323
|
+
p2_f2: "<strong>Quy trình Swarm FSM 5 Giai Đoạn:</strong> Quy trình tất định từ dò tìm element trực tiếp đến tự động phục hồi kịch bản.",
|
|
1324
|
+
p2_f3: "<strong>Dò Tìm DOM Trực Tiếp Dưới 200ms:</strong> Khảo sát live DOM/AOM bằng headless Playwright trước khi sinh locator, tỷ lệ trúng 100%.",
|
|
1325
|
+
p2_f4: "<strong>Đa Nền Tảng Đa Ngôn Ngữ:</strong> Hỗ trợ mượt mà Playwright (TS/JS), Cypress, Selenium, Pytest, và Katalon.",
|
|
1326
|
+
p3_title: "3. Kiểm Thử API & Chuẩn Hợp Đồng",
|
|
1327
|
+
p3_badge: "Không Sai Lệch",
|
|
1328
|
+
p3_desc: "Kiểm thử toàn diện vòng đời API từ hợp đồng OpenAPI/Swagger đến mô phỏng mạng lỗi và hỗn loạn (Chaos injection).",
|
|
1329
|
+
p3_f1: "<strong>Sinh Ma Trận Test Từ OpenAPI:</strong> Biên dịch đặc tả OpenAPI thành các bộ test case phân luồng tích cực, biên và tiêu cực.",
|
|
1330
|
+
p3_f2: "<strong>Sentinel Chống Trôi Hợp Đồng (API Drift):</strong> Phân tích cú pháp AST để phát hiện sớm các breaking change trước khi CI thất bại.",
|
|
1331
|
+
p3_f3: "<strong>Chặn Bắt & Mock API (Mock Shield):</strong> Chặn bắt và làm giả HTTP/GraphQL trong trình duyệt, giả lập giật lag và lỗi 500.",
|
|
1332
|
+
p3_f4: "<strong>Tích Hợp Postman & Newman:</strong> Tự động chuyển đổi bộ sưu tập Postman và phân tích chẩn đoán kết quả thực thi.",
|
|
1333
|
+
p4_title: "4. Hiệu Năng & Độ Ổn Định",
|
|
1334
|
+
p4_badge: "Bảo Vệ SLA",
|
|
1335
|
+
p4_desc: "Kiểm thử chịu tải backend, đo lường chỉ số Core Web Vitals, và quản lý cách ly các test case chập chờn.",
|
|
1336
|
+
p4_f1: "<strong>Bộ Sinh Kịch Bản Đa Công Cụ:</strong> Tự động tạo kịch bản tải cho k6, Locust, và Apache JMeter (.jmx).",
|
|
1337
|
+
p4_f2: "<strong>Đo Lường Core Web Vitals:</strong> Đánh giá chi tiết các chỉ số LCP, CLS, và INP thông qua Chrome DevTools Protocol.",
|
|
1338
|
+
p4_f3: "<strong>Sentinel Bắt Test Chập Chờn (Flaky):</strong> Tính điểm phương sai không tất định và tự động cách ly vào khu vực kiểm dịch.",
|
|
1339
|
+
p4_f4: "<strong>Phân Mảnh Tải Song Song (Matrix Sharder):</strong> Thuật toán phân bổ tối ưu (Bin Packing) cân bằng thời gian chạy CI giữa các máy runner với sai số dưới 5%.",
|
|
1340
|
+
sec_hero_tag: "Độ Chính Xác Thực Tế",
|
|
1341
|
+
sec_hero_title: "3 Siêu Năng Lực Đột Phá",
|
|
1342
|
+
sec_hero_desc: "Các đột phá kiến trúc giúp ngăn chặn AI suy đoán sai lệch, loại bỏ các test case vô nghĩa (test luôn pass / tautological tests), và dập tắt lỗi pipeline chập chờn.",
|
|
1343
|
+
h1_badge: "SIÊU TÍNH NĂNG 1 • LINTER AST",
|
|
1344
|
+
h1_title: "Bắt Test Pass Ảo (Fake-Pass Sentinel)",
|
|
1345
|
+
h1_desc: "AI coding agents thường sinh test case rỗng hoặc bọc try/catch bỏ qua lỗi để tạo kết quả pass giả. Linter AST phân tích cây cú pháp trong 0.02s giúp phát hiện ngay các bài test thiếu assertion hoặc bỏ qua ngoại lệ ngầm.",
|
|
1346
|
+
h2_badge: "SIÊU TÍNH NĂNG 2 • ĐỘT BIẾN MÃ",
|
|
1347
|
+
h2_title: "Đo Độ Nhạy Assert (Micro-Mutator)",
|
|
1348
|
+
h2_desc: "Tự động biến đổi logic (đảo toán tử, sửa điều kiện) để kiểm tra xem các câu lệnh assert có thực sự bắt được lỗi hay không (yêu cầu Mutation Score ≥ 80%).",
|
|
1349
|
+
h3_badge: "SIÊU TÍNH NĂNG 3 • TỐI ƯU NGỮ CẢNH",
|
|
1350
|
+
h3_title: "Lọc 95% Nhiễu Log CI/CD",
|
|
1351
|
+
h3_desc: "Log CLI và Gradle dài hàng nghìn dòng làm AI bị tràn bộ nhớ và mất tập trung. Bộ lọc thông minh cô đọng dữ liệu còn vài dòng chứa đúng dòng gây lỗi, exception gốc và 3 request gần nhất.",
|
|
1352
|
+
sec_cli_tag: "Hiệu Quả Tức Thì",
|
|
1353
|
+
sec_cli_title: "Bảng Tra Cứu Lệnh CLI (Không Cần Cấu Hình)",
|
|
1354
|
+
sec_cli_desc: "Thực thi mọi tính năng mạnh mẽ của Synapse Hub trực tiếp qua npx hoặc npm mà không cần cài đặt phức tạp.",
|
|
1355
|
+
t_doctor: "1. Chẩn Đoán (Doctor)",
|
|
1356
|
+
t_setup: "2. Cài Đặt (Setup)",
|
|
1357
|
+
t_verify: "3. Kiểm Tra 9 Cổng",
|
|
1358
|
+
t_lint: "4. Quét Fake-Pass",
|
|
1359
|
+
t_excel: "5. Xuất Excel",
|
|
1360
|
+
t_dashboard: "6. Dashboard",
|
|
1361
|
+
t_review: "7. Soát Spec",
|
|
1362
|
+
t_watch: "8. Giám Sát Real-Time",
|
|
1363
|
+
t_desc_doctor: "🩺 Quét chẩn đoán 1-click kiểm tra môi trường Python 3.9+, Node.js, Git hook, trình duyệt, và Bộ nhớ Agent Trung tâm.",
|
|
1364
|
+
t_desc_setup: "⚡ Cài đặt dự án 1-click: sinh hướng dẫn PROJECT_AI_GUIDE.md, cầu nối Universal AI bridges, bản đồ AST, và git hook chặn rò rỉ.",
|
|
1365
|
+
t_desc_verify: "🛡️ Thực thi toàn bộ 9 Quality Gates Definition-of-Done (UTF-8 No BOM, Clean POM, Đường dẫn linh hoạt, Mutation ≥ 80%).",
|
|
1366
|
+
t_desc_lint: "🔍 Quét AST phát hiện các test case pass ảo (0 assertion), khối catch rỗng và ngoại lệ bị bỏ qua ngầm (swallowed exceptions) trên toàn bộ test script.",
|
|
1367
|
+
t_desc_excel: "📊 Biên dịch tài liệu test case markdown sang file bảng tính Excel 12 cột chuyên nghiệp có công thức và danh sách chọn trạng thái.",
|
|
1368
|
+
t_desc_dashboard: "📈 Khởi tạo và mở trang Báo cáo QA Tổng thể dạng HTML độc lập ngay trong trình duyệt của bạn.",
|
|
1369
|
+
t_desc_review: "🐟 Soát xét đặc tả độc lập theo mô hình Elephant-Goldfish, bóc tách chính xác 5 dạng lỗ hổng mơ hồ trước khi viết code.",
|
|
1370
|
+
t_desc_watch: "👁️ Bảng điều khiển TUI HUD trực quan thời gian thực, tích hợp cơ chế giám sát tự động chống treo/kẹt mạng và chống vòng lặp thao tác.",
|
|
1371
|
+
sec_comp_tag: "Định Vị Giá Trị",
|
|
1372
|
+
sec_comp_title: "So Sánh Synapse Hub Với Các Lựa Chọn Khác",
|
|
1373
|
+
sec_comp_desc: "Lý do các đội ngũ kỹ thuật doanh nghiệp lựa chọn Synapse Hub làm trung tâm trí tuệ đồng nhất thay vì chắp vá các công cụ đơn lẻ.",
|
|
1374
|
+
th_dimension: "Tiêu chí / Khía cạnh",
|
|
1375
|
+
tr1_dim: "Phạm vi & Vòng đời",
|
|
1376
|
+
tr1_syn: "Toàn diện 4 Trụ Cột QA",
|
|
1377
|
+
tr1_es: "Chỉ là Linter JS/TS",
|
|
1378
|
+
tr1_st: "Chỉ là Engine Đột Biến",
|
|
1379
|
+
tr1_al: "Chỉ là Báo Cáo Test",
|
|
1380
|
+
tr1_he: "Chỉ là Proxy Tự Phục Hồi",
|
|
1381
|
+
tr2_dim: "Đối tượng phục vụ",
|
|
1382
|
+
tr2_syn: "AI Agents + Kỹ sư QA",
|
|
1383
|
+
tr2_es: "Lập trình viên Frontend",
|
|
1384
|
+
tr2_st: "Senior Developers",
|
|
1385
|
+
tr2_al: "QA Leads / Quản lý",
|
|
1386
|
+
tr2_he: "Selenium SDETs",
|
|
1387
|
+
tr3_dim: "Cú pháp AST Đa Ngôn Ngữ",
|
|
1388
|
+
tr4_dim: "Bắt Test Pass Ảo (AST Linter)",
|
|
1389
|
+
tr4_syn: "Tích hợp sẵn (Quét 0.02s)",
|
|
1390
|
+
tr5_dim: "Chạy 100% Offline (Air-Gapped)",
|
|
1391
|
+
tr5_syn: "100% Offline (Không tốn token API)",
|
|
1392
|
+
tr6_dim: "QA Thủ Công (AI-RBT & Excel)",
|
|
1393
|
+
tr6_syn: "Xuất Excel 12 cột tích hợp sẵn",
|
|
1394
|
+
sec_gates_tag: "Kiểm Định Toàn Diện",
|
|
1395
|
+
sec_gates_title: "9 Cổng Kiểm Soát Chất Lượng (DoD Sentinel)",
|
|
1396
|
+
sec_gates_desc: "Mọi kịch bản test do AI sinh ra bắt buộc phải vượt qua toàn bộ 9 Quality Gates trước khi được commit hoặc merge code.",
|
|
1397
|
+
g0_name: "Bảo Đảm Bản Quyền & Tác Giả",
|
|
1398
|
+
g0_desc: "Bảo chứng nguồn gốc tác quyền Thế Vị (@TeeVee998) theo chuẩn Giấy phép MIT.",
|
|
1399
|
+
g1_name: "Chuẩn Mã Hóa UTF-8 No BOM",
|
|
1400
|
+
g1_desc: "100% file không chứa UTF-8 BOM hoặc lỗi vỡ font chữ trên toàn bộ dự án.",
|
|
1401
|
+
g2_name: "Đường Dẫn Linh Hoạt (Path Portability)",
|
|
1402
|
+
g2_desc: "Không gắn cứng đường dẫn máy cá nhân (/Users/..., C:\\...), chạy mượt trên mọi môi trường.",
|
|
1403
|
+
g3_name: "Kiến Trúc Clean POM Phẳng",
|
|
1404
|
+
g3_desc: "Cấm tuyệt đối raw XPath hay CSS selector trong test script; bắt buộc đóng gói trong Page.",
|
|
1405
|
+
g4_name: "Chống Lệch Tài Liệu AI (Anti-Drift)",
|
|
1406
|
+
g4_desc: "Đảm bảo không phát sinh PageClass ảo hay test suite sai lệch giữa mã nguồn thực và PROJECT_AI_GUIDE.md.",
|
|
1407
|
+
g5_name: "Bộ Lọc Chặn File Rác & File Tạm",
|
|
1408
|
+
g5_desc: "Không để rò rỉ file build tạm (*.tmp, *.db, memory dump) làm bẩn không gian làm việc.",
|
|
1409
|
+
g6_name: "Bảo Vệ Bí Mật & Thông Tin Đăng Nhập",
|
|
1410
|
+
g6_desc: "Không lưu mật khẩu dạng plaintext, private key hoặc token bí mật trong kịch bản.",
|
|
1411
|
+
g7_name: "Quét Tĩnh & Phát Hiện Test Pass Ảo",
|
|
1412
|
+
g7_desc: "Tự động quét phát hiện test thiếu assertion, sleep cố định và try-catch bỏ qua ngoại lệ ngầm.",
|
|
1413
|
+
g8_name: "Kiểm Thử Đột Biến Mã (Micro-Mutation)",
|
|
1414
|
+
g8_desc: "Yêu cầu điểm Mutation ≥ 80% để loại bỏ các bài test pass ảo nhưng không kiểm tra logic thực tế.",
|
|
1415
|
+
sec_swarm_tag: "Hệ Thống AI Agent Tự Động (Swarm)",
|
|
1416
|
+
sec_swarm_title: "6 Hồ Sơ Subagent Chuyên Biệt",
|
|
1417
|
+
sec_swarm_desc: "Phối hợp nhịp nhàng thông qua kiến trúc Single Front-Door FSM, loại bỏ hoàn toàn sự lúng túng khi điều phối agent.",
|
|
1418
|
+
a1_role: "Trưởng Nhóm Điều Phối (Lead QA)",
|
|
1419
|
+
a1_desc: "Tiếp nhận yêu cầu người dùng, phân tích phạm vi ảnh hưởng, cài đặt dự án và điều khiển chuyển trạng thái FSM.",
|
|
1420
|
+
a2_role: "Khảo Sát DOM Trực Tiếp",
|
|
1421
|
+
a2_desc: "Dò tìm DOM/AOM trực tiếp dưới 200ms bằng headless Playwright. Không bao giờ đoán mò selector.",
|
|
1422
|
+
a3_role: "Kỹ Sư Thiết Kế Clean POM",
|
|
1423
|
+
a3_desc: "Thiết kế Page Class và test script đa ngôn ngữ, áp dụng nghiêm ngặt kiến trúc Clean POM phẳng.",
|
|
1424
|
+
a4_role: "Kỹ Sư Chạy Test Tự Động",
|
|
1425
|
+
a4_desc: "Thực thi test headless qua CLI, cân bằng phân mảnh CI runner và lọc bỏ 95% nhiễu log.",
|
|
1426
|
+
a5_role: "Chuyên Gia Phân Tích & Điều Tra Lỗi (Failure Autopsy)",
|
|
1427
|
+
a5_desc: "Chẩn đoán nguyên nhân gốc (RCA) từ JUnit XML và ảnh chụp lỗi; tự động đề xuất giải pháp và tạo PR khắc phục lỗi.",
|
|
1428
|
+
a6_role: "Chốt Chặn Kiểm Soát Chất Lượng (Quality Gatekeeper)",
|
|
1429
|
+
a6_desc: "Kiểm định nghiêm ngặt toàn bộ 9 Quality Gates DoD và điểm mutation ≥ 80% trước khi hoàn tất công việc.",
|
|
1430
|
+
footer_subtitle: "Nền Tảng Kiểm Định Chất Lượng & Guardrail Cho AI Coding Doanh Nghiệp.",
|
|
1431
|
+
footer_creator: "Tác giả sáng lập",
|
|
1432
|
+
footer_license: "Phát hành theo",
|
|
1433
|
+
footer_legal: "Mọi quyền tác giả và nguồn gốc mã nguồn được bảo toàn theo đúng quy định giấy phép mở.",
|
|
1434
|
+
footer_meta: "Tạo lúc __NOW_STR__ • Hoàn toàn Offline & Sẵn sàng cho Môi trường Độc lập",
|
|
1435
|
+
toast_copy: "✓ Đã sao chép vào bộ nhớ tạm!"
|
|
1436
|
+
},
|
|
1437
|
+
en: {
|
|
1438
|
+
nav_pillars: "4 Pillars",
|
|
1439
|
+
nav_features: "Features",
|
|
1440
|
+
nav_quickstart: "CLI Commands",
|
|
1441
|
+
nav_gates: "9 Quality Gates",
|
|
1442
|
+
nav_compare: "Comparison",
|
|
1443
|
+
status_ready: "● Ready",
|
|
1444
|
+
hero_pill_tag: "🛡️ Enterprise AI Quality Intelligence Hub",
|
|
1445
|
+
hero_pill_status: "100% Offline Ready",
|
|
1446
|
+
hero_target_label: "Target Project",
|
|
1447
|
+
hero_title: "The Complete QA Intelligence Hub<br>for AI Coding Agents",
|
|
1448
|
+
hero_desc: "Empowering QA Engineers and Autonomous AI Agents across <strong>Manual</strong>, <strong>Automation</strong>, <strong>API</strong>, and <strong>Performance</strong> testing. Equipped with 100% offline-first AST sentinels, 6 swarm profiles, and 9 Quality Gates Definition-of-Done.",
|
|
1449
|
+
mode_cli_title: "🛠️ Mode 1: Standalone CLI (Zero AI)",
|
|
1450
|
+
mode_cli_desc: "Run <code>npx synapse-hub lint</code> to catch fake passes, distill CI logs, or export Excel with zero setup.",
|
|
1451
|
+
mode_agent_title: "🧠 Mode 2: Guardrail for AI Coding",
|
|
1452
|
+
mode_agent_desc: "Mount into Cursor, Antigravity, or Claude Code as quality guardrails — stopping AI from writing brittle or tautological tests.",
|
|
1453
|
+
btn_quickstart: "🚀 5-Second Quickstart",
|
|
1454
|
+
btn_pillars: "🎯 Explore 4 Pillars",
|
|
1455
|
+
btn_gates: "🛡️ View 9 Quality Gates",
|
|
1456
|
+
stat_skills: "Standardized AI Skills",
|
|
1457
|
+
stat_gates: "Quality Gates DoD",
|
|
1458
|
+
stat_swarm: "Autonomous Swarm Roles",
|
|
1459
|
+
stat_offline: "Air-Gapped & Offline Ready",
|
|
1460
|
+
sec_pillars_tag: "Comprehensive Discipline",
|
|
1461
|
+
sec_pillars_title: "The 4 Pillars of QA Intelligence",
|
|
1462
|
+
sec_pillars_desc: "Synapse Hub bridges manual exploratory testing with bleeding-edge AI automation, robust contract API testing, and backend endurance verification.",
|
|
1463
|
+
p1_title: "1. Manual Testing (AI-RBT)",
|
|
1464
|
+
p1_badge: "Risk-Based",
|
|
1465
|
+
p1_desc: "Transforms vague requirements into rigorous, boundary-tested manual test cases with zero hallucinations.",
|
|
1466
|
+
p1_f1: "<strong>6-Stage Risk-Based Testing:</strong> Priority classification by business blast radius and failure probability.",
|
|
1467
|
+
p1_f2: "<strong>15-Field Input Matrix:</strong> Exhaustive boundary checks (Email, Phone, Currency, Regex, SQLi chars).",
|
|
1468
|
+
p1_f3: "<strong>12-Column Excel Exporter:</strong> 1-click Markdown-to-Excel export with formulas and conditional formatting.",
|
|
1469
|
+
p1_f4: "<strong>Edge-Case Discovery:</strong> Auto-flags double-click submission, concurrent race conditions, and session timeouts.",
|
|
1470
|
+
p2_title: "2. Test Automation & Clean POM",
|
|
1471
|
+
p2_badge: "Flat Architecture",
|
|
1472
|
+
p2_desc: "Enforces Clean Page Object Model standards where test scripts strictly call business action methods.",
|
|
1473
|
+
p2_f1: "<strong>Zero-Locator Scripts:</strong> Raw XPaths and CSS selectors strictly forbidden inside test cases.",
|
|
1474
|
+
p2_f2: "<strong>5-Stage FSM Swarm:</strong> Deterministic workflow from live element probing to self-healing execution.",
|
|
1475
|
+
p2_f3: "<strong>Sub-200ms Live Probing:</strong> Headless Playwright live DOM/AOM inspection before writing locators.",
|
|
1476
|
+
p2_f4: "<strong>Polyglot Codebase:</strong> Native support for Playwright (TS/JS), Cypress, Selenium, Pytest, and Katalon.",
|
|
1477
|
+
p3_title: "3. API & Contract Intelligence",
|
|
1478
|
+
p3_badge: "Zero Drift",
|
|
1479
|
+
p3_desc: "End-to-end API lifecycle testing from OpenAPI/Swagger contracts to live chaos network simulation.",
|
|
1480
|
+
p3_f1: "<strong>OpenAPI Spec-to-Matrix:</strong> Compiles OpenAPI specs into positive, boundary, and negative test suites.",
|
|
1481
|
+
p3_f2: "<strong>API Drift Sentinel:</strong> AST-based schema change detector prevents breaking contract changes.",
|
|
1482
|
+
p3_f3: "<strong>Network Mock Shield:</strong> In-browser HTTP/GraphQL stubbing, network throttling, and 500 error injection.",
|
|
1483
|
+
p3_f4: "<strong>Newman / Postman Bridge:</strong> Automated Postman collection conversion and execution diagnostics.",
|
|
1484
|
+
p4_title: "4. Performance & Reliability",
|
|
1485
|
+
p4_badge: "SLA Enforcer",
|
|
1486
|
+
p4_desc: "Backend stress benchmarking, Core Web Vitals telemetry, and anti-flakiness quarantine management.",
|
|
1487
|
+
p4_f1: "<strong>Multi-Engine Load Generator:</strong> Generates production k6, Locust, and Apache JMeter (.jmx) plans.",
|
|
1488
|
+
p4_f2: "<strong>Core Web Vitals Profiler:</strong> Measures LCP, CLS, and INP with CDP deep profiling.",
|
|
1489
|
+
p4_f3: "<strong>Flaky Test Sentinel:</strong> Non-deterministic variance scoring and automated quarantine quarantine gating.",
|
|
1490
|
+
p4_f4: "<strong>Matrix Duration Sharder:</strong> Bin-packing algorithm balances parallel CI runners within 5% variance.",
|
|
1491
|
+
sec_hero_tag: "Ground-Truth Rigor",
|
|
1492
|
+
sec_hero_title: "3 Hero Superpowers",
|
|
1493
|
+
sec_hero_desc: "Key architectural innovations that prevent AI hallucinations, tautological tests, and pipeline flakiness.",
|
|
1494
|
+
h1_badge: "HERO 1 • AST LINTER",
|
|
1495
|
+
h1_title: "Fake-Pass Sentinel",
|
|
1496
|
+
h1_desc: "AI agents often generate empty tests or catch-and-ignore blocks to make CI appear green. Our AST linter scans the syntax tree to catch 0-assertion tests and swallowed exceptions in 0.02s.",
|
|
1497
|
+
h2_badge: "HERO 2 • MUTATION ENGINE",
|
|
1498
|
+
h2_title: "Syntactic Micro-Mutator",
|
|
1499
|
+
h2_desc: "Inverts operators, strips return values, and mutates condition boundaries. Verifies test assertions catch real defects with a mandatory Mutation Score threshold of ≥ 80%.",
|
|
1500
|
+
h3_badge: "HERO 3 • CONTEXT SHIELD",
|
|
1501
|
+
h3_title: "95% Log Distillation",
|
|
1502
|
+
h3_desc: "CLI and Gradle dumps containing 2,000+ lines cause LLM 'Lost in the Middle' errors. Distills raw output down to the exact failing line and the last 3 network requests.",
|
|
1503
|
+
sec_cli_tag: "Instant Productivity",
|
|
1504
|
+
sec_cli_title: "Zero-Configuration CLI Cheatsheet",
|
|
1505
|
+
sec_cli_desc: "Run all Synapse Hub capabilities directly via npx without manual configuration.",
|
|
1506
|
+
t_doctor: "1. Doctor",
|
|
1507
|
+
t_setup: "2. Setup Project",
|
|
1508
|
+
t_verify: "3. Verify 9 Gates",
|
|
1509
|
+
t_lint: "4. Scan Fake-Pass",
|
|
1510
|
+
t_excel: "5. Export Excel",
|
|
1511
|
+
t_dashboard: "6. Dashboard",
|
|
1512
|
+
t_review: "7. Review Spec",
|
|
1513
|
+
t_watch: "8. Real-Time Watch",
|
|
1514
|
+
t_desc_doctor: "🩺 Runs a 1-click diagnostic scan verifying Python 3.9+, Node.js, Git hooks, browser drivers, and Central Agent Memory.",
|
|
1515
|
+
t_desc_setup: "⚡ 1-click bootstrap of target repository: generates PROJECT_AI_GUIDE.md, universal AI bridges, AST map, and pre-push sentinel.",
|
|
1516
|
+
t_desc_verify: "🛡️ Enforces all 9 Quality Gates Definition-of-Done (UTF-8 No BOM, Clean POM, Path Portability, Mutation ≥ 80%).",
|
|
1517
|
+
t_desc_lint: "🔍 AST scan detecting fake passes (0 assertions), empty catch blocks, and swallowed exceptions across all test scripts.",
|
|
1518
|
+
t_desc_excel: "📊 Compiles markdown test cases into a professional 12-column Excel workbook with status dropdowns and formulas.",
|
|
1519
|
+
t_desc_dashboard: "📈 Compiles and opens the standalone executive QA HTML report in your browser.",
|
|
1520
|
+
t_desc_review: "🐟 Zero-context spec stress-testing via Elephant-Goldfish model, catching 5 ambiguity vectors before coding.",
|
|
1521
|
+
t_desc_watch: "👁️ Real-time live TUI HUD terminal dashboard with watchdog inactivity monitor and action loop prevention.",
|
|
1522
|
+
sec_comp_tag: "Value Proposition",
|
|
1523
|
+
sec_comp_title: "How Synapse Hub Compares",
|
|
1524
|
+
sec_comp_desc: "Why enterprise teams choose Synapse Hub as the unified intelligence layer over fragmented single-purpose tools.",
|
|
1525
|
+
th_dimension: "Capability / Dimension",
|
|
1526
|
+
tr1_dim: "Scope & Lifecycle",
|
|
1527
|
+
tr1_syn: "Full 4-Pillar QA Hub",
|
|
1528
|
+
tr1_es: "JS/TS Linter Only",
|
|
1529
|
+
tr1_st: "Mutation Engine Only",
|
|
1530
|
+
tr1_al: "Test Reporter Only",
|
|
1531
|
+
tr1_he: "Self-Healing Proxy Only",
|
|
1532
|
+
tr2_dim: "Target Audience",
|
|
1533
|
+
tr2_syn: "AI Agents + QA Engineers",
|
|
1534
|
+
tr2_es: "Frontend Developers",
|
|
1535
|
+
tr2_st: "Senior Developers",
|
|
1536
|
+
tr2_al: "QA Leads / Managers",
|
|
1537
|
+
tr2_he: "Selenium SDETs",
|
|
1538
|
+
tr3_dim: "Multi-Language AST",
|
|
1539
|
+
tr4_dim: "Fake-Pass AST Sentinel",
|
|
1540
|
+
tr4_syn: "Native (0.02s Scan)",
|
|
1541
|
+
tr5_dim: "Air-Gapped & Offline Ready",
|
|
1542
|
+
tr5_syn: "100% Offline (Zero API cost)",
|
|
1543
|
+
tr6_dim: "Manual QA (AI-RBT & Excel)",
|
|
1544
|
+
tr6_syn: "Native 12-Col Exporter",
|
|
1545
|
+
sec_gates_tag: "Zero-Hallucination Pipeline",
|
|
1546
|
+
sec_gates_title: "9 Quality Gates DoD Sentinel",
|
|
1547
|
+
sec_gates_desc: "Every AI-generated test script must satisfy all 9 Quality Gates before code can be committed or merged.",
|
|
1548
|
+
g0_name: "Author Attribution & Integrity",
|
|
1549
|
+
g0_desc: "Cryptographic provenance invariant preserving author Thế Vị (@TeeVee998) MIT license.",
|
|
1550
|
+
g1_name: "UTF-8 No BOM & Clean Encoding",
|
|
1551
|
+
g1_desc: "100% UTF-8 without BOM or mojibake bytes across all test files and configs.",
|
|
1552
|
+
g2_name: "Path Portability",
|
|
1553
|
+
g2_desc: "Zero machine-specific absolute file paths (/Users/..., C:\\\\...) committed to git.",
|
|
1554
|
+
g3_name: "Clean POM Flat Architecture",
|
|
1555
|
+
g3_desc: "Strictly zero raw XPaths or CSS selectors inside test scripts; encapsulated in Pages.",
|
|
1556
|
+
g4_name: "AI Documentation Anti-Drift",
|
|
1557
|
+
g4_desc: "Zero hallucinated classes or missing test suites between code and PROJECT_AI_GUIDE.md.",
|
|
1558
|
+
g5_name: "Temporary File Blacklist",
|
|
1559
|
+
g5_desc: "Zero temporary files (*.tmp, *.db, memory dumps) polluting repository workspace.",
|
|
1560
|
+
g6_name: "Credential Security Sentinel",
|
|
1561
|
+
g6_desc: "Zero hardcoded plaintext passwords, private keys, or API tokens in scripts.",
|
|
1562
|
+
g7_name: "Static Defect & Fake-Pass",
|
|
1563
|
+
g7_desc: "Meta Infer-style heuristic & static AST scan catching 0-assertion tests, static sleeps, and swallowed exception blocks.",
|
|
1564
|
+
g8_name: "Syntactic Micro-Mutation",
|
|
1565
|
+
g8_desc: "Requires test suite mutation score ≥ 80% to eliminate tautological test cases.",
|
|
1566
|
+
sec_swarm_tag: "Autonomous Multi-Agent System",
|
|
1567
|
+
sec_swarm_title: "6 Specialized Subagent Profiles",
|
|
1568
|
+
sec_swarm_desc: "Coordinated through a single front-door FSM architecture to avoid decision paralysis.",
|
|
1569
|
+
a1_role: "Lead QA Orchestrator",
|
|
1570
|
+
a1_desc: "Ingests user intent, scopes impact, bootstraps projects, and enforces sequential FSM transitions.",
|
|
1571
|
+
a2_role: "Live Interaction Explorer",
|
|
1572
|
+
a2_desc: "Probes live web DOM/AOM under 200ms using headless Playwright. Zero selector guessing.",
|
|
1573
|
+
a3_role: "Clean POM Crafter",
|
|
1574
|
+
a3_desc: "Designs multi-language Page Classes and test scripts enforcing strict Clean POM Flat Architecture.",
|
|
1575
|
+
a4_role: "Test Execution Runner",
|
|
1576
|
+
a4_desc: "Dispatches headless test runs via CLI, balances parallel runner shards, and distills 95% of log noise.",
|
|
1577
|
+
a5_role: "Failure Autopsy Analyst",
|
|
1578
|
+
a5_desc: "Closed-loop failure diagnosis from JUnit XML and screenshots; generates auto-healing PR plans.",
|
|
1579
|
+
a6_role: "Quality Gatekeeper Sentinel",
|
|
1580
|
+
a6_desc: "Final gatekeeper enforcing all 9 Quality Gates DoD and ≥ 80% mutation score before task completion.",
|
|
1581
|
+
footer_subtitle: "The Enterprise AI Agent Quality Engineering & Autonomous Skill Network.",
|
|
1582
|
+
footer_creator: "Original Creator",
|
|
1583
|
+
footer_license: "Released under the",
|
|
1584
|
+
footer_legal: "All author attribution notices preserved in accordance with open-source licensing.",
|
|
1585
|
+
footer_meta: "Generated on __NOW_STR__ • Offline & Air-Gapped Ready",
|
|
1586
|
+
toast_copy: "✓ Copied to clipboard!"
|
|
1587
|
+
}
|
|
1588
|
+
};
|
|
1589
|
+
|
|
1590
|
+
let currentLang = "__DEFAULT_LANG__";
|
|
1591
|
+
|
|
1592
|
+
function setLanguage(lang) {
|
|
1593
|
+
if (!translations[lang]) return;
|
|
1594
|
+
currentLang = lang;
|
|
1595
|
+
try {
|
|
1596
|
+
localStorage.setItem("synapse_hub_lang", lang);
|
|
1597
|
+
} catch(e) {}
|
|
1598
|
+
|
|
1599
|
+
document.querySelectorAll("[data-i18n]").forEach(el => {
|
|
1600
|
+
const key = el.getAttribute("data-i18n");
|
|
1601
|
+
if (translations[lang] && translations[lang][key] !== undefined) {
|
|
1602
|
+
el.innerHTML = translations[lang][key];
|
|
1603
|
+
}
|
|
1604
|
+
});
|
|
1605
|
+
|
|
1606
|
+
const btnVi = document.getElementById("btn-vi");
|
|
1607
|
+
const btnEn = document.getElementById("btn-en");
|
|
1608
|
+
if (btnVi && btnEn) {
|
|
1609
|
+
btnVi.classList.toggle("active", lang === "vi");
|
|
1610
|
+
btnEn.classList.toggle("active", lang === "en");
|
|
1611
|
+
}
|
|
1612
|
+
|
|
1613
|
+
const toast = document.getElementById("toast");
|
|
1614
|
+
if (toast) {
|
|
1615
|
+
toast.innerText = translations[lang]["toast_copy"] || "✓ Copied!";
|
|
1616
|
+
}
|
|
1617
|
+
|
|
1618
|
+
document.documentElement.lang = lang;
|
|
1619
|
+
}
|
|
1620
|
+
|
|
1621
|
+
function switchTab(evt, tabId) {
|
|
1622
|
+
const tabs = document.querySelectorAll('.terminal-tab');
|
|
1623
|
+
const panes = document.querySelectorAll('.tab-pane');
|
|
1624
|
+
|
|
1625
|
+
tabs.forEach(t => t.classList.remove('active'));
|
|
1626
|
+
panes.forEach(p => p.style.display = 'none');
|
|
1627
|
+
|
|
1628
|
+
evt.currentTarget.classList.add('active');
|
|
1629
|
+
const target = document.getElementById(tabId);
|
|
1630
|
+
if (target) target.style.display = 'block';
|
|
1631
|
+
}
|
|
1632
|
+
|
|
1633
|
+
function copyCmd(cmd) {
|
|
1634
|
+
if (navigator.clipboard && window.isSecureContext) {
|
|
1635
|
+
navigator.clipboard.writeText(cmd).then(() => showToast());
|
|
1636
|
+
} else {
|
|
1637
|
+
const textArea = document.createElement("textarea");
|
|
1638
|
+
textArea.value = cmd;
|
|
1639
|
+
textArea.style.position = "fixed";
|
|
1640
|
+
textArea.style.left = "-9999px";
|
|
1641
|
+
document.body.appendChild(textArea);
|
|
1642
|
+
textArea.focus();
|
|
1643
|
+
textArea.select();
|
|
1644
|
+
try {
|
|
1645
|
+
document.execCommand('copy');
|
|
1646
|
+
showToast();
|
|
1647
|
+
} catch (err) {
|
|
1648
|
+
console.error('Failed to copy', err);
|
|
1649
|
+
}
|
|
1650
|
+
document.body.removeChild(textArea);
|
|
1651
|
+
}
|
|
1652
|
+
}
|
|
1653
|
+
|
|
1654
|
+
function showToast() {
|
|
1655
|
+
const toast = document.getElementById('toast');
|
|
1656
|
+
toast.classList.add('show');
|
|
1657
|
+
setTimeout(() => {
|
|
1658
|
+
toast.classList.remove('show');
|
|
1659
|
+
}, 2000);
|
|
1660
|
+
}
|
|
1661
|
+
|
|
1662
|
+
// Initialize saved language preference on load
|
|
1663
|
+
document.addEventListener("DOMContentLoaded", () => {
|
|
1664
|
+
let saved = "__DEFAULT_LANG__";
|
|
1665
|
+
try {
|
|
1666
|
+
saved = localStorage.getItem("synapse_hub_lang") || saved;
|
|
1667
|
+
} catch(e) {}
|
|
1668
|
+
if (saved !== "__DEFAULT_LANG__") {
|
|
1669
|
+
setLanguage(saved);
|
|
1670
|
+
}
|
|
1671
|
+
});
|
|
1672
|
+
</script>
|
|
1673
|
+
</body>
|
|
1674
|
+
</html>
|