fix: drag-drop utilise text/plain uniquement + logs console
CI / lint (push) Failing after 9s
CI / test (push) Has been skipped
CI / build (push) Has been skipped
CI / e2e (push) Has been skipped
CI / security (push) Successful in 16s
Desktop Build / build-windows (push) Has been cancelled
Desktop Build / build-linux (push) Has been cancelled

- dragstart: setData 'text/plain' (universel, pas de custom MIME)
- drop container + tab: getData('text/plain')
- console.log dans le drop handler pour diagnostic
- Suppression application/obsigate-tab (non fiable cross-browser)
This commit is contained in:
2026-07-27 23:20:55 -04:00
parent 1a9a555bee
commit fe4cb9c47c
+28 -18
View File
@@ -371,8 +371,8 @@ function createPaneTabManager(paneId) {
const payload = JSON.stringify({ const payload = JSON.stringify({
paneId: this.paneId, tabId: tab.id, index: idx paneId: this.paneId, tabId: tab.id, index: idx
}); });
e.dataTransfer.setData('application/obsigate-tab', payload); // text/plain is universally supported across all browsers for drag-drop
e.dataTransfer.setData('text/plain', payload); // fallback for browser compat e.dataTransfer.setData('text/plain', payload);
e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.effectAllowed = 'move';
el.classList.add('dragging'); el.classList.add('dragging');
}); });
@@ -395,9 +395,9 @@ function createPaneTabManager(paneId) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); // Prevent container handler from double-firing e.stopPropagation(); // Prevent container handler from double-firing
document.querySelectorAll('.tab-drop-indicator').forEach(d => d.remove()); document.querySelectorAll('.tab-drop-indicator').forEach(d => d.remove());
try { const raw = e.dataTransfer.getData('text/plain');
const raw = e.dataTransfer.getData('application/obsigate-tab');
if (!raw) return; if (!raw) return;
try {
const dragData = JSON.parse(raw); const dragData = JSON.parse(raw);
// Same pane — reorder // Same pane — reorder
if (dragData.paneId === this.paneId) { if (dragData.paneId === this.paneId) {
@@ -796,14 +796,14 @@ const PaneManager = {
const tabBar = container.querySelector('.tab-bar'); const tabBar = container.querySelector('.tab-bar');
if (tabBar) tabBar.classList.remove('drop-target'); if (tabBar) tabBar.classList.remove('drop-target');
// Try both data formats // Get drag data (text/plain is universally supported)
let raw = e.dataTransfer.getData('application/obsigate-tab'); const raw = e.dataTransfer.getData('text/plain');
if (!raw) raw = e.dataTransfer.getData('text/plain'); console.log('[PaneManager] drop fired, raw data:', raw ? raw.substring(0, 80) : 'null');
if (!raw) return;
try { if (!raw) return;
const dragData = JSON.parse(raw); let dragData;
if (dragData.paneId == null || dragData.tabId == null) return; try { dragData = JSON.parse(raw); } catch (e2) { console.log('[PaneManager] JSON parse error:', e2); return; }
if (dragData.paneId == null || dragData.tabId == null) { console.log('[PaneManager] missing paneId/tabId'); return; }
// Recalculate edge zone from drop coordinates // Recalculate edge zone from drop coordinates
const rect = container.getBoundingClientRect(); const rect = container.getBoundingClientRect();
@@ -811,24 +811,34 @@ const PaneManager = {
const relY = e.clientY - rect.top; const relY = e.clientY - rect.top;
const isSingle = !this.isSplit(); const isSingle = !this.isSplit();
console.log('[PaneManager] drop at', relX.toFixed(0), relY.toFixed(0),
'rect', rect.width.toFixed(0), 'x', rect.height.toFixed(0),
'isSingle', isSingle, 'paneId', paneId, 'srcPane', dragData.paneId);
if (isSingle && relX > rect.width * 0.72) { if (isSingle && relX > rect.width * 0.72) {
console.log('[PaneManager] → splitRight');
this.splitRight(); this.splitRight();
setTimeout(() => { // Transfer after DOM settles
const transfer = () => {
const newPaneId = this.panes.length - 1; const newPaneId = this.panes.length - 1;
console.log('[PaneManager] transferring tab', dragData.tabId, 'to pane', newPaneId);
this.transferTab(dragData.paneId, dragData.tabId, newPaneId); this.transferTab(dragData.paneId, dragData.tabId, newPaneId);
}, 200); };
setTimeout(transfer, 200);
} else if (isSingle && relY > rect.height * 0.72) { } else if (isSingle && relY > rect.height * 0.72) {
console.log('[PaneManager] → splitDown');
this.splitDown(); this.splitDown();
setTimeout(() => { const transfer = () => {
const newPaneId = this.panes.length - 1; const newPaneId = this.panes.length - 1;
this.transferTab(dragData.paneId, dragData.tabId, newPaneId); this.transferTab(dragData.paneId, dragData.tabId, newPaneId);
}, 200); };
setTimeout(transfer, 200);
} else if (dragData.paneId !== paneId) { } else if (dragData.paneId !== paneId) {
// Cross-pane transfer (already in split mode, different panes) console.log('[PaneManager] → cross-pane transfer', dragData.paneId, '→', paneId);
this.transferTab(dragData.paneId, dragData.tabId, paneId); this.transferTab(dragData.paneId, dragData.tabId, paneId);
} else {
console.log('[PaneManager] → same pane, no edge — letting tab handler deal');
} }
// else: same pane, not edge — tab handler deals with reorder
} catch (e2) { console.debug('PaneManager drop error:', e2); }
}); });
}, },