BookStack Code Mirror - bookstack/blob - resources/js/wysiwyg/services/__tests__/keyboard-handling.test.ts

   1 import {
   2     createTestContext,
   3     dispatchKeydownEventForNode,
   4     dispatchKeydownEventForSelectedNode,
   5     initializeUnitTest
   6 } from "lexical/__tests__/utils";
   7 import {
   8     $createParagraphNode, $createTextNode,
   9     $getRoot, LexicalNode,
  10     ParagraphNode,
  11 } from "lexical";
  12 import {$createDetailsNode, DetailsNode} from "@lexical/rich-text/LexicalDetailsNode";
  13 import {registerKeyboardHandling} from "../keyboard-handling";
  14 import {registerRichText} from "@lexical/rich-text";
  15
  16 describe('Keyboard-handling service tests', () => {
  17     initializeUnitTest((testEnv) => {
  18
  19         test('Details: down key on last lines creates new sibling node', () => {
  20             const {editor} = testEnv;
  21
  22             registerRichText(editor);
  23             registerKeyboardHandling(createTestContext(testEnv));
  24
  25             let lastRootChild!: LexicalNode|null;
  26             let detailsPara!: ParagraphNode;
  27
  28             editor.updateAndCommit(() => {
  29                 const root = $getRoot()
  30                 const details = $createDetailsNode();
  31                 detailsPara = $createParagraphNode();
  32                 details.append(detailsPara);
  33                 $getRoot().append(details);
  34                 detailsPara.select();
  35
  36                 lastRootChild = root.getLastChild();
  37             });
  38
  39             expect(lastRootChild).toBeInstanceOf(DetailsNode);
  40
  41             dispatchKeydownEventForNode(detailsPara, editor, 'ArrowDown');
  42             editor.commitUpdates();
  43
  44             editor.getEditorState().read(() => {
  45                 lastRootChild = $getRoot().getLastChild();
  46             });
  47
  48             expect(lastRootChild).toBeInstanceOf(ParagraphNode);
  49         });
  50
  51         test('Details: enter on last empy block creates new sibling node', () => {
  52             const {editor} = testEnv;
  53
  54             registerRichText(editor);
  55             registerKeyboardHandling(createTestContext(testEnv));
  56
  57             let lastRootChild!: LexicalNode|null;
  58             let detailsPara!: ParagraphNode;
  59
  60             editor.updateAndCommit(() => {
  61                 const root = $getRoot()
  62                 const details = $createDetailsNode();
  63                 const text = $createTextNode('Hello!');
  64                 detailsPara = $createParagraphNode();
  65                 detailsPara.append(text);
  66                 details.append(detailsPara);
  67                 $getRoot().append(details);
  68                 text.selectEnd();
  69
  70                 lastRootChild = root.getLastChild();
  71             });
  72
  73             expect(lastRootChild).toBeInstanceOf(DetailsNode);
  74
  75             dispatchKeydownEventForNode(detailsPara, editor, 'Enter');
  76             editor.commitUpdates();
  77
  78             dispatchKeydownEventForSelectedNode(editor, 'Enter');
  79             editor.commitUpdates();
  80
  81             let detailsChildren!: LexicalNode[];
  82             let lastDetailsText!: string;
  83
  84             editor.getEditorState().read(() => {
  85                 detailsChildren = (lastRootChild as DetailsNode).getChildren();
  86                 lastRootChild = $getRoot().getLastChild();
  87                 lastDetailsText = detailsChildren[0].getTextContent();
  88             });
  89
  90             expect(lastRootChild).toBeInstanceOf(ParagraphNode);
  91             expect(detailsChildren).toHaveLength(1);
  92             expect(lastDetailsText).toBe('Hello!');
  93         });
  94     });
  95 });