Skip to content

Commit 29c09b1

Browse files
committed
feat: add mock-connector cli tool for local testing
1 parent c039fd0 commit 29c09b1

19 files changed

+1009
-1281
lines changed

CONTRIBUTING.md

Lines changed: 62 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ This focus helps guide our project decisions as a community and what we choose t
3333
- [Available commands](#available-commands)
3434
- [Project structure](#project-structure)
3535
- [Local connector CLI](#local-connector-cli)
36+
- [Mock connector (for local development)](#mock-connector-for-local-development)
3637
- [Code style](#code-style)
3738
- [TypeScript](#typescript)
3839
- [Server API patterns](#server-api-patterns)
@@ -104,6 +105,10 @@ pnpm dev # Start development server
104105
pnpm build # Production build
105106
pnpm preview # Preview production build
106107

108+
# Connector
109+
pnpm npmx-connector # Start the real connector (requires npm login)
110+
pnpm mock-connector # Start the mock connector (no npm login needed)
111+
107112
# Code Quality
108113
pnpm lint # Run linter (oxlint + oxfmt)
109114
pnpm lint:fix # Auto-fix lint issues
@@ -157,6 +162,36 @@ pnpm npmx-connector
157162

158163
The connector will check your npm authentication, generate a connection token, and listen for requests from npmx.dev.
159164

165+
### Mock connector (for local development)
166+
167+
If you're working on admin features (org management, package access controls, operations queue) and don't want to use your real npm account, you can run the mock connector instead:
168+
169+
```bash
170+
pnpm mock-connector
171+
```
172+
173+
This starts a mock connector server pre-populated with sample data (orgs, teams, members, packages). No npm login is required — operations succeed immediately without making real npm CLI calls.
174+
175+
The mock connector prints a connection URL to the terminal, just like the real connector. Click it (or paste the token manually) to connect the UI.
176+
177+
**Options:**
178+
179+
```bash
180+
pnpm mock-connector # default: port 31415, user "mock-user", sample data
181+
pnpm mock-connector --port 9999 # custom port
182+
pnpm mock-connector --user alice # custom username
183+
pnpm mock-connector --empty # start with no pre-populated data
184+
```
185+
186+
**Default sample data:**
187+
188+
- **@nuxt**: 4 members (mock-user, danielroe, pi0, antfu), 3 teams (core, docs, triage)
189+
- **@unjs**: 2 members (mock-user, pi0), 1 team (maintainers)
190+
- **Packages**: @nuxt/kit, @nuxt/schema, @unjs/nitro with team-based access controls
191+
192+
> [!TIP]
193+
> Run `pnpm dev` in a separate terminal to start the Nuxt dev server, then click the connection URL from the mock connector to connect.
194+
160195
## Code style
161196

162197
When committing changes, try to keep an eye out for unintended formatting updates. These can make a pull request look noisier than it really is and slow down the review process. Sometimes IDEs automatically reformat files on save, which can unintentionally introduce extra changes.
@@ -754,13 +789,30 @@ You need to either:
754789

755790
### Testing connector features
756791

757-
Features that require authentication through the local connector (org management, package collaborators, operations queue) are tested using a mock connector server. The testing infrastructure includes:
792+
Features that require authentication through the local connector (org management, package collaborators, operations queue) are tested using a mock connector server.
793+
794+
#### Architecture
795+
796+
The mock connector infrastructure is shared between the CLI, E2E tests, and Vitest component tests:
797+
798+
```
799+
cli/src/
800+
├── types.ts # ConnectorEndpoints contract (shared by real + mock)
801+
├── mock-state.ts # MockConnectorStateManager (canonical source)
802+
├── mock-app.ts # H3 mock app + MockConnectorServer class
803+
└── mock-server.ts # CLI entry point (pnpm mock-connector)
804+
805+
test/test-utils/ # Re-exports from cli/src/ for test convenience
806+
test/e2e/helpers/ # E2E-specific wrappers (fixtures, global setup)
807+
```
808+
809+
Both the real server (`cli/src/server.ts`) and the mock server (`cli/src/mock-app.ts`) conform to the `ConnectorEndpoints` interface defined in `cli/src/types.ts`. This ensures the API contract is enforced by TypeScript. When adding a new endpoint, update `ConnectorEndpoints` first, then implement it in both servers.
758810

759-
**For Vitest component tests** (`test/nuxt/`):
811+
#### Vitest component tests (`test/nuxt/`)
760812

761813
- Mock the `useConnector` composable with reactive state
762814
- Use `document.body` queries for components using Teleport
763-
- See `test/nuxt/components/ConnectorModal.spec.ts` for an example
815+
- See `test/nuxt/components/HeaderConnectorModal.spec.ts` for an example
764816

765817
```typescript
766818
// Create mock state
@@ -775,10 +827,9 @@ vi.mock('~/composables/useConnector', () => ({
775827
}))
776828
```
777829

778-
**For Playwright E2E tests** (`test/e2e/`):
830+
#### Playwright E2E tests (`test/e2e/`)
779831

780-
- A mock HTTP server (`test/e2e/helpers/mock-connector.ts`) implements the connector API
781-
- The server starts automatically via Playwright's global setup
832+
- A mock HTTP server starts automatically via Playwright's global setup
782833
- Use the `mockConnector` fixture to set up test data and the `gotoConnected` helper to navigate with authentication
783834

784835
```typescript
@@ -798,9 +849,11 @@ test('shows org members', async ({ page, gotoConnected, mockConnector }) => {
798849

799850
The mock connector supports test endpoints for state manipulation:
800851

801-
- `/__test__/org/:org` - Set org users and teams
802-
- `/__test__/user/orgs` - Set user's organizations
803-
- `/__test__/operations` - Get/manipulate operation queue
852+
- `/__test__/reset` - Reset all mock state
853+
- `/__test__/org` - Set org users, teams, and team members
854+
- `/__test__/user-orgs` - Set user's organizations
855+
- `/__test__/user-packages` - Set user's packages
856+
- `/__test__/package` - Set package collaborators
804857

805858
## Submitting changes
806859

app/composables/useConnector.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { PendingOperation, OperationStatus, OperationType } from '../../cli/src/types'
1+
import type { PendingOperation, OperationStatus, OperationType } from '#cli/types'
22
import { $fetch } from 'ofetch'
33

44
export interface NewOperation {

cli/package.json

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,7 @@
1717
"npmx-connector": "./dist/cli.mjs"
1818
},
1919
"exports": {
20-
".": {
21-
"import": "./dist/index.mjs",
22-
"types": "./dist/index.d.mts"
23-
}
20+
".": "./dist/index.mjs"
2421
},
2522
"files": [
2623
"dist"
@@ -29,6 +26,7 @@
2926
"build": "tsdown",
3027
"dev": "NPMX_CLI_DEV=true node src/cli.ts",
3128
"dev:debug": "DEBUG=npmx-connector NPMX_CLI_DEV=true node src/cli.ts",
29+
"dev:mock": "NPMX_CLI_DEV=true node src/mock-server.ts",
3230
"test:types": "tsc --noEmit"
3331
},
3432
"dependencies": {

0 commit comments

Comments
 (0)