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 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-21 17:04:46 +00:00
parent 48e3bf210a
commit 78642bcbb2

View File

@@ -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) {