bookmarklet.js

function parsePrometheusLabels(s) {
    s = s.substring(1, s.length - 1); // strip {...}
    let re = new RegExp(/(\w+)=\"(.*?)\"[,]?\s*/, 'y');
    let labels = {};
    let labelSpans = {};
    while(true) {
        let m = re.exec(s);
        if(!m) {
            break;
        }
        let [_, key, value] = m;
        labels[key] = value;
        labelSpans[key] = [m.index, m[0].length];
    }
    return [labels, labelSpans];
}

function findMismatchedLabels(left, right) {
    let mismatched = new Set();

    for(let [key, leftValue] of Object.entries(left)) {
        if(!(key in right && leftValue == right[key])) {
            mismatched.add(key);
        }
    }

    for(let [key, rightValue] of Object.entries(right)) {
        if(!(key in left && rightValue == left[key])) {
            mismatched.add(key);
        }
    }

    return mismatched;
}

function formatLabel(key, value) {
    return `${key}="${value}"`;
}

(function() {
    let duplicateSeriesRE = /found duplicate series for the match group (\{[^}]+\}) on the (?:right|left) hand-side of the operation: \[(\{[^}]+\}),\s*(\{[^}]+\})\]/;

    let errorMessageElements = document.querySelectorAll('form.query_form .error');

    for(let e of errorMessageElements) {
        let innerHTML = e.innerHTML;

        let m = duplicateSeriesRE.exec(innerHTML);
        if(m == null) {
            continue;
        }
        let [_, matchGroup, leftLabelSet, rightLabelSet] = m;

        let leftLabelSetSpans;
        let rightLabelSetSpans;

        [matchGroup, _] = parsePrometheusLabels(matchGroup);
        [leftLabelSet, leftLabelSetSpans] = parsePrometheusLabels(leftLabelSet);
        [rightLabelSet, rightLabelSetSpans] = parsePrometheusLabels(rightLabelSet);

        let mismatched = findMismatchedLabels(leftLabelSet, rightLabelSet);
        for(let key of mismatched) {
            let highlightLeft = formatLabel(key, leftLabelSet[key]);
            let highlightRight = formatLabel(key, rightLabelSet[key]);
            innerHTML = innerHTML.replace(highlightLeft, `${highlightLeft}`);
            innerHTML = innerHTML.replace(highlightRight, `${highlightRight}`);
        }

        innerHTML = innerHTML.replace('found duplicate series', 'found duplicate series');

        e.innerHTML = innerHTML;
    }
})();