diff --git a/markitect/plugins/testdrive_jsui.py b/markitect/plugins/testdrive_jsui.py index 29027440..c5756b1f 100644 --- a/markitect/plugins/testdrive_jsui.py +++ b/markitect/plugins/testdrive_jsui.py @@ -50,7 +50,7 @@ class TestDriveJSUIEngine(RenderingEnginePlugin): "static/js/controls/debug-control.js", "static/js/controls/edit-control.js", "static/js/config-loader.js", - "static/js/main.js" + "static/js/main-updated.js" ], "css": [ "static/css/editor.css", diff --git a/test_browser_ready.py b/test_browser_ready.py new file mode 100644 index 00000000..a1464085 --- /dev/null +++ b/test_browser_ready.py @@ -0,0 +1,134 @@ +#!/usr/bin/env python3 +""" +Create a browser-ready test file to verify JavaScript fixes +""" + +import sys +from pathlib import Path + +# Add current directory to path for imports +sys.path.insert(0, str(Path(__file__).parent)) + +def create_browser_test(): + """Create a complete test file ready for browser verification.""" + + print("🌐 Creating Browser-Ready Test") + print("=" * 50) + + try: + from markitect.plugins import PluginManager, RenderingEngineManager, RenderingConfig + + # Initialize plugin system + plugin_manager = PluginManager() + rendering_manager = RenderingEngineManager(plugin_manager) + engine = rendering_manager.get_engine('testdrive-jsui') + + # Test content specifically for JavaScript verification + test_content = """# JavaScript Fix Verification + +This document tests the resolved JavaScript issues: + +## Fixed Issues āœ… + +### 1. Const Redeclaration Error +- **Problem**: `const MARKITECT_STRICT_MODE` declared in both `main.js` and `control-base.js` +- **Solution**: Removed duplicate declaration from `control-base.js`, now declared only in `main-updated.js` + +### 2. MarkitectMain Not Available +- **Problem**: Loading `main.js` instead of `main-updated.js` which contains `MarkitectMain` +- **Solution**: Updated plugin asset list to load `main-updated.js` + +### 3. JavaScript Loading Order +- **Problem**: Multiple main files causing conflicts +- **Solution**: Load only `main-updated.js` with all required functionality + +## Expected Browser Behavior + +When you open this document in a browser: + +1. āœ… **No console errors** about const redeclaration +2. āœ… **MarkitectMain available** - edit functionality should work +3. āœ… **Control panels should appear** in compass positions: + - Northwest: Table of Contents + - Northeast: Edit Controls + - East: Status Information + - Southeast: Debug Panel + +## Test Instructions + +1. Open this HTML file in a browser +2. Check the browser console (F12 → Console tab) +3. Look for: + - āŒ No "redeclaration of const" errors + - āœ… "šŸŽÆ TestDrive JSUI loading complete, initializing..." + - āœ… "šŸš€ Starting MarkitectMain initialization..." + - āœ… Various initialization success messages + +## Interactive Testing + +Try clicking on different sections of this document - they should become editable if JavaScript is working correctly. + +--- + +**Generated**: {timestamp} +**Engine**: testdrive-jsui +**Assets**: All plugin assets deployed to `_markitect/plugins/testdrive-jsui/` +""" + + # Create output directory + output_dir = Path('/tmp/browser_test_verification') + output_dir.mkdir(exist_ok=True) + + print(f"šŸ“ Output directory: {output_dir}") + + # Configure rendering + config = RenderingConfig( + asset_base_url="_markitect", + development_mode=False, + output_directory=output_dir + ) + + # Deploy assets + print(f"šŸ“¦ Deploying assets...") + deployed_assets = rendering_manager.deploy_engine_assets('testdrive-jsui', config) + + asset_count = sum(len(files) for files in deployed_assets.values() if isinstance(files, list)) + print(f" āœ… Deployed {asset_count} assets") + + # Add timestamp to content + from datetime import datetime + timestamped_content = test_content.format( + timestamp=datetime.now().strftime('%Y-%m-%d %H:%M:%S') + ) + + # Render document + print(f"šŸ“„ Rendering test document...") + html_content = engine.render_document(timestamped_content, 'edit', config) + + # Write test file + test_file = output_dir / 'browser_verification_test.html' + test_file.write_text(html_content) + + print(f"āœ… Browser test file created!") + print(f"\nšŸŽÆ Instructions:") + print(f"1. Open: file://{test_file.absolute()}") + print(f"2. Check browser console for errors") + print(f"3. Look for edit functionality (click sections to edit)") + print(f"4. Control panels should appear around the document") + + print(f"\nšŸ“Š File Details:") + print(f" Size: {len(html_content):,} characters") + print(f" Assets: {asset_count} files deployed") + print(f" Location: {test_file}") + + return True + + except Exception as e: + print(f"āŒ Browser test creation failed: {e}") + import traceback + traceback.print_exc() + return False + +if __name__ == "__main__": + success = create_browser_test() + sys.exit(0 if success else 1) \ No newline at end of file diff --git a/test_js_fixes.py b/test_js_fixes.py new file mode 100644 index 00000000..2d9070b0 --- /dev/null +++ b/test_js_fixes.py @@ -0,0 +1,140 @@ +#!/usr/bin/env python3 +""" +Test JavaScript fixes for const redeclaration and MarkitectMain issues +""" + +import sys +from pathlib import Path +import re + +# Add current directory to path for imports +sys.path.insert(0, str(Path(__file__).parent)) + +def test_javascript_fixes(): + """Test that JavaScript const redeclaration and MarkitectMain issues are resolved.""" + + print("šŸ”§ Testing JavaScript Fixes") + print("=" * 50) + + try: + # Test 1: Check for const declarations in loaded files + print("1ļøāƒ£ Checking for const declaration conflicts...") + + from markitect.plugins import PluginManager, RenderingEngineManager + plugin_manager = PluginManager() + rendering_manager = RenderingEngineManager(plugin_manager) + engine = rendering_manager.get_engine('testdrive-jsui') + + required_assets = engine.get_required_assets() + js_files = required_assets.get('js', []) + + print(f" šŸ“„ JavaScript files to be loaded: {len(js_files)}") + + const_declarations = {} + for js_file in js_files: + file_path = Path('testdrive-jsui') / js_file + if file_path.exists(): + content = file_path.read_text() + # Find const declarations (both all-caps and camelCase) + const_matches = re.findall(r'^const\s+([A-Za-z_][A-Za-z0-9_]*)\s*=', content, re.MULTILINE) + if const_matches: + const_declarations[js_file] = const_matches + print(f" {js_file}: {', '.join(const_matches)}") + + # Check for duplicates + all_consts = [] + for file, consts in const_declarations.items(): + all_consts.extend(consts) + + duplicates = set([const for const in all_consts if all_consts.count(const) > 1]) + + if duplicates: + print(f" āŒ Found duplicate const declarations: {', '.join(duplicates)}") + return False + else: + print(f" āœ… No duplicate const declarations found") + + # Test 2: Verify MarkitectMain is in the loaded files + print(f"\n2ļøāƒ£ Checking MarkitectMain availability...") + + markitect_main_files = [f for f, consts in const_declarations.items() if 'MarkitectMain' in consts] + + if not markitect_main_files: + print(f" āŒ MarkitectMain not found in any loaded files") + return False + elif len(markitect_main_files) > 1: + print(f" āŒ MarkitectMain declared in multiple files: {', '.join(markitect_main_files)}") + return False + else: + print(f" āœ… MarkitectMain found in: {markitect_main_files[0]}") + + # Test 3: Verify correct main file is loaded + print(f"\n3ļøāƒ£ Checking correct main file is loaded...") + + if 'static/js/main-updated.js' in js_files and 'static/js/main.js' not in js_files: + print(f" āœ… Correct main file loaded: main-updated.js") + elif 'static/js/main.js' in js_files: + print(f" āŒ Wrong main file loaded: main.js (should be main-updated.js)") + return False + else: + print(f" āš ļø No main file found in asset list") + + # Test 4: Generate and verify HTML output + print(f"\n4ļøāƒ£ Testing HTML generation...") + + from markitect.plugins import RenderingConfig + + content = "# JavaScript Fix Test\n\nTesting resolved JavaScript issues." + output_dir = Path('/tmp/test_js_fixes_verification') + output_dir.mkdir(exist_ok=True) + + config = RenderingConfig( + asset_base_url="_markitect", + development_mode=False, + output_directory=output_dir + ) + + # Deploy assets and render + rendering_manager.deploy_engine_assets('testdrive-jsui', config) + html_content = engine.render_document(content, 'edit', config) + + # Check HTML script references + script_refs = re.findall(r'