norn-cli 1.3.17 → 1.3.18

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.
@@ -0,0 +1,542 @@
1
+ "use strict";
2
+ /**
3
+ * Coverage Panel - Webview for displaying API coverage details
4
+ */
5
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ var desc = Object.getOwnPropertyDescriptor(m, k);
8
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
9
+ desc = { enumerable: true, get: function() { return m[k]; } };
10
+ }
11
+ Object.defineProperty(o, k2, desc);
12
+ }) : (function(o, m, k, k2) {
13
+ if (k2 === undefined) k2 = k;
14
+ o[k2] = m[k];
15
+ }));
16
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
17
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
18
+ }) : function(o, v) {
19
+ o["default"] = v;
20
+ });
21
+ var __importStar = (this && this.__importStar) || (function () {
22
+ var ownKeys = function(o) {
23
+ ownKeys = Object.getOwnPropertyNames || function (o) {
24
+ var ar = [];
25
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
26
+ return ar;
27
+ };
28
+ return ownKeys(o);
29
+ };
30
+ return function (mod) {
31
+ if (mod && mod.__esModule) return mod;
32
+ var result = {};
33
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
34
+ __setModuleDefault(result, mod);
35
+ return result;
36
+ };
37
+ })();
38
+ Object.defineProperty(exports, "__esModule", { value: true });
39
+ exports.CoveragePanel = void 0;
40
+ const vscode = __importStar(require("vscode"));
41
+ class CoveragePanel {
42
+ static currentPanel;
43
+ _panel;
44
+ _disposables = [];
45
+ constructor(panel) {
46
+ this._panel = panel;
47
+ this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
48
+ }
49
+ static show(coverage) {
50
+ const column = vscode.ViewColumn.Beside;
51
+ if (CoveragePanel.currentPanel) {
52
+ CoveragePanel.currentPanel._panel.reveal(column);
53
+ CoveragePanel.currentPanel._update(coverage);
54
+ return;
55
+ }
56
+ const panel = vscode.window.createWebviewPanel('nornCoverage', 'API Coverage', column, {
57
+ enableScripts: true,
58
+ retainContextWhenHidden: true,
59
+ });
60
+ CoveragePanel.currentPanel = new CoveragePanel(panel);
61
+ CoveragePanel.currentPanel._update(coverage);
62
+ }
63
+ dispose() {
64
+ CoveragePanel.currentPanel = undefined;
65
+ this._panel.dispose();
66
+ while (this._disposables.length) {
67
+ const d = this._disposables.pop();
68
+ if (d) {
69
+ d.dispose();
70
+ }
71
+ }
72
+ }
73
+ _update(coverage) {
74
+ this._panel.title = `API Coverage: ${coverage.percentage}%`;
75
+ this._panel.webview.html = this._getHtmlContent(coverage);
76
+ // Handle messages from webview
77
+ this._panel.webview.onDidReceiveMessage(async (message) => {
78
+ switch (message.type) {
79
+ case 'refresh':
80
+ vscode.commands.executeCommand('norn.refreshCoverage');
81
+ break;
82
+ }
83
+ }, null, this._disposables);
84
+ }
85
+ /**
86
+ * Update the panel content (called when coverage is refreshed)
87
+ */
88
+ static updateContent(coverage) {
89
+ if (CoveragePanel.currentPanel) {
90
+ CoveragePanel.currentPanel._update(coverage);
91
+ }
92
+ }
93
+ _getHtmlContent(coverage) {
94
+ return /*html*/ `
95
+ <!DOCTYPE html>
96
+ <html lang="en">
97
+ <head>
98
+ <meta charset="UTF-8">
99
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
100
+ <title>API Coverage</title>
101
+ <style>
102
+ * { box-sizing: border-box; }
103
+
104
+ body {
105
+ font-family: var(--vscode-font-family);
106
+ font-size: var(--vscode-font-size);
107
+ color: var(--vscode-foreground);
108
+ background-color: var(--vscode-editor-background);
109
+ padding: 0;
110
+ margin: 0;
111
+ }
112
+
113
+ .container { padding: 16px; }
114
+
115
+ /* Header with overall stats */
116
+ .coverage-header {
117
+ display: flex;
118
+ align-items: center;
119
+ gap: 16px;
120
+ padding: 20px;
121
+ background: var(--vscode-editor-inactiveSelectionBackground);
122
+ border-radius: 8px;
123
+ margin-bottom: 20px;
124
+ }
125
+
126
+ .coverage-title {
127
+ font-size: 1.3em;
128
+ font-weight: bold;
129
+ }
130
+
131
+ .coverage-percentage {
132
+ font-size: 2em;
133
+ font-weight: bold;
134
+ margin-left: auto;
135
+ }
136
+
137
+ .coverage-percentage.high { color: #4ec9b0; }
138
+ .coverage-percentage.medium { color: #cca700; }
139
+ .coverage-percentage.low { color: #f14c4c; }
140
+
141
+ .coverage-stats {
142
+ color: var(--vscode-descriptionForeground);
143
+ font-size: 0.9em;
144
+ }
145
+
146
+ /* Progress bar */
147
+ .progress-container {
148
+ margin: 16px 0;
149
+ }
150
+
151
+ .progress-bar {
152
+ height: 8px;
153
+ background: var(--vscode-progressBar-background, #0e70c0);
154
+ border-radius: 4px;
155
+ transition: width 0.3s ease;
156
+ }
157
+
158
+ .progress-track {
159
+ height: 8px;
160
+ background: var(--vscode-input-background);
161
+ border-radius: 4px;
162
+ overflow: hidden;
163
+ }
164
+
165
+ /* Refresh button */
166
+ .refresh-btn {
167
+ background: var(--vscode-button-background);
168
+ color: var(--vscode-button-foreground);
169
+ border: none;
170
+ padding: 8px 16px;
171
+ border-radius: 4px;
172
+ cursor: pointer;
173
+ font-family: var(--vscode-font-family);
174
+ font-size: var(--vscode-font-size);
175
+ display: flex;
176
+ align-items: center;
177
+ gap: 6px;
178
+ }
179
+
180
+ .refresh-btn:hover {
181
+ background: var(--vscode-button-hoverBackground);
182
+ }
183
+
184
+ /* Spec sections */
185
+ .spec-section {
186
+ margin-bottom: 24px;
187
+ }
188
+
189
+ .spec-header {
190
+ display: flex;
191
+ align-items: center;
192
+ gap: 12px;
193
+ padding: 12px 16px;
194
+ background: var(--vscode-sideBar-background, var(--vscode-editor-inactiveSelectionBackground));
195
+ border-radius: 6px;
196
+ margin-bottom: 12px;
197
+ cursor: pointer;
198
+ }
199
+
200
+ .spec-header:hover {
201
+ background: var(--vscode-list-hoverBackground);
202
+ }
203
+
204
+ .spec-title {
205
+ font-weight: bold;
206
+ flex: 1;
207
+ }
208
+
209
+ .spec-url {
210
+ font-family: var(--vscode-editor-font-family);
211
+ font-size: 0.85em;
212
+ color: var(--vscode-descriptionForeground);
213
+ max-width: 300px;
214
+ overflow: hidden;
215
+ text-overflow: ellipsis;
216
+ white-space: nowrap;
217
+ }
218
+
219
+ .spec-coverage {
220
+ font-weight: bold;
221
+ padding: 4px 12px;
222
+ border-radius: 4px;
223
+ }
224
+
225
+ .spec-coverage.high { background: rgba(78, 201, 176, 0.2); color: #4ec9b0; }
226
+ .spec-coverage.medium { background: rgba(204, 167, 0, 0.2); color: #cca700; }
227
+ .spec-coverage.low { background: rgba(241, 76, 76, 0.2); color: #f14c4c; }
228
+
229
+ /* Tag groups */
230
+ .tag-group {
231
+ margin-bottom: 16px;
232
+ }
233
+
234
+ .tag-header {
235
+ display: flex;
236
+ align-items: center;
237
+ gap: 8px;
238
+ padding: 8px 12px;
239
+ background: var(--vscode-textBlockQuote-background);
240
+ border-radius: 4px;
241
+ margin-bottom: 8px;
242
+ cursor: pointer;
243
+ }
244
+
245
+ .tag-header:hover {
246
+ background: var(--vscode-list-hoverBackground);
247
+ }
248
+
249
+ .tag-name {
250
+ font-weight: 600;
251
+ text-transform: capitalize;
252
+ }
253
+
254
+ .tag-stats {
255
+ color: var(--vscode-descriptionForeground);
256
+ font-size: 0.9em;
257
+ margin-left: auto;
258
+ }
259
+
260
+ .expand-icon {
261
+ transition: transform 0.2s;
262
+ }
263
+
264
+ .expand-icon.collapsed {
265
+ transform: rotate(-90deg);
266
+ }
267
+
268
+ /* Endpoint items */
269
+ .endpoint-item {
270
+ border: 1px solid var(--vscode-panel-border);
271
+ border-radius: 6px;
272
+ margin-bottom: 8px;
273
+ overflow: hidden;
274
+ }
275
+
276
+ .endpoint-header {
277
+ display: flex;
278
+ align-items: center;
279
+ gap: 12px;
280
+ padding: 10px 12px;
281
+ background: var(--vscode-editor-inactiveSelectionBackground);
282
+ }
283
+
284
+ .endpoint-method {
285
+ font-family: var(--vscode-editor-font-family);
286
+ font-weight: bold;
287
+ padding: 2px 8px;
288
+ border-radius: 3px;
289
+ font-size: 0.85em;
290
+ min-width: 60px;
291
+ text-align: center;
292
+ }
293
+
294
+ .method-get { background: #61affe22; color: #61affe; }
295
+ .method-post { background: #49cc9022; color: #49cc90; }
296
+ .method-put { background: #fca13022; color: #fca130; }
297
+ .method-delete { background: #f9393922; color: #f93e3e; }
298
+ .method-patch { background: #50e3c222; color: #50e3c2; }
299
+ .method-head, .method-options { background: #9012fe22; color: #9012fe; }
300
+
301
+ .endpoint-path {
302
+ font-family: var(--vscode-editor-font-family);
303
+ flex: 1;
304
+ }
305
+
306
+ .endpoint-summary {
307
+ color: var(--vscode-descriptionForeground);
308
+ font-size: 0.85em;
309
+ max-width: 200px;
310
+ overflow: hidden;
311
+ text-overflow: ellipsis;
312
+ white-space: nowrap;
313
+ }
314
+
315
+ .endpoint-progress {
316
+ font-size: 0.85em;
317
+ color: var(--vscode-descriptionForeground);
318
+ }
319
+
320
+ /* Response codes */
321
+ .response-codes {
322
+ display: flex;
323
+ flex-wrap: wrap;
324
+ gap: 8px;
325
+ padding: 10px 12px;
326
+ background: var(--vscode-editor-background);
327
+ border-top: 1px solid var(--vscode-panel-border);
328
+ }
329
+
330
+ .response-code {
331
+ display: flex;
332
+ align-items: center;
333
+ gap: 6px;
334
+ padding: 4px 10px;
335
+ border-radius: 4px;
336
+ font-family: var(--vscode-editor-font-family);
337
+ font-size: 0.9em;
338
+ }
339
+
340
+ .response-code.covered {
341
+ background: rgba(78, 201, 176, 0.15);
342
+ border: 1px solid rgba(78, 201, 176, 0.3);
343
+ }
344
+
345
+ .response-code.uncovered {
346
+ background: rgba(241, 76, 76, 0.1);
347
+ border: 1px solid rgba(241, 76, 76, 0.2);
348
+ color: var(--vscode-descriptionForeground);
349
+ }
350
+
351
+ .code-icon {
352
+ font-size: 0.9em;
353
+ }
354
+
355
+ .code-icon.success { color: #4ec9b0; }
356
+ .code-icon.missing { color: #f14c4c; }
357
+
358
+ .code-value {
359
+ font-weight: bold;
360
+ }
361
+
362
+ .covered-by {
363
+ font-size: 0.8em;
364
+ color: var(--vscode-descriptionForeground);
365
+ margin-left: 4px;
366
+ }
367
+
368
+ /* Empty state */
369
+ .empty-state {
370
+ text-align: center;
371
+ padding: 48px 24px;
372
+ color: var(--vscode-descriptionForeground);
373
+ }
374
+
375
+ .empty-state-icon {
376
+ font-size: 3em;
377
+ margin-bottom: 16px;
378
+ }
379
+
380
+ .empty-state-title {
381
+ font-size: 1.2em;
382
+ font-weight: bold;
383
+ color: var(--vscode-foreground);
384
+ margin-bottom: 8px;
385
+ }
386
+
387
+ /* Collapsible content */
388
+ .collapsible-content {
389
+ overflow: hidden;
390
+ transition: max-height 0.3s ease;
391
+ }
392
+
393
+ .collapsible-content.collapsed {
394
+ max-height: 0 !important;
395
+ }
396
+ </style>
397
+ </head>
398
+ <body>
399
+ <div class="container">
400
+ ${this._renderHeader(coverage)}
401
+ ${coverage.hasSwagger ? this._renderSpecs(coverage) : this._renderEmptyState()}
402
+ </div>
403
+
404
+ <script>
405
+ const vscode = acquireVsCodeApi();
406
+
407
+ function refresh() {
408
+ vscode.postMessage({ type: 'refresh' });
409
+ }
410
+
411
+ function toggleSection(id) {
412
+ const content = document.getElementById(id);
413
+ const icon = document.getElementById(id + '-icon');
414
+ if (content && icon) {
415
+ content.classList.toggle('collapsed');
416
+ icon.classList.toggle('collapsed');
417
+ }
418
+ }
419
+ </script>
420
+ </body>
421
+ </html>`;
422
+ }
423
+ _renderHeader(coverage) {
424
+ const percentClass = coverage.percentage >= 80 ? 'high' : coverage.percentage >= 50 ? 'medium' : 'low';
425
+ return /*html*/ `
426
+ <div class="coverage-header">
427
+ <div>
428
+ <div class="coverage-title">API Coverage</div>
429
+ <div class="coverage-stats">${coverage.covered} of ${coverage.total} response codes covered</div>
430
+ <div class="progress-container">
431
+ <div class="progress-track">
432
+ <div class="progress-bar" style="width: ${coverage.percentage}%"></div>
433
+ </div>
434
+ </div>
435
+ </div>
436
+ <div class="coverage-percentage ${percentClass}">${coverage.percentage}%</div>
437
+ <button class="refresh-btn" onclick="refresh()">
438
+ ↻ Refresh
439
+ </button>
440
+ </div>`;
441
+ }
442
+ _renderSpecs(coverage) {
443
+ if (coverage.specs.length === 0) {
444
+ return this._renderEmptyState();
445
+ }
446
+ return coverage.specs.map((spec, index) => this._renderSpec(spec, index)).join('');
447
+ }
448
+ _renderSpec(spec, index) {
449
+ const percentClass = spec.percentage >= 80 ? 'high' : spec.percentage >= 50 ? 'medium' : 'low';
450
+ // Group endpoints by tag
451
+ const tagGroups = new Map();
452
+ for (const endpoint of spec.endpoints) {
453
+ if (!tagGroups.has(endpoint.tag)) {
454
+ tagGroups.set(endpoint.tag, []);
455
+ }
456
+ tagGroups.get(endpoint.tag).push(endpoint);
457
+ }
458
+ const tagsHtml = Array.from(tagGroups.entries())
459
+ .map(([tag, endpoints], tagIndex) => this._renderTagGroup(tag, endpoints, `spec-${index}-tag-${tagIndex}`))
460
+ .join('');
461
+ return /*html*/ `
462
+ <div class="spec-section">
463
+ <div class="spec-header" onclick="toggleSection('spec-${index}')">
464
+ <span class="expand-icon" id="spec-${index}-icon">▼</span>
465
+ <span class="spec-title">${this._escapeHtml(spec.swaggerTitle)}</span>
466
+ <span class="spec-url" title="${this._escapeHtml(spec.swaggerUrl)}">${this._escapeHtml(spec.swaggerUrl)}</span>
467
+ <span class="spec-coverage ${percentClass}">${spec.percentage}%</span>
468
+ </div>
469
+ <div class="collapsible-content" id="spec-${index}">
470
+ ${tagsHtml}
471
+ </div>
472
+ </div>`;
473
+ }
474
+ _renderTagGroup(tag, endpoints, id) {
475
+ const totalCodes = endpoints.reduce((sum, e) => sum + e.totalCodes, 0);
476
+ const coveredCodes = endpoints.reduce((sum, e) => sum + e.coveredCodes, 0);
477
+ const endpointsHtml = endpoints.map(e => this._renderEndpoint(e)).join('');
478
+ return /*html*/ `
479
+ <div class="tag-group">
480
+ <div class="tag-header" onclick="toggleSection('${id}')">
481
+ <span class="expand-icon" id="${id}-icon">▼</span>
482
+ <span class="tag-name">${this._escapeHtml(tag)}</span>
483
+ <span class="tag-stats">${coveredCodes}/${totalCodes} codes</span>
484
+ </div>
485
+ <div class="collapsible-content" id="${id}">
486
+ ${endpointsHtml}
487
+ </div>
488
+ </div>`;
489
+ }
490
+ _renderEndpoint(endpoint) {
491
+ const methodClass = `method-${endpoint.method.toLowerCase()}`;
492
+ const codesHtml = endpoint.responseCodes
493
+ .map(rc => {
494
+ const coveredClass = rc.covered ? 'covered' : 'uncovered';
495
+ const iconClass = rc.covered ? 'success' : 'missing';
496
+ const icon = rc.covered ? '✓' : '✗';
497
+ const coveredByText = rc.covered && rc.coveredBy.length > 0
498
+ ? `<span class="covered-by">via ${rc.coveredBy.join(', ')}</span>`
499
+ : '';
500
+ return /*html*/ `
501
+ <div class="response-code ${coveredClass}">
502
+ <span class="code-icon ${iconClass}">${icon}</span>
503
+ <span class="code-value">${rc.code}</span>
504
+ ${coveredByText}
505
+ </div>`;
506
+ })
507
+ .join('');
508
+ return /*html*/ `
509
+ <div class="endpoint-item">
510
+ <div class="endpoint-header">
511
+ <span class="endpoint-method ${methodClass}">${endpoint.method}</span>
512
+ <span class="endpoint-path">${this._escapeHtml(endpoint.path)}</span>
513
+ ${endpoint.summary ? `<span class="endpoint-summary" title="${this._escapeHtml(endpoint.summary)}">${this._escapeHtml(endpoint.summary)}</span>` : ''}
514
+ <span class="endpoint-progress">${endpoint.coveredCodes}/${endpoint.totalCodes}</span>
515
+ </div>
516
+ <div class="response-codes">
517
+ ${codesHtml}
518
+ </div>
519
+ </div>`;
520
+ }
521
+ _renderEmptyState() {
522
+ return /*html*/ `
523
+ <div class="empty-state">
524
+ <div class="empty-state-icon">📊</div>
525
+ <div class="empty-state-title">No Swagger Specs Found</div>
526
+ <div>Add a <code>swagger</code> statement to a .nornapi file to track API coverage.</div>
527
+ <div style="margin-top: 16px; font-family: var(--vscode-editor-font-family);">
528
+ swagger "https://api.example.com/swagger.json"
529
+ </div>
530
+ </div>`;
531
+ }
532
+ _escapeHtml(text) {
533
+ return text
534
+ .replace(/&/g, '&amp;')
535
+ .replace(/</g, '&lt;')
536
+ .replace(/>/g, '&gt;')
537
+ .replace(/"/g, '&quot;')
538
+ .replace(/'/g, '&#039;');
539
+ }
540
+ }
541
+ exports.CoveragePanel = CoveragePanel;
542
+ //# sourceMappingURL=coveragePanel.js.map