refactor

test/test.wysiwyg-split.browser.ts

@@ -0,0 +1,98 @@
+import { tap, expect, webhelpers } from '@git.zone/tstest/tapbundle';
+
+import { DeesInputWysiwyg } from '../ts_web/elements/wysiwyg/dees-input-wysiwyg.js';
+import { DeesWysiwygBlock } from '../ts_web/elements/wysiwyg/dees-wysiwyg-block.js';
+
+tap.test('should split paragraph content on Enter key', async () => {
+  // Create the wysiwyg editor
+  const editor: DeesInputWysiwyg = await webhelpers.fixture(
+    webhelpers.html`<dees-input-wysiwyg></dees-input-wysiwyg>`
+  );
+  
+  // Import a test paragraph
+  editor.importBlocks([{
+    id: 'test-para-1',
+    type: 'paragraph',
+    content: 'Hello World'
+  }]);
+  
+  await editor.updateComplete;
+  
+  // Wait for blocks to render
+  await new Promise(resolve => setTimeout(resolve, 100));
+  
+  // Get the block wrapper and component
+  const blockWrapper = editor.shadowRoot?.querySelector('[data-block-id="test-para-1"]');
+  expect(blockWrapper).toBeDefined();
+  
+  const blockComponent = blockWrapper?.querySelector('dees-wysiwyg-block') as DeesWysiwygBlock;
+  expect(blockComponent).toBeDefined();
+  expect(blockComponent.block.type).toEqual('paragraph');
+  
+  // Wait for block to render
+  await blockComponent.updateComplete;
+  
+  // Test getSplitContent
+  console.log('Testing getSplitContent...');
+  const splitResult = blockComponent.getSplitContent();
+  console.log('Split result:', splitResult);
+  
+  // Since we haven't set cursor position, it might return null or split at start
+  // This is just to test if the method is callable
+  expect(typeof blockComponent.getSplitContent).toEqual('function');
+});
+
+tap.test('should handle Enter key press in paragraph', async () => {
+  // Create the wysiwyg editor
+  const editor: DeesInputWysiwyg = await webhelpers.fixture(
+    webhelpers.html`<dees-input-wysiwyg></dees-input-wysiwyg>`
+  );
+  
+  // Import a test paragraph
+  editor.importBlocks([{
+    id: 'test-enter-1',
+    type: 'paragraph',
+    content: 'First part|Second part' // | marks where we'll simulate cursor
+  }]);
+  
+  await editor.updateComplete;
+  await new Promise(resolve => setTimeout(resolve, 100));
+  
+  // Check initial state
+  expect(editor.blocks.length).toEqual(1);
+  expect(editor.blocks[0].content).toEqual('First part|Second part');
+  
+  // Get the block element
+  const blockWrapper = editor.shadowRoot?.querySelector('[data-block-id="test-enter-1"]');
+  const blockComponent = blockWrapper?.querySelector('dees-wysiwyg-block') as DeesWysiwygBlock;
+  const blockElement = blockComponent.shadowRoot?.querySelector('.block.paragraph') as HTMLDivElement;
+  
+  expect(blockElement).toBeDefined();
+  
+  // Set content without the | marker
+  blockElement.textContent = 'First partSecond part';
+  
+  // Focus the block
+  blockElement.focus();
+  
+  // Create and dispatch Enter key event
+  const enterEvent = new KeyboardEvent('keydown', {
+    key: 'Enter',
+    code: 'Enter',
+    bubbles: true,
+    cancelable: true,
+    composed: true
+  });
+  
+  // Dispatch the event
+  blockElement.dispatchEvent(enterEvent);
+  
+  // Wait for processing
+  await new Promise(resolve => setTimeout(resolve, 200));
+  
+  // Check if block was split (this might not work perfectly in test environment)
+  console.log('Blocks after Enter:', editor.blocks.length);
+  console.log('Block contents:', editor.blocks.map(b => b.content));
+});
+
+export default tap.start();