go/pkg/webview/angular.go

627 lines
15 KiB
Go
Raw Permalink Normal View History

feat: BugSETI app, WebSocket hub, browser automation, and MCP tools (#336) * feat: add security logging and fix framework regressions This commit implements comprehensive security event logging and resolves critical regressions in the core framework. Security Logging: - Enhanced `pkg/log` with a `Security` level and helper. - Added `log.Username()` to consistently identify the executing user. - Instrumented GitHub CLI auth, Agentic configuration, filesystem sandbox, MCP handlers, and MCP TCP transport with security logs. - Added `SecurityStyle` to the CLI for consistent visual representation of security events. UniFi Security (CodeQL): - Refactored `pkg/unifi` to remove hardcoded `InsecureSkipVerify`, resolving a high-severity alert. - Added a `--verify-tls` flag and configuration option to control TLS verification. - Updated command handlers to support the new verification parameter. Framework Fixes: - Restored original signatures for `MustServiceFor`, `Config()`, and `Display()` in `pkg/framework/core`, which had been corrupted during a merge. - Fixed `pkg/framework/framework.go` and `pkg/framework/core/runtime_pkg.go` to match the restored signatures. - These fixes resolve project-wide compilation errors caused by the signature mismatches. I encountered significant blockers due to a corrupted state of the `dev` branch after a merge, which introduced breaking changes in the core framework's DI system. I had to manually reconcile these signatures with the expected usage across the codebase to restore build stability. * feat(mcp): add RAG tools (query, ingest, collections) Add vector database tools to the MCP server for RAG operations: - rag_query: Search for relevant documentation using semantic similarity - rag_ingest: Ingest files or directories into the vector database - rag_collections: List available collections Uses existing internal/cmd/rag exports (QueryDocs, IngestDirectory, IngestFile) and pkg/rag for Qdrant client access. Default collection is "hostuk-docs" with topK=5 for queries. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat(mcp): add metrics tools (record, query) Add MCP tools for recording and querying AI/security metrics events. The metrics_record tool writes events to daily JSONL files, and the metrics_query tool provides aggregated statistics by type, repo, and agent. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat: add 'core mcp serve' command Add CLI command to start the MCP server for AI tool integration. - Create internal/cmd/mcpcmd package with serve subcommand - Support --workspace flag for directory restriction - Handle SIGINT/SIGTERM for clean shutdown - Register in full.go build variant Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat(ws): add WebSocket hub package for real-time streaming Add pkg/ws package implementing a hub pattern for WebSocket connections: - Hub manages client connections, broadcasts, and channel subscriptions - Client struct represents connected WebSocket clients - Message types: process_output, process_status, event, error, ping/pong - Channel-based subscription system (subscribe/unsubscribe) - SendProcessOutput and SendProcessStatus for process streaming integration - Full test coverage including concurrency tests Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat(mcp): add process management and WebSocket MCP tools Add MCP tools for process management: - process_start: Start a new external process - process_stop: Gracefully stop a running process - process_kill: Force kill a process - process_list: List all managed processes - process_output: Get captured process output - process_input: Send input to process stdin Add MCP tools for WebSocket: - ws_start: Start WebSocket server for real-time streaming - ws_info: Get hub statistics (clients, channels) Update Service struct with optional process.Service and ws.Hub fields, new WithProcessService and WithWSHub options, getter methods, and Shutdown method for cleanup. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat(webview): add browser automation package via Chrome DevTools Protocol Add pkg/webview package for browser automation: - webview.go: Main interface with Connect, Navigate, Click, Type, QuerySelector, Screenshot, Evaluate - cdp.go: Chrome DevTools Protocol WebSocket client implementation - actions.go: DOM action types (Click, Type, Hover, Scroll, etc.) and ActionSequence builder - console.go: Console message capture and filtering with ConsoleWatcher and ExceptionWatcher - angular.go: Angular-specific helpers for router navigation, component access, and Zone.js stability Add MCP tools for webview: - webview_connect/disconnect: Connection management - webview_navigate: Page navigation - webview_click/type/query/wait: DOM interaction - webview_console: Console output capture - webview_eval: JavaScript execution - webview_screenshot: Screenshot capture Add documentation: - docs/mcp/angular-testing.md: Guide for Angular application testing Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * docs: document new packages and BugSETI application - Update CLAUDE.md with documentation for: - pkg/ws (WebSocket hub for real-time streaming) - pkg/webview (Browser automation via CDP) - pkg/mcp (MCP server tools: process, ws, webview) - BugSETI application overview - Add comprehensive README for BugSETI with: - Installation and configuration guide - Usage workflow documentation - Architecture overview - Contributing guidelines Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * feat(bugseti): add BugSETI system tray app with auto-update BugSETI - Distributed Bug Fixing like SETI@home but for code Features: - System tray app with Wails v3 - GitHub issue fetching with label filters - Issue queue with priority management - AI context seeding via seed-agent-developer skill - Automated PR submission flow - Stats tracking and leaderboard - Cross-platform notifications - Self-updating with stable/beta/nightly channels Includes: - cmd/bugseti: Main application with Angular frontend - internal/bugseti: Core services (fetcher, queue, seeder, submit, config, stats, notify) - internal/bugseti/updater: Auto-update system (checker, downloader, installer) - .github/workflows/bugseti-release.yml: CI/CD for all platforms Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * fix: resolve import cycle and code duplication - Remove pkg/log import from pkg/io/local to break import cycle (pkg/log/rotation.go imports pkg/io, creating circular dependency) - Use stderr logging for security events in sandbox escape detection - Remove unused sync/atomic import from core.go - Fix duplicate LogSecurity function declarations in cli/log.go - Update workspace/service.go Crypt() call to match interface Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * fix: update tests for new function signatures and format code - Update core_test.go: Config(), Display() now panic instead of returning error - Update runtime_pkg_test.go: sr.Config() now panics instead of returning error - Update MustServiceFor tests to use assert.Panics - Format BugSETI, MCP tools, and webview packages with gofmt Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> --------- Co-authored-by: Snider <631881+Snider@users.noreply.github.com> Co-authored-by: Claude <developers@lethean.io> Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
2026-02-05 17:22:05 +00:00
package webview
import (
"context"
"fmt"
"time"
)
// AngularHelper provides Angular-specific testing utilities.
type AngularHelper struct {
wv *Webview
timeout time.Duration
}
// NewAngularHelper creates a new Angular helper for the webview.
func NewAngularHelper(wv *Webview) *AngularHelper {
return &AngularHelper{
wv: wv,
timeout: 30 * time.Second,
}
}
// SetTimeout sets the default timeout for Angular operations.
func (ah *AngularHelper) SetTimeout(d time.Duration) {
ah.timeout = d
}
// WaitForAngular waits for Angular to finish all pending operations.
// This includes HTTP requests, timers, and change detection.
func (ah *AngularHelper) WaitForAngular() error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
return ah.waitForAngular(ctx)
}
// waitForAngular implements the Angular wait logic.
func (ah *AngularHelper) waitForAngular(ctx context.Context) error {
// Check if Angular is present
isAngular, err := ah.isAngularApp(ctx)
if err != nil {
return err
}
if !isAngular {
return fmt.Errorf("not an Angular application")
}
// Wait for Zone.js stability
return ah.waitForZoneStability(ctx)
}
// isAngularApp checks if the current page is an Angular application.
func (ah *AngularHelper) isAngularApp(ctx context.Context) (bool, error) {
script := `
(function() {
// Check for Angular 2+
if (window.getAllAngularRootElements && window.getAllAngularRootElements().length > 0) {
return true;
}
// Check for Angular CLI generated apps
if (document.querySelector('[ng-version]')) {
return true;
}
// Check for Angular elements
if (window.ng && typeof window.ng.probe === 'function') {
return true;
}
// Check for AngularJS (1.x)
if (window.angular && window.angular.element) {
return true;
}
return false;
})()
`
result, err := ah.wv.evaluate(ctx, script)
if err != nil {
return false, err
}
isAngular, ok := result.(bool)
if !ok {
return false, nil
}
return isAngular, nil
}
// waitForZoneStability waits for Zone.js to become stable.
func (ah *AngularHelper) waitForZoneStability(ctx context.Context) error {
script := `
new Promise((resolve, reject) => {
// Get the root elements
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
if (roots.length === 0) {
// Try to find root element directly
const appRoot = document.querySelector('[ng-version]');
if (appRoot) {
roots.push(appRoot);
}
}
if (roots.length === 0) {
resolve(true); // No Angular roots found, nothing to wait for
return;
}
// Get the Zone from any root element
let zone = null;
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
zone = injector.get(window.ng.coreTokens.NgZone || 'NgZone');
if (zone) break;
} catch (e) {
// Continue to next root
}
}
if (!zone) {
// Fallback: check window.Zone
if (window.Zone && window.Zone.current && window.Zone.current._inner) {
const isStable = !window.Zone.current._inner._hasPendingMicrotasks &&
!window.Zone.current._inner._hasPendingMacrotasks;
if (isStable) {
resolve(true);
} else {
// Poll for stability
let attempts = 0;
const poll = setInterval(() => {
attempts++;
const stable = !window.Zone.current._inner._hasPendingMicrotasks &&
!window.Zone.current._inner._hasPendingMacrotasks;
if (stable || attempts > 100) {
clearInterval(poll);
resolve(stable);
}
}, 50);
}
} else {
resolve(true);
}
return;
}
// Use Angular's zone stability
if (zone.isStable) {
resolve(true);
return;
}
// Wait for stability
const sub = zone.onStable.subscribe(() => {
sub.unsubscribe();
resolve(true);
});
// Timeout fallback
setTimeout(() => {
sub.unsubscribe();
resolve(zone.isStable);
}, 5000);
})
`
ticker := time.NewTicker(100 * time.Millisecond)
defer ticker.Stop()
// First evaluate the promise
_, err := ah.wv.evaluate(ctx, script)
if err != nil {
// If the script fails, fall back to simple polling
return ah.pollForStability(ctx)
}
return nil
}
// pollForStability polls for Angular stability as a fallback.
func (ah *AngularHelper) pollForStability(ctx context.Context) error {
script := `
(function() {
if (window.Zone && window.Zone.current) {
const inner = window.Zone.current._inner || window.Zone.current;
return !inner._hasPendingMicrotasks && !inner._hasPendingMacrotasks;
}
return true;
})()
`
ticker := time.NewTicker(50 * time.Millisecond)
defer ticker.Stop()
for {
select {
case <-ctx.Done():
return ctx.Err()
case <-ticker.C:
result, err := ah.wv.evaluate(ctx, script)
if err != nil {
continue
}
if stable, ok := result.(bool); ok && stable {
return nil
}
}
}
}
// NavigateByRouter navigates using Angular Router.
func (ah *AngularHelper) NavigateByRouter(path string) error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
if (roots.length === 0) {
throw new Error('No Angular root elements found');
}
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
const router = injector.get(window.ng.coreTokens.Router || 'Router');
if (router) {
router.navigateByUrl(%q);
return true;
}
} catch (e) {
continue;
}
}
throw new Error('Could not find Angular Router');
})()
`, path)
_, err := ah.wv.evaluate(ctx, script)
if err != nil {
return fmt.Errorf("failed to navigate: %w", err)
}
// Wait for navigation to complete
return ah.waitForZoneStability(ctx)
}
// GetRouterState returns the current Angular router state.
func (ah *AngularHelper) GetRouterState() (*AngularRouterState, error) {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := `
(function() {
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
const router = injector.get(window.ng.coreTokens.Router || 'Router');
if (router) {
return {
url: router.url,
fragment: router.routerState.root.fragment,
params: router.routerState.root.params,
queryParams: router.routerState.root.queryParams
};
}
} catch (e) {
continue;
}
}
return null;
})()
`
result, err := ah.wv.evaluate(ctx, script)
if err != nil {
return nil, err
}
if result == nil {
return nil, fmt.Errorf("could not get router state")
}
// Parse result
resultMap, ok := result.(map[string]any)
if !ok {
return nil, fmt.Errorf("invalid router state format")
}
state := &AngularRouterState{
URL: getString(resultMap, "url"),
}
if fragment, ok := resultMap["fragment"].(string); ok {
state.Fragment = fragment
}
if params, ok := resultMap["params"].(map[string]any); ok {
state.Params = make(map[string]string)
for k, v := range params {
if s, ok := v.(string); ok {
state.Params[k] = s
}
}
}
if queryParams, ok := resultMap["queryParams"].(map[string]any); ok {
state.QueryParams = make(map[string]string)
for k, v := range queryParams {
if s, ok := v.(string); ok {
state.QueryParams[k] = s
}
}
}
return state, nil
}
// AngularRouterState represents Angular router state.
type AngularRouterState struct {
URL string `json:"url"`
Fragment string `json:"fragment,omitempty"`
Params map[string]string `json:"params,omitempty"`
QueryParams map[string]string `json:"queryParams,omitempty"`
}
// GetComponentProperty gets a property from an Angular component.
func (ah *AngularHelper) GetComponentProperty(selector, propertyName string) (any, error) {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) {
throw new Error('Element not found: %s');
}
const component = window.ng.probe(element).componentInstance;
if (!component) {
throw new Error('No Angular component found on element');
}
return component[%q];
})()
`, selector, selector, propertyName)
return ah.wv.evaluate(ctx, script)
}
// SetComponentProperty sets a property on an Angular component.
func (ah *AngularHelper) SetComponentProperty(selector, propertyName string, value any) error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) {
throw new Error('Element not found: %s');
}
const component = window.ng.probe(element).componentInstance;
if (!component) {
throw new Error('No Angular component found on element');
}
component[%q] = %v;
// Trigger change detection
const injector = window.ng.probe(element).injector;
const appRef = injector.get(window.ng.coreTokens.ApplicationRef || 'ApplicationRef');
if (appRef) {
appRef.tick();
}
return true;
})()
`, selector, selector, propertyName, formatJSValue(value))
_, err := ah.wv.evaluate(ctx, script)
return err
}
// CallComponentMethod calls a method on an Angular component.
func (ah *AngularHelper) CallComponentMethod(selector, methodName string, args ...any) (any, error) {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
argsStr := ""
for i, arg := range args {
if i > 0 {
argsStr += ", "
}
argsStr += formatJSValue(arg)
}
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) {
throw new Error('Element not found: %s');
}
const component = window.ng.probe(element).componentInstance;
if (!component) {
throw new Error('No Angular component found on element');
}
if (typeof component[%q] !== 'function') {
throw new Error('Method not found: %s');
}
const result = component[%q](%s);
// Trigger change detection
const injector = window.ng.probe(element).injector;
const appRef = injector.get(window.ng.coreTokens.ApplicationRef || 'ApplicationRef');
if (appRef) {
appRef.tick();
}
return result;
})()
`, selector, selector, methodName, methodName, methodName, argsStr)
return ah.wv.evaluate(ctx, script)
}
// TriggerChangeDetection manually triggers Angular change detection.
func (ah *AngularHelper) TriggerChangeDetection() error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := `
(function() {
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
const appRef = injector.get(window.ng.coreTokens.ApplicationRef || 'ApplicationRef');
if (appRef) {
appRef.tick();
return true;
}
} catch (e) {
continue;
}
}
return false;
})()
`
_, err := ah.wv.evaluate(ctx, script)
return err
}
// GetService gets an Angular service by token name.
func (ah *AngularHelper) GetService(serviceName string) (any, error) {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
const service = injector.get(%q);
if (service) {
// Return a serializable representation
return JSON.parse(JSON.stringify(service));
}
} catch (e) {
continue;
}
}
return null;
})()
`, serviceName)
return ah.wv.evaluate(ctx, script)
}
// WaitForComponent waits for an Angular component to be present.
func (ah *AngularHelper) WaitForComponent(selector string) error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) return false;
try {
const component = window.ng.probe(element).componentInstance;
return !!component;
} catch (e) {
return false;
}
})()
`, selector)
ticker := time.NewTicker(100 * time.Millisecond)
defer ticker.Stop()
for {
select {
case <-ctx.Done():
return ctx.Err()
case <-ticker.C:
result, err := ah.wv.evaluate(ctx, script)
if err != nil {
continue
}
if found, ok := result.(bool); ok && found {
return nil
}
}
}
}
// DispatchEvent dispatches a custom event on an element.
func (ah *AngularHelper) DispatchEvent(selector, eventName string, detail any) error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
detailStr := "null"
if detail != nil {
detailStr = formatJSValue(detail)
}
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) {
throw new Error('Element not found: %s');
}
const event = new CustomEvent(%q, { bubbles: true, detail: %s });
element.dispatchEvent(event);
return true;
})()
`, selector, selector, eventName, detailStr)
_, err := ah.wv.evaluate(ctx, script)
return err
}
// GetNgModel gets the value of an ngModel-bound input.
func (ah *AngularHelper) GetNgModel(selector string) (any, error) {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) return null;
// Try to get from component
try {
const debug = window.ng.probe(element);
const component = debug.componentInstance;
// Look for common ngModel patterns
if (element.tagName === 'INPUT' || element.tagName === 'SELECT' || element.tagName === 'TEXTAREA') {
return element.value;
}
} catch (e) {}
return element.value || element.textContent;
})()
`, selector)
return ah.wv.evaluate(ctx, script)
}
// SetNgModel sets the value of an ngModel-bound input.
func (ah *AngularHelper) SetNgModel(selector string, value any) error {
ctx, cancel := context.WithTimeout(ah.wv.ctx, ah.timeout)
defer cancel()
script := fmt.Sprintf(`
(function() {
const element = document.querySelector(%q);
if (!element) {
throw new Error('Element not found: %s');
}
element.value = %v;
element.dispatchEvent(new Event('input', { bubbles: true }));
element.dispatchEvent(new Event('change', { bubbles: true }));
// Trigger change detection
const roots = window.getAllAngularRootElements ? window.getAllAngularRootElements() : [];
for (const root of roots) {
try {
const injector = window.ng.probe(root).injector;
const appRef = injector.get(window.ng.coreTokens.ApplicationRef || 'ApplicationRef');
if (appRef) {
appRef.tick();
break;
}
} catch (e) {}
}
return true;
})()
`, selector, selector, formatJSValue(value))
_, err := ah.wv.evaluate(ctx, script)
return err
}
// Helper functions
func getString(m map[string]any, key string) string {
if v, ok := m[key].(string); ok {
return v
}
return ""
}
func formatJSValue(v any) string {
switch val := v.(type) {
case string:
return fmt.Sprintf("%q", val)
case bool:
if val {
return "true"
}
return "false"
case nil:
return "null"
default:
return fmt.Sprintf("%v", val)
}
}