Basic post about MCP configuration and debugging Sitecore MCP agent in Cursor
Model Context Protocol (MCP) agents are becoming popular day-by-day. In simple terms, MCP is nothing but API for AIs. In other words, while you can use AI chat to get information from web about various resources, if you want end-users to interact with your own custom-built applications, MCP agent will be useful for interaction and can be setup in your local machine. Since you need a visual interface to chat with an AI agent and cursor is not only an IDE but also has a chat interface, I have used cursor in this blog post as example but Claude Desktop is an option closer to end-users. To configure an MCP agent, you can go to the concerned provider github repo and should find the npx command and args. For instance, I picked up the following repos among others for this purpose:
The commands will go into %userprofile%/.cursor/mcp.json in case of cursor:
#######
#######
If there is a typo error in the args or command, the tools won't be listed for the MCP agent. In the following video, I forced an error in the github mcp agent by adding a wrong package name and as a result the signal turns amber then red. Once I rectify the same, the signal comes back green after refresh simultaneously listing the mcp agent tools. So, only when the signal is green, the concerned agent tool will be invoked as you send a relevant chat message -
In case of claude desktop, the same commands will be part of claude_desktop_config.json under %AppData%/claude folder
If using Claude desktop, to see the commands reflected in File > Settings > Developer section, start Claude desktop in administrator mode after saving changes to the claude_desktop_config.json:
Note: If Claude Desktop is already open, ensure to File > Exit and then open in Administrator mode else new config changes won't be listed! Also note that if Claude Desktop hasn't been File > Exit in the previous attempt, the config changes won't reflect. So, ensure to open and Exit properly to see the config changes in the consequent launch!
Once you have multiple agents setup, you can chat with different agents as shown in the following video:
Debugging TypeScript code in Sitecore MCP Server
For this part, you need a Sitecore instance as pre-requisite so, clone this repo and ensure Docker desktop is running and start the instance in docker by executing init.ps1 followed by up.ps1.
Next, one of the other important aspects while working with Sitecore MCP agent is debugging. To perform debugging of typescript agent code in Cursor, here are the steps:
Pre-requisite: https://github.com/Antonytm/mcp-sitecore-server
1. Add an entry in mcp.json as follows:
The local sse agent will turn green only after the above url is available i.e., after the next step.
2. In Cursor, View > Terminal and open Javascript debug terminal then execute npm run start
Debugger will get attached. At this point, http://localhost:3001/sse in browser must be available.
Add breakpoints in the code, for instance, in the get-home-item ts file. Once debugger is attached, these breakpoints will turn bright red.
3. Next add another terminal window and execute npm run inspector
Note that executing npm run inspector needs changes to package.json
3.a Open the inspector url in browser
3.b Click Connect
3.c Next, click Tools and List tools
3.d Access get home tool and click Run tool
3.e The break point will reach the code execution and F10, F11 or F5 is what will help thereafter!
Happy debugging with Sitecore MCP agent and Cursor.
Comments
Post a Comment