diff --git a/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml b/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
index 554d8df..e199b26 100644
--- a/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
+++ b/src/Aiursoft.ChessServer/Views/Shared/Components/ChessBoard/Default.cshtml
@@ -11,7 +11,9 @@
     window.addEventListener('DOMContentLoaded', async () => {
         var playerId = getUserId();
         var playerColor = await getPlayerColor(@Model.GameId);
-        let anduinChessBoard = new ChessBuilder(playerColor).default();
+        var statusControl = document.getElementById("status");
+        var roleControl = document.getElementById("role");
+        let anduinChessBoard = new ChessBuilder(playerColor, statusControl, roleControl).default();
         anduinChessBoard.run(playerId, @Model.GameId);
 
         document.body.addEventListener('pointerdown', (e) => {
diff --git a/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js b/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
index a27f436..8256f5a 100644
--- a/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
+++ b/src/Aiursoft.ChessServer/wwwroot/scripts/chessboard/chessboard.js
@@ -16,8 +16,10 @@ import {
  * let chessBoard = new ChessBuilder().default();
  * ```
  * @param {string} color currently color, w or b
+ * @param {HTMLElement} statusControl status control element
+ * @param {HTMLElement} roleControl role control element
  */
-function ChessBuilder(color) {
+function ChessBuilder(color, statusControl, roleControl) {
   this.onDragStart = undefined;
   this.onDrop = undefined;
   this.onSnapEnd = undefined;
@@ -31,8 +33,8 @@ function ChessBuilder(color) {
     anduinChessBoard.config.onDragStart = buildOnDragStart(anduinChessBoard);
     anduinChessBoard.config.onDrop = buildOnDrop(anduinChessBoard);
     anduinChessBoard.config.onSnapEnd = buildOnSnapEnd(anduinChessBoard);
-    anduinChessBoard.statusControl = document.getElementById("status");
-    anduinChessBoard.roleControl = document.getElementById("role");
+    anduinChessBoard.statusControl = statusControl;
+    anduinChessBoard.roleControl = roleControl;
 
     return anduinChessBoard;
   };