feat: fetch and display Codeforces problem statements in ProblemWorkspace#49
Merged
Merged
Conversation
- Install cheerio for server-side HTML parsing - Add cfStatementParser.js with parseCFProblemStatement() helper - Add GET /api/cf/problem/:contestId/:index/statement route to server.js - Add cfStatementParser.test.js with 11 unit tests (mocked HTML fixtures) - Add src/services/cfStatement.js frontend fetch service - Update ProblemWorkspace.jsx with statement panel, loading/error states - Update ProblemWorkspace.css with statement panel styles - Update eslint.config.js for node globals on new server files - Update vite.config.js with /api proxy for dev server Agent-Logs-Url: https://github.com/enlorik/HDD/sessions/ba819bfd-a6b0-4a90-8ea5-965d62ff0a58 Co-authored-by: enlorik <99548776+enlorik@users.noreply.github.com>
Copilot created this pull request from a session on behalf of
enlorik
May 11, 2026 13:50
View session
enlorik
marked this pull request as ready for review
May 13, 2026 11:28
Contributor
There was a problem hiding this comment.
Pull request overview
Adds end-to-end support for fetching and rendering Codeforces problem statements inside HDD’s ProblemWorkspace, using a server-side HTML fetch + parser to return structured plain-text JSON to the React UI.
Changes:
- Backend: added
/api/cf/problem/:contestId/:index/statementto fetch the Codeforces problem page and parse it into JSON via a newcfStatementParser.js. - Frontend: added a statement fetch service and updated
ProblemWorkspaceto display loading/error states, limits, statement sections, and samples. - Tooling: added Vite dev proxy for
/api, updated ESLint config for Node globals, and added unit tests for the parser.
Reviewed changes
Copilot reviewed 9 out of 10 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| vite.config.js | Proxies /api to the Express server in dev for the new endpoint. |
| src/services/cfStatement.js | Adds a frontend fetch wrapper for the statement endpoint. |
| src/components/ProblemWorkspace.jsx | Fetches and renders the parsed statement (loading/error/ok states). |
| src/components/ProblemWorkspace.css | Styles the new statement panel and sample layout. |
| server.js | Adds the new statement route that fetches Codeforces HTML and returns parsed JSON. |
| package.json | Adds cheerio dependency used for server-side parsing. |
| package-lock.json | Locks cheerio and its transitive dependencies. |
| eslint.config.js | Applies Node globals to the new parser and its tests. |
| cfStatementParser.test.js | Adds unit tests for parsing title/limits/body/specs/samples from fixtures. |
| cfStatementParser.js | Implements the cheerio-based HTML-to-plain-text parser. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
14
to
17
| "dependencies": { | ||
| "cheerio": "^1.2.0", | ||
| "express": "^5.2.1", | ||
| "react": "^19.2.0", |
Comment on lines
+82
to
+94
| let rawHtml = ''; | ||
|
|
||
| const request = https.get(options, (cfRes) => { | ||
| if (cfRes.statusCode !== 200) { | ||
| res.status(502).json({ error: `Codeforces returned HTTP ${cfRes.statusCode}` }); | ||
| cfRes.resume(); | ||
| return; | ||
| } | ||
|
|
||
| cfRes.setEncoding('utf-8'); | ||
| cfRes.on('data', chunk => { rawHtml += chunk; }); | ||
| cfRes.on('end', () => { | ||
| const parsed = parseCFProblemStatement(rawHtml); |
Comment on lines
+11
to
+15
| /** | ||
| * Replace block-level children and <br> tags with newlines, then return the | ||
| * trimmed text content of an element. This preserves paragraph breaks without | ||
| * leaking any HTML tags to the caller. | ||
| * |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR lets HDD display a Codeforces problem statement directly inside the app, without requiring the user to visit the Codeforces website.
Changes
Backend (
server.js,cfStatementParser.js)GET /api/cf/problem/:contestId/:index/statementroutecontestId(numeric) andindex(alphanumeric, e.g.A,C1)cfStatementParser.jshelper that isolates all cheerio-based HTML parsingtitle,timeLimit,memoryLimit,statement,inputSpecification,outputSpecification,samples[]Frontend (
src/services/cfStatement.js,ProblemWorkspace.jsx,ProblemWorkspace.css)src/services/cfStatement.js— thin fetch wrapper for the new endpointProblemWorkspace.jsx:contestId/index)ProblemWorkspace.csswith styles for limits strip, statement body, section headings, and samples gridConfig
vite.config.jsto proxy/api/to the Express dev server (port 3000) so the new route works innpm run deveslint.config.jsto apply Node globals tocfStatementParser.jsand its test fileTests (
cfStatementParser.test.js)Out of scope (per problem statement)
Validation
npm test— 19/19 tests pass ✅npm run lint— clean ✅npm run build— success ✅