cursorflow 1.3.7__tar.gz → 2.0.1__tar.gz
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.
- {cursorflow-1.3.7 → cursorflow-2.0.1}/MANIFEST.in +1 -0
- cursorflow-2.0.1/PKG-INFO +293 -0
- cursorflow-2.0.1/README.md +248 -0
- cursorflow-2.0.1/cursorflow/core/browser_controller.py +2473 -0
- cursorflow-2.0.1/cursorflow/core/error_context_collector.py +590 -0
- cursorflow-2.0.1/cursorflow/core/hmr_detector.py +439 -0
- cursorflow-2.0.1/cursorflow/core/trace_manager.py +209 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/rules/cursorflow-installation.mdc +96 -50
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/rules/cursorflow-usage.mdc +227 -91
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow.egg-info/SOURCES.txt +5 -1
- cursorflow-2.0.1/docs/USER_MANUAL.md +1023 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/examples/comprehensive_screenshot_example.py +14 -6
- cursorflow-2.0.1/examples/v2_comprehensive_demo.py +516 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/pyproject.toml +5 -4
- cursorflow-1.3.7/PKG-INFO +0 -249
- cursorflow-1.3.7/README.md +0 -205
- cursorflow-1.3.7/cursorflow/core/browser_controller.py +0 -1220
- cursorflow-1.3.7/docs/USER_MANUAL.md +0 -581
- {cursorflow-1.3.7 → cursorflow-2.0.1}/LICENSE +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/__init__.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/auto_updater.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/cli.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/agent.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/auth_handler.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/browser_engine.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/css_iterator.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/cursor_integration.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/cursorflow.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/error_correlator.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/event_correlator.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/file_change_monitor.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/log_collector.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/log_monitor.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/mockup_comparator.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/persistent_session.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/core/report_generator.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/install_cursorflow_rules.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/log_sources/local_file.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/log_sources/ssh_remote.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/rules/__init__.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/cursorflow/updater.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/examples/mockup_comparison_example.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/examples/opensas_example.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/examples/react_example.py +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/setup.cfg +0 -0
- {cursorflow-1.3.7 → cursorflow-2.0.1}/setup.py +0 -0
@@ -15,6 +15,7 @@ include examples/react_example.py
|
|
15
15
|
include examples/opensas_example.py
|
16
16
|
include examples/mockup_comparison_example.py
|
17
17
|
include examples/comprehensive_screenshot_example.py
|
18
|
+
include examples/v2_comprehensive_demo.py
|
18
19
|
|
19
20
|
# INCLUDE: Single comprehensive user manual
|
20
21
|
include docs/USER_MANUAL.md
|
@@ -0,0 +1,293 @@
|
|
1
|
+
Metadata-Version: 2.4
|
2
|
+
Name: cursorflow
|
3
|
+
Version: 2.0.1
|
4
|
+
Summary: 🔥 Complete page intelligence for AI-driven development with Hot Reload Intelligence - captures DOM, network, console, performance, HMR events, and comprehensive page analysis
|
5
|
+
Author-email: GeekWarrior Development <rbush@cooltheory.com>
|
6
|
+
License-Expression: MIT
|
7
|
+
Project-URL: Homepage, https://github.com/haley-marketing-group/cursorflow
|
8
|
+
Project-URL: Documentation, https://cursorflow.readthedocs.io
|
9
|
+
Project-URL: Repository, https://github.com/haley-marketing-group/cursorflow
|
10
|
+
Keywords: ui-testing,automation,cursor,ai,web-testing,css-iteration,hot-reload,hmr,element-intelligence,page-analysis,error-context
|
11
|
+
Classifier: Development Status :: 5 - Production/Stable
|
12
|
+
Classifier: Intended Audience :: Developers
|
13
|
+
Classifier: Programming Language :: Python :: 3
|
14
|
+
Classifier: Programming Language :: Python :: 3.8
|
15
|
+
Classifier: Programming Language :: Python :: 3.9
|
16
|
+
Classifier: Programming Language :: Python :: 3.10
|
17
|
+
Classifier: Programming Language :: Python :: 3.11
|
18
|
+
Classifier: Programming Language :: Python :: 3.12
|
19
|
+
Classifier: Topic :: Software Development :: Testing
|
20
|
+
Classifier: Topic :: Software Development :: Quality Assurance
|
21
|
+
Classifier: Framework :: AsyncIO
|
22
|
+
Requires-Python: >=3.8
|
23
|
+
Description-Content-Type: text/markdown
|
24
|
+
License-File: LICENSE
|
25
|
+
Requires-Dist: playwright>=1.40.0
|
26
|
+
Requires-Dist: paramiko>=3.3.1
|
27
|
+
Requires-Dist: pyyaml>=6.0.1
|
28
|
+
Requires-Dist: asyncio-mqtt>=0.11.1
|
29
|
+
Requires-Dist: click>=8.1.7
|
30
|
+
Requires-Dist: rich>=13.6.0
|
31
|
+
Requires-Dist: jinja2>=3.1.2
|
32
|
+
Requires-Dist: python-dateutil>=2.8.2
|
33
|
+
Requires-Dist: watchdog>=3.0.0
|
34
|
+
Requires-Dist: docker>=6.1.3
|
35
|
+
Requires-Dist: pillow>=10.0.0
|
36
|
+
Requires-Dist: numpy>=1.24.0
|
37
|
+
Requires-Dist: websockets>=11.0.0
|
38
|
+
Provides-Extra: dev
|
39
|
+
Requires-Dist: pytest>=7.4.0; extra == "dev"
|
40
|
+
Requires-Dist: pytest-asyncio>=0.21.1; extra == "dev"
|
41
|
+
Requires-Dist: black>=23.9.1; extra == "dev"
|
42
|
+
Requires-Dist: flake8>=6.1.0; extra == "dev"
|
43
|
+
Requires-Dist: mypy>=1.6.1; extra == "dev"
|
44
|
+
Dynamic: license-file
|
45
|
+
|
46
|
+
# CursorFlow
|
47
|
+
|
48
|
+
**Complete page intelligence for AI-driven development**
|
49
|
+
|
50
|
+
CursorFlow captures comprehensive data from web applications - DOM structure, CSS properties, network activity, console logs, and performance metrics - enabling AI agents like Cursor to make intelligent decisions about UI improvements and debugging.
|
51
|
+
|
52
|
+
## 🎯 What CursorFlow Does
|
53
|
+
|
54
|
+
**Data Collection, Not Analysis** - We gather structured data, AI makes the decisions.
|
55
|
+
|
56
|
+
### **📊 Complete Page Intelligence**
|
57
|
+
Every screenshot captures everything:
|
58
|
+
- **DOM**: All elements with 7 selector strategies each
|
59
|
+
- **Network**: All requests, responses, and complete response bodies
|
60
|
+
- **Console**: All logs, errors, and smart error correlation
|
61
|
+
- **Performance**: Load times, memory usage, with reliability indicators
|
62
|
+
- **Visual**: Screenshots with pixel-perfect comparisons
|
63
|
+
- **Fonts**: Loading status, performance, and usage analysis
|
64
|
+
- **Animations**: Active animations and transitions tracking
|
65
|
+
- **Resources**: Complete resource loading analysis
|
66
|
+
- **Storage**: localStorage, sessionStorage, cookies, IndexedDB state
|
67
|
+
|
68
|
+
### **🔄 Rapid Iteration Support**
|
69
|
+
- **Hot Reload Intelligence** with framework auto-detection (Vite, Webpack, Next.js, Parcel, Laravel Mix)
|
70
|
+
- **Mockup comparison** with enhanced DOM and CSS analysis
|
71
|
+
- **Hot reload integration** for instant, perfectly-timed CSS testing
|
72
|
+
- **Persistent sessions** that survive code changes
|
73
|
+
- **Universal framework support** (React, Vue, PHP, Perl, anything)
|
74
|
+
|
75
|
+
### **🤖 AI-First Design**
|
76
|
+
All data structured for AI consumption:
|
77
|
+
- Consistent JSON format across all features
|
78
|
+
- **Multi-selector element identification** for robust automation
|
79
|
+
- **Accessibility-aware** element analysis
|
80
|
+
- Error correlation with **smart screenshot deduplication**
|
81
|
+
- Performance insights with **reliability metadata**
|
82
|
+
- **HMR event correlation** for CSS change tracking
|
83
|
+
|
84
|
+
## 🚀 Quick Start
|
85
|
+
|
86
|
+
```bash
|
87
|
+
# Install CursorFlow
|
88
|
+
pip install cursorflow
|
89
|
+
|
90
|
+
# Test with complete intelligence
|
91
|
+
cursorflow test --base-url http://localhost:3000 --actions '[
|
92
|
+
{"navigate": "/dashboard"},
|
93
|
+
{"wait_for": "#main-content"},
|
94
|
+
{"screenshot": "dashboard-loaded"}
|
95
|
+
]'
|
96
|
+
|
97
|
+
# HMR-powered CSS iteration
|
98
|
+
cursorflow iterate-mockup https://mockup.com/design \
|
99
|
+
--base-url http://localhost:5173 \
|
100
|
+
--css-improvements '[
|
101
|
+
{"name": "fix-spacing", "css": ".container { gap: 2rem; }"}
|
102
|
+
]'
|
103
|
+
```
|
104
|
+
|
105
|
+
## 💻 Usage Examples
|
106
|
+
|
107
|
+
### **Hot Reload Intelligence**
|
108
|
+
```python
|
109
|
+
from cursorflow import CursorFlow
|
110
|
+
|
111
|
+
async def hmr_workflow():
|
112
|
+
flow = CursorFlow("http://localhost:5173", {"headless": False})
|
113
|
+
|
114
|
+
# Start HMR monitoring (auto-detects Vite/Webpack/Next.js)
|
115
|
+
await flow.browser.start_hmr_monitoring()
|
116
|
+
|
117
|
+
# Take baseline
|
118
|
+
await flow.execute_and_collect([
|
119
|
+
{"navigate": "/app"},
|
120
|
+
{"screenshot": "baseline"}
|
121
|
+
])
|
122
|
+
|
123
|
+
# Wait for CSS changes with perfect timing
|
124
|
+
hmr_event = await flow.browser.wait_for_css_update()
|
125
|
+
print(f"🔥 {hmr_event['framework']} CSS update detected!")
|
126
|
+
|
127
|
+
# Capture immediately after change
|
128
|
+
await flow.execute_and_collect([
|
129
|
+
{"screenshot": "updated"}
|
130
|
+
])
|
131
|
+
```
|
132
|
+
|
133
|
+
### **Advanced Element Analysis**
|
134
|
+
```python
|
135
|
+
# Get comprehensive element data
|
136
|
+
results = await flow.execute_and_collect([
|
137
|
+
{"navigate": "/form"},
|
138
|
+
{"screenshot": "form-analysis"}
|
139
|
+
])
|
140
|
+
|
141
|
+
# Access enhanced element data
|
142
|
+
for element in results['artifacts']['screenshots'][0]['dom_analysis']['elements']:
|
143
|
+
print(f"Element: {element['selector']}")
|
144
|
+
print(f" 7 Selectors: {list(element['selectors'].keys())}")
|
145
|
+
print(f" Accessible: {element['accessibility']['role']}")
|
146
|
+
print(f" Interactive: {element['accessibility']['interactive']}")
|
147
|
+
print(f" Visible: {element['visual_context']['visibility']['is_visible']}")
|
148
|
+
```
|
149
|
+
|
150
|
+
### **Comprehensive Page Intelligence**
|
151
|
+
```python
|
152
|
+
# Get complete page analysis
|
153
|
+
screenshot = results['artifacts']['screenshots'][0]
|
154
|
+
|
155
|
+
# Complete Intelligence
|
156
|
+
print(f"Fonts loaded: {screenshot['font_status']['loadedFonts']}")
|
157
|
+
print(f"Animations running: {screenshot['animation_status']['runningAnimations']}")
|
158
|
+
print(f"Resources: {screenshot['resource_status']['totalResources']}")
|
159
|
+
print(f"Storage items: {screenshot['storage_status']['localStorage']['itemCount']}")
|
160
|
+
```
|
161
|
+
|
162
|
+
### **Smart Error Diagnostics**
|
163
|
+
```python
|
164
|
+
# Enhanced error context with deduplication
|
165
|
+
error_context = await flow.browser.capture_interaction_error_context(
|
166
|
+
action_description="Submit form",
|
167
|
+
error_details={"type": "validation_error"}
|
168
|
+
)
|
169
|
+
|
170
|
+
print(f"Screenshot: {error_context['screenshot_info']['path']}")
|
171
|
+
print(f"Reused: {error_context['screenshot_info']['is_reused']}") # Smart deduplication
|
172
|
+
print(f"Context: {len(error_context['recent_actions'])} recent actions")
|
173
|
+
```
|
174
|
+
|
175
|
+
## 🔧 CLI Commands
|
176
|
+
|
177
|
+
### **Universal Testing with Complete Intelligence**
|
178
|
+
```bash
|
179
|
+
# Simple page test with full intelligence
|
180
|
+
cursorflow test --base-url http://localhost:3000 --path "/dashboard"
|
181
|
+
|
182
|
+
# Complex interaction test
|
183
|
+
cursorflow test --base-url http://localhost:3000 --actions '[
|
184
|
+
{"navigate": "/login"},
|
185
|
+
{"fill": {"selector": "#email", "value": "test@example.com"}},
|
186
|
+
{"click": "#login-btn"},
|
187
|
+
{"wait_for": ".dashboard"},
|
188
|
+
{"screenshot": "logged-in"}
|
189
|
+
]'
|
190
|
+
```
|
191
|
+
|
192
|
+
### **HMR-Powered CSS Iteration**
|
193
|
+
```bash
|
194
|
+
# Perfect CSS iteration with HMR intelligence
|
195
|
+
cursorflow iterate-mockup https://mockup.com/design \
|
196
|
+
--base-url http://localhost:5173 \
|
197
|
+
--css-improvements '[
|
198
|
+
{"name": "improve-spacing", "css": ".container { gap: 2rem; }"},
|
199
|
+
{"name": "enhance-colors", "css": ".button { background: #007bff; }"}
|
200
|
+
]'
|
201
|
+
```
|
202
|
+
|
203
|
+
### **Enhanced Design Comparison**
|
204
|
+
```bash
|
205
|
+
# Compare with comprehensive intelligence
|
206
|
+
cursorflow compare-mockup https://mockup.com/design \
|
207
|
+
--base-url http://localhost:3000 \
|
208
|
+
--mockup-actions '[{"navigate": "/"}]' \
|
209
|
+
--implementation-actions '[{"navigate": "/dashboard"}]'
|
210
|
+
```
|
211
|
+
|
212
|
+
## 🧠 AI Integration
|
213
|
+
|
214
|
+
### **Cursor Rules (Auto-Install)**
|
215
|
+
```bash
|
216
|
+
# Install AI assistance rules
|
217
|
+
cursorflow install-rules
|
218
|
+
```
|
219
|
+
|
220
|
+
CursorFlow includes comprehensive rules that teach Cursor:
|
221
|
+
- **When to use HMR intelligence** for CSS iteration
|
222
|
+
- **How to analyze multi-selector element data**
|
223
|
+
- **Best practices for comprehensive page analysis**
|
224
|
+
- **Error debugging with smart context collection**
|
225
|
+
|
226
|
+
### **Structured Data for AI**
|
227
|
+
Every CursorFlow operation returns **perfectly structured JSON** optimized for AI analysis:
|
228
|
+
|
229
|
+
```json
|
230
|
+
{
|
231
|
+
"artifacts": {
|
232
|
+
"screenshots": [{
|
233
|
+
"path": ".cursorflow/artifacts/screenshots/dashboard_123.png",
|
234
|
+
"dom_analysis": {
|
235
|
+
"elements": [...], // 7 selectors + accessibility per element
|
236
|
+
"pageStructure": {...}, // Enhanced page analysis
|
237
|
+
"analysisVersion": "2.0" // Version tracking
|
238
|
+
},
|
239
|
+
"font_status": {...}, // Font loading intelligence
|
240
|
+
"animation_status": {...}, // Animation tracking
|
241
|
+
"resource_status": {...}, // Resource analysis
|
242
|
+
"storage_status": {...}, // Storage state
|
243
|
+
"hmr_status": {...} // HMR event data
|
244
|
+
}]
|
245
|
+
}
|
246
|
+
}
|
247
|
+
```
|
248
|
+
|
249
|
+
## 🌟 Framework Support
|
250
|
+
|
251
|
+
**HMR Auto-Detection:**
|
252
|
+
- ✅ **Vite** (port 5173, WebSocket `/__vite_hmr`)
|
253
|
+
- ✅ **Webpack Dev Server** (port 3000, WebSocket `/sockjs-node`)
|
254
|
+
- ✅ **Next.js** (port 3000, WebSocket `/_next/webpack-hmr`)
|
255
|
+
- ✅ **Parcel** (port 1234, WebSocket `/hmr`)
|
256
|
+
- ✅ **Laravel Mix** (port 3000, WebSocket `/browser-sync/socket.io`)
|
257
|
+
|
258
|
+
**Universal Compatibility:**
|
259
|
+
- Works with **any web application** regardless of framework
|
260
|
+
- **Framework-agnostic** core operations
|
261
|
+
- **Smart adaptation** to different development environments
|
262
|
+
|
263
|
+
## 📖 Documentation
|
264
|
+
|
265
|
+
- **[Complete User Manual](docs/USER_MANUAL.md)** - Full feature guide
|
266
|
+
- **[Examples](examples/)** - Practical usage examples
|
267
|
+
- **[API Reference](docs/api/)** - Complete Python API documentation
|
268
|
+
|
269
|
+
## 🚀 Why CursorFlow?
|
270
|
+
|
271
|
+
### **For Developers:**
|
272
|
+
- **Faster CSS iteration** with HMR precision timing
|
273
|
+
- **Complete element intelligence** with multi-selector strategies
|
274
|
+
- **Full page visibility** with comprehensive analysis
|
275
|
+
- **Smart error debugging** with rich context collection
|
276
|
+
|
277
|
+
### **For AI Agents:**
|
278
|
+
- **Perfect structured data** for intelligent decision making
|
279
|
+
- **Multi-selector reliability** for robust automation
|
280
|
+
- **Accessibility awareness** for inclusive development
|
281
|
+
- **HMR correlation** for understanding change impact
|
282
|
+
|
283
|
+
### **For Teams:**
|
284
|
+
- **Framework agnostic** - works with any web technology
|
285
|
+
- **Production ready** - handles real-world complexity
|
286
|
+
- **Comprehensive testing** - covers all aspects of web apps
|
287
|
+
- **AI-first design** - built for autonomous development
|
288
|
+
|
289
|
+
---
|
290
|
+
|
291
|
+
**Complete page intelligence for AI-driven development with CursorFlow**
|
292
|
+
|
293
|
+
*Hot reload precision • Advanced element analysis • Smart error diagnostics • Comprehensive page intelligence*
|
@@ -0,0 +1,248 @@
|
|
1
|
+
# CursorFlow
|
2
|
+
|
3
|
+
**Complete page intelligence for AI-driven development**
|
4
|
+
|
5
|
+
CursorFlow captures comprehensive data from web applications - DOM structure, CSS properties, network activity, console logs, and performance metrics - enabling AI agents like Cursor to make intelligent decisions about UI improvements and debugging.
|
6
|
+
|
7
|
+
## 🎯 What CursorFlow Does
|
8
|
+
|
9
|
+
**Data Collection, Not Analysis** - We gather structured data, AI makes the decisions.
|
10
|
+
|
11
|
+
### **📊 Complete Page Intelligence**
|
12
|
+
Every screenshot captures everything:
|
13
|
+
- **DOM**: All elements with 7 selector strategies each
|
14
|
+
- **Network**: All requests, responses, and complete response bodies
|
15
|
+
- **Console**: All logs, errors, and smart error correlation
|
16
|
+
- **Performance**: Load times, memory usage, with reliability indicators
|
17
|
+
- **Visual**: Screenshots with pixel-perfect comparisons
|
18
|
+
- **Fonts**: Loading status, performance, and usage analysis
|
19
|
+
- **Animations**: Active animations and transitions tracking
|
20
|
+
- **Resources**: Complete resource loading analysis
|
21
|
+
- **Storage**: localStorage, sessionStorage, cookies, IndexedDB state
|
22
|
+
|
23
|
+
### **🔄 Rapid Iteration Support**
|
24
|
+
- **Hot Reload Intelligence** with framework auto-detection (Vite, Webpack, Next.js, Parcel, Laravel Mix)
|
25
|
+
- **Mockup comparison** with enhanced DOM and CSS analysis
|
26
|
+
- **Hot reload integration** for instant, perfectly-timed CSS testing
|
27
|
+
- **Persistent sessions** that survive code changes
|
28
|
+
- **Universal framework support** (React, Vue, PHP, Perl, anything)
|
29
|
+
|
30
|
+
### **🤖 AI-First Design**
|
31
|
+
All data structured for AI consumption:
|
32
|
+
- Consistent JSON format across all features
|
33
|
+
- **Multi-selector element identification** for robust automation
|
34
|
+
- **Accessibility-aware** element analysis
|
35
|
+
- Error correlation with **smart screenshot deduplication**
|
36
|
+
- Performance insights with **reliability metadata**
|
37
|
+
- **HMR event correlation** for CSS change tracking
|
38
|
+
|
39
|
+
## 🚀 Quick Start
|
40
|
+
|
41
|
+
```bash
|
42
|
+
# Install CursorFlow
|
43
|
+
pip install cursorflow
|
44
|
+
|
45
|
+
# Test with complete intelligence
|
46
|
+
cursorflow test --base-url http://localhost:3000 --actions '[
|
47
|
+
{"navigate": "/dashboard"},
|
48
|
+
{"wait_for": "#main-content"},
|
49
|
+
{"screenshot": "dashboard-loaded"}
|
50
|
+
]'
|
51
|
+
|
52
|
+
# HMR-powered CSS iteration
|
53
|
+
cursorflow iterate-mockup https://mockup.com/design \
|
54
|
+
--base-url http://localhost:5173 \
|
55
|
+
--css-improvements '[
|
56
|
+
{"name": "fix-spacing", "css": ".container { gap: 2rem; }"}
|
57
|
+
]'
|
58
|
+
```
|
59
|
+
|
60
|
+
## 💻 Usage Examples
|
61
|
+
|
62
|
+
### **Hot Reload Intelligence**
|
63
|
+
```python
|
64
|
+
from cursorflow import CursorFlow
|
65
|
+
|
66
|
+
async def hmr_workflow():
|
67
|
+
flow = CursorFlow("http://localhost:5173", {"headless": False})
|
68
|
+
|
69
|
+
# Start HMR monitoring (auto-detects Vite/Webpack/Next.js)
|
70
|
+
await flow.browser.start_hmr_monitoring()
|
71
|
+
|
72
|
+
# Take baseline
|
73
|
+
await flow.execute_and_collect([
|
74
|
+
{"navigate": "/app"},
|
75
|
+
{"screenshot": "baseline"}
|
76
|
+
])
|
77
|
+
|
78
|
+
# Wait for CSS changes with perfect timing
|
79
|
+
hmr_event = await flow.browser.wait_for_css_update()
|
80
|
+
print(f"🔥 {hmr_event['framework']} CSS update detected!")
|
81
|
+
|
82
|
+
# Capture immediately after change
|
83
|
+
await flow.execute_and_collect([
|
84
|
+
{"screenshot": "updated"}
|
85
|
+
])
|
86
|
+
```
|
87
|
+
|
88
|
+
### **Advanced Element Analysis**
|
89
|
+
```python
|
90
|
+
# Get comprehensive element data
|
91
|
+
results = await flow.execute_and_collect([
|
92
|
+
{"navigate": "/form"},
|
93
|
+
{"screenshot": "form-analysis"}
|
94
|
+
])
|
95
|
+
|
96
|
+
# Access enhanced element data
|
97
|
+
for element in results['artifacts']['screenshots'][0]['dom_analysis']['elements']:
|
98
|
+
print(f"Element: {element['selector']}")
|
99
|
+
print(f" 7 Selectors: {list(element['selectors'].keys())}")
|
100
|
+
print(f" Accessible: {element['accessibility']['role']}")
|
101
|
+
print(f" Interactive: {element['accessibility']['interactive']}")
|
102
|
+
print(f" Visible: {element['visual_context']['visibility']['is_visible']}")
|
103
|
+
```
|
104
|
+
|
105
|
+
### **Comprehensive Page Intelligence**
|
106
|
+
```python
|
107
|
+
# Get complete page analysis
|
108
|
+
screenshot = results['artifacts']['screenshots'][0]
|
109
|
+
|
110
|
+
# Complete Intelligence
|
111
|
+
print(f"Fonts loaded: {screenshot['font_status']['loadedFonts']}")
|
112
|
+
print(f"Animations running: {screenshot['animation_status']['runningAnimations']}")
|
113
|
+
print(f"Resources: {screenshot['resource_status']['totalResources']}")
|
114
|
+
print(f"Storage items: {screenshot['storage_status']['localStorage']['itemCount']}")
|
115
|
+
```
|
116
|
+
|
117
|
+
### **Smart Error Diagnostics**
|
118
|
+
```python
|
119
|
+
# Enhanced error context with deduplication
|
120
|
+
error_context = await flow.browser.capture_interaction_error_context(
|
121
|
+
action_description="Submit form",
|
122
|
+
error_details={"type": "validation_error"}
|
123
|
+
)
|
124
|
+
|
125
|
+
print(f"Screenshot: {error_context['screenshot_info']['path']}")
|
126
|
+
print(f"Reused: {error_context['screenshot_info']['is_reused']}") # Smart deduplication
|
127
|
+
print(f"Context: {len(error_context['recent_actions'])} recent actions")
|
128
|
+
```
|
129
|
+
|
130
|
+
## 🔧 CLI Commands
|
131
|
+
|
132
|
+
### **Universal Testing with Complete Intelligence**
|
133
|
+
```bash
|
134
|
+
# Simple page test with full intelligence
|
135
|
+
cursorflow test --base-url http://localhost:3000 --path "/dashboard"
|
136
|
+
|
137
|
+
# Complex interaction test
|
138
|
+
cursorflow test --base-url http://localhost:3000 --actions '[
|
139
|
+
{"navigate": "/login"},
|
140
|
+
{"fill": {"selector": "#email", "value": "test@example.com"}},
|
141
|
+
{"click": "#login-btn"},
|
142
|
+
{"wait_for": ".dashboard"},
|
143
|
+
{"screenshot": "logged-in"}
|
144
|
+
]'
|
145
|
+
```
|
146
|
+
|
147
|
+
### **HMR-Powered CSS Iteration**
|
148
|
+
```bash
|
149
|
+
# Perfect CSS iteration with HMR intelligence
|
150
|
+
cursorflow iterate-mockup https://mockup.com/design \
|
151
|
+
--base-url http://localhost:5173 \
|
152
|
+
--css-improvements '[
|
153
|
+
{"name": "improve-spacing", "css": ".container { gap: 2rem; }"},
|
154
|
+
{"name": "enhance-colors", "css": ".button { background: #007bff; }"}
|
155
|
+
]'
|
156
|
+
```
|
157
|
+
|
158
|
+
### **Enhanced Design Comparison**
|
159
|
+
```bash
|
160
|
+
# Compare with comprehensive intelligence
|
161
|
+
cursorflow compare-mockup https://mockup.com/design \
|
162
|
+
--base-url http://localhost:3000 \
|
163
|
+
--mockup-actions '[{"navigate": "/"}]' \
|
164
|
+
--implementation-actions '[{"navigate": "/dashboard"}]'
|
165
|
+
```
|
166
|
+
|
167
|
+
## 🧠 AI Integration
|
168
|
+
|
169
|
+
### **Cursor Rules (Auto-Install)**
|
170
|
+
```bash
|
171
|
+
# Install AI assistance rules
|
172
|
+
cursorflow install-rules
|
173
|
+
```
|
174
|
+
|
175
|
+
CursorFlow includes comprehensive rules that teach Cursor:
|
176
|
+
- **When to use HMR intelligence** for CSS iteration
|
177
|
+
- **How to analyze multi-selector element data**
|
178
|
+
- **Best practices for comprehensive page analysis**
|
179
|
+
- **Error debugging with smart context collection**
|
180
|
+
|
181
|
+
### **Structured Data for AI**
|
182
|
+
Every CursorFlow operation returns **perfectly structured JSON** optimized for AI analysis:
|
183
|
+
|
184
|
+
```json
|
185
|
+
{
|
186
|
+
"artifacts": {
|
187
|
+
"screenshots": [{
|
188
|
+
"path": ".cursorflow/artifacts/screenshots/dashboard_123.png",
|
189
|
+
"dom_analysis": {
|
190
|
+
"elements": [...], // 7 selectors + accessibility per element
|
191
|
+
"pageStructure": {...}, // Enhanced page analysis
|
192
|
+
"analysisVersion": "2.0" // Version tracking
|
193
|
+
},
|
194
|
+
"font_status": {...}, // Font loading intelligence
|
195
|
+
"animation_status": {...}, // Animation tracking
|
196
|
+
"resource_status": {...}, // Resource analysis
|
197
|
+
"storage_status": {...}, // Storage state
|
198
|
+
"hmr_status": {...} // HMR event data
|
199
|
+
}]
|
200
|
+
}
|
201
|
+
}
|
202
|
+
```
|
203
|
+
|
204
|
+
## 🌟 Framework Support
|
205
|
+
|
206
|
+
**HMR Auto-Detection:**
|
207
|
+
- ✅ **Vite** (port 5173, WebSocket `/__vite_hmr`)
|
208
|
+
- ✅ **Webpack Dev Server** (port 3000, WebSocket `/sockjs-node`)
|
209
|
+
- ✅ **Next.js** (port 3000, WebSocket `/_next/webpack-hmr`)
|
210
|
+
- ✅ **Parcel** (port 1234, WebSocket `/hmr`)
|
211
|
+
- ✅ **Laravel Mix** (port 3000, WebSocket `/browser-sync/socket.io`)
|
212
|
+
|
213
|
+
**Universal Compatibility:**
|
214
|
+
- Works with **any web application** regardless of framework
|
215
|
+
- **Framework-agnostic** core operations
|
216
|
+
- **Smart adaptation** to different development environments
|
217
|
+
|
218
|
+
## 📖 Documentation
|
219
|
+
|
220
|
+
- **[Complete User Manual](docs/USER_MANUAL.md)** - Full feature guide
|
221
|
+
- **[Examples](examples/)** - Practical usage examples
|
222
|
+
- **[API Reference](docs/api/)** - Complete Python API documentation
|
223
|
+
|
224
|
+
## 🚀 Why CursorFlow?
|
225
|
+
|
226
|
+
### **For Developers:**
|
227
|
+
- **Faster CSS iteration** with HMR precision timing
|
228
|
+
- **Complete element intelligence** with multi-selector strategies
|
229
|
+
- **Full page visibility** with comprehensive analysis
|
230
|
+
- **Smart error debugging** with rich context collection
|
231
|
+
|
232
|
+
### **For AI Agents:**
|
233
|
+
- **Perfect structured data** for intelligent decision making
|
234
|
+
- **Multi-selector reliability** for robust automation
|
235
|
+
- **Accessibility awareness** for inclusive development
|
236
|
+
- **HMR correlation** for understanding change impact
|
237
|
+
|
238
|
+
### **For Teams:**
|
239
|
+
- **Framework agnostic** - works with any web technology
|
240
|
+
- **Production ready** - handles real-world complexity
|
241
|
+
- **Comprehensive testing** - covers all aspects of web apps
|
242
|
+
- **AI-first design** - built for autonomous development
|
243
|
+
|
244
|
+
---
|
245
|
+
|
246
|
+
**Complete page intelligence for AI-driven development with CursorFlow**
|
247
|
+
|
248
|
+
*Hot reload precision • Advanced element analysis • Smart error diagnostics • Comprehensive page intelligence*
|