Skip to content

Commit e232269

Browse files
elieteyssedouelieteyssedou
committed
feat: improve config override and UI enhancements
- Fix MCP server configuration to override existing configs by removing before adding - Add comprehensive tests for config override scenarios - Update border color using CSS custom properties for better theming - Fix GitHub Actions badge URLs - Add README copying to npm package in release workflow
1 parent d189a9f commit e232269

File tree

6 files changed

+76
-12
lines changed

6 files changed

+76
-12
lines changed

‎.changeset/config-override-and-improvements.md‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
"@mcp-pointer/server": patch
3+
"@mcp-pointer/chrome-extension": patch
4+
---
5+
6+
Fix config override and improve UI
7+
8+
- Fix MCP server configuration to override existing configurations by removing before adding
9+
- Add comprehensive tests for config override scenarios
10+
- Update border color to use CSS custom property for better theming
11+
- Fix GitHub Actions badge URLs in README
12+
- Add README copying to npm package in release workflow

‎.github/workflows/release.yml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,9 @@ jobs:
4040
- name: Run tests
4141
run: pnpm test
4242

43+
- name: Copy README to server package for npm
44+
run: cp README.md packages/server/README.md
45+
4346
- name: Build all packages
4447
run: pnpm build
4548

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
![MCP Pointer banner](/docs/banner.png)
22

