Solution #197
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| name: Test | ||
|
|
||
| on: | ||
| pull_request: | ||
| branches: [ master ] | ||
|
|
||
| jobs: | ||
| build: | ||
|
|
||
| runs-on: ubuntu-latest | ||
|
|
||
| strategy: | ||
| matrix: | ||
| node-version: [20.x] | ||
|
|
||
| steps: | ||
| - uses: actions/checkout@v2 | ||
| - name: Use Node.js ${{ matrix.node-version }} | ||
| uses: actions/setup-node@v1 | ||
| with: | ||
| node-version: ${{ matrix.node-version }} | ||
| - run: npm install | ||
| - run: npm test |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,99 @@ | ||
| 'use strict'; | ||
|
|
||
| const http = require('http'); | ||
| const querystring = require('querystring'); | ||
|
|
||
| function createServer() { | ||
| return http.createServer((req, res) => { | ||
| if (req.method === 'GET' && req.url === '/') { | ||
| const html = `<!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Expense Form</title> | ||
| </head> | ||
| <body> | ||
| <h1>Submit expense</h1> | ||
| <form method="POST" action="/add-expense"> | ||
| <label> | ||
| Date | ||
| <input type="date" name="date" required /> | ||
| </label> | ||
| <label> | ||
| Title | ||
| <input type="text" name="title" required /> | ||
| </label> | ||
| <label> | ||
| Amount | ||
| <input type="number" name="amount" required /> | ||
| </label> | ||
| <button type="submit">Submit</button> | ||
| </form> | ||
| </body> | ||
| </html>`; | ||
|
|
||
| res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); | ||
| res.end(html); | ||
|
|
||
| return; | ||
| } | ||
|
|
||
| if (req.method === 'POST' && req.url === '/add-expense') { | ||
| let body = ''; | ||
| const contentType = req.headers['content-type'] || ''; | ||
|
|
||
| req.on('data', (chunk) => { | ||
| body += chunk.toString(); | ||
| }); | ||
|
|
||
| req.on('end', () => { | ||
| let expense; | ||
|
|
||
| try { | ||
| if (contentType.includes('application/x-www-form-urlencoded')) { | ||
| expense = querystring.parse(body); | ||
| } else { | ||
| expense = JSON.parse(body); | ||
| } | ||
| } catch (error) { | ||
| res.writeHead(400, { 'Content-Type': 'application/json' }); | ||
| res.end(JSON.stringify(['Invalid request payload'])); | ||
|
Comment on lines
+60
to
+61
There was a problem hiding this comment. When parsing fails you return a 400 with application/json. Parsing errors should still return a 400 but as an HTML page (Content-Type: text/html) with a clear, user-friendly error message so the server doesn't return raw JSON to a browser. |
||
|
|
||
| return; | ||
|
Comment on lines
+59
to
+63
There was a problem hiding this comment. The parsing error branch currently returns JSON. Per checklist items #6 and #12 you must keep the 400 status but send an HTML page (Content-Type: 'text/html; charset=utf-8') with a clear human-readable message such as "There was a problem reading your form data." Replace the JSON response here with such an HTML response. |
||
| } | ||
|
|
||
| if (expense.date && expense.title && expense.amount) { | ||
| const fs = require('fs'); | ||
| const path = require('path'); | ||
| const dataPath = path.resolve(__dirname, '../db/expense.json'); | ||
|
|
||
| fs.writeFileSync(dataPath, JSON.stringify(expense, null, 2)); | ||
| res.writeHead(200, { 'Content-Type': 'application/json' }); | ||
| res.end(JSON.stringify(expense)); | ||
|
Comment on lines
+72
to
+73
There was a problem hiding this comment. The response for a successful save is sent with
Comment on lines
+72
to
+73
There was a problem hiding this comment. The successful POST response currently sends 'Content-Type: application/json' and raw JSON. The spec requires 'Content-Type: text/html' and an HTML document embedding ) so the browser shows formatted JSON.
Comment on lines
+71
to
+73
There was a problem hiding this comment. After writing the expense file the handler returns application/json. Per checklist items #5, #11 and #16 the successful POST /add-expense response must use Content-Type: 'text/html' and return an HTML document that embeds |
||
| } else { | ||
| res.writeHead(400, { 'Content-Type': 'application/json' }); | ||
| res.end(JSON.stringify(['Missing required fields'])); | ||
|
Comment on lines
+75
to
+76
There was a problem hiding this comment. Error responses (400/404) are returned as
Comment on lines
+74
to
+76
There was a problem hiding this comment. The 'missing required fields' branch responds with application/json. Change this to an HTML response (Content-Type: text/html) that explains which required fields are missing (or at least a clear human-readable message) to match the app's main behavior.
Comment on lines
+74
to
+76
There was a problem hiding this comment. The "missing required fields" branch returns JSON. Per checklist item #7 change this to an HTML page (Content-Type: 'text/html; charset=utf-8') that clearly explains which fields are missing (for example: |
||
| } | ||
| }); | ||
| } else { | ||
| const notFoundHtml = `<!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Not Found</title> | ||
| </head> | ||
| <body> | ||
| <h1>404 - Not Found</h1> | ||
| <p>Sorry, the page you are looking for does not exist.</p> | ||
| </body> | ||
| </html>`; | ||
|
|
||
| res.writeHead(404, { 'Content-Type': 'text/html; charset=utf-8' }); | ||
| res.end(notFoundHtml); | ||
| } | ||
| }); | ||
| } | ||
|
|
||
| module.exports = { | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The task requires showing an HTML form. There is no GET handler to serve the form (e.g. GET '/' returning an HTML page with inputs for date, title and amount). Add a route that serves the form HTML.