From dee562f5ef9630d9104bac97e62cd51d993e00bc Mon Sep 17 00:00:00 2001 From: Sven Adlung Date: Tue, 16 Nov 2021 15:49:38 +0100 Subject: [PATCH] Add Text demo for React --- demos/src/Nodes/Text/React/index.html | 15 +++++++++++++++ demos/src/Nodes/Text/React/index.jsx | 20 ++++++++++++++++++++ demos/src/Nodes/Text/React/index.spec.js | 15 +++++++++++++++ 3 files changed, 50 insertions(+) create mode 100644 demos/src/Nodes/Text/React/index.html create mode 100644 demos/src/Nodes/Text/React/index.jsx create mode 100644 demos/src/Nodes/Text/React/index.spec.js diff --git a/demos/src/Nodes/Text/React/index.html b/demos/src/Nodes/Text/React/index.html new file mode 100644 index 00000000..24a15eb5 --- /dev/null +++ b/demos/src/Nodes/Text/React/index.html @@ -0,0 +1,15 @@ + + + + + + + +
+ + + diff --git a/demos/src/Nodes/Text/React/index.jsx b/demos/src/Nodes/Text/React/index.jsx new file mode 100644 index 00000000..b7702abe --- /dev/null +++ b/demos/src/Nodes/Text/React/index.jsx @@ -0,0 +1,20 @@ +import React from 'react' +import { useEditor, EditorContent } from '@tiptap/react' +import Document from '@tiptap/extension-document' +import Paragraph from '@tiptap/extension-paragraph' +import Text from '@tiptap/extension-text' + +export default () => { + const editor = useEditor({ + extensions: [Document, Paragraph, Text], + content: ` +

The Text extension is required, at least if you want to have text in your text editor and that’s very likely.

+ `, + }) + + if (!editor) { + return null + } + + return +} diff --git a/demos/src/Nodes/Text/React/index.spec.js b/demos/src/Nodes/Text/React/index.spec.js new file mode 100644 index 00000000..28ae8618 --- /dev/null +++ b/demos/src/Nodes/Text/React/index.spec.js @@ -0,0 +1,15 @@ +context('/src/Nodes/Text/React/', () => { + before(() => { + cy.visit('/src/Nodes/Text/React/') + }) + + beforeEach(() => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.clearContent() + }) + }) + + it('text should be wrapped in a paragraph by default', () => { + cy.get('.ProseMirror').type('Example Text').find('p').should('contain', 'Example Text') + }) +})