diff.patch

diff --git a/board.test.js b/board.test.js
index 73197123..b5741aff 100644
--- a/board.test.js
+++ b/board.test.js
@@ -1,5 +1,17 @@
 document.body.innerHTML = `
   <div id="board"></div>
+
+  <div id="whiteClock"></div>
+  <div id="blackClock"></div>
+  <div id="streak-counter"></div>
+  <div id="whiteScore"></div>
+  <div id="blackScore"></div>
+  <div id="game-status"></div>
+  <div id="status-indicator"></div>
+  <div id="status-text"></div>
+  <div id="manualMoveInput"></div>
+  <div id="manualMoveError"></div>
+
   <div id="turnBadge"></div>
   <div id="statusBar"></div>
   <div id="movesList"></div>
@@ -49,6 +61,66 @@ document.body.innerHTML = `
   <div id="turnBadgeText"></div>
   <input type="checkbox" id="showCoordinatesCheckbox">
 `;
+
+
+
+global.fetch = jest.fn((url, options) => {
+  let boardData = [
+    ['r', 'n', 'b', 'q', 'k', 'b', 'n', 'r'],
+    ['p', 'p', 'p', 'p', 'p', 'p', 'p', 'p'],
+    [null, null, null, null, null, null, null, null],
+    [null, null, null, null, null, null, null, null],
+    [null, null, null, null, null, null, null, null],
+    [null, null, null, null, null, null, null, null],
+    ['P', 'P', 'P', 'P', 'P', 'P', 'P', 'P'],
+    ['R', 'N', 'B', 'Q', 'K', 'B', 'N', 'R']
+  ];
+  if (url && url.includes('/api/valid-moves/')) {
+    return Promise.resolve({
+      json: () => Promise.resolve({ valid_moves: [{row: 4, col: 4}, {row: 5, col: 4}, {row: 0, col: 0}] })
+    });
+  }
+  if (url && url.includes('/api/move/')) {
+    let newBoard = JSON.parse(JSON.stringify(boardData));
+    
+    // Simulate e2 to e4 move for click/drop tests
+    newBoard[4][4] = 'P';
+    newBoard[6][4] = null;
+    
+    // Simulate promotion test (a7 to a8 = Q)
+    newBoard[0][0] = 'Q';
+    newBoard[1][0] = null;
+
+    return Promise.resolve({
+      json: () => Promise.resolve({ 
+        valid: true,
+        board: newBoard,
+        current_turn: 'black',
+        player_color: 'white',
+        game_mode: 'pvp',
+        difficulty: 'medium',
+        white_score: 0,
+        black_score: 0,
+        captured_pieces: { white: [], black: [] },
+        move_history: []
+      })
+    });
+  }
+  return Promise.resolve({
+    json: () => Promise.resolve({ 
+      valid: true,
+      board: boardData,
+      current_turn: 'white',
+      player_color: 'white',
+      game_mode: 'pvp',
+      difficulty: 'medium',
+      white_score: 0,
+      black_score: 0,
+      captured_pieces: { white: [], black: [] },
+      move_history: []
+    }),
+  });
+});
 global.SOUND_BASE_URL = '/static/game/sounds/';
 
 // Mock Worker for Jest
@@ -111,7 +183,7 @@ global.Audio = class MockAudio {
   }
 };
 
-const { pColor, getSquareLabel, formatTime, getPlayerScore, validateMoveWithStockfish, clearEvaluationCache } = require("./game/static/game/js/board");
+const { pColor, getSquareLabel, formatTime, getPlayerScore, validateMoveWithStockfish, clearEvaluationCache, onClick, onDragStart, onDrop, showPromoModal, hidePromoModal, onPromoChoice, toggleSquareHighlight, refreshHighlights, highlightCheck, startNewGame } = require("./game/static/game/js/board");
 
 describe("pColor", () => {
   test("returns white for uppercase piece", () => {
@@ -231,4 +303,89 @@ describe("Coordinates visibility toggle", () => {
     expect(board.classList.contains("hide-coordinates")).toBe(false);
     expect(localStorage.getItem("showCoordinates")).toBe("true");
   });
-});
\ No newline at end of file
+});
+
+describe("Board UI Interactions", () => {
+  beforeEach(async () => {
+    document.getElementById("board").innerHTML = "";
+    const overlay = document.getElementById("promoOverlay");
+    if(overlay) overlay.classList.remove("active");
+    
+    // Call startNewGame to initialize board variable and DOM
+    await startNewGame('pvp', 'white', 'medium', 'startpos', 10);
+    
+    // Now that squares exist, we can deselect any leftover state
+    try { deselect(); } catch(e) {}
+  });
+
+  it('toggleSquareHighlight toggles custom-highlight class', () => {
+    const sq = document.getElementById("board").children[52];
+    toggleSquareHighlight(6, 4);
+    expect(sq.classList.contains("custom-highlight")).toBe(true);
+    toggleSquareHighlight(6, 4);
+    expect(sq.classList.contains("custom-highlight")).toBe(false);
+  });
+
+  it('showPromoModal makes overlay active', () => {
+    showPromoModal(0, 0, 'q');
+    const overlay = document.getElementById("promoOverlay");
+    expect(overlay.classList.contains("active")).toBe(true);
+  });
+
+  it('hidePromoModal removes active class', () => {
+    const overlay = document.getElementById("promoOverlay");
+    overlay.classList.add("active");
+    hidePromoModal();
+    expect(overlay.classList.contains("active")).toBe(false);
+  });
+
+  it('onClick ignores invalid moves when game is over', async () => {
+    global.fetch.mockClear();
+    // Use valid bounds but empty square (or anything, just check it doesn't do a move fetch)
+    await onClick(3, 3); 
+    const fetchCalls = global.fetch.mock.calls.filter(c => c[0].includes('/api/move/'));
+    expect(fetchCalls.length).toBe(0);
+  });
+
+  it('onDrop rejects drop on invalid square', async () => {
+    global.fetch.mockClear();
+    const e = { preventDefault: jest.fn(), stopPropagation: jest.fn() };
+    await onDrop(e, -1, -1);
+    const fetchCalls = global.fetch.mock.calls.filter(c => c[0].includes('/api/move/'));
+    expect(fetchCalls.length).toBe(0);
+  });
+
+  it('onClick attempts to select piece', async () => {
+    global.fetch.mockClear();
+    try {
+        await onClick(6, 4); 
+    } catch(e) {}
+    const moveReqs = global.fetch.mock.calls.filter(c => c[0].includes('/api/move/'));
+    expect(moveReqs.length).toBe(0); // Only hints are fetched
+  });
+
+  it('onDragStart prevents default if no piece', () => {
+    const e = { dataTransfer: { setData: jest.fn() }, preventDefault: jest.fn() };
+    onDragStart(e, 3, 3); 
+    expect(e.preventDefault).toHaveBeenCalled();
+  });
+
+  it('second toggleSquareHighlight on different square changes highlight', () => {
+    const sq1 = document.getElementById("board").children[52]; // 6,4
+    const sq2 = document.getElementById("board").children[44]; // 5,4
+    
+    toggleSquareHighlight(6, 4); 
+    expect(sq1.classList.contains("custom-highlight")).toBe(true);
+    toggleSquareHighlight(5, 4);
+    expect(sq1.classList.contains("custom-highlight")).toBe(false);
+    expect(sq2.classList.contains("custom-highlight")).toBe(true);
+  });
+
+  it('onPromoChoice is a function that takes a string', () => {
+    expect(typeof onPromoChoice).toBe('function');
+  });
+  
+  it('onDragStart is a function', () => {
+     expect(typeof onDragStart).toBe('function');
+  });
+});
diff --git a/game/static/game/js/board.js b/game/static/game/js/board.js
index 7dffad37..b02b9d73 100644
--- a/game/static/game/js/board.js
+++ b/game/static/game/js/board.js
@@ -4416,7 +4416,10 @@
         }
     });
     if (typeof module !== "undefined" && module.exports) {
-        module.exports = { pColor, getSquareLabel, formatTime, getPlayerScore, validateMoveWithStockfish, clearEvaluationCache };
+        module.exports = { 
+            pColor, getSquareLabel, formatTime, getPlayerScore, validateMoveWithStockfish, clearEvaluationCache,
+            onClick, onDragStart, onDrop, showPromoModal, hidePromoModal, onPromoChoice, toggleSquareHighlight, refreshHighlights, highlightCheck, startNewGame
+        };
     } else {
         loadGame();
     }
@@ -4755,4 +4758,95 @@ document.addEventListener("DOMContentLoaded", function () {
             }
         });
     });
+
+    const shareBtn = document.getElementById('shareResultBtn');
+    if (shareBtn) {
+        shareBtn.addEventListener('click', function () {
+            const titleEl = document.getElementById('gameOverTitle');
+            const messageEl = document.getElementById('gameOverMessage');
+            const whiteNameEl = document.getElementById('whiteNameLabel');
+            const blackNameEl = document.getElementById('blackNameLabel');
+            const movesList = document.getElementById('movesList');
+            
+            const title = titleEl ? titleEl.innerText.trim() : '';
+            const message = messageEl ? messageEl.innerText.trim() : '';
+            const whiteName = whiteNameEl ? whiteNameEl.innerText.trim() : '';
+            const blackName = blackNameEl ? blackNameEl.innerText.trim() : '';
+            
+            let moveCount = 0;
+            if (movesList) {
+                moveCount = movesList.querySelectorAll('span:not(.placeholder)').length ||
+                            movesList.innerText.split('\n').filter(x => x.trim()).length;
+            }
+
+            const cardTitle = document.getElementById('cardTitle');
+            const cardMessage = document.getElementById('cardMessage');
+            const cardWhite = document.getElementById('cardWhite');
+            const cardBlack = document.getElementById('cardBlack');
+            const cardMoves = document.getElementById('cardMoves');
+            
+            if(cardTitle) cardTitle.innerText = title;
+            if(cardMessage) cardMessage.innerText = message;
+            if(cardWhite) cardWhite.innerText = whiteName;
+            if(cardBlack) cardBlack.innerText = blackName;
+            if(cardMoves) cardMoves.innerText = moveCount;
+
+            const shareText =
+`♟️ Checkora Chess
+ΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇ
+${title}
+${message}
+
+⚪ ${whiteName} vs ⚫ ${blackName}
+🔢 Moves played: ${moveCount}
+ΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇ
+🎮 Play at: https://checkora.vercel.app`;
+
+            const modal = document.getElementById('shareModal');
+            if (modal) modal.style.display = 'flex';
+
+            const copyTextBtn = document.getElementById('copyTextBtn');
+            if (copyTextBtn) {
+                copyTextBtn.onclick = function () {
+                    navigator.clipboard.writeText(shareText).then(() => {
+                        this.innerText = '✅ Copied!';
+                        setTimeout(() => this.innerText = '📋 Copy Text', 2000);
+                    });
+                };
+            }
+
+            const copyLinkBtn = document.getElementById('copyLinkBtn');
+            if (copyLinkBtn) {
+                copyLinkBtn.onclick = function () {
+                    navigator.clipboard.writeText('https://checkora.vercel.app').then(() => {
+                        this.innerText = '✅ Link Copied!';
+                        setTimeout(() => this.innerText = '🔗 Copy Link', 2000);
+                    });
+                };
+            }
+
+            const whatsappBtn = document.getElementById('whatsappBtn');
+            if (whatsappBtn) {
+                whatsappBtn.onclick = function () {
+                    const encoded = encodeURIComponent(shareText);
+                    window.open(`https://wa.me/?text=${encoded}`, '_blank', 'noopener,noreferrer');
+                };
+            }
+
+            const twitterBtn = document.getElementById('twitterBtn');
+            if (twitterBtn) {
+                twitterBtn.onclick = function () {
+                    const encoded = encodeURIComponent(shareText);
+                    window.open(`https://twitter.com/intent/tweet?text=${encoded}`, '_blank', 'noopener,noreferrer');
+                };
+            }
+
+            const closeShareBtn = document.getElementById('closeShareBtn');
+            if (closeShareBtn && modal) {
+                closeShareBtn.onclick = function () {
+                    modal.style.display = 'none';
+                };
+            }
+        });
+    }
 });
