@smartsoft001-mobilems/claude-plugins 2.85.0 → 2.86.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude-plugin/marketplace.json +2 -6
- package/package.json +2 -2
- package/plugins/mobilems/.claude-plugin/README.md +30 -0
- package/plugins/mobilems/.claude-plugin/plugin.json +5 -0
- package/plugins/mobilems/scripts/refresh-mobilems-api-spec.sh +372 -0
- package/plugins/mobilems/skills/mobilems-docs-reader/SKILL.md +116 -0
- package/plugins/flow/.claude-plugin/README.md +0 -91
- package/plugins/flow/.claude-plugin/merge-permissions.js +0 -97
- package/plugins/flow/.claude-plugin/plugin.json +0 -5
- package/plugins/flow/.claude-plugin/settings.template.json +0 -86
- package/plugins/flow/agents/angular-component-scaffolder.md +0 -175
- package/plugins/flow/agents/angular-directive-builder.md +0 -153
- package/plugins/flow/agents/angular-guard-builder.md +0 -243
- package/plugins/flow/agents/angular-jest-test-writer.md +0 -474
- package/plugins/flow/agents/angular-pipe-builder.md +0 -169
- package/plugins/flow/agents/angular-resolver-builder.md +0 -286
- package/plugins/flow/agents/angular-service-builder.md +0 -161
- package/plugins/flow/agents/angular-signal-state-builder.md +0 -339
- package/plugins/flow/agents/angular-test-diagnostician.md +0 -279
- package/plugins/flow/agents/angular-testbed-configurator.md +0 -315
- package/plugins/flow/agents/arch-scaffolder.md +0 -278
- package/plugins/flow/agents/e2e-data-testid-injector.md +0 -197
- package/plugins/flow/agents/e2e-project-scaffolder.md +0 -194
- package/plugins/flow/agents/e2e-test-writer.md +0 -350
- package/plugins/flow/agents/shared-agent-evolver.md +0 -294
- package/plugins/flow/agents/shared-build-verifier.md +0 -160
- package/plugins/flow/agents/shared-config-updater.md +0 -310
- package/plugins/flow/agents/shared-coverage-enforcer.md +0 -184
- package/plugins/flow/agents/shared-error-handler.md +0 -217
- package/plugins/flow/agents/shared-file-creator.md +0 -344
- package/plugins/flow/agents/shared-impl-orchestrator.md +0 -312
- package/plugins/flow/agents/shared-impl-reporter.md +0 -368
- package/plugins/flow/agents/shared-impl-teammate.md +0 -201
- package/plugins/flow/agents/shared-linear-subtask-iterator.md +0 -337
- package/plugins/flow/agents/shared-logic-implementer.md +0 -243
- package/plugins/flow/agents/shared-maia-api.md +0 -26
- package/plugins/flow/agents/shared-parallelization-analyzer.md +0 -343
- package/plugins/flow/agents/shared-performance-validator.md +0 -168
- package/plugins/flow/agents/shared-plan-perspective.md +0 -269
- package/plugins/flow/agents/shared-project-standardizer.md +0 -205
- package/plugins/flow/agents/shared-report-synthesizer.md +0 -188
- package/plugins/flow/agents/shared-review-teammate.md +0 -189
- package/plugins/flow/agents/shared-security-scanner.md +0 -186
- package/plugins/flow/agents/shared-style-enforcer.md +0 -230
- package/plugins/flow/agents/shared-subtask-dependency-analyzer.md +0 -188
- package/plugins/flow/agents/shared-tdd-developer.md +0 -350
- package/plugins/flow/agents/shared-team-coordinator.md +0 -189
- package/plugins/flow/agents/shared-test-fixer.md +0 -186
- package/plugins/flow/agents/shared-test-runner.md +0 -191
- package/plugins/flow/agents/shared-ui-classifier.md +0 -263
- package/plugins/flow/agents/shared-verification-orchestrator.md +0 -194
- package/plugins/flow/agents/shared-verification-runner.md +0 -140
- package/plugins/flow/agents/ui-a11y-validator.md +0 -305
- package/plugins/flow/agents/ui-screenshot-reporter.md +0 -329
- package/plugins/flow/agents/ui-web-designer.md +0 -214
- package/plugins/flow/scripts/compute-session-tokens.sh +0 -39
- package/plugins/flow/skills/a11y-audit/SKILL.md +0 -214
- package/plugins/flow/skills/angular-patterns/SKILL.md +0 -191
- package/plugins/flow/skills/browser-capture/SKILL.md +0 -238
- package/plugins/flow/skills/commit/SKILL.md +0 -259
- package/plugins/flow/skills/debug-helper/SKILL.md +0 -375
- package/plugins/flow/skills/impl/SKILL.md +0 -992
- package/plugins/flow/skills/linear-suggestion/SKILL.md +0 -132
- package/plugins/flow/skills/maia-files-delete/SKILL.md +0 -59
- package/plugins/flow/skills/maia-files-upload/SKILL.md +0 -57
- package/plugins/flow/skills/nx-conventions/SKILL.md +0 -326
- package/plugins/flow/skills/plan/SKILL.md +0 -1033
- package/plugins/flow/skills/push/SKILL.md +0 -759
- package/plugins/flow/skills/review/SKILL.md +0 -443
- package/plugins/flow/skills/test-e2e/SKILL.md +0 -161
- package/plugins/flow/skills/test-unit/SKILL.md +0 -456
- package/plugins/flow-external/.claude-plugin/README.md +0 -152
- package/plugins/flow-external/.claude-plugin/merge-permissions.js +0 -80
- package/plugins/flow-external/.claude-plugin/plugin.json +0 -5
- package/plugins/flow-external/.claude-plugin/settings.template.json +0 -78
- package/plugins/flow-external/agents/angular-component-scaffolder.md +0 -269
- package/plugins/flow-external/agents/angular-directive-builder.md +0 -130
- package/plugins/flow-external/agents/angular-guard-builder.md +0 -70
- package/plugins/flow-external/agents/angular-pipe-builder.md +0 -82
- package/plugins/flow-external/agents/angular-resolver-builder.md +0 -74
- package/plugins/flow-external/agents/angular-service-builder.md +0 -160
- package/plugins/flow-external/agents/angular-state-builder.md +0 -254
- package/plugins/flow-external/agents/shared-build-verifier.md +0 -67
- package/plugins/flow-external/agents/shared-impl-orchestrator.md +0 -88
- package/plugins/flow-external/agents/shared-impl-reporter.md +0 -135
- package/plugins/flow-external/agents/shared-linear-subtask-iterator.md +0 -70
- package/plugins/flow-external/agents/shared-ui-classifier.md +0 -38
- package/plugins/flow-external/agents/ui-web-designer.md +0 -179
- package/plugins/flow-external/scripts/compute-session-tokens.sh +0 -39
- package/plugins/flow-external/skills/a11y-audit/SKILL.md +0 -96
- package/plugins/flow-external/skills/angular-cli-conventions/SKILL.md +0 -267
- package/plugins/flow-external/skills/angular-patterns/SKILL.md +0 -170
- package/plugins/flow-external/skills/browser-capture/SKILL.md +0 -68
- package/plugins/flow-external/skills/commit/SKILL.md +0 -114
- package/plugins/flow-external/skills/debug-helper/SKILL.md +0 -131
- package/plugins/flow-external/skills/impl/SKILL.md +0 -217
- package/plugins/flow-external/skills/linear-suggestion/SKILL.md +0 -62
- package/plugins/flow-external/skills/maia-files-delete/SKILL.md +0 -34
- package/plugins/flow-external/skills/maia-files-upload/SKILL.md +0 -41
- package/plugins/flow-external/skills/plan/SKILL.md +0 -334
- package/plugins/flow-external/skills/push/SKILL.md +0 -232
- package/plugins/flow-legacy/.claude-plugin/README.md +0 -143
- package/plugins/flow-legacy/.claude-plugin/merge-permissions.js +0 -94
- package/plugins/flow-legacy/.claude-plugin/plugin.json +0 -5
- package/plugins/flow-legacy/.claude-plugin/settings.template.json +0 -79
- package/plugins/flow-legacy/agents/angular-component-scaffolder.md +0 -323
- package/plugins/flow-legacy/agents/angular-directive-builder.md +0 -258
- package/plugins/flow-legacy/agents/angular-guard-builder.md +0 -322
- package/plugins/flow-legacy/agents/angular-pipe-builder.md +0 -227
- package/plugins/flow-legacy/agents/angular-resolver-builder.md +0 -332
- package/plugins/flow-legacy/agents/angular-service-builder.md +0 -271
- package/plugins/flow-legacy/agents/angular-state-builder.md +0 -479
- package/plugins/flow-legacy/agents/shared-impl-orchestrator.md +0 -174
- package/plugins/flow-legacy/agents/shared-impl-reporter.md +0 -232
- package/plugins/flow-legacy/agents/shared-linear-subtask-iterator.md +0 -187
- package/plugins/flow-legacy/agents/shared-tdd-developer.md +0 -306
- package/plugins/flow-legacy/agents/shared-test-runner.md +0 -131
- package/plugins/flow-legacy/agents/shared-ui-classifier.md +0 -145
- package/plugins/flow-legacy/scripts/compute-session-tokens.sh +0 -39
- package/plugins/flow-legacy/skills/a11y-audit/SKILL.md +0 -214
- package/plugins/flow-legacy/skills/angular-patterns/SKILL.md +0 -346
- package/plugins/flow-legacy/skills/browser-capture/SKILL.md +0 -238
- package/plugins/flow-legacy/skills/commit/SKILL.md +0 -215
- package/plugins/flow-legacy/skills/debug-helper/SKILL.md +0 -395
- package/plugins/flow-legacy/skills/impl/SKILL.md +0 -710
- package/plugins/flow-legacy/skills/linear-suggestion/SKILL.md +0 -132
- package/plugins/flow-legacy/skills/maia-files-delete/SKILL.md +0 -59
- package/plugins/flow-legacy/skills/maia-files-upload/SKILL.md +0 -57
- package/plugins/flow-legacy/skills/nx-conventions/SKILL.md +0 -368
- package/plugins/flow-legacy/skills/plan/SKILL.md +0 -742
- package/plugins/flow-legacy/skills/push/SKILL.md +0 -645
- package/plugins/flow-legacy/skills/test-unit/SKILL.md +0 -500
|
@@ -1,215 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: commit
|
|
3
|
-
description: Create a conventional commit message based on Linear task and staged changes. Fetches task details, analyzes changes, generates commit message, and optionally runs parallelization analysis.
|
|
4
|
-
allowed-tools:
|
|
5
|
-
- Bash
|
|
6
|
-
- Read
|
|
7
|
-
- Glob
|
|
8
|
-
- Grep
|
|
9
|
-
- AskUserQuestion
|
|
10
|
-
- TaskCreate
|
|
11
|
-
- TaskUpdate
|
|
12
|
-
- TaskList
|
|
13
|
-
- TaskGet
|
|
14
|
-
- mcp__linear__get_issue
|
|
15
|
-
- mcp__linear__list_comments
|
|
16
|
-
---
|
|
17
|
-
|
|
18
|
-
# Commit Skill
|
|
19
|
-
|
|
20
|
-
Create a conventional commit message based on Linear task and staged changes.
|
|
21
|
-
|
|
22
|
-
## Usage
|
|
23
|
-
|
|
24
|
-
```
|
|
25
|
-
/commit [linearTaskId]
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
## Parameters
|
|
29
|
-
|
|
30
|
-
- `linearTaskId` - Linear task ID (e.g., ENG-123)
|
|
31
|
-
|
|
32
|
-
## Execution Checklist
|
|
33
|
-
|
|
34
|
-
Execute each step in order. Do not skip any step marked as MANDATORY.
|
|
35
|
-
|
|
36
|
-
- [ ] **1. Fetch Linear task** — get title, description, labels/type from MCP Linear server
|
|
37
|
-
- [ ] **2. Analyze staged changes** — run `git diff --cached` to understand scope
|
|
38
|
-
- [ ] **3. Verify completeness** — compare task requirements with staged changes; if incomplete, ask user whether to continue or stop
|
|
39
|
-
- [ ] **4. Read commitlint config** — read `commitlint.config.js` for valid scopes and format
|
|
40
|
-
- [ ] **5. Generate commit message** — draft `<type>(<scope>): <subject>` with body and `Refs: <linearTaskId>`
|
|
41
|
-
- [ ] **6. Show message to user** — present commit message for approval before proceeding
|
|
42
|
-
- [ ] **7. MANDATORY: Pre-commit preparation** — run `nvm use 18` (legacy Node.js version)
|
|
43
|
-
- [ ] **8. Create commit** — execute `git commit` with the approved message
|
|
44
|
-
- [ ] **9. Parallelization analysis (optional)** — fetch Linear comments, search for orchestration plan, delegate to `shared-parallelization-analyzer` if found
|
|
45
|
-
|
|
46
|
-
### Task Progress Tracking
|
|
47
|
-
|
|
48
|
-
**MANDATORY**: Use Claude Code's built-in task tracking to provide real-time progress visibility.
|
|
49
|
-
|
|
50
|
-
**Task naming convention**: Every task subject MUST be prefixed with the Linear task ID:
|
|
51
|
-
|
|
52
|
-
```
|
|
53
|
-
<linearTaskId> <step description>
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
**At skill start**: Create tasks for each checklist step using `TaskCreate`:
|
|
57
|
-
|
|
58
|
-
```
|
|
59
|
-
TaskCreate({
|
|
60
|
-
subject: "MM-123 Fetch Linear task",
|
|
61
|
-
description: "Get title, description, labels/type from MCP Linear server",
|
|
62
|
-
activeForm: "MM-123 Fetching Linear task"
|
|
63
|
-
})
|
|
64
|
-
TaskCreate({
|
|
65
|
-
subject: "MM-123 Analyze staged changes",
|
|
66
|
-
description: "Run git diff --cached to understand scope",
|
|
67
|
-
activeForm: "MM-123 Analyzing staged changes"
|
|
68
|
-
})
|
|
69
|
-
```
|
|
70
|
-
|
|
71
|
-
**During execution**:
|
|
72
|
-
|
|
73
|
-
- Before starting a step → `TaskUpdate({ taskId, status: "in_progress" })`
|
|
74
|
-
- After completing a step → `TaskUpdate({ taskId, status: "completed" })`
|
|
75
|
-
|
|
76
|
-
**At checkpoints**: Use `TaskList` to review overall progress before presenting status to user.
|
|
77
|
-
|
|
78
|
-
## Instructions
|
|
79
|
-
|
|
80
|
-
You are tasked with creating a git commit based on a Linear task and staged changes.
|
|
81
|
-
|
|
82
|
-
### Step 1: Fetch Linear Task Details
|
|
83
|
-
|
|
84
|
-
Use the MCP Linear server to fetch task details for the provided `linearTaskId`. Extract:
|
|
85
|
-
|
|
86
|
-
- Task title
|
|
87
|
-
- Task description
|
|
88
|
-
- Task labels/type (bug, feature, improve etc.)
|
|
89
|
-
|
|
90
|
-
### Step 2: Analyze Staged Changes
|
|
91
|
-
|
|
92
|
-
Run `git diff --cached` to see what files have been changed and understand the scope of changes.
|
|
93
|
-
|
|
94
|
-
### Step 2.5: Verify Implementation Completeness
|
|
95
|
-
|
|
96
|
-
Before proceeding with the commit, verify that all requirements from the Linear task have been implemented:
|
|
97
|
-
|
|
98
|
-
1. **Compare task requirements with actual changes**:
|
|
99
|
-
|
|
100
|
-
- Review the Linear task description and acceptance criteria
|
|
101
|
-
- Analyze the staged changes from `git diff --cached`
|
|
102
|
-
- Identify any requirements from the task that are not reflected in the code changes
|
|
103
|
-
|
|
104
|
-
2. **Ask user if implementation is incomplete**:
|
|
105
|
-
|
|
106
|
-
- If any task requirements appear to be missing from the staged changes, use `AskUserQuestion` to ask the user:
|
|
107
|
-
- Option 1: "Continue with commit" (Proceed with committing only the current changes)
|
|
108
|
-
- Option 2: "Complete implementation first" (Recommended) - Stop the commit process so user can implement missing requirements
|
|
109
|
-
|
|
110
|
-
3. **Handle user decision**:
|
|
111
|
-
- If user chooses "Continue with commit": Proceed to Step 3
|
|
112
|
-
- If user chooses "Complete implementation first": Stop the commit process and inform the user about what's missing
|
|
113
|
-
|
|
114
|
-
**Note**: This verification step helps ensure commits are complete and aligned with task requirements, reducing the need for follow-up commits.
|
|
115
|
-
|
|
116
|
-
### Step 3: Read Commitlint Configuration
|
|
117
|
-
|
|
118
|
-
Read the `commitlint.config.js` file to understand:
|
|
119
|
-
|
|
120
|
-
- Available scopes (from the `scope-enum` rule)
|
|
121
|
-
- Commit message format requirements
|
|
122
|
-
|
|
123
|
-
### Step 4: Generate Commit Message
|
|
124
|
-
|
|
125
|
-
Based on the Linear task details and code changes, generate a commit message following conventional commits format:
|
|
126
|
-
|
|
127
|
-
```
|
|
128
|
-
<type>(<scope>): <subject>
|
|
129
|
-
|
|
130
|
-
<body>
|
|
131
|
-
|
|
132
|
-
Refs: <linearTaskId>
|
|
133
|
-
```
|
|
134
|
-
|
|
135
|
-
Where:
|
|
136
|
-
|
|
137
|
-
- **type**: Choose from: `feat`, `fix`, `refactor`, `test`, `docs`, `chore`, `build`, `ci`, `perf`, `style`
|
|
138
|
-
- Use task labels/type to determine (bug → fix, feature → feat, etc.)
|
|
139
|
-
- **scope**: Select from available scopes in commitlint.config.js based on changed files
|
|
140
|
-
- If multiple scopes affected, choose the primary one or use a general scope
|
|
141
|
-
- The scope must be one of the valid scopes from commitlint config
|
|
142
|
-
- **subject**: Brief description (use Linear task title as base, keep under 72 chars)
|
|
143
|
-
- **body**: Optional detailed explanation if needed (from task description or complex changes)
|
|
144
|
-
- **footer**: Always include `Refs: <linearTaskId>` to link to Linear task
|
|
145
|
-
|
|
146
|
-
### Step 4.5: Pre-commit Preparation (Mandatory)
|
|
147
|
-
|
|
148
|
-
Before creating the commit, **always** run the following commands:
|
|
149
|
-
|
|
150
|
-
1. **Switch to Node.js 18** (legacy projects use Node 18):
|
|
151
|
-
|
|
152
|
-
```bash
|
|
153
|
-
source ~/.nvm/nvm.sh && nvm use 18
|
|
154
|
-
```
|
|
155
|
-
|
|
156
|
-
### Step 5: Create Commit
|
|
157
|
-
|
|
158
|
-
Execute the commit with the generated message:
|
|
159
|
-
|
|
160
|
-
```bash
|
|
161
|
-
git commit -m "<type>(<scope>): <subject>" -m "<body>" -m "Refs: <linearTaskId>"
|
|
162
|
-
```
|
|
163
|
-
|
|
164
|
-
### Step 6: Post-Commit Parallelization Analysis (Optional)
|
|
165
|
-
|
|
166
|
-
After the commit is created, perform an optional parallelization analysis:
|
|
167
|
-
|
|
168
|
-
1. **Fetch Linear comments** for the task using the MCP Linear server
|
|
169
|
-
2. **Search for `🎭 Agent Orchestration Plan` blocks** in the comments
|
|
170
|
-
3. **If found**: Delegate analysis to `shared-parallelization-analyzer` agent:
|
|
171
|
-
|
|
172
|
-
```
|
|
173
|
-
Analyze orchestration plan for parallelization opportunities:
|
|
174
|
-
- Linear Task ID: [linearTaskId]
|
|
175
|
-
- Orchestration Plan: [the 🎭 Agent Orchestration Plan block content]
|
|
176
|
-
```
|
|
177
|
-
|
|
178
|
-
The agent will:
|
|
179
|
-
|
|
180
|
-
- Parse the orchestration plan (agents table, execution flow, TDD cycles)
|
|
181
|
-
- Build a dependency graph from file I/O analysis
|
|
182
|
-
- Identify false sequential dependencies and parallelization opportunities
|
|
183
|
-
- Generate a console report with current vs proposed execution
|
|
184
|
-
|
|
185
|
-
4. **If not found**: Skip silently — no message needed (common for hotfixes, config-only commits)
|
|
186
|
-
|
|
187
|
-
**IMPORTANT**:
|
|
188
|
-
|
|
189
|
-
- This step is **non-blocking** and **advisory only**
|
|
190
|
-
- The analysis report is shown to the user in the console but is NOT auto-applied
|
|
191
|
-
- Recurring orchestrator improvement suggestions (if any) are filed as Linear issues in the "MobileMS Framework" project via `linear-suggestion` skill — no user interaction required
|
|
192
|
-
- A commit failure or missing orchestration plan should never cause this step to error
|
|
193
|
-
|
|
194
|
-
### Guidelines
|
|
195
|
-
|
|
196
|
-
1. Keep the subject line concise and imperative mood
|
|
197
|
-
2. Choose the most appropriate type based on task nature and code changes
|
|
198
|
-
3. Select scope based on the primary area of code changes
|
|
199
|
-
4. If task type is unclear, analyze the code changes to determine type
|
|
200
|
-
5. Always include the Linear task reference in the footer
|
|
201
|
-
6. If there are no staged changes, warn the user and don't create commit
|
|
202
|
-
7. After a successful commit, run the optional parallelization analysis (Step 6) to surface optimization opportunities from the orchestration plan. Recurring patterns are filed as Linear issues automatically via `linear-suggestion` skill
|
|
203
|
-
|
|
204
|
-
### Example
|
|
205
|
-
|
|
206
|
-
For Linear task "ENG-123: Add dark mode toggle to settings":
|
|
207
|
-
|
|
208
|
-
- Type: `feat` (new feature)
|
|
209
|
-
- Scope: `shared-angular` (if changes are in libs/shared/angular)
|
|
210
|
-
- Subject: "add dark mode toggle to settings"
|
|
211
|
-
- Result: `feat(shared-angular): add dark mode toggle to settings`
|
|
212
|
-
|
|
213
|
-
---
|
|
214
|
-
|
|
215
|
-
**Important**: Before committing, show the generated commit message to the user for approval.
|
|
@@ -1,395 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: debug-helper
|
|
3
|
-
description: Cross-stack debugging workflows for Angular 14, NestJS, and MongoDB applications
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# Debug Helper (Angular 14 Legacy)
|
|
7
|
-
|
|
8
|
-
This skill provides debugging workflows and techniques for Angular 14 legacy projects.
|
|
9
|
-
|
|
10
|
-
## 1. Angular 14 Debugging
|
|
11
|
-
|
|
12
|
-
### Component Not Rendering
|
|
13
|
-
|
|
14
|
-
1. **Check selector usage**
|
|
15
|
-
|
|
16
|
-
```typescript
|
|
17
|
-
// Verify selector matches
|
|
18
|
-
@Component({ selector: 'app-my-component' })
|
|
19
|
-
// Template: <app-my-component></app-my-component>
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
2. **Check module declarations**
|
|
23
|
-
|
|
24
|
-
```typescript
|
|
25
|
-
@NgModule({
|
|
26
|
-
declarations: [MyComponent], // Is it declared?
|
|
27
|
-
exports: [MyComponent], // Is it exported (if used outside)?
|
|
28
|
-
})
|
|
29
|
-
export class FeatureModule {}
|
|
30
|
-
```
|
|
31
|
-
|
|
32
|
-
3. **Check module imports**
|
|
33
|
-
```typescript
|
|
34
|
-
@NgModule({
|
|
35
|
-
imports: [FeatureModule], // Is feature module imported?
|
|
36
|
-
})
|
|
37
|
-
export class AppModule {}
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
### BehaviorSubject/Observable Issues
|
|
41
|
-
|
|
42
|
-
1. **BehaviorSubject not updating view**
|
|
43
|
-
|
|
44
|
-
```typescript
|
|
45
|
-
// Wrong: mutating array directly
|
|
46
|
-
const items = this._items.getValue();
|
|
47
|
-
items.push(newItem); // Won't trigger update
|
|
48
|
-
this._items.next(items);
|
|
49
|
-
|
|
50
|
-
// Correct: create new reference
|
|
51
|
-
const items = this._items.getValue();
|
|
52
|
-
this._items.next([...items, newItem]);
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
2. **Subscription not receiving values**
|
|
56
|
-
|
|
57
|
-
```typescript
|
|
58
|
-
// Ensure subscription is active
|
|
59
|
-
ngOnInit(): void {
|
|
60
|
-
this.items$ = this.stateService.items$;
|
|
61
|
-
|
|
62
|
-
// Debug: log values
|
|
63
|
-
this.items$.pipe(
|
|
64
|
-
tap(items => console.log('Items received:', items)),
|
|
65
|
-
takeUntil(this.destroy$)
|
|
66
|
-
).subscribe();
|
|
67
|
-
}
|
|
68
|
-
```
|
|
69
|
-
|
|
70
|
-
3. **Memory leak from subscriptions**
|
|
71
|
-
|
|
72
|
-
```typescript
|
|
73
|
-
// Always unsubscribe with takeUntil pattern
|
|
74
|
-
private readonly destroy$ = new Subject<void>();
|
|
75
|
-
|
|
76
|
-
ngOnInit(): void {
|
|
77
|
-
this.service.data$
|
|
78
|
-
.pipe(takeUntil(this.destroy$))
|
|
79
|
-
.subscribe(data => this.data = data);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
ngOnDestroy(): void {
|
|
83
|
-
this.destroy$.next();
|
|
84
|
-
this.destroy$.complete();
|
|
85
|
-
}
|
|
86
|
-
```
|
|
87
|
-
|
|
88
|
-
### Change Detection Issues
|
|
89
|
-
|
|
90
|
-
```typescript
|
|
91
|
-
// Force change detection (use sparingly)
|
|
92
|
-
constructor(private cdr: ChangeDetectorRef) {}
|
|
93
|
-
|
|
94
|
-
// After async operation
|
|
95
|
-
this.cdr.detectChanges();
|
|
96
|
-
|
|
97
|
-
// Or mark for check (OnPush)
|
|
98
|
-
this.cdr.markForCheck();
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
### HTTP Debugging (Angular 14)
|
|
102
|
-
|
|
103
|
-
```typescript
|
|
104
|
-
// HTTP interceptor for logging
|
|
105
|
-
@Injectable()
|
|
106
|
-
export class LoggingInterceptor implements HttpInterceptor {
|
|
107
|
-
intercept(
|
|
108
|
-
req: HttpRequest<any>,
|
|
109
|
-
next: HttpHandler,
|
|
110
|
-
): Observable<HttpEvent<any>> {
|
|
111
|
-
console.log('Request:', req.method, req.url);
|
|
112
|
-
|
|
113
|
-
return next.handle(req).pipe(
|
|
114
|
-
tap({
|
|
115
|
-
next: (event) => {
|
|
116
|
-
if (event instanceof HttpResponse) {
|
|
117
|
-
console.log('Response:', event.status, event.body);
|
|
118
|
-
}
|
|
119
|
-
},
|
|
120
|
-
error: (error) => console.error('HTTP Error:', error),
|
|
121
|
-
}),
|
|
122
|
-
);
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
// Register in module
|
|
127
|
-
@NgModule({
|
|
128
|
-
providers: [
|
|
129
|
-
{ provide: HTTP_INTERCEPTORS, useClass: LoggingInterceptor, multi: true },
|
|
130
|
-
],
|
|
131
|
-
})
|
|
132
|
-
export class AppModule {}
|
|
133
|
-
```
|
|
134
|
-
|
|
135
|
-
### Template Debugging
|
|
136
|
-
|
|
137
|
-
```html
|
|
138
|
-
<!-- Debug in template with json pipe -->
|
|
139
|
-
<pre>{{ data | json }}</pre>
|
|
140
|
-
|
|
141
|
-
<!-- Debug *ngIf condition -->
|
|
142
|
-
<p>isLoading: {{ isLoading }}</p>
|
|
143
|
-
<p>items.length: {{ items?.length }}</p>
|
|
144
|
-
|
|
145
|
-
<!-- Debug *ngFor -->
|
|
146
|
-
<div *ngFor="let item of items; let i = index">{{ i }}: {{ item | json }}</div>
|
|
147
|
-
```
|
|
148
|
-
|
|
149
|
-
### Browser DevTools
|
|
150
|
-
|
|
151
|
-
1. **Angular DevTools** - Install Chrome extension (works with Angular 14)
|
|
152
|
-
2. **Component inspector** - Click "Components" tab
|
|
153
|
-
3. **Profiler** - Record change detection cycles
|
|
154
|
-
4. **Network tab** - Check API calls
|
|
155
|
-
|
|
156
|
-
## 2. NestJS Debugging
|
|
157
|
-
|
|
158
|
-
### Request Not Reaching Controller
|
|
159
|
-
|
|
160
|
-
1. **Check route path**
|
|
161
|
-
|
|
162
|
-
```typescript
|
|
163
|
-
@Controller('features') // /features
|
|
164
|
-
@Get(':id') // /features/:id
|
|
165
|
-
```
|
|
166
|
-
|
|
167
|
-
2. **Check module imports**
|
|
168
|
-
|
|
169
|
-
```typescript
|
|
170
|
-
@Module({
|
|
171
|
-
imports: [FeatureModule], // Is module imported?
|
|
172
|
-
})
|
|
173
|
-
export class AppModule {}
|
|
174
|
-
```
|
|
175
|
-
|
|
176
|
-
3. **Check guards/interceptors**
|
|
177
|
-
```typescript
|
|
178
|
-
@UseGuards(AuthGuard) // Is guard blocking?
|
|
179
|
-
```
|
|
180
|
-
|
|
181
|
-
### Dependency Injection Errors
|
|
182
|
-
|
|
183
|
-
```
|
|
184
|
-
Error: Nest can't resolve dependencies of FeatureService
|
|
185
|
-
```
|
|
186
|
-
|
|
187
|
-
**Solutions:**
|
|
188
|
-
|
|
189
|
-
1. Check provider is in module
|
|
190
|
-
|
|
191
|
-
```typescript
|
|
192
|
-
@Module({
|
|
193
|
-
providers: [FeatureService, FeatureRepository],
|
|
194
|
-
})
|
|
195
|
-
```
|
|
196
|
-
|
|
197
|
-
2. Check circular dependencies
|
|
198
|
-
|
|
199
|
-
```typescript
|
|
200
|
-
// Use forwardRef
|
|
201
|
-
@Inject(forwardRef(() => OtherService))
|
|
202
|
-
private readonly other: OtherService,
|
|
203
|
-
```
|
|
204
|
-
|
|
205
|
-
3. Check module exports
|
|
206
|
-
```typescript
|
|
207
|
-
@Module({
|
|
208
|
-
providers: [SharedService],
|
|
209
|
-
exports: [SharedService], // Must export if used elsewhere
|
|
210
|
-
})
|
|
211
|
-
```
|
|
212
|
-
|
|
213
|
-
### Logging
|
|
214
|
-
|
|
215
|
-
```typescript
|
|
216
|
-
import { Logger } from '@nestjs/common';
|
|
217
|
-
|
|
218
|
-
@Injectable()
|
|
219
|
-
export class FeatureService {
|
|
220
|
-
private readonly logger = new Logger(FeatureService.name);
|
|
221
|
-
|
|
222
|
-
async findAll() {
|
|
223
|
-
this.logger.log('Finding all features');
|
|
224
|
-
this.logger.debug('Debug info');
|
|
225
|
-
this.logger.warn('Warning');
|
|
226
|
-
this.logger.error('Error occurred', error.stack);
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
```
|
|
230
|
-
|
|
231
|
-
## 3. MongoDB/Mongoose Debugging
|
|
232
|
-
|
|
233
|
-
### Connection Issues
|
|
234
|
-
|
|
235
|
-
```typescript
|
|
236
|
-
// Log connection events
|
|
237
|
-
mongoose.connection.on('connected', () => console.log('MongoDB connected'));
|
|
238
|
-
mongoose.connection.on('error', (err) => console.error('MongoDB error:', err));
|
|
239
|
-
mongoose.connection.on('disconnected', () =>
|
|
240
|
-
console.log('MongoDB disconnected'),
|
|
241
|
-
);
|
|
242
|
-
```
|
|
243
|
-
|
|
244
|
-
### Query Debugging
|
|
245
|
-
|
|
246
|
-
```typescript
|
|
247
|
-
// Enable Mongoose debug mode
|
|
248
|
-
mongoose.set('debug', true);
|
|
249
|
-
|
|
250
|
-
// Or for specific query
|
|
251
|
-
const result = await this.model.find({ status: 'active' });
|
|
252
|
-
console.log('Query:', this.model.find({ status: 'active' }).getQuery());
|
|
253
|
-
```
|
|
254
|
-
|
|
255
|
-
## 4. Common Debugging Patterns
|
|
256
|
-
|
|
257
|
-
### Console Debugging
|
|
258
|
-
|
|
259
|
-
```typescript
|
|
260
|
-
// Temporary debug logs (remove before commit)
|
|
261
|
-
console.log('DEBUG:', variable);
|
|
262
|
-
console.table(arrayOfObjects);
|
|
263
|
-
console.group('Group');
|
|
264
|
-
console.log('Item 1');
|
|
265
|
-
console.log('Item 2');
|
|
266
|
-
console.groupEnd();
|
|
267
|
-
console.time('Operation');
|
|
268
|
-
// ... operation
|
|
269
|
-
console.timeEnd('Operation');
|
|
270
|
-
```
|
|
271
|
-
|
|
272
|
-
### Breakpoint Debugging
|
|
273
|
-
|
|
274
|
-
```typescript
|
|
275
|
-
// Add debugger statement
|
|
276
|
-
function processData(data: Data) {
|
|
277
|
-
debugger; // Execution pauses here in DevTools
|
|
278
|
-
return transform(data);
|
|
279
|
-
}
|
|
280
|
-
```
|
|
281
|
-
|
|
282
|
-
### VS Code Launch Configuration (Angular 14 / Nx 14)
|
|
283
|
-
|
|
284
|
-
```json
|
|
285
|
-
// .vscode/launch.json
|
|
286
|
-
{
|
|
287
|
-
"version": "0.2.0",
|
|
288
|
-
"configurations": [
|
|
289
|
-
{
|
|
290
|
-
"type": "node",
|
|
291
|
-
"request": "launch",
|
|
292
|
-
"name": "Debug NestJS",
|
|
293
|
-
"runtimeArgs": ["-r", "ts-node/register"],
|
|
294
|
-
"args": ["${workspaceFolder}/apps/api/src/main.ts"],
|
|
295
|
-
"cwd": "${workspaceFolder}"
|
|
296
|
-
},
|
|
297
|
-
{
|
|
298
|
-
"type": "chrome",
|
|
299
|
-
"request": "launch",
|
|
300
|
-
"name": "Debug Angular",
|
|
301
|
-
"url": "http://localhost:4200",
|
|
302
|
-
"webRoot": "${workspaceFolder}/apps/web/src"
|
|
303
|
-
}
|
|
304
|
-
]
|
|
305
|
-
}
|
|
306
|
-
```
|
|
307
|
-
|
|
308
|
-
## 5. Error Investigation Workflow
|
|
309
|
-
|
|
310
|
-
### Step 1: Reproduce
|
|
311
|
-
|
|
312
|
-
- Get exact steps to reproduce
|
|
313
|
-
- Note environment (browser, Node version - should be Node 18)
|
|
314
|
-
|
|
315
|
-
### Step 2: Isolate
|
|
316
|
-
|
|
317
|
-
- Identify component/service causing issue
|
|
318
|
-
- Check if issue is frontend, backend, or database
|
|
319
|
-
|
|
320
|
-
### Step 3: Trace
|
|
321
|
-
|
|
322
|
-
- Add logging at key points
|
|
323
|
-
- Use debugger to step through code
|
|
324
|
-
- Check network requests/responses
|
|
325
|
-
|
|
326
|
-
### Step 4: Root Cause
|
|
327
|
-
|
|
328
|
-
- Identify the actual cause (not symptoms)
|
|
329
|
-
- Document findings
|
|
330
|
-
|
|
331
|
-
### Step 5: Fix & Verify
|
|
332
|
-
|
|
333
|
-
- Apply fix
|
|
334
|
-
- Write test that catches the bug
|
|
335
|
-
- Verify fix doesn't introduce regressions
|
|
336
|
-
|
|
337
|
-
## 6. Quick Fixes (Angular 14)
|
|
338
|
-
|
|
339
|
-
### "Cannot read property of undefined"
|
|
340
|
-
|
|
341
|
-
```typescript
|
|
342
|
-
// Use optional chaining
|
|
343
|
-
const name = user?.profile?.name;
|
|
344
|
-
|
|
345
|
-
// With nullish coalescing
|
|
346
|
-
const name = user?.profile?.name ?? 'Unknown';
|
|
347
|
-
|
|
348
|
-
// In templates (Angular 14)
|
|
349
|
-
{
|
|
350
|
-
{
|
|
351
|
-
user?.profile?.name;
|
|
352
|
-
}
|
|
353
|
-
}
|
|
354
|
-
```
|
|
355
|
-
|
|
356
|
-
### "Expression has changed after it was checked"
|
|
357
|
-
|
|
358
|
-
```typescript
|
|
359
|
-
// Option 1: setTimeout
|
|
360
|
-
ngAfterViewInit(): void {
|
|
361
|
-
setTimeout(() => this.value = newValue);
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
// Option 2: ChangeDetectorRef
|
|
365
|
-
ngAfterViewInit(): void {
|
|
366
|
-
this.value = newValue;
|
|
367
|
-
this.cdr.detectChanges();
|
|
368
|
-
}
|
|
369
|
-
```
|
|
370
|
-
|
|
371
|
-
### "Circular dependency detected"
|
|
372
|
-
|
|
373
|
-
```typescript
|
|
374
|
-
// Use forwardRef
|
|
375
|
-
@Inject(forwardRef(() => ServiceB))
|
|
376
|
-
private serviceB: ServiceB
|
|
377
|
-
|
|
378
|
-
// Or refactor to remove circular dependency
|
|
379
|
-
```
|
|
380
|
-
|
|
381
|
-
### "NullInjectorError: No provider for X"
|
|
382
|
-
|
|
383
|
-
```typescript
|
|
384
|
-
// Check module providers
|
|
385
|
-
@NgModule({
|
|
386
|
-
providers: [MyService], // Add missing provider
|
|
387
|
-
})
|
|
388
|
-
export class AppModule {}
|
|
389
|
-
|
|
390
|
-
// Or check providedIn
|
|
391
|
-
@Injectable({
|
|
392
|
-
providedIn: 'root', // Or specific module
|
|
393
|
-
})
|
|
394
|
-
export class MyService {}
|
|
395
|
-
```
|