Bug: Consent messages only show for first blocked element when multiple elements have same denied category

[gebeer]

Issue Summary

When multiple elements on a page require the same denied consent category, only the first element displays a consent message. Subsequent elements are silently blocked without any user-facing consent request.

Current Configuration

PrivacyWire Setup

• Compiled PrivacyWire.js loaded from: site/modules/PrivacyWire/js/PrivacyWire.js
• LocalStorage consent state: {"version":1,"cookieGroups":{"necessary":true,"functional":false,"statistics":false,"marketing":false,"external_media":false}}

Initial Iframe Markup (on page load)

<div style="padding:56.25% 0 0 0;position:relative;">
    <iframe 
        data-src="https://player.vimeo.com/video/815841220?h=07bd62c97f" 
        data-category="external_media" 
        class="require-consent" 
        data-ask-consent="1" 
        style="position:absolute;top:0;left:0;width:100%;height:100%;" 
        frameborder="0" 
        allow="autoplay; fullscreen; picture-in-picture" 
        allowfullscreen></iframe>
</div>
<script 
    type="text/plain" 
    data-type="text/javascript" 
    data-category="external_media" 
    class="require-consent" 
    data-src="https://player.vimeo.com/api/player.js"></script>

Blueprint Template Available

<div hidden="" class="privacywire-ask-consent-blueprint" id="privacywire-ask-consent-blueprint">
    <div class="privacywire-consent-message">
        <p>To load this element, it is required to consent to the following cookie category: {category}.</p>
    </div>
    <button class="privacywire-consent-button" data-consent-category="{categoryname}">
        Load {category} cookies
    </button>
</div>

Expected Behavior

• Iframe should be blocked (✅ working)
• Consent message should be generated using blueprint template and inserted adjacent to iframe
• User should see consent request with button to allow external_media cookies

Actual Behavior

• Iframe is correctly blocked
• No consent message is generated or displayed for iframe
• Only the script tag (first element) receives a consent message
• User sees empty space where iframe should be

Root Cause

Bug in checkElementsWithRequiredConsent() method (line 435)

• Early return statement causes loop to exit after processing first disallowed element
• Only the first element with denied consent gets processed; subsequent elements are ignored

// Current buggy code
if (!allowed) {
  this.updateDisallowedElement(el);
  return; // ← Exits entire loop, subsequent elements never processed
}

Proposed Fix

Change return to continue to process all blocked elements:

// Fixed code
if (!allowed) {
  this.updateDisallowedElement(el);
  continue; // ← Process next element instead of exiting
}

Impact

This affects any page with multiple elements requiring the same denied consent category. Only the first element gets a consent message; subsequent elements remain silently blocked, creating poor UX.

Test Results After Fix ✅

1. Page Load: Both iframe and script are properly blocked
2. Consent Message: Displayed adjacent to iframe with correct category text
3. Button Click:
   • Iframe loads and displays content
   • Consent message is removed from DOM
   • LocalStorage updated correctly
4. Script Execution: Associated scripts load and execute properly

File to modify: src/js/PrivacyWire.js (line 435)

[gebeer]

Fix available in PR #46

The issue has been resolved with a one-line fix that changes to in the method. This ensures all blocked elements get processed for consent messages instead of stopping after the first one.

PR: #46
Fix: line 435
Testing: Confirmed working with iframe + script scenario