Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Adopt shared escapeHtml utility across codebase

Open
  • Is something wrong?
#319 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Refactor
Clarity
Needs clarification
Activity status
Stale
Tech stack
eslint, javascript
Domain
documentation, frontend, security

Research direction

Start with js/utils.js and grep the listed patterns for local escape helpers, dynamic innerHTML, setAttribute, template attributes, DOMParser, and outerHTML uses. Review each match for appropriate shared escaping, then update CONTRIBUTING.md or DEVNOTES.md and add JSDoc in js/utils.js. Done means no local helpers remain outside _site/ and audited dynamic insertions use escapeHtml where appropriate.

Written by the indexing model from the issue text.

Description

core functionality help wanted

Summary

We centralized HTML escaping with a shared helper: escapeHtml in js/utils.js.

This follow-up issue tracks (a) sweeping the codebase to migrate local escape methods and risky templating to use the shared utility, and (b) announcing its availability to contributors after the PR merges.

Why

  • Consistent, safe escaping reduces XSS risk and eliminates duplicate implementations.
  • One utility improves maintainability and developer ergonomics.

Scope

  • Replace local escapeHtml / escapeHTML implementations with import { escapeHtml } from '/js/utils.js'.
  • Audit and update places building innerHTML or HTML attributes with dynamic values.

Tasks

Migration

  • Replace local escapeHtml / escapeHTML in components with the shared utility.
  • Audit for direct template insertions of dynamic values and wrap with escapeHtml as needed.
  • Review uses of .innerHTML and setAttribute with dynamic content.
  • Grep patterns to review:
    • this.escapeHtml(|this.escapeHTML(|escapeHTML(
    • .innerHTML =
    • title="...${...}" / aria-label="...${...}" with dynamic values
    • new DOMParser() or stringified outerHTML

Documentation

  • Update CONTRIBUTING.md or a DEVNOTES.md snippet: "Always use escapeHtml when inserting dynamic text into HTML or attributes."
  • Add JSDoc to js/utils.js escapeHtml with usage examples.

Communication (post-merge)

  • Announce the shared escapeHtml utility in the dev channel and encourage adoption in new code.
  • Link to js/utils.js.

Optional safeguards

  • Consider adding an ESLint rule or code review checklist item to flag raw innerHTML with dynamic inputs.

Acceptance criteria

  • No local escape helpers remain in source (excluding generated files under _site/).
  • All audited dynamic insertions use escapeHtml where appropriate.
Dominant language
JavaScript
Stars
2
Forks
3
No merged PRs in 30d

Getting set up

This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from CenterForDigitalHumanities/TPEN-interfaces

All issues in CenterForDigitalHumanities/TPEN-interfaces

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.