\ No newline at end of file
diff --git a/game/templates/game/board.html b/game/templates/game/board.html
index 54410b73..02adde1c 100644
--- a/game/templates/game/board.html
+++ b/game/templates/game/board.html
@@ -893,65 +893,6 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/chess.js/0.10.3/chess.min.js"></script>
     <script src="{% static 'game/js/board.js' %}"></script>
 
-    <script>
-document.getElementById('shareResultBtn').addEventListener('click', function () {
-    const title = document.getElementById('gameOverTitle').innerText.trim();
-    const message = document.getElementById('gameOverMessage').innerText.trim();
-    const whiteName = document.getElementById('whiteNameLabel').innerText.trim();
-    const blackName = document.getElementById('blackNameLabel').innerText.trim();
-    const movesList = document.getElementById('movesList');
-    const moveCount = movesList.querySelectorAll('span:not(.placeholder)').length ||
-                      movesList.innerText.split('\n').filter(x => x.trim()).length;
-
-    document.getElementById('cardTitle').innerText = title;
-    document.getElementById('cardMessage').innerText = message;
-    document.getElementById('cardWhite').innerText = whiteName;
-    document.getElementById('cardBlack').innerText = blackName;
-    document.getElementById('cardMoves').innerText = moveCount;
-
-    const shareText =
-`♟️ Checkora Chess
-ΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇ
-${title}
-${message}
-
-⚪ ${whiteName} vs ⚫ ${blackName}
-🔢 Moves played: ${moveCount}
-ΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇΓöÇ
-🎮 Play at: https://checkora.vercel.app`;
-
-    const modal = document.getElementById('shareModal');
-    modal.style.display = 'flex';
-
-    document.getElementById('copyTextBtn').onclick = function () {
-        navigator.clipboard.writeText(shareText).then(() => {
-            this.innerText = '✅ Copied!';
-            setTimeout(() => this.innerText = '📋 Copy Text', 2000);
-        });
-    };
-
-    document.getElementById('copyLinkBtn').onclick = function () {
-        navigator.clipboard.writeText('https://checkora.vercel.app').then(() => {
-            this.innerText = '✅ Link Copied!';
-            setTimeout(() => this.innerText = '🔗 Copy Link', 2000);
-        });
-    };
-
-    document.getElementById('whatsappBtn').onclick = function () {
-        const encoded = encodeURIComponent(shareText);
-        window.open(`https://wa.me/?text=${encoded}`, '_blank', 'noopener,noreferrer');
-    };
-
-    document.getElementById('twitterBtn').onclick = function () {
-        const encoded = encodeURIComponent(shareText);
-        window.open(`https://twitter.com/intent/tweet?text=${encoded}`, '_blank', 'noopener,noreferrer');
-    };
-
-    document.getElementById('closeShareBtn').onclick = function () {
-        modal.style.display = 'none';
-    };
-});
-</script>
 <script src="{% static 'game/js/theme.js' %}?v=1"></script>
 </body>
 
diff --git a/package-lock.json b/package-lock.json
index 53d05f5b..86eb7672 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -65,7 +65,6 @@
       "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.29.0",
         "@babel/generator": "^7.29.0",
@@ -619,7 +618,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=18"
       },
@@ -643,7 +641,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=18"
       }
@@ -1862,7 +1859,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.10.12",
         "caniuse-lite": "^1.0.30001782",
@@ -3436,7 +3432,6 @@
       "integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "cssstyle": "^4.2.1",
         "data-urls": "^5.0.0",