3-
[![CI](https://github.com/etsd-tech/mcp-pointer/actions/workflows/ci.yml/badge.svg?branch=main&event=check_suite)](https://github.com/etsd-tech/mcp-pointer/actions/workflows/ci.yml)
4-
[![Release](https://github.com/etsd-tech/mcp-pointer/actions/workflows/release.yml/badge.svg?event=release)](https://github.com/etsd-tech/mcp-pointer/actions/workflows/release.yml)
3+
[![CI](https://github.com/etsd-tech/mcp-pointer/actions/workflows/ci.yml/badge.svg?branch=main)](https://github.com/etsd-tech/mcp-pointer/actions/workflows/ci.yml)
4+
[![Release](https://github.com/etsd-tech/mcp-pointer/actions/workflows/release.yml/badge.svg?branch=main)](https://github.com/etsd-tech/mcp-pointer/actions/workflows/release.yml)
55

66
# 👆 MCP Pointer
77

‎packages/chrome-extension/src/styles.css‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
/* MCP Pointer Element Selection Styles */
2+
:root {
3+
--mcp-pointer-border-color: #7abaffc0;
4+
}
25

36
/* Crosshair cursor when trigger key is pressed */
47
.mcp-pointer--is-pointing {
@@ -23,15 +26,15 @@
2326
.mcp-pointer__overlay--hover {
2427
pointer-events: none;
2528

26-
border: #13628aea dashed 2px;
29+
border: var(--mcp-pointer-border-color) dashed 2px;
2730
border-radius: 12px;
2831
}
2932

3033
/* Selection overlay when element is selected */
3134
.mcp-pointer__overlay--selection {
3235
pointer-events: none;
3336
border-radius: 12px;
34-
border: #13628aca solid 2px;
37+
border: var(--mcp-pointer-border-color) solid 2px;
3538
}
3639

3740
/* Complex shimmer effect (::before) */

‎packages/server/src/__tests__/config.test.ts‎

Lines changed: 45 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -82,13 +82,13 @@ describe('configCommand', () => {
8282
it('should execute claude mcp add command with default port and pointer name', () => {
8383
configCommand(SupportedTool.CLAUDE);
8484

85-
// Verify execSync was called once with the correct command
86-
expect(mockExecSync).toHaveBeenCalledTimes(1);
87-
const command = mockExecSync.mock.calls[0][0];
85+
// Verify execSync was called twice (remove + add)
86+
expect(mockExecSync).toHaveBeenCalledTimes(2);
87+
const addCommand = mockExecSync.mock.calls[1][0];
8888

89-
// Verify exact command structure
89+
// Verify exact command structure for add command
9090
const expectedCommand = 'claude mcp add pointer -s user --env MCP_POINTER_PORT=7007 -- npx -y @mcp-pointer/server start';
91-
expect(command).toBe(expectedCommand);
91+
expect(addCommand).toBe(expectedCommand);
9292

9393
// Verify success message
9494
expect(mockLoggerInfo).toHaveBeenCalledWith(expect.stringContaining('✅ Successfully configured MCP Pointer for Claude Code'));
@@ -99,10 +99,47 @@ describe('configCommand', () => {
9999

100100
configCommand(SupportedTool.CLAUDE);
101101

102-
expect(mockExecSync).toHaveBeenCalledTimes(1);
103-
const command = mockExecSync.mock.calls[0][0];
102+
expect(mockExecSync).toHaveBeenCalledTimes(2);
103+
const addCommand = mockExecSync.mock.calls[1][0];
104104
const expectedCommand = 'claude mcp add pointer -s user --env MCP_POINTER_PORT=8888 -- npx -y @mcp-pointer/server start';
105-
expect(command).toBe(expectedCommand);
105+
expect(addCommand).toBe(expectedCommand);
106+
});
107+
108+
it('should attempt to remove existing server before adding new one', () => {
109+
configCommand(SupportedTool.CLAUDE);
110+
111+
// Verify execSync was called twice (remove + add)
112+
expect(mockExecSync).toHaveBeenCalledTimes(2);
113+
114+
// First call should be remove command
115+
const removeCommand = mockExecSync.mock.calls[0][0];
116+
expect(removeCommand).toBe('claude mcp remove pointer -s user');
117+
118+
// Second call should be add command
119+
const addCommand = mockExecSync.mock.calls[1][0];
120+
expect(addCommand).toBe('claude mcp add pointer -s user --env MCP_POINTER_PORT=7007 -- npx -y @mcp-pointer/server start');
121+
122+
expect(mockLoggerInfo).toHaveBeenCalledWith(expect.stringContaining('🔄 Removed existing MCP Pointer configuration'));
123+
expect(mockLoggerInfo).toHaveBeenCalledWith(expect.stringContaining('✅ Successfully configured MCP Pointer for Claude Code'));
124+
});
125+
126+
it('should continue adding even if remove fails', () => {
127+
// Mock remove command to fail, but add command to succeed
128+
mockExecSync
129+
.mockImplementationOnce(() => {
130+
throw new Error('Server not found');
131+
})
132+
.mockImplementationOnce(() => Buffer.from(''));
133+
134+
configCommand(SupportedTool.CLAUDE);
135+
136+
// Verify execSync was still called twice
137+
expect(mockExecSync).toHaveBeenCalledTimes(2);
138+
139+
// Should still log success message
140+
expect(mockLoggerInfo).toHaveBeenCalledWith(expect.stringContaining('✅ Successfully configured MCP Pointer for Claude Code'));
141+
// Should not log removal message when remove fails
142+
expect(mockLoggerInfo).not.toHaveBeenCalledWith(expect.stringContaining('🔄 Removed existing MCP Pointer configuration'));
106143
});
107144

108145
it('should handle command failure gracefully', () => {

‎packages/server/src/config.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,15 @@ function configureClaudeCode(port: string) {
3838
try {
3939
logger.info('🔧 Configuring MCP Pointer for Claude Code...');
4040

41+
// First, try to remove existing server if it exists (ignore errors)
42+
try {
43+
execSync(`claude mcp remove ${MCP_SERVER_NAME} -s user`, { stdio: 'pipe' });
44+
logger.info('🔄 Removed existing MCP Pointer configuration');
45+
} catch {
46+
// Ignore errors - server might not exist
47+
}
48+
49+
// Now add the server configuration
4150
const command = `claude mcp add ${MCP_SERVER_NAME} -s user --env MCP_POINTER_PORT=${port} -- npx -y @mcp-pointer/server start`;
4251
execSync(command, { stdio: 'pipe' });
4352

0 commit comments

Comments
 (0)