coulomb/markitect-main
2
0
Fork 0
Code Issues 60 Pull Requests Actions Projects 12 Releases 1 Wiki Activity

refactor: Still trying to reorganize edit mode to be more robust
Some checks failed
Test Suite / code-quality (push) Has been cancelled
Details
Test Suite / unit-tests (3.11) (push) Has been cancelled
Details
Test Suite / unit-tests (3.12) (push) Has been cancelled
Details
Test Suite / security-scan (push) Has been cancelled
Details
Test Suite / integration-tests (push) Has been cancelled
Details
Test Suite / e2e-tests (push) Has been cancelled
Details
Test Suite / performance-tests (push) Has been cancelled
Details
Test Suite / test-summary (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Bernd Worsch
2025-11-04 21:59:22 +01:00
parent 85faf502c4
commit c5a5b26797
487 changed files with 94669 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

221
test_reopen_issue.js Normal file
View File

@@ -0,0 +1,221 @@
#!/usr/bin/env node
/**
* Test Reopen Issue
*
* Test to reproduce and verify the fix for the issue where
* edit menus cannot be reopened after being closed
*/
const { TestRunner } = require('./test_runner.js');
const runner = new TestRunner();
runner.describe('Edit Menu Reopen Tests', () => {
runner.it('should allow reopening text editor after X button close', async () => {
// Load editor
delete require.cache[require.resolve('/home/worsch/markitect_project/markitect/static/editor.js')];
require('/home/worsch/markitect_project/markitect/static/editor.js');
if (global.DOMRenderer && global.SectionManager && global.FloatingMenu) {
const container = document.createElement('div');
container.innerHTML = '<div id="markdown-content"></div>';
document.body.appendChild(container);
const manager = new global.SectionManager();
const renderer = new global.DOMRenderer(manager, container);
// Create test section
const textMarkdown = 'Test section for reopen testing';
const sections = manager.createSectionsFromMarkdown(textMarkdown);
const textSection = sections[0];
const mockElement = document.createElement('div');
mockElement.setAttribute('data-section-id', textSection.id);
Object.defineProperties(mockElement, {
getBoundingClientRect: {
value: () => ({ top: 100, right: 400, bottom: 150, left: 50, width: 350, height: 50 })
}
});
renderer.findSectionElement = () => mockElement;
// First open
renderer.showEditor(textSection.id, textSection.currentMarkdown);
// Verify menu exists
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
runner.expect(renderer.currentFloatingMenu.isVisible).toBeTruthy();
const firstMenu = document.querySelector('.ui-edit-floating-menu');
runner.expect(firstMenu).toBeTruthy();
// Close with X button
const closeButton = firstMenu.querySelector('.ui-edit-close-button');
runner.expect(closeButton).toBeTruthy();
closeButton.click();
// Verify menu is closed
runner.expect(renderer.currentFloatingMenu).toBeFalsy();
const menuAfterClose = document.querySelector('.ui-edit-floating-menu');
runner.expect(menuAfterClose).toBeFalsy();
// Try to reopen - this should work
renderer.showEditor(textSection.id, textSection.currentMarkdown);
// Verify menu can be reopened
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
runner.expect(renderer.currentFloatingMenu.isVisible).toBeTruthy();
const reopenedMenu = document.querySelector('.ui-edit-floating-menu');
runner.expect(reopenedMenu).toBeTruthy();
// Cleanup
if (renderer.currentFloatingMenu) {
renderer.currentFloatingMenu.hide();
}
document.body.removeChild(container);
}
});
runner.it('should allow reopening image editor after X button close', async () => {
if (global.DOMRenderer && global.SectionManager && global.FloatingMenu) {
const container = document.createElement('div');
container.innerHTML = '<div id="markdown-content"></div>';
document.body.appendChild(container);
const manager = new global.SectionManager();
const renderer = new global.DOMRenderer(manager, container);
// Create image section
const imageMarkdown = '![Test](test.jpg)';
const sections = manager.createSectionsFromMarkdown(imageMarkdown);
const imageSection = sections[0];
const mockElement = document.createElement('div');
mockElement.setAttribute('data-section-id', imageSection.id);
Object.defineProperties(mockElement, {
getBoundingClientRect: {
value: () => ({ top: 100, right: 400, bottom: 150, left: 50, width: 350, height: 50 })
}
});
renderer.findSectionElement = () => mockElement;
// First open image editor
renderer.showImageEditor(imageSection.id, imageSection);
// Verify menu exists
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
runner.expect(renderer.currentFloatingMenu.isVisible).toBeTruthy();
const firstMenu = document.querySelector('.ui-edit-floating-menu');
runner.expect(firstMenu).toBeTruthy();
// Close with X button
const closeButton = firstMenu.querySelector('.ui-edit-close-button');
runner.expect(closeButton).toBeTruthy();
closeButton.click();
// Verify menu is closed
runner.expect(renderer.currentFloatingMenu).toBeFalsy();
const menuAfterClose = document.querySelector('.ui-edit-floating-menu');
runner.expect(menuAfterClose).toBeFalsy();
// Try to reopen image editor - this should work
renderer.showImageEditor(imageSection.id, imageSection);
// Verify menu can be reopened
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
runner.expect(renderer.currentFloatingMenu.isVisible).toBeTruthy();
const reopenedMenu = document.querySelector('.ui-edit-floating-menu');
runner.expect(reopenedMenu).toBeTruthy();
runner.expect(reopenedMenu.dataset.editType).toBe('image');
// Cleanup
if (renderer.currentFloatingMenu) {
renderer.currentFloatingMenu.hide();
}
document.body.removeChild(container);
}
});
runner.it('should clean up properly when hiding current editor', async () => {
if (global.DOMRenderer && global.SectionManager && global.FloatingMenu) {
const container = document.createElement('div');
container.innerHTML = '<div id="markdown-content"></div>';
document.body.appendChild(container);
const manager = new global.SectionManager();
const renderer = new global.DOMRenderer(manager, container);
const textMarkdown = 'Test section for cleanup testing';
const sections = manager.createSectionsFromMarkdown(textMarkdown);
const textSection = sections[0];
const mockElement = document.createElement('div');
mockElement.setAttribute('data-section-id', textSection.id);
Object.defineProperties(mockElement, {
getBoundingClientRect: {
value: () => ({ top: 100, right: 400, bottom: 150, left: 50, width: 350, height: 50 })
}
});
renderer.findSectionElement = () => mockElement;
// Open editor
renderer.showEditor(textSection.id, textSection.currentMarkdown);
// Verify menu exists
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
const menuBeforeHide = document.querySelector('.ui-edit-floating-menu');
runner.expect(menuBeforeHide).toBeTruthy();
// Call hideCurrentEditor
renderer.hideCurrentEditor();
// Verify proper cleanup
runner.expect(renderer.currentFloatingMenu).toBeFalsy();
const menuAfterHide = document.querySelector('.ui-edit-floating-menu');
runner.expect(menuAfterHide).toBeFalsy();
// Test that we can open again
renderer.showEditor(textSection.id, textSection.currentMarkdown);
runner.expect(renderer.currentFloatingMenu).toBeTruthy();
const reopenedMenu = document.querySelector('.ui-edit-floating-menu');
runner.expect(reopenedMenu).toBeTruthy();
// Cleanup
if (renderer.currentFloatingMenu) {
renderer.currentFloatingMenu.hide();
}
document.body.removeChild(container);
}
});
});
// Run the tests
if (require.main === module) {
console.log('🔄 Running Edit Menu Reopen Tests');
runner.run().then(() => {
const results = runner.results;
const failed = results.filter(r => r.status === 'FAIL').length;
if (failed > 0) {
console.log(`❌ ${failed} test(s) failed - reopen issue needs fixing`);
results.forEach(result => {
if (result.status === 'FAIL') {
console.log(`\nFailed test: ${result.name}`);
if (result.error) {
console.log(`Error: ${result.error}`);
}
}
});
} else {
console.log('✅ All reopen tests passed!');
}
});
}
module.exports = runner;