CSES Companion
CSES Companion is a production-oriented Visual Studio Code extension for working with the CSES problem set from inside VS Code. It combines a Tree View sidebar, a premium problem-detail webview, secure login/session handling with VS Code SecretStorage, cached catalog/problem metadata, submission history tooling, diff-and-restore flows, and direct submit plumbing built around authenticated HTML form parsing rather than invented APIs.
Features
- Browse the CSES problem catalog from a custom Activity Bar container.
- Open full problem statements in a side webview with tabs for statement, samples, submissions, and accepted history.
- Render common CSES math notation with local KaTeX support inside the problem webview.
- Log in directly from the extension and store username/password/session state only in
ExtensionContext.secrets.
- Attempt session reuse on startup and automatically fall back to secure saved credentials when enabled.
- Sync solved and attempted status into the problem tree.
- View recent submissions, per-problem submission history, and accepted-only history.
- Open previous submission source in a readonly virtual document.
- Diff the active editor against a previous accepted submission using the VS Code diff editor.
- Create solution files, folders, and testcase files from the current problem.
- Submit the current file directly to CSES and poll for verdict updates.
- Cache public and user metadata in extension storage for faster reloads.
Important Notes
- This extension assumes no official CSES API.
- Public and authenticated data access is implemented through HTML fetching, form submission, and parser-based extraction.
- Some CSES selectors and submit/result page details still need live verification against current site HTML.
- Fragile site-specific logic is intentionally isolated under
src/parsers and a small number of service methods.
Authentication And Security
- Username, password, session cookies, and auth metadata are stored only in VS Code SecretStorage.
- On startup the extension first tries to restore session cookies; if that fails and secure credential reuse is enabled, it attempts auto-login with saved credentials.
- Logout supports both session-only sign-out and sign-out with credential removal.
- Passwords and full cookie values are redacted from logs.
- Login and session failures are reported with more specific messages for invalid credentials, expired sessions, parse failures, and network issues.
Configuration
The extension contributes these settings:
csesCompanion.rememberUsername
csesCompanion.rememberPassword
csesCompanion.autoLoginOnStartup
csesCompanion.defaultLanguage
csesCompanion.languageMappings
csesCompanion.problemFolderPattern
csesCompanion.solutionFilePattern
csesCompanion.codeTemplateText
csesCompanion.openProblemInWebview
csesCompanion.syncOnStartup
csesCompanion.pollIntervalMs
csesCompanion.cacheCatalogHours
csesCompanion.cacheStatementsDays
csesCompanion.cacheProgressMinutes
csesCompanion.showAttemptedBadges
csesCompanion.preferLatestAcceptedForDiff
csesCompanion.workspaceRootStrategy
The settings layer is wrapped by SettingsService, so command and service code avoid repeatedly reading raw configuration keys.
Security Model
- Passwords are never written to settings, workspace files, logs, or webview storage.
- Username, password, session cookies, and auth metadata are stored only in VS Code SecretStorage.
- Problem HTML is sanitized before being rendered in the webview.
- The webview uses a CSP and a nonce-based external script.
- Submission source is kept in cache storage and opened as virtual/untitled documents unless the user explicitly restores it into the workspace.
See SECURITY.md for more detail.
Running The Extension
- Open the
CSES Companion activity bar container.
- Use
CSES: Sync Problem Catalog to fetch public tasks.
- Use
CSES: Login to unlock progress, submissions, accepted history, and direct submit.
- Open a problem from the tree to launch the premium problem-detail webview.
- Use
CSES: Submit Current File from an active solution editor to submit directly.
Selectors To Verify Live
These areas are implemented with realistic parser boundaries but should be verified against current CSES HTML before publishing broadly:
src/parsers/loginParser.ts
src/parsers/problemStatementParser.ts
src/parsers/submissionParser.ts
src/parsers/submitParser.ts
- Candidate URLs in
src/utils/cses.ts
Troubleshooting
- If startup auto-login does not happen, verify
rememberPassword and autoLoginOnStartup are enabled.
- If login fails unexpectedly, verify that the CSES login form field names and CSRF inputs still match the selectors.
- If problem statements render partially, inspect the current statement container selector.
- If submissions do not appear, verify the current result/status table layout and URL path.
- If submit fails, confirm the live submit form action, field names, and compiler option labels.
- If source retrieval is unavailable for a submission, the UI will degrade gracefully and still allow other actions where possible.
Known Limitations
- Full live compatibility depends on the current CSES site structure.
- Some remote environments may handle browser sign-in prompts or external links differently.
- The current webview is intentionally lightweight and does not use a bundled frontend framework.
Future Roadmap
- Better per-category filtering and inline search text state
- Favorites, notes, and offline-first statement browsing
- Live selector diagnostics for parser breakages
- Richer progress analytics and workspace export of accepted histories
- Bundled packaging to reduce VSIX size and improve startup performance
| |