Outdated Bootstrap Library Allows Malicious Script Injection

Vulnerability Explanation

Bootstrap's JavaScript components (Carousel, Collapse, Modal, Tab, Alert, Dropdown) used jQuery to directly parse the value of the `data-target` and `href` attributes as a CSS selector without sanitization. Because jQuery's selector engine can interpret HTML strings, an attacker who controls the value of a `data-target` attribute — for example, via a URL parameter reflected into the page, or via user-generated content — can inject arbitrary HTML including event handlers (e.g., `<img src=x onerror=alert(1)>`), resulting in JavaScript execution in the victim's browser. Exploitation requires user interaction (the victim must trigger the Bootstrap component, e.g., click a button), making this a reflected/stored XSS with a UI:R condition.

Root Cause

Bootstrap's interactive components passed the raw `data-target` attribute value directly to jQuery's `$()` constructor, which parses HTML in addition to CSS selectors. No allowlist validation or sanitization was applied to the selector string before use, allowing HTML injection via the attribute value.

Technical Impact

An attacker who can control the `data-target` attribute value (via reflected input, stored user content, or DOM manipulation) can execute arbitrary JavaScript in the victim's browser. This enables session hijacking via cookie theft, credential phishing via DOM manipulation, defacement, or delivery of further client-side attacks. CVSS v3.1 base score: 6.1 (Medium) — AV:N/AC:L/PR:N/UI:R/S:C/C:L/I:L/A:N.

Severity Justification

CVSS v3.x score of 6.1 (Medium). Network-accessible, no privileges required, but requires user interaction (UI:R) to trigger the vulnerable component. Exploitability is realistic only when attacker-controlled input reaches a data-target attribute.

Affected Components

• Bootstrap >= 3.0.0, < 3.4.0
• Bootstrap 4.0.0-beta < 4.0.0-beta.2

Remediation Steps

1. Upgrade Bootstrap 3.x to version 3.4.0 or later. This release replaced direct jQuery HTML parsing with `document.querySelector()` and added selector validation across all affected components (Alert, Carousel, Collapse, Dropdown, Modal, Tab).
2. If migrating to Bootstrap 5 is feasible, prefer that path — Bootstrap 5 drops jQuery entirely and is actively maintained. Bootstrap 3 is end-of-life.
3. If an immediate upgrade is not possible, audit all places where `data-target`, `data-slide-to`, `href`, or similar Bootstrap data attributes are populated with any server-side or user-supplied values, and ensure those values are strictly validated server-side (allowlist of known safe selector strings like `#myModal`).
4. Add a Content Security Policy (CSP) header as a defence-in-depth measure to limit the impact of any XSS that does execute. Start in report-only mode: `Content-Security-Policy-Report-Only: default-src 'self'; script-src 'self'`.
5. After upgrading, verify no inline `data-target` values in your templates accept dynamic/user-supplied input without server-side validation.

Verification Steps

1. Check the loaded Bootstrap version in your browser's DevTools console: `bootstrap.VERSION` (Bootstrap 3) or check the `<script>` tag src/integrity attribute.
2. Run `npm list bootstrap` or `yarn list bootstrap` in your project root to confirm the installed version.
3. Use the GitHub Security Advisory checker or Snyk (`npx snyk test`) to confirm CVE-2016-10735 is no longer flagged after the upgrade.
4. Manually test: add `data-target="<img src=x onerror=alert(1)>"` to a collapse or modal trigger button and confirm no alert fires in the updated version.

Code Examples (html)

<!-- Bootstrap 3.1.1 — data-target is passed raw to jQuery $() -->
<button
  data-toggle="collapse"
  data-target="<img src=x onerror=alert(document.cookie)>">
  Toggle
</button>

<!-- Bootstrap 3.4.0+ — selector is validated; HTML injection is blocked -->
<button
  data-toggle="collapse"
  data-target="#myCollapsibleSection">
  Toggle
</button>

<!-- Always use static, known-safe selector strings in data-target -->
<!-- If the target must be dynamic, validate server-side against an allowlist -->

Best Practices

• Never pass unsanitized user input into Bootstrap `data-*` attributes — always validate against an allowlist of known safe selector values server-side.
• Keep frontend libraries pinned to actively maintained versions and subscribe to their security advisories (e.g., GitHub Security Advisories for `twbs/bootstrap`).
• Implement a Content Security Policy to reduce the blast radius of any XSS vulnerability, whether in a library or your own code.
• Prefer using Bootstrap's JavaScript API (passing options via JS objects) over `data-*` attributes when values are dynamic, as it gives you explicit control over sanitization.

References

• nvd.nist.gov/vuln/detail/CVE-2016-10735
• github.com/advisories/GHSA-4p24-vmcr-4gqj
• blog.getbootstrap.com/2018/12/13/bootstrap-3-4-0/
• github.com/twbs/bootstrap/issues/20184
• security.snyk.io/vuln/npm:bootstrap:20160627