The task and original case
Round-trip a query containing spaces and an ampersand while keeping a page fragment separate. This is a small URL utility project with precise expected behavior. The string “A & B” should come back unchanged after building and parsing the URL.
| Case element | Value or requirement |
|---|---|
| Inputs | Query value A & B plus fragment summary; encode it, reload it and parse it. |
| Build | A URL builder/parser round-trip test with spaces, ampersands and repeated keys. |
This is an original invented exercise. It is independent practice, with no employer assessment or open-vacancy claim. Download the inputs, attempt your own result, then open the separate answer key.
Data and worked inputs
Build a result another person can follow
Create a URL object for a fictional search page. Put the query value A & B into URLSearchParams using set or append rather than manual concatenation. Assign summary to the URL's hash separately. Serialize the URL, parse that serialized value again and retrieve the query through the parameters API.
MDN documents URLSearchParams serialization and repeated keys. Define whether your query field permits one value or several. If you choose a single query, reject unexpected repeated q keys or explicitly select a documented rule; if multiple values are allowed, use getAll. Preserve the original semantic value in tests rather than relying on one particular percent-encoding spelling.
Sources[1]
Check the worked result
Parsing returns exactly A & B. The fragment identifies summary and is not included inside the q value. Your assertion should compare the decoded value and hash separately. A raw string such as ?q=A & B can mistakenly introduce another parameter because the ampersand has URL syntax meaning.
Avoid encoding an already serialized query again. Double encoding can turn a literal ampersand representation into visible percent characters after one parse. Test the round trip, not merely whether the constructed URL looks plausible.
Make the failure visible
Try a value containing a plus sign, an empty string and a second q key. Confirm how each is preserved or rejected under your declared rule. A fragment belongs to the URL's separate hash component; putting #summary into the query value changes its meaning. Keep query building separate from display text and from any authorization-sensitive destination selection.
Revise it and ask someone to reproduce it
Ask a peer to add “C + D” as a second fixture and predict the decoded output. In revision two, add a multi-value filter using append and demonstrate getAll. Keep the single-query policy intact so the broader utility does not silently change the original field's semantics.
- Decoded query equals the original value exactly.
- The fragment remains separate from query parameters.
- Plus signs, empty values and repeated keys have tested outcomes.
Describe the work accurately
After completing your own version, you could adapt this project bullet: “Built a URL round-trip exercise preserving query characters, separate fragments and explicitly declared repeated-key behavior.”
Use Projects or Independent practice as the heading. Keep the input files, result and revision together. Describe only your own completed work; the invented numbers are model outputs, not employer results or measured business impact.