GHSA-HVQH-JW65-WCPQ: Cross-Site Scripting (XSS) in devbridge-autocomplete

The devbridge-autocomplete library (also known as jQuery-Autocomplete) is a client-side component designed to facilitate interactive search input suggestions. It handles queries by reading from local datasets or remote endpoints and dynamically generating search suggestion markup. This architecture introduces a typical DOM-based injection surface when suggestions are obtained from untrusted databases or external APIs.

This security vulnerability, designated as GHSA-HVQH-JW65-WCPQ, is classified as a client-side Cross-Site Scripting (XSS) flaw corresponding to CWE-79. The vulnerability is present in the component's default presentation logic, which compiles suggestion objects into HTML markup without proper neutralization.

The attack surface is prominent in applications where the search suggestion data is sourced from user-generated content. For instance, if an application implements autocomplete suggestions based on username directories, product listings, or tags, an attacker can poison these data sources with malicious payloads that execute inside the browser sessions of users interacting with the autocomplete element.

The root cause of GHSA-HVQH-JW65-WCPQ resides in two default formatting functions: formatGroup and formatResult. Both functions are designed to map suggestion object parameters to string representations of HTML, which are then injected directly into the DOM via jQuery's .html() method (an innerHTML-based wrapper).

In the default implementation of formatGroup, category headers are concatenated directly into a template string without any sterilization. If a group name contains HTML characters, they are preserved intact. When the library renders the autocomplete container, these tags are processed and rendered as executable nodes by the browser's HTML parser.

In the formatResult function, which handles individual autocomplete entries, the vulnerability occurs under specific logical branches. Under normal operations, the function uses regex replacements to wrap matching queries with <strong> tags. However, if the query string (currentValue) is empty—such as when minChars: 0 is specified—the function invokes an early-return branch that returns suggestion.value directly in its raw state. This leaves the suggestion value completely unescaped during initial rendering.

A detailed inspection of the source files prior to version 2.0.1 reveals the precise code paths responsible for the raw injection. The vulnerable functions in src/format.ts are implemented as follows:

// Vulnerable Code Path
export function formatResult(suggestion: Suggestion, currentValue: string): string {
    if (!currentValue) {
        // Unsanitized return of the suggestion's raw value
        return suggestion.value;
    }
    // Highlight replacements continue here...
}
 
export function formatGroup(_suggestion: Suggestion, category: string): string {
    // Vulnerable string concatenation without validation
    return '<div class="autocomplete-group">' + category + "</div>";
}

In the patched version (2.0.1), the library utilizes browser-native DOM APIs rather than vulnerable string manipulation to construct the elements. The safe implementation is shown below:

// Patched Code Path (v2.0.1)
export function formatResult(suggestion: Suggestion, currentValue: string): string {
    if (!currentValue) {
        // Native DOM element creation ensures safe text assignment
        const span = document.createElement("span");
        span.textContent = suggestion.value; // Escapes special entities
        return span.innerHTML;
    }
 
    const pattern = "(" + utils.escapeRegExChars(currentValue) + ")";
    return suggestion.value
        .replace(new RegExp(pattern, "gi"), "<strong>$1</strong>")
        .replace(/&/g, "&amp;")
        .replace(/</g, "&lt;")
        .replace(/>/g, "&gt;")
        .replace(/"/g, "&quot;")
        .replace(/&lt;(\/?strong)&gt;/g, "<$1>");
}
 
export function formatGroup(_suggestion: Suggestion, category: string): string {
    // Uses native serialization for category titles
    const div = document.createElement("div");
    div.className = "autocomplete-group";
    div.textContent = category; // Escapes special entities
    return div.outerHTML;
}

While this fix successfully secures the immediate injection pathways, a variant threat remains. The regex replacement chain in the standard formatResult pathway does not escape single quotes ('). If down-stream components or custom integrations process the output of formatResult and inject it into single-quoted HTML attributes, attribute breakout and subsequent script execution remain possible.

Exploitation of GHSA-HVQH-JW65-WCPQ relies on introducing a payload into the dataset queried by the autocomplete handler. Because the frontend relies entirely on backend payloads being formatted by either formatGroup or formatResult, an attacker with write access to suggestion registries can inject malicious markup without direct client interaction.

To exploit the formatGroup vulnerability, the attacker registers a record containing a broken image tag with an active event handler inside the category field:

<img src=x onerror="alert('XSS-formatGroup')">

When a victim accesses the web application, clicks the autocomplete text area, and types any character that matches this group, the library constructs the list. The category string is injected via jQuery's .html(), which parses the image element and fires the onerror JavaScript payload immediately.

To exploit the formatResult vulnerability under configurations with minChars: 0, the attacker poisons a standard suggestion entry with an inline SVG element. Because minChars is set to zero, clicking or focusing on the search container initiates an empty query. The library returns the poisoned value, skips the regex-based escaping path, and renders the payload directly into the DOM.

The security impact of successful exploitation matches standard Document Object Model (DOM) Cross-Site Scripting capabilities. An attacker can execute arbitrary JavaScript within the context of the victim's current session. This allows for session token harvesting, credential harvesting, and DOM manipulation.

Because the script runs with the authorization state of the victim, an administrative user triggering the XSS payload can be forced to perform administrative changes, modify application permissions, or execute state-changing APIs without their knowledge. This elevates the risk profile in administrative control panels that utilize autocomplete fields for management purposes.

The calculated CVSS v3.1 score is 6.1 (Medium), with the vector string CVSS:3.1/AV:N/AC:L/PR:N/UI:R/S:C/C:L/I:L/A:N. The requirement for user interaction (typing or selecting the autocomplete textbox) prevents a higher severity classification, but the shift in security scope (from browser sandbox boundaries to application control context) qualifies it as a high-priority vulnerability.

The primary remediation path is upgrading the NPM package dependency to version 2.0.1 or higher. This release implements native DOM element generation for text sterilization, which ensures that input data cannot break out of structural text containers.

If legacy deployment requirements prevent an immediate dependency upgrade, developers can override the default formatters manually during the autocomplete initialization phase. Overriding these parameters with safe, custom sanitization routines effectively neutralizes the vulnerability:

$('#autocomplete-field').autocomplete({
    serviceUrl: '/api/suggestions',
    formatResult: function (suggestion, currentValue) {
        if (!currentValue) {
            var span = document.createElement('span');
            span.textContent = suggestion.value;
            return span.innerHTML;
        }
        // Apply standard escaping highlighting manually
        var escaped = suggestion.value
            .replace(/&/g, '&')
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#x27;');
        var pattern = '(' + escapeRegExChars(currentValue) + ')';
        return escaped.replace(new RegExp(pattern, 'gi'), '<strong>$1</strong>');
    },
    formatGroup: function (suggestion, category) {
        var div = document.createElement('div');
        div.className = 'autocomplete-group';
        div.textContent = category;
        return div.outerHTML;
    }
});

Additionally, implementing a robust Content Security Policy (CSP) that restricts script execution sources can mitigate the impact of any potential bypasses. Specifically, disabling unsafe-inline scripts and restricting external resource connections limits the capability of injected scripts to exfiltrate session parameters or load remote staging payloads.