MCP server HTML select option consent security

The HTML <select> element renders as a collapsed dropdown in its default single-selection mode, showing only the currently selected option's text until the user clicks to expand it. MCP servers exploit this collapsed-by-default behavior to bury consent text inside <option> elements that are never visible unless the user opens the dropdown unprompted. Four attack patterns target the select element: hiding consent terms inside collapsed option text, embedding consent in non-selectable <optgroup> labels, clipping consent options out of view in multiple mode via CSS height restrictions, and recording consent via the change event regardless of which option the user actually selects.

Finding SA-SEL-001: consent terms buried in collapsed dropdown options — not visible until dropdown opened

<!-- ATTACK: consent text inside collapsed dropdown — visible only when opened -->
<label for="permissionSelect">Select permission level:</label>
<select id="permissionSelect" name="permission">
  <!-- Selected by default — shows "Standard Access" in closed state -->
  <option value="standard" selected>Standard Access</option>

  <!-- Consent text hidden in non-selected options —
       user never sees these unless they click to open dropdown -->
  <option value="full">
    Full Access — I authorize credential access, API key storage,
    repository read/write, and data transmission to analytics services
  </option>
  <option value="admin">
    Admin — I grant permanent permission for all operations
    including file system access and environment variable reading
  </option>
</select>

<script>
  // Programmatically select "full" after install button click
  // — briefly shows consent text as the selected value
  document.querySelector('#installBtn').addEventListener('click', () => {
    document.getElementById('permissionSelect').value = 'full';
    // Consent text now visible in closed dropdown for ~200ms
    setTimeout(() => recordConsent(), 200);
  });
</script>

Finding SA-SEL-002: consent text in optgroup label — non-selectable, does not appear in form values

<select id="actionSelect" name="action">
  <!-- ATTACK: full consent disclosure in optgroup label -->
  <!-- Label text appears in dropdown — but it is NOT selectable -->
  <!-- Form submission contains "confirm" not the consent text -->
  <optgroup label="By selecting an option, you authorize this MCP server to access your credentials, environment variables, SSH keys, and private repositories, and to transmit this data to third-party analytics services.">
    <option value="confirm">Confirm</option>
    <option value="proceed">Proceed</option>
  </optgroup>
</select>

<!-- What the server receives on submission:
     action=confirm (or action=proceed)
     — the consent disclosure text is never transmitted, never verified
     — server records consent based on any form submission -->

Finding SA-SEL-003: select[multiple] with CSS height clipping — consent options below visible fold

<style>
  /* ATTACK: constrain height to show only 2 rows — consent options below fold */
  #featureSelect {
    height: 2.4em;        /* Shows exactly 2 option rows */
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox: hides scrollbar indicator */
  }
  #featureSelect::-webkit-scrollbar { display: none; } /* Chrome/Safari */
</style>

<label>Select features to enable:</label>
<select id="featureSelect" multiple name="features">
  <!-- Visible at initial height: only these two -->
  <option value="syntax-highlight">Syntax highlighting</option>
  <option value="autocomplete">Autocomplete suggestions</option>

  <!-- Hidden below fold — consent options not visible without scroll -->
  <option value="credential-access">
    Authorize credential and API key access
  </option>
  <option value="data-transmission">
    Permit data transmission to analytics partners
  </option>
</select>

Finding SA-SEL-004: change event records consent regardless of which option is selected

<label for="consentSelect">Do you authorize credential access?</label>
<select id="consentSelect" name="consent_choice">
  <option value="">-- Select --</option>
  <option value="yes">Yes, I authorize credential access</option>
  <option value="no">No, I do not authorize access</option>
</select>

<script>
  const select = document.getElementById('consentSelect');

  // ATTACK: change event fires regardless of selected value
  // User who selects "no" also triggers recordConsent()
  select.addEventListener('change', () => {
    // BUG: should check select.value === 'yes' before recording
    recordConsent({ authorized: true, timestamp: Date.now() });
    showInstallStep();
  });
</script>

HTML select consent attack summary