BookStack Code Mirror - bookstack/blob - resources/js/wysiwyg/lexical/rich-text/__tests__/unit/LexicalQuoteNode.test.ts

   1 /**
   2  * Copyright (c) Meta Platforms, Inc. and affiliates.
   3  *
   4  * This source code is licensed under the MIT license found in the
   5  * LICENSE file in the root directory of this source tree.
   6  *
   7  */
   8
   9 import {$createQuoteNode, QuoteNode} from '@lexical/rich-text';
  10 import {$createRangeSelection, $getRoot, ParagraphNode} from 'lexical';
  11 import {initializeUnitTest} from 'lexical/__tests__/utils';
  12
  13 const editorConfig = Object.freeze({
  14   namespace: '',
  15   theme: {
  16     quote: 'my-quote-class',
  17   },
  18 });
  19
  20 describe('LexicalQuoteNode tests', () => {
  21   initializeUnitTest((testEnv) => {
  22     test('QuoteNode.constructor', async () => {
  23       const {editor} = testEnv;
  24       await editor.update(() => {
  25         const quoteNode = $createQuoteNode();
  26         expect(quoteNode.getType()).toBe('quote');
  27         expect(quoteNode.getTextContent()).toBe('');
  28       });
  29       expect(() => $createQuoteNode()).toThrow();
  30     });
  31
  32     test('QuoteNode.createDOM()', async () => {
  33       const {editor} = testEnv;
  34       await editor.update(() => {
  35         const quoteNode = $createQuoteNode();
  36         expect(quoteNode.createDOM(editorConfig).outerHTML).toBe(
  37           '<blockquote class="my-quote-class"></blockquote>',
  38         );
  39         expect(
  40           quoteNode.createDOM({
  41             namespace: '',
  42             theme: {},
  43           }).outerHTML,
  44         ).toBe('<blockquote></blockquote>');
  45       });
  46     });
  47
  48     test('QuoteNode.updateDOM()', async () => {
  49       const {editor} = testEnv;
  50       await editor.update(() => {
  51         const quoteNode = $createQuoteNode();
  52         const domElement = quoteNode.createDOM(editorConfig);
  53         expect(domElement.outerHTML).toBe(
  54           '<blockquote class="my-quote-class"></blockquote>',
  55         );
  56         const newQuoteNode = $createQuoteNode();
  57         const result = newQuoteNode.updateDOM(quoteNode, domElement);
  58         expect(result).toBe(false);
  59         expect(domElement.outerHTML).toBe(
  60           '<blockquote class="my-quote-class"></blockquote>',
  61         );
  62       });
  63     });
  64
  65     test('QuoteNode.insertNewAfter()', async () => {
  66       const {editor} = testEnv;
  67       let quoteNode: QuoteNode;
  68       await editor.update(() => {
  69         const root = $getRoot();
  70         quoteNode = $createQuoteNode();
  71         root.append(quoteNode);
  72       });
  73       expect(testEnv.outerHTML).toBe(
  74         '<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><blockquote><br></blockquote></div>',
  75       );
  76       await editor.update(() => {
  77         const result = quoteNode.insertNewAfter($createRangeSelection());
  78         expect(result).toBeInstanceOf(ParagraphNode);
  79         expect(result.getDirection()).toEqual(quoteNode.getDirection());
  80       });
  81       expect(testEnv.outerHTML).toBe(
  82         '<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><blockquote><br></blockquote><p><br></p></div>',
  83       );
  84     });
  85
  86     test('$createQuoteNode()', async () => {
  87       const {editor} = testEnv;
  88       await editor.update(() => {
  89         const quoteNode = $createQuoteNode();
  90         const createdQuoteNode = $createQuoteNode();
  91         expect(quoteNode.__type).toEqual(createdQuoteNode.__type);
  92         expect(quoteNode.__parent).toEqual(createdQuoteNode.__parent);
  93         expect(quoteNode.__key).not.toEqual(createdQuoteNode.__key);
  94       });
  95     });
  96   });
  97 });