Skip to content

fix: replace innerHTML with textContent in sampler.js and pitchslider.js#7491

Open
NAME-ASHWANIYADAV wants to merge 1 commit into
sugarlabs:masterfrom
NAME-ASHWANIYADAV:fix/replace-innerHTML-with-textContent
Open

fix: replace innerHTML with textContent in sampler.js and pitchslider.js#7491
NAME-ASHWANIYADAV wants to merge 1 commit into
sugarlabs:masterfrom
NAME-ASHWANIYADAV:fix/replace-innerHTML-with-textContent

Conversation

@NAME-ASHWANIYADAV

@NAME-ASHWANIYADAV NAME-ASHWANIYADAV commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

PR Category

  • Bug Fix
  • Feature
  • Performance
  • Tests
  • Documentation
  • CI/CD

Description

This PR addresses security and code quality improvements by replacing innerHTML with textContent for rendering static UI text in sampler.js and pitchslider.js.

As outlined in AGENTS.md (Section 4: Prefer textContent over innerHTML), using innerHTML to inject static text strings is an anti-pattern. This PR ensures we follow the project's security and DOM manipulation guidelines.

Changes Made

  • js/widgets/sampler.js: Replaced innerHTML with textContent for static UI elements including "AI Sample Generation", "Submit", "Preview", and "Save" buttons.
  • js/widgets/pitchslider.js: Replaced innerHTML with textContent for setting the freqLabel display text, removing unnecessary inline <label> injections.
  • Code Formatting: Verified changes using eslint and npx prettier --write as required.

Why This Matters

  • Prevents unnecessary HTML parsing for static strings.
  • Adheres strictly to the guidelines established in AGENTS.md.
  • Improves overall code security and maintains cleaner DOM injection practices.

Verification

  • Replaced instances of innerHTML with textContent where applicable.
  • Ran npm run lint and resolved any issues.
  • Ran npx prettier --check . to ensure formatting consistency.
  • Verified unit tests passing with npm test.

@github-actions github-actions Bot added bug fix Fixes a bug or incorrect behavior size/S Small: 10-49 lines changed area/javascript Changes to JS source files labels Jun 10, 2026
@github-actions

Copy link
Copy Markdown
Contributor

🧪 Jest Test Results

✅ All Jest tests passed! This PR is ready to merge.

Coverage: Statements: 48.3% | Branches: 39.92% | Functions: 53.01% | Lines: 48.7%
Master Coverage: Statements: 48.29% | Branches: 39.91% | Functions: 52.99% | Lines: 48.69%

@NAME-ASHWANIYADAV

NAME-ASHWANIYADAV commented Jun 10, 2026

Copy link
Copy Markdown
Contributor Author

@Chaitu7032 Chaitu7032 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The conversion from innerHTML to textContent is appropriate here.

@kartikktripathi kartikktripathi left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@NAME-ASHWANIYADAV

Copy link
Copy Markdown
Contributor Author

thank u guys !! @Chaitu7032 @kartikktripathi

@walterbender

Copy link
Copy Markdown
Member

I need to think about removing the HTML label tag. It has its uses, esp. for things like screen readers. @abhinish What do you think?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area/javascript Changes to JS source files bug fix Fixes a bug or incorrect behavior size/S Small: 10-49 lines changed

Projects

Development

Successfully merging this pull request may close these issues.

4 participants