From 2d4c4c5a20bcde436537d49f9328a75e4774ce14 Mon Sep 17 00:00:00 2001 From: Smittix Date: Wed, 21 Jan 2026 17:04:46 +0000 Subject: [PATCH] Fix device card rendering - handle DOM element not HTML string DeviceCard.createDeviceCard() returns a DOM element, not an HTML string. Use replaceWith() and prepend() instead of outerHTML and insertAdjacentHTML. Co-Authored-By: Claude Opus 4.5 --- static/js/modes/bluetooth.js | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/static/js/modes/bluetooth.js b/static/js/modes/bluetooth.js index c454696..4f7fb87 100644 --- a/static/js/modes/bluetooth.js +++ b/static/js/modes/bluetooth.js @@ -327,21 +327,19 @@ const BluetoothMode = (function() { const existingCard = deviceContainer.querySelector(`[data-device-id="${device.device_id}"]`); if (typeof DeviceCard !== 'undefined') { - const cardHtml = DeviceCard.createDeviceCard(device); + // DeviceCard.createDeviceCard returns a DOM element + const cardElement = DeviceCard.createDeviceCard(device); if (existingCard) { - existingCard.outerHTML = cardHtml; + existingCard.replaceWith(cardElement); } else { - deviceContainer.insertAdjacentHTML('afterbegin', cardHtml); + deviceContainer.prepend(cardElement); } - // Re-attach click handler - const newCard = deviceContainer.querySelector(`[data-device-id="${device.device_id}"]`); - if (newCard) { - newCard.addEventListener('click', () => showDeviceDetails(device.device_id)); - } + // Attach click handler + cardElement.addEventListener('click', () => showDeviceDetails(device.device_id)); } else { - // Fallback simple rendering + // Fallback simple rendering (returns HTML string) const cardHtml = createSimpleDeviceCard(device); if (existingCard) {