mirror/tiptap
1
0
Fork 0
mirror of https://github.com/ueberdosis/tiptap.git synced 2024-11-24 03:39:01 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: add tiptap class

Browse Source 
* update docs
* update demos
This commit is contained in:
Patrick Baber 2023-05-25 13:45:06 +02:00 committed by GitHub
parent d61a621186
commit 614fc8082c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
219 changed files with 1386 additions and 1378 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
demos/setup/helper.ts
View File

@ -29,7 +29,7 @@ export function debug() {
// @ts-ignore
sendData('source', window.source)
waitUntilElementExists('.ProseMirror', element => {
waitUntilElementExists('.tiptap', element => {
// @ts-ignore
const editor = element.editor

2
demos/setup/style.scss
View File

@ -73,7 +73,7 @@ select {
}
}
.ProseMirror:focus {
.tiptap:focus {
outline: none;
}

2
demos/src/Commands/InsertContent/Vue/index.vue
View File

@ -94,7 +94,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Demos/SingleRoomCollab/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

54
demos/src/Examples/AutolinkValidation/React/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/AutolinkValidation/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
})
const validLinks = [
@ -26,75 +26,75 @@ context('/src/Examples/AutolinkValidation/React/', () => {
validLinks.forEach(([rawTextInput, textThatShouldBeLinked]) => {
it(`should autolink ${rawTextInput}`, () => {
cy.get('.ProseMirror').type(rawTextInput)
cy.get('.ProseMirror a').contains(textThatShouldBeLinked)
cy.get('.tiptap').type(rawTextInput)
cy.get('.tiptap a').contains(textThatShouldBeLinked)
})
})
invalidLinks.forEach(rawTextInput => {
it(`should not autolink ${rawTextInput}`, () => {
cy.get('.ProseMirror').type(`{selectall}{backspace}${rawTextInput}`)
cy.get('.ProseMirror a').should('not.exist')
cy.get('.tiptap').type(`{selectall}{backspace}${rawTextInput}`)
cy.get('.tiptap a').should('not.exist')
})
})
it('should not relink unset links after entering second link', () => {
cy.get('.ProseMirror').type('https://tiptap.dev {home}')
cy.get('.ProseMirror').should('have.text', 'https://tiptap.dev ')
cy.get('.tiptap').type('https://tiptap.dev {home}')
cy.get('.tiptap').should('have.text', 'https://tiptap.dev ')
cy.get('[data-testid=unsetLink]').click()
cy.get('.ProseMirror')
cy.get('.tiptap')
.find('a')
.should('have.length', 0)
cy.get('.ProseMirror').type('{end}http://www.example.com/ ')
cy.get('.ProseMirror')
cy.get('.tiptap').type('{end}http://www.example.com/ ')
cy.get('.tiptap')
.find('a')
.should('have.length', 1)
.should('have.attr', 'href', 'http://www.example.com/')
})
it('should not relink unset links after hitting next paragraph', () => {
cy.get('.ProseMirror').type('https://tiptap.dev {home}')
cy.get('.ProseMirror').should('have.text', 'https://tiptap.dev ')
cy.get('.tiptap').type('https://tiptap.dev {home}')
cy.get('.tiptap').should('have.text', 'https://tiptap.dev ')
cy.get('[data-testid=unsetLink]').click()
cy.get('.ProseMirror')
cy.get('.tiptap')
.find('a')
.should('have.length', 0)
cy.get('.ProseMirror').type('{end}typing other text should prevent the link from relinking when hitting enter{enter}')
cy.get('.ProseMirror')
cy.get('.tiptap').type('{end}typing other text should prevent the link from relinking when hitting enter{enter}')
cy.get('.tiptap')
.find('a')
.should('have.length', 0)
})
it('should not relink unset links after modifying', () => {
cy.get('.ProseMirror').type('https://tiptap.dev {home}')
cy.get('.ProseMirror').should('have.text', 'https://tiptap.dev ')
cy.get('.tiptap').type('https://tiptap.dev {home}')
cy.get('.tiptap').should('have.text', 'https://tiptap.dev ')
cy.get('[data-testid=unsetLink]').click()
cy.get('.ProseMirror')
cy.get('.tiptap')
.find('a')
.should('have.length', 0)
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{home}')
.type('{rightArrow}'.repeat('https://'.length))
.type('blah')
cy.get('.ProseMirror').should('have.text', 'https://blahtiptap.dev ')
cy.get('.ProseMirror')
cy.get('.tiptap').should('have.text', 'https://blahtiptap.dev ')
cy.get('.tiptap')
.find('a')
.should('have.length', 0)
})
it('should autolink after hitting enter (new paragraph)', () => {
cy.get('.ProseMirror').type('https://tiptap.dev{enter}')
cy.get('.ProseMirror').should('have.text', 'https://tiptap.dev')
cy.get('.ProseMirror')
cy.get('.tiptap').type('https://tiptap.dev{enter}')
cy.get('.tiptap').should('have.text', 'https://tiptap.dev')
cy.get('.tiptap')
.find('a')
.should('have.length', 1)
.should('have.attr', 'href', 'https://tiptap.dev')
})
it('should autolink after hitting shift-enter (hardbreak)', () => {
cy.get('.ProseMirror').type('https://tiptap.dev{shift+enter}')
cy.get('.ProseMirror').should('have.text', 'https://tiptap.dev')
cy.get('.ProseMirror')
cy.get('.tiptap').type('https://tiptap.dev{shift+enter}')
cy.get('.tiptap').should('have.text', 'https://tiptap.dev')
cy.get('.tiptap')
.find('a')
.should('have.length', 1)
.should('have.attr', 'href', 'https://tiptap.dev')

2
demos/src/Examples/AutolinkValidation/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

10
demos/src/Examples/AutolinkValidation/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/AutolinkValidation/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
})
const validLinks = [
@ -26,15 +26,15 @@ context('/src/Examples/AutolinkValidation/Vue/', () => {
validLinks.forEach(([rawTextInput, textThatShouldBeLinked]) => {
it(`should autolink ${rawTextInput}`, () => {
cy.get('.ProseMirror').type(rawTextInput)
cy.get('.ProseMirror a').contains(textThatShouldBeLinked)
cy.get('.tiptap').type(rawTextInput)
cy.get('.tiptap a').contains(textThatShouldBeLinked)
})
})
invalidLinks.forEach(rawTextInput => {
it(`should not autolink ${rawTextInput}`, () => {
cy.get('.ProseMirror').type(`{selectall}{backspace}${rawTextInput}`)
cy.get('.ProseMirror a').should('not.exist')
cy.get('.tiptap').type(`{selectall}{backspace}${rawTextInput}`)
cy.get('.tiptap a').should('not.exist')
})
})
})

2
demos/src/Examples/AutolinkValidation/Vue/index.vue
View File

@ -45,7 +45,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/Book/React/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Book/React/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})

2
demos/src/Examples/Book/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/Book/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Book/Vue/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})

2
demos/src/Examples/Book/Vue/index.vue
View File

@ -106,7 +106,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CSSModules/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CSSModules/Vue/index.vue
View File

@ -131,7 +131,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CodeBlockLanguage/React/index.spec.js
View File

@ -15,7 +15,7 @@ context('/src/Examples/CodeBlockLanguage/React/', () => {
expect(initialCount).to.be.greaterThan(0)
cy.get('.ProseMirror select').select('java')
cy.get('.tiptap select').select('java')
cy.wait(500)
cy.get('[class^=hljs]').then(newElements => {

2
demos/src/Examples/CodeBlockLanguage/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CodeBlockLanguage/Vue/index.spec.js
View File

@ -15,7 +15,7 @@ context('/src/Examples/CodeBlockLanguage/Vue/', () => {
expect(initialCount).to.be.greaterThan(0)
cy.get('.ProseMirror select').select('java')
cy.get('.tiptap select').select('java')
cy.wait(500)
cy.get('[class^=hljs]').then(newElements => {

2
demos/src/Examples/CodeBlockLanguage/Vue/index.vue
View File

@ -87,7 +87,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CollaborativeEditing/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/CollaborativeEditing/Vue/index.vue
View File

@ -264,7 +264,7 @@ export default {
}
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

12
demos/src/Examples/Community/React/index.spec.js
View File

@ -7,17 +7,17 @@ context('/src/Examples/Community/React/', () => {
// check if count text is "44/280 characters"
cy.get('.character-count__text').should('have.text', '44/280 characters')
// type in .ProseMirror
cy.get('.ProseMirror').type(' Hello World')
// type in .tiptap
cy.get('.tiptap').type(' Hello World')
cy.get('.character-count__text').should('have.text', '56/280 characters')
// remove content from .ProseMirror and enter text
cy.get('.ProseMirror').type('{selectall}{backspace}Hello World')
// remove content from .tiptap and enter text
cy.get('.tiptap').type('{selectall}{backspace}Hello World')
cy.get('.character-count__text').should('have.text', '11/280 characters')
})
it('should mention a user', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}@')
cy.get('.tiptap').type('{selectall}{backspace}@')
// check if the mention autocomplete is visible
cy.get('.tippy-content .items').should('be.visible')
@ -29,7 +29,7 @@ context('/src/Examples/Community/React/', () => {
$el.click()
// check if the user is mentioned
cy.get('.ProseMirror').should('have.text', `@${name} `)
cy.get('.tiptap').should('have.text', `@${name} `)
cy.get('.character-count__text').should('have.text', '2/280 characters')
})

2
demos/src/Examples/Community/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

12
demos/src/Examples/Community/Vue/index.spec.js
View File

@ -7,17 +7,17 @@ context('/src/Examples/Community/Vue/', () => {
// check if count text is "44/280 characters"
cy.get('.character-count__text').should('have.text', '44/280 characters')
// type in .ProseMirror
cy.get('.ProseMirror').type(' Hello World')
// type in .tiptap
cy.get('.tiptap').type(' Hello World')
cy.get('.character-count__text').should('have.text', '56/280 characters')
// remove content from .ProseMirror and enter text
cy.get('.ProseMirror').type('{selectall}{backspace}Hello World')
// remove content from .tiptap and enter text
cy.get('.tiptap').type('{selectall}{backspace}Hello World')
cy.get('.character-count__text').should('have.text', '11/280 characters')
})
it('should mention a user', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}@')
cy.get('.tiptap').type('{selectall}{backspace}@')
// check if the mention autocomplete is visible
cy.get('.tippy-content .items').should('be.visible')
@ -29,7 +29,7 @@ context('/src/Examples/Community/Vue/', () => {
$el.click()
// check if the user is mentioned
cy.get('.ProseMirror').should('have.text', `@${name} `)
cy.get('.tiptap').should('have.text', `@${name} `)
cy.get('.character-count__text').should('have.text', '2/280 characters')
})

2
demos/src/Examples/Community/Vue/index.vue
View File

@ -96,7 +96,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

26
demos/src/Examples/CustomDocument/React/index.spec.js
View File

@ -4,42 +4,42 @@ context('/src/Examples/CustomDocument/React/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should have a headline and a paragraph', () => {
cy.get('.ProseMirror h1').should('exist').should('have.text', 'It’ll always have a heading …')
cy.get('.ProseMirror p').should('exist').should('have.text', '… if you pass a custom document. That’s the beauty of having full control over the schema.')
cy.get('.tiptap h1').should('exist').should('have.text', 'It’ll always have a heading …')
cy.get('.tiptap p').should('exist').should('have.text', '… if you pass a custom document. That’s the beauty of having full control over the schema.')
})
it('should have a tooltip for a paragraph on a new line', () => {
cy.get('.ProseMirror').type('{enter}')
cy.get('.ProseMirror p[data-placeholder]').should('exist').should('have.attr', 'data-placeholder', 'Can you add some further context?')
cy.get('.tiptap').type('{enter}')
cy.get('.tiptap p[data-placeholder]').should('exist').should('have.attr', 'data-placeholder', 'Can you add some further context?')
})
it('should have a headline after clearing the document', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.ProseMirror').focus()
cy.get('.ProseMirror h1[data-placeholder]')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('.tiptap').focus()
cy.get('.tiptap h1[data-placeholder]')
.should('exist')
.should('have.attr', 'class', 'is-empty is-editor-empty')
.should('have.attr', 'data-placeholder', 'What’s the title?')
})
it('should have a headline after clearing the document & enter paragraph automatically after adding a headline', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}Hello world{enter}')
cy.get('.ProseMirror h1')
cy.get('.tiptap').type('{selectall}{backspace}Hello world{enter}')
cy.get('.tiptap h1')
.should('exist')
.should('have.text', 'Hello world')
cy.get('.ProseMirror p[data-placeholder]')
cy.get('.tiptap p[data-placeholder]')
.should('exist')
.should('have.attr', 'data-placeholder', 'Can you add some further context?')
cy.get('.ProseMirror').type('This is a paragraph for this test document')
cy.get('.ProseMirror p')
cy.get('.tiptap').type('This is a paragraph for this test document')
cy.get('.tiptap p')
.should('exist')
.should('have.text', 'This is a paragraph for this test document')
})

6
demos/src/Examples/CustomDocument/React/styles.scss
View File

@ -1,12 +1,12 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}
}
/* Placeholder (at the top) */
/*.ProseMirror p.is-editor-empty:first-child::before {
/*.tiptap p.is-editor-empty:first-child::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;
@ -15,7 +15,7 @@
}*/
/* Placeholder (on every new line) */
.ProseMirror .is-empty::before {
.tiptap .is-empty::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;

26
demos/src/Examples/CustomDocument/Vue/index.spec.js
View File

@ -4,44 +4,44 @@ context('/src/Examples/CustomDocument/Vue/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should have a headline and a paragraph', () => {
cy.get('.ProseMirror h1').should('exist').should('have.text', 'It’ll always have a heading …')
cy.get('.ProseMirror p').should('exist').should('have.text', '… if you pass a custom document. That’s the beauty of having full control over the schema.')
cy.get('.tiptap h1').should('exist').should('have.text', 'It’ll always have a heading …')
cy.get('.tiptap p').should('exist').should('have.text', '… if you pass a custom document. That’s the beauty of having full control over the schema.')
})
it('should have a tooltip for a paragraph on a new line', () => {
cy.get('.ProseMirror').type('{enter}')
cy.get('.ProseMirror p[data-placeholder]').should('exist').should('have.attr', 'data-placeholder', 'Can you add some further context?')
cy.get('.tiptap').type('{enter}')
cy.get('.tiptap p[data-placeholder]').should('exist').should('have.attr', 'data-placeholder', 'Can you add some further context?')
})
it('should have a headline after clearing the document', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.wait(100)
cy.get('.ProseMirror').focus()
cy.get('.ProseMirror h1[data-placeholder]')
cy.get('.tiptap').focus()
cy.get('.tiptap h1[data-placeholder]')
.should('exist')
.should('have.attr', 'class', 'is-empty is-editor-empty')
.should('have.attr', 'data-placeholder', 'What’s the title?')
})
it('should have a headline after clearing the document & enter paragraph automatically after adding a headline', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}Hello world{enter}')
cy.get('.tiptap').type('{selectall}{backspace}Hello world{enter}')
cy.wait(100)
cy.get('.ProseMirror h1')
cy.get('.tiptap h1')
.should('exist')
.should('have.text', 'Hello world')
cy.get('.ProseMirror p[data-placeholder]')
cy.get('.tiptap p[data-placeholder]')
.should('exist')
.should('have.attr', 'data-placeholder', 'Can you add some further context?')
cy.get('.ProseMirror').type('This is a paragraph for this test document')
cy.get('.ProseMirror p')
cy.get('.tiptap').type('This is a paragraph for this test document')
cy.get('.tiptap p')
.should('exist')
.should('have.text', 'This is a paragraph for this test document')
})

6
demos/src/Examples/CustomDocument/Vue/index.vue
View File

@ -59,14 +59,14 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}
}
/* Placeholder (at the top) */
/*.ProseMirror p.is-editor-empty:first-child::before {
/*.tiptap p.is-editor-empty:first-child::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;
@ -75,7 +75,7 @@ export default {
}*/
/* Placeholder (on every new line) */
.ProseMirror .is-empty::before {
.tiptap .is-empty::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;

12
demos/src/Examples/CustomParagraph/React/index.spec.js
View File

@ -4,20 +4,20 @@ context('/src/Examples/CustomParagraph/React/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should have a paragraph and text length', () => {
cy.get('.ProseMirror p').should('exist').should('have.text', 'Each line shows the number of characters in the paragraph.')
cy.get('.ProseMirror .label').should('exist').should('have.text', '58')
cy.get('.tiptap p').should('exist').should('have.text', 'Each line shows the number of characters in the paragraph.')
cy.get('.tiptap .label').should('exist').should('have.text', '58')
})
it('should have new paragraph', () => {
cy.get('.ProseMirror').type('{selectall}{moveToEnd}{enter}')
cy.get('.ProseMirror p').eq(1).should('exist').should('have.text', '')
cy.get('.ProseMirror .label').eq(1).should('exist').should('have.text', '0')
cy.get('.tiptap').type('{selectall}{moveToEnd}{enter}')
cy.get('.tiptap p').eq(1).should('exist').should('have.text', '')
cy.get('.tiptap .label').eq(1).should('exist').should('have.text', '0')
})
})

6
demos/src/Examples/CustomParagraph/React/styles.scss
View File

@ -1,12 +1,12 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}
}
/* Placeholder (at the top) */
/*.ProseMirror p.is-editor-empty:first-child::before {
/*.tiptap p.is-editor-empty:first-child::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;
@ -15,7 +15,7 @@
}*/
/* Placeholder (on every new line) */
.ProseMirror .is-empty::before {
.tiptap .is-empty::before {
content: attr(data-placeholder);
float: left;
color: #ced4da;

12
demos/src/Examples/CustomParagraph/Vue/index.spec.js
View File

@ -4,20 +4,20 @@ context('/src/Examples/CustomParagraph/React/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should have a paragraph and text length', () => {
cy.get('.ProseMirror p').should('exist').should('have.text', 'Each line shows the number of characters in the paragraph.')
cy.get('.ProseMirror .label').should('exist').should('have.text', '58')
cy.get('.tiptap p').should('exist').should('have.text', 'Each line shows the number of characters in the paragraph.')
cy.get('.tiptap .label').should('exist').should('have.text', '58')
})
it('should have new paragraph', () => {
cy.get('.ProseMirror').type('{selectall}{moveToEnd}{enter}')
cy.get('.ProseMirror p').eq(1).should('exist').should('have.text', '')
cy.get('.ProseMirror .label').eq(1).should('exist').should('have.text', '0')
cy.get('.tiptap').type('{selectall}{moveToEnd}{enter}')
cy.get('.tiptap p').eq(1).should('exist').should('have.text', '')
cy.get('.tiptap .label').eq(1).should('exist').should('have.text', '0')
})
})

2
demos/src/Examples/CustomParagraph/Vue/index.vue
View File

@ -46,7 +46,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

74
demos/src/Examples/Default/React/index.spec.js
View File

@ -4,17 +4,17 @@ context('/src/Examples/Default/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<h1>Example Text</h1>')
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
})
})
it('should apply the paragraph style when the keyboard shortcut is pressed', () => {
cy.get('.ProseMirror h1').should('exist')
cy.get('.ProseMirror p').should('not.exist')
cy.get('.tiptap h1').should('exist')
cy.get('.tiptap p').should('not.exist')
cy.get('.ProseMirror')
cy.get('.tiptap')
.trigger('keydown', { modKey: true, altKey: true, key: '0' })
.find('p')
.should('contain', 'Example Text')
@ -28,58 +28,58 @@ context('/src/Examples/Default/React/', () => {
buttonMarks.forEach(m => {
it(`should disable ${m.label} when the code tag is enabled for cursor`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('be.disabled')
})
it(`should enable ${m.label} when the code tag is disabled for cursor`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('code').click()
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('not.be.disabled')
})
it(`should disable ${m.label} when the code tag is enabled for selection`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('be.disabled')
})
it(`should enable ${m.label} when the code tag is disabled for selection`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains('code').click()
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('not.be.disabled')
})
it(`should apply ${m.label} when the button is pressed`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains(m.label).click()
cy.get(`.ProseMirror ${m.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${m.tag}`).should('exist').should('have.text', 'Hello world')
})
})
it('should clear marks when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains('bold').click()
cy.get('.ProseMirror strong').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap strong').should('exist').should('have.text', 'Hello world')
cy.get('button').contains('clear marks').click()
cy.get('.ProseMirror strong').should('not.exist')
cy.get('.tiptap strong').should('not.exist')
})
it('should clear nodes when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('bullet list').click()
cy.get('.ProseMirror ul').should('exist').should('have.text', 'Hello world')
cy.get('.ProseMirror').type('{enter}A second item{enter}A third item{selectall}')
cy.get('.tiptap ul').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap').type('{enter}A second item{enter}A third item{selectall}')
cy.get('button').contains('clear nodes').click()
cy.get('.ProseMirror ul').should('not.exist')
cy.get('.ProseMirror p').should('have.length', 3)
cy.get('.tiptap ul').should('not.exist')
cy.get('.tiptap p').should('have.length', 3)
})
const buttonNodes = [
@ -98,46 +98,46 @@ context('/src/Examples/Default/React/', () => {
buttonNodes.forEach(n => {
it(`should set ${n.label} when the button is pressed`, () => {
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('not.exist')
cy.get(`.tiptap ${n.tag}`).should('not.exist')
})
})
it('should add a hr when on the same line as a node', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a hr when on a new line', () => {
cy.get('.ProseMirror').type('{rightArrow}{enter}')
cy.get('.tiptap').type('{rightArrow}{enter}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a br', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('hard break').click()
cy.get('.ProseMirror h1 br').should('exist')
cy.get('.tiptap h1 br').should('exist')
})
it('should undo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
})
it('should redo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
cy.get('button').contains('redo').click()
cy.get('.ProseMirror').should('not.contain', 'Hello world')
cy.get('.tiptap').should('not.contain', 'Hello world')
})
})

2
demos/src/Examples/Default/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

66
demos/src/Examples/Default/Svelte/index.spec.js
View File

@ -4,17 +4,17 @@ context('/src/Examples/Default/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<h1>Example Text</h1>')
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
})
})
it('should apply the paragraph style when the keyboard shortcut is pressed', () => {
cy.get('.ProseMirror h1').should('exist')
cy.get('.ProseMirror p').should('not.exist')
cy.get('.tiptap h1').should('exist')
cy.get('.tiptap p').should('not.exist')
cy.get('.ProseMirror')
cy.get('.tiptap')
.trigger('keydown', { modKey: true, altKey: true, key: '0' })
.find('p')
.should('contain', 'Example Text')
@ -28,32 +28,32 @@ context('/src/Examples/Default/React/', () => {
buttonMarks.forEach(m => {
it(`should apply ${m.label} when the button is pressed`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains(m.label).click()
cy.get(`.ProseMirror ${m.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${m.tag}`).should('exist').should('have.text', 'Hello world')
})
})
it('should clear marks when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains('bold').click()
cy.get('.ProseMirror strong').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap strong').should('exist').should('have.text', 'Hello world')
cy.get('button').contains('clear marks').click()
cy.get('.ProseMirror strong').should('not.exist')
cy.get('.tiptap strong').should('not.exist')
})
it('should clear nodes when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('bullet list').click()
cy.get('.ProseMirror ul').should('exist').should('have.text', 'Hello world')
cy.get('.ProseMirror').type('{enter}A second item{enter}A third item{selectall}')
cy.get('.tiptap ul').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap').type('{enter}A second item{enter}A third item{selectall}')
cy.get('button').contains('clear nodes').click()
cy.get('.ProseMirror ul').should('not.exist')
cy.get('.ProseMirror p').should('have.length', 3)
cy.get('.tiptap ul').should('not.exist')
cy.get('.tiptap p').should('have.length', 3)
})
const buttonNodes = [
@ -72,46 +72,46 @@ context('/src/Examples/Default/React/', () => {
buttonNodes.forEach(n => {
it(`should set ${n.label} when the button is pressed`, () => {
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('not.exist')
cy.get(`.tiptap ${n.tag}`).should('not.exist')
})
})
it('should add a hr when on the same line as a node', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a hr when on a new line', () => {
cy.get('.ProseMirror').type('{rightArrow}{enter}')
cy.get('.tiptap').type('{rightArrow}{enter}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a br', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('hard break').click()
cy.get('.ProseMirror h1 br').should('exist')
cy.get('.tiptap h1 br').should('exist')
})
it('should undo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
})
it('should redo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
cy.get('button').contains('redo').click()
cy.get('.ProseMirror').should('not.contain', 'Hello world')
cy.get('.tiptap').should('not.contain', 'Hello world')
})
})

2
demos/src/Examples/Default/Svelte/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

66
demos/src/Examples/Default/Vue/index.spec.js
View File

@ -4,17 +4,17 @@ context('/src/Examples/Default/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<h1>Example Text</h1>')
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
})
})
it('should apply the paragraph style when the keyboard shortcut is pressed', () => {
cy.get('.ProseMirror h1').should('exist')
cy.get('.ProseMirror p').should('not.exist')
cy.get('.tiptap h1').should('exist')
cy.get('.tiptap p').should('not.exist')
cy.get('.ProseMirror')
cy.get('.tiptap')
.trigger('keydown', { modKey: true, altKey: true, key: '0' })
.find('p')
.should('contain', 'Example Text')
@ -28,32 +28,32 @@ context('/src/Examples/Default/Vue/', () => {
buttonMarks.forEach(m => {
it(`should apply ${m.label} when the button is pressed`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains(m.label).click()
cy.get(`.ProseMirror ${m.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${m.tag}`).should('exist').should('have.text', 'Hello world')
})
})
it('should clear marks when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains('bold').click()
cy.get('.ProseMirror strong').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap strong').should('exist').should('have.text', 'Hello world')
cy.get('button').contains('clear marks').click()
cy.get('.ProseMirror strong').should('not.exist')
cy.get('.tiptap strong').should('not.exist')
})
it('should clear nodes when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('bullet list').click()
cy.get('.ProseMirror ul').should('exist').should('have.text', 'Hello world')
cy.get('.ProseMirror').type('{enter}A second item{enter}A third item{selectall}')
cy.get('.tiptap ul').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap').type('{enter}A second item{enter}A third item{selectall}')
cy.get('button').contains('clear nodes').click()
cy.get('.ProseMirror ul').should('not.exist')
cy.get('.ProseMirror p').should('have.length', 3)
cy.get('.tiptap ul').should('not.exist')
cy.get('.tiptap p').should('have.length', 3)
})
const buttonNodes = [
@ -72,46 +72,46 @@ context('/src/Examples/Default/Vue/', () => {
buttonNodes.forEach(n => {
it(`should set ${n.label} when the button is pressed`, () => {
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('not.exist')
cy.get(`.tiptap ${n.tag}`).should('not.exist')
})
})
it('should add a hr when on the same line as a node', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a hr when on a new line', () => {
cy.get('.ProseMirror').type('{rightArrow}{enter}')
cy.get('.tiptap').type('{rightArrow}{enter}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a br', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('hard break').click()
cy.get('.ProseMirror h1 br').should('exist')
cy.get('.tiptap h1 br').should('exist')
})
it('should undo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
})
it('should redo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
cy.get('button').contains('redo').click()
cy.get('.ProseMirror').should('not.contain', 'Hello world')
cy.get('.tiptap').should('not.contain', 'Hello world')
})
})

2
demos/src/Examples/Default/Vue/index.vue
View File

@ -128,7 +128,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

10
demos/src/Examples/Drawing/Vue/index.spec.js
View File

@ -4,18 +4,18 @@ context('/src/Examples/Drawing/Vue/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should have a svg canvas', () => {
cy.get('.ProseMirror svg').should('exist')
cy.get('.tiptap svg').should('exist')
})
it('should draw on the svg canvas', () => {
cy.get('.ProseMirror svg').should('exist')
cy.get('.tiptap svg').should('exist')
cy.wait(500)
@ -23,13 +23,13 @@ context('/src/Examples/Drawing/Vue/', () => {
const color = inputs[0].value
const size = inputs[1].value
cy.get('.ProseMirror svg')
cy.get('.tiptap svg')
.click()
.trigger('mousedown', { pageX: 100, pageY: 100, which: 1 })
.trigger('mousemove', { pageX: 200, pageY: 200, which: 1 })
.trigger('mouseup')
cy.get('.ProseMirror svg path')
cy.get('.tiptap svg path')
.should('exist')
.should('have.attr', 'stroke-width', size)
.should('have.attr', 'stroke', color.toUpperCase())

10
demos/src/Examples/Formatting/React/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Formatting/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
})
const marks = [
@ -13,9 +13,9 @@ context('/src/Examples/Formatting/React/', () => {
marks.forEach(m => {
it(`sets ${m.label}`, () => {
cy.get('.ProseMirror').type('Hello world.{selectall}')
cy.get('.tiptap').type('Hello world.{selectall}')
cy.get('button').contains(m.label).click()
cy.get('.ProseMirror mark').should('exist')
cy.get('.tiptap mark').should('exist')
})
})
@ -28,10 +28,10 @@ context('/src/Examples/Formatting/React/', () => {
alignments.forEach(a => {
it(`sets ${a.label}`, () => {
cy.get('.ProseMirror').type('Hello world.{selectall}')
cy.get('.tiptap').type('Hello world.{selectall}')
cy.get('button').contains(a.label).click()
if (a.alignment !== 'left') {
cy.get('.ProseMirror p').should('have.css', 'text-align', a.alignment)
cy.get('.tiptap p').should('have.css', 'text-align', a.alignment)
}
})
})

2
demos/src/Examples/Formatting/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
margin-top: 1rem;
> * + * {

10
demos/src/Examples/Formatting/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Formatting/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
})
const marks = [
@ -13,9 +13,9 @@ context('/src/Examples/Formatting/Vue/', () => {
marks.forEach(m => {
it(`sets ${m.label}`, () => {
cy.get('.ProseMirror').type('Hello world.{selectall}')
cy.get('.tiptap').type('Hello world.{selectall}')
cy.get('button').contains(m.label).click()
cy.get('.ProseMirror mark').should('exist')
cy.get('.tiptap mark').should('exist')
})
})
@ -28,10 +28,10 @@ context('/src/Examples/Formatting/Vue/', () => {
alignments.forEach(a => {
it(`sets ${a.label}`, () => {
cy.get('.ProseMirror').type('Hello world.{selectall}')
cy.get('.tiptap').type('Hello world.{selectall}')
cy.get('button').contains(a.label).click()
if (a.alignment !== 'left') {
cy.get('.ProseMirror p').should('have.css', 'text-align', a.alignment)
cy.get('.tiptap p').should('have.css', 'text-align', a.alignment)
}
})
})

2
demos/src/Examples/Formatting/Vue/index.vue
View File

@ -103,7 +103,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
margin-top: 1rem;
> * + * {

12
demos/src/Examples/Images/React/index.spec.js
View File

@ -4,21 +4,21 @@ context('/src/Examples/Images/React/', () => {
})
it('finds image elements inside editor', () => {
cy.get('.ProseMirror img').should('have.length', 2)
cy.get('.tiptap img').should('have.length', 2)
})
it('allows removing images', () => {
cy.get('.ProseMirror img').should('have.length', 2)
cy.get('.ProseMirror img').first().trigger('mousedown', { which: 1 })
cy.get('.ProseMirror').type('{backspace}')
cy.get('.ProseMirror img').should('have.length', 1)
cy.get('.tiptap img').should('have.length', 2)
cy.get('.tiptap img').first().trigger('mousedown', { which: 1 })
cy.get('.tiptap').type('{backspace}')
cy.get('.tiptap img').should('have.length', 1)
})
it('allows images to be added via URL', () => {
cy.window().then(win => {
cy.stub(win, 'prompt').returns('https://unsplash.it/250/250')
cy.get('button').contains('add image from URL').click({ force: false })
cy.get('.ProseMirror img').should('have.length', 3)
cy.get('.tiptap img').should('have.length', 3)
})
})
})

2
demos/src/Examples/Images/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

12
demos/src/Examples/Images/Vue/index.spec.js
View File

@ -5,14 +5,14 @@ context('/src/Examples/Images/Vue/', () => {
// TODO: Write tests
it('finds image elements inside editor', () => {
cy.get('.ProseMirror img').should('have.length', 2)
cy.get('.tiptap img').should('have.length', 2)
})
it('allows removing images', () => {
cy.get('.ProseMirror img').should('have.length', 2)
cy.get('.ProseMirror img').first().trigger('mousedown', { which: 1 })
cy.get('.ProseMirror').type('{backspace}')
cy.get('.ProseMirror img').should('have.length', 1)
cy.get('.tiptap img').should('have.length', 2)
cy.get('.tiptap img').first().trigger('mousedown', { which: 1 })
cy.get('.tiptap').type('{backspace}')
cy.get('.tiptap img').should('have.length', 1)
})
it('allows images to be added via URL', () => {
@ -22,7 +22,7 @@ context('/src/Examples/Images/Vue/', () => {
cy.wait(1000)
cy.get('button').contains('add image from URL').click({ force: false })
cy.wait(1000)
cy.get('.ProseMirror img').should('have.length', 3)
cy.get('.tiptap img').should('have.length', 3)
})
})
})

2
demos/src/Examples/Images/Vue/index.vue
View File

@ -59,7 +59,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

6
demos/src/Examples/InteractivityComponent/React/index.spec.js
View File

@ -4,18 +4,18 @@ context('/src/Examples/InteractivityComponent/React/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should render a custom node', () => {
cy.get('.ProseMirror .react-component').should('have.length', 1)
cy.get('.tiptap .react-component').should('have.length', 1)
})
it('should handle count click inside custom node', () => {
cy.get('.ProseMirror .react-component button')
cy.get('.tiptap .react-component button')
.should('have.text', 'This button has been clicked 0 times.')
.click()
.should('have.text', 'This button has been clicked 1 times.')

2
demos/src/Examples/InteractivityComponent/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

6
demos/src/Examples/InteractivityComponent/Vue/index.spec.js
View File

@ -4,18 +4,18 @@ context('/src/Examples/InteractivityComponent/Vue/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should render a custom node', () => {
cy.get('.ProseMirror .vue-component').should('have.length', 1)
cy.get('.tiptap .vue-component').should('have.length', 1)
})
it('should handle count click inside custom node', () => {
cy.get('.ProseMirror .vue-component button')
cy.get('.tiptap .vue-component button')
.should('have.text', 'This button has been clicked 0 times.')
.click()
.should('have.text', 'This button has been clicked 1 times.')

2
demos/src/Examples/InteractivityComponent/Vue/index.vue
View File

@ -45,7 +45,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Examples/InteractivityComponentContent/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

16
demos/src/Examples/InteractivityComponentContent/Vue/index.spec.js
View File

@ -4,19 +4,19 @@ context('/src/Examples/InteractivityComponentContent/Vue/', () => {
})
it('should have a working tiptap instance', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
// eslint-disable-next-line
expect(editor).to.not.be.null
})
})
it('should render a custom node', () => {
cy.get('.ProseMirror .vue-component')
cy.get('.tiptap .vue-component')
.should('have.length', 1)
})
it('should allow text editing inside component', () => {
cy.get('.ProseMirror .vue-component .content')
cy.get('.tiptap .vue-component .content')
.invoke('attr', 'contentEditable', true)
.invoke('text', '')
.type('Hello World!')
@ -24,24 +24,24 @@ context('/src/Examples/InteractivityComponentContent/Vue/', () => {
})
it('should allow text editing inside component with markdown text', () => {
cy.get('.ProseMirror .vue-component .content')
cy.get('.tiptap .vue-component .content')
.invoke('attr', 'contentEditable', true)
.invoke('text', '')
.type('Hello World! This is **bold**.')
.should('have.text', 'Hello World! This is bold.')
cy.get('.ProseMirror .vue-component .content strong')
cy.get('.tiptap .vue-component .content strong')
.should('exist')
})
it('should remove node via selectall', () => {
cy.get('.ProseMirror .vue-component')
cy.get('.tiptap .vue-component')
.should('have.length', 1)
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{selectall}{backspace}')
cy.get('.ProseMirror .vue-component')
cy.get('.tiptap .vue-component')
.should('have.length', 0)
})
})

2
demos/src/Examples/InteractivityComponentContent/Vue/index.vue
View File

@ -47,7 +47,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

28
demos/src/Examples/MarkdownShortcuts/React/index.spec.js
View File

@ -4,97 +4,97 @@ context('/src/Examples/MarkdownShortcuts/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('should make a h1', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('# Headline')
.find('h1')
.should('contain', 'Headline')
})
it('should make a h2', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('## Headline')
.find('h2')
.should('contain', 'Headline')
})
it('should make a h3', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('### Headline')
.find('h3')
.should('contain', 'Headline')
})
it('should make a h4', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('#### Headline')
.find('h4')
.should('contain', 'Headline')
})
it('should make a h5', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('##### Headline')
.find('h5')
.should('contain', 'Headline')
})
it('should make a h6', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('###### Headline')
.find('h6')
.should('contain', 'Headline')
})
it('should create inline code', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('`$foobar`')
.find('code')
.should('contain', '$foobar')
})
it('should create a code block without language', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('``` {enter}const foo = bar{enter}```')
.find('pre')
.should('contain', 'const foo = bar')
})
it('should create a bullet list from asteriks', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('* foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a bullet list from dashes', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('- foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a bullet list from pluses', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('+ foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a ordered list', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('1. foobar')
.find('ol')
.should('contain', 'foobar')
})
it('should create a blockquote', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('> foobar')
.find('blockquote')
.should('contain', 'foobar')

2
demos/src/Examples/MarkdownShortcuts/React/styles.scss
View File

@ -1,4 +1,4 @@
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

28
demos/src/Examples/MarkdownShortcuts/Vue/index.spec.js
View File

@ -4,97 +4,97 @@ context('/src/Examples/MarkdownShortcuts/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('should make a h1', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('# Headline')
.find('h1')
.should('contain', 'Headline')
})
it('should make a h2', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('## Headline')
.find('h2')
.should('contain', 'Headline')
})
it('should make a h3', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('### Headline')
.find('h3')
.should('contain', 'Headline')
})
it('should make a h4', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('#### Headline')
.find('h4')
.should('contain', 'Headline')
})
it('should make a h5', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('##### Headline')
.find('h5')
.should('contain', 'Headline')
})
it('should make a h6', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('###### Headline')
.find('h6')
.should('contain', 'Headline')
})
it('should create inline code', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('`$foobar`')
.find('code')
.should('contain', '$foobar')
})
it('should create a code block without language', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('``` {enter}const foo = bar{enter}```')
.find('pre')
.should('contain', 'const foo = bar')
})
it('should create a bullet list from asteriks', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('* foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a bullet list from dashes', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('- foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a bullet list from pluses', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('+ foobar')
.find('ul')
.should('contain', 'foobar')
})
it('should create a ordered list', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('1. foobar')
.find('ol')
.should('contain', 'foobar')
})
it('should create a blockquote', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('> foobar')
.find('blockquote')
.should('contain', 'foobar')

2
demos/src/Examples/MarkdownShortcuts/Vue/index.vue
View File

@ -54,7 +54,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

8
demos/src/Examples/Menus/React/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Menus/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.chain().focus().clearContent().run()
})
})
@ -15,7 +15,7 @@ context('/src/Examples/Menus/React/', () => {
})
it('should show menu when text is selected', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Test')
.type('{selectall}')
@ -40,7 +40,7 @@ context('/src/Examples/Menus/React/', () => {
marks.forEach(mark => {
it(`should apply ${mark.button} correctly`, () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Test')
.type('{selectall}')
@ -49,7 +49,7 @@ context('/src/Examples/Menus/React/', () => {
.contains(mark.button)
.click()
cy.get('.ProseMirror')
cy.get('.tiptap')
.find(`p ${mark.tag}`)
})
})

2
demos/src/Examples/Menus/React/styles.scss
View File

@ -1,4 +1,4 @@
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

8
demos/src/Examples/Menus/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Menus/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.chain().focus().clearContent().run()
})
})
@ -15,7 +15,7 @@ context('/src/Examples/Menus/Vue/', () => {
})
it('should show menu when text is selected', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Test')
.type('{selectall}')
@ -40,7 +40,7 @@ context('/src/Examples/Menus/Vue/', () => {
marks.forEach(mark => {
it(`should apply ${mark.button} correctly`, () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Test')
.type('{selectall}')
@ -49,7 +49,7 @@ context('/src/Examples/Menus/Vue/', () => {
.contains(mark.button)
.click()
cy.get('.ProseMirror')
cy.get('.tiptap')
.find(`p ${mark.tag}`)
})
})

2
demos/src/Examples/Menus/Vue/index.vue
View File

@ -82,7 +82,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

12
demos/src/Examples/Minimal/React/index.spec.js
View File

@ -4,20 +4,20 @@ context('/src/Examples/Minimal/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('text should be wrapped in a paragraph by default', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Example Text')
.find('p')
.should('contain', 'Example Text')
})
it('should parse paragraphs correctly', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<p>Example Text</p>')
expect(editor.getHTML()).to.eq('<p>Example Text</p>')
@ -27,19 +27,19 @@ context('/src/Examples/Minimal/React/', () => {
})
it('enter should make a new paragraph', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('First Paragraph{enter}Second Paragraph')
.find('p')
.should('have.length', 2)
})
it('backspace should remove the last paragraph', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{enter}')
.find('p')
.should('have.length', 2)
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{backspace}')
.find('p')
.should('have.length', 1)

2
demos/src/Examples/Minimal/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

12
demos/src/Examples/Minimal/Vue/index.spec.js
View File

@ -4,20 +4,20 @@ context('/src/Examples/Minimal/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('text should be wrapped in a paragraph by default', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('Example Text')
.find('p')
.should('contain', 'Example Text')
})
it('should parse paragraphs correctly', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<p>Example Text</p>')
expect(editor.getHTML()).to.eq('<p>Example Text</p>')
@ -27,19 +27,19 @@ context('/src/Examples/Minimal/Vue/', () => {
})
it('enter should make a new paragraph', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('First Paragraph{enter}Second Paragraph')
.find('p')
.should('have.length', 2)
})
it('backspace should remove the last paragraph', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{enter}')
.find('p')
.should('have.length', 2)
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('{backspace}')
.find('p')
.should('have.length', 1)

2
demos/src/Examples/Minimal/Vue/index.vue
View File

@ -45,7 +45,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

6
demos/src/Examples/Savvy/React/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Savvy/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
@ -24,11 +24,11 @@ context('/src/Examples/Savvy/React/', () => {
tests.forEach(test => {
it(`should parse ${test[0]} correctly`, () => {
cy.get('.ProseMirror').type(test[0]).should('contain', test[1])
cy.get('.tiptap').type(test[0]).should('contain', test[1])
})
})
it('should parse hex colors correctly', () => {
cy.get('.ProseMirror').type('#FD9170').find('.color')
cy.get('.tiptap').type('#FD9170').find('.color')
})
})

2
demos/src/Examples/Savvy/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

6
demos/src/Examples/Savvy/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Examples/Savvy/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
@ -24,14 +24,14 @@ context('/src/Examples/Savvy/Vue/', () => {
tests.forEach(test => {
it(`should parse ${test[0]} correctly`, () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type(test[0])
.should('contain', test[1])
})
})
it('should parse hex colors correctly', () => {
cy.get('.ProseMirror')
cy.get('.tiptap')
.type('#FD9170')
.find('.color')
})

2
demos/src/Examples/Savvy/Vue/index.vue
View File

@ -63,7 +63,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

58
demos/src/Examples/Tables/React/index.spec.js
View File

@ -4,119 +4,119 @@ context('/src/Examples/Tables/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
cy.get('button').contains('insertTable').click()
})
})
it('adds a table with three columns and three rows', () => {
cy.get('.ProseMirror table')
cy.get('.tiptap table')
.should('exist')
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('exist')
.should('have.length', 3)
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('exist')
.should('have.length', 3)
cy.get('.ProseMirror table td')
cy.get('.tiptap table td')
.should('exist')
.should('have.length', 6)
})
it('adds & delete columns', () => {
cy.get('button').contains('addColumnBefore').click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 4)
cy.get('button').contains('addColumnAfter').click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 5)
cy.get('button').contains('deleteColumn')
.click()
.click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 3)
})
it('adds & delete rows', () => {
cy.get('button').contains('addRowBefore').click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 4)
cy.get('button').contains('addRowAfter').click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 5)
cy.get('button').contains('deleteRow')
.click()
.click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 3)
})
it('should delete table', () => {
cy.get('button').contains('deleteTable').click()
cy.get('.ProseMirror table').should('not.exist')
cy.get('.tiptap table').should('not.exist')
})
it('should merge cells', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror table th').should('have.length', 2)
cy.get('.tiptap table th').should('have.length', 2)
})
it('should split cells', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror table th').should('have.length', 2)
cy.get('.tiptap table th').should('have.length', 2)
cy.get('button').contains('splitCell').click()
cy.get('.ProseMirror table th').should('have.length', 3)
cy.get('.tiptap table th').should('have.length', 3)
})
it('should toggle header columns', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.toggleHeaderColumn()
cy.get('.ProseMirror table th').should('have.length', 5)
cy.get('.tiptap table th').should('have.length', 5)
})
})
it('should toggle header row', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.toggleHeaderRow()
cy.get('.ProseMirror table th').should('have.length', 0)
cy.get('.tiptap table th').should('have.length', 0)
})
})
it('should merge split', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror th[colspan="2"]')
cy.get('.tiptap th[colspan="2"]')
.should('exist')
cy.get('button')
.contains('mergeOrSplit')
.click()
cy.get('.ProseMirror th[colspan="2"]')
cy.get('.tiptap th[colspan="2"]')
.should('not.exist')
})
it('should set cell attribute', () => {
cy.get('.ProseMirror').type('{downArrow}')
cy.get('.tiptap').type('{downArrow}')
cy.get('button').contains('setCellAttribute').click()
cy.get('.ProseMirror table td[style]').should('have.attr', 'style', 'background-color: #FAF594')
cy.get('.tiptap table td[style]').should('have.attr', 'style', 'background-color: #FAF594')
})
it('should move focus to next or prev cell', () => {
cy.get('.ProseMirror').type('Column 1')
cy.get('.tiptap').type('Column 1')
cy.get('button').contains('goToNextCell').click()
cy.get('.ProseMirror').type('Column 2')
cy.get('.tiptap').type('Column 2')
cy.get('button').contains('goToPreviousCell').click()
cy.get('.ProseMirror th').then(elements => {
cy.get('.tiptap th').then(elements => {
expect(elements[0].innerText).to.equal('Column 1')
expect(elements[1].innerText).to.equal('Column 2')
})

4
demos/src/Examples/Tables/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
margin: 1rem 0;
> * + * {
@ -58,7 +58,7 @@
}
/* Table-specific styling */
.ProseMirror {
.tiptap {
table {
border-collapse: collapse;
table-layout: fixed;

58
demos/src/Examples/Tables/Vue/index.spec.js
View File

@ -4,119 +4,119 @@ context('/src/Examples/Tables/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
cy.get('button').contains('insertTable').click()
})
})
it('adds a table with three columns and three rows', () => {
cy.get('.ProseMirror table')
cy.get('.tiptap table')
.should('exist')
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('exist')
.should('have.length', 3)
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('exist')
.should('have.length', 3)
cy.get('.ProseMirror table td')
cy.get('.tiptap table td')
.should('exist')
.should('have.length', 6)
})
it('adds & delete columns', () => {
cy.get('button').contains('addColumnBefore').click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 4)
cy.get('button').contains('addColumnAfter').click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 5)
cy.get('button').contains('deleteColumn')
.click()
.click()
cy.get('.ProseMirror table th')
cy.get('.tiptap table th')
.should('have.length', 3)
})
it('adds & delete rows', () => {
cy.get('button').contains('addRowBefore').click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 4)
cy.get('button').contains('addRowAfter').click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 5)
cy.get('button').contains('deleteRow')
.click()
.click()
cy.get('.ProseMirror table tr')
cy.get('.tiptap table tr')
.should('have.length', 3)
})
it('should delete table', () => {
cy.get('button').contains('deleteTable').click()
cy.get('.ProseMirror table').should('not.exist')
cy.get('.tiptap table').should('not.exist')
})
it('should merge cells', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror table th').should('have.length', 2)
cy.get('.tiptap table th').should('have.length', 2)
})
it('should split cells', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror table th').should('have.length', 2)
cy.get('.tiptap table th').should('have.length', 2)
cy.get('button').contains('splitCell').click()
cy.get('.ProseMirror table th').should('have.length', 3)
cy.get('.tiptap table th').should('have.length', 3)
})
it('should toggle header columns', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.toggleHeaderColumn()
cy.get('.ProseMirror table th').should('have.length', 5)
cy.get('.tiptap table th').should('have.length', 5)
})
})
it('should toggle header row', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.toggleHeaderRow()
cy.get('.ProseMirror table th').should('have.length', 0)
cy.get('.tiptap table th').should('have.length', 0)
})
})
it('should merge split', () => {
cy.get('.ProseMirror').type('{shift}{rightArrow}')
cy.get('.tiptap').type('{shift}{rightArrow}')
cy.get('button').contains('mergeCells').click()
cy.get('.ProseMirror th[colspan="2"]')
cy.get('.tiptap th[colspan="2"]')
.should('exist')
cy.get('button')
.contains('mergeOrSplit')
.click()
cy.get('.ProseMirror th[colspan="2"]')
cy.get('.tiptap th[colspan="2"]')
.should('not.exist')
})
it('should set cell attribute', () => {
cy.get('.ProseMirror').type('{downArrow}')
cy.get('.tiptap').type('{downArrow}')
cy.get('button').contains('setCellAttribute').click()
cy.get('.ProseMirror table td[style]').should('have.attr', 'style', 'background-color: #FAF594')
cy.get('.tiptap table td[style]').should('have.attr', 'style', 'background-color: #FAF594')
})
it('should move focus to next or prev cell', () => {
cy.get('.ProseMirror').type('Column 1')
cy.get('.tiptap').type('Column 1')
cy.get('button').contains('goToNextCell').click()
cy.get('.ProseMirror').type('Column 2')
cy.get('.tiptap').type('Column 2')
cy.get('button').contains('goToPreviousCell').click()
cy.get('.ProseMirror th').then(elements => {
cy.get('.tiptap th').then(elements => {
expect(elements[0].innerText).to.equal('Column 1')
expect(elements[1].innerText).to.equal('Column 2')
})

4
demos/src/Examples/Tables/Vue/index.vue
View File

@ -161,7 +161,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
margin: 1rem 0;
> * + * {
@ -220,7 +220,7 @@ export default {
}
/* Table-specific styling */
.ProseMirror {
.tiptap {
table {
border-collapse: collapse;
table-layout: fixed;

26
demos/src/Examples/Tasks/React/index.spec.js
View File

@ -4,29 +4,29 @@ context('/src/Examples/Tasks/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('should always use task items', () => {
cy.get('.ProseMirror input[type="checkbox"]').should('have.length', 1)
cy.get('.tiptap input[type="checkbox"]').should('have.length', 1)
})
it('should create new tasks', () => {
cy.get('.ProseMirror').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.ProseMirror input[type="checkbox"]').should('have.length', 3)
cy.get('.tiptap').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.tiptap input[type="checkbox"]').should('have.length', 3)
})
it('should check and uncheck tasks on click', () => {
cy.get('.ProseMirror').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 2)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 0)
cy.get('.tiptap').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.tiptap').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.tiptap').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 2)
cy.get('.tiptap').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.tiptap').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 0)
})
})

26
demos/src/Examples/Tasks/Vue/index.spec.js
View File

@ -4,29 +4,29 @@ context('/src/Examples/Tasks/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
it('should always use task items', () => {
cy.get('.ProseMirror input[type="checkbox"]').should('have.length', 1)
cy.get('.tiptap input[type="checkbox"]').should('have.length', 1)
})
it('should create new tasks', () => {
cy.get('.ProseMirror').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.ProseMirror input[type="checkbox"]').should('have.length', 3)
cy.get('.tiptap').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.tiptap input[type="checkbox"]').should('have.length', 3)
})
it('should check and uncheck tasks on click', () => {
cy.get('.ProseMirror').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 2)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.ProseMirror').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.ProseMirror').find('input[type="checkbox"]:checked').should('have.length', 0)
cy.get('.tiptap').type('Cook food{enter}Eat food{enter}Clean dishes')
cy.get('.tiptap').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.tiptap').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 2)
cy.get('.tiptap').find('input[type="checkbox"]').eq(0).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 1)
cy.get('.tiptap').find('input[type="checkbox"]').eq(1).click({ force: true })
cy.get('.tiptap').find('input[type="checkbox"]:checked').should('have.length', 0)
})
})

4
demos/src/Experiments/All/Vue/index.vue
View File

@ -263,7 +263,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}
@ -445,7 +445,7 @@ export default {
}
}
.ProseMirror p.is-empty::before {
.tiptap p.is-empty::before {
content: attr(data-placeholder);
float: left;
color: #adb5bd;

20
demos/src/Experiments/CollaborationAnnotation/Vue/index.spec.js
View File

@ -4,20 +4,20 @@ context('/src/Experiments/CollaborationAnnotation/Vue/', () => {
})
/* it('renders two editors', () => {
cy.get('.ProseMirror').should('have.length', 2)
cy.get('.tiptap').should('have.length', 2)
}) */
// TODO: Fix those tests in the future
// Current problem is that ProseMirror seems to mismatch a transformation somewhere inside those tests
// Current problem is that tiptap seems to mismatch a transformation somewhere inside those tests
// So to fix this, we should look for a different way to simulate the annotation process
/* it('sets an annotation in editor 1 and shows annotations in both editors', () => {
cy.window().then(win => {
cy.stub(win, 'prompt', () => 'This is a test comment')
cy.get('.editor-1 .ProseMirror').type('{selectall}{backspace}Hello world{selectall}')
cy.get('.editor-1 .tiptap').type('{selectall}{backspace}Hello world{selectall}')
cy.get('button').contains('comment').eq(0).click()
cy.get('.editor-1 .ProseMirror').type('{end}')
cy.get('.ProseMirror .annotation').should('have.length', 2)
cy.get('.editor-1 .tiptap').type('{end}')
cy.get('.tiptap .annotation').should('have.length', 2)
cy.get('.comment').should('exist').contains('This is a test comment')
})
}) */
@ -41,10 +41,10 @@ context('/src/Experiments/CollaborationAnnotation/Vue/', () => {
}
})
cy.get('.editor-1 .ProseMirror').type('{selectall}{backspace}Hello world{selectall}')
cy.get('.editor-1 .tiptap').type('{selectall}{backspace}Hello world{selectall}')
cy.get('button').contains('comment').eq(0).click()
cy.wait(1000)
cy.get('.editor-1 .ProseMirror').find('.annotation').click()
cy.get('.editor-1 .tiptap').find('.annotation').click()
cy.get('.comment').should('exist').contains('This is a test comment')
cy.get('button').contains('update').click()
cy.wait(1000)
@ -56,13 +56,13 @@ context('/src/Experiments/CollaborationAnnotation/Vue/', () => {
cy.window().then(win => {
cy.stub(win, 'prompt', () => 'This is a test comment')
cy.get('.editor-1 .ProseMirror').type('{selectall}{backspace}Hello world{selectall}')
cy.get('.editor-1 .tiptap').type('{selectall}{backspace}Hello world{selectall}')
cy.get('button').contains('comment').eq(0).click()
cy.wait(1000)
cy.get('.editor-1 .ProseMirror').find('.annotation').click()
cy.get('.editor-1 .tiptap').find('.annotation').click()
cy.get('.comment').should('exist').contains('This is a test comment')
cy.get('button').contains('remove').click()
cy.get('.ProseMirror .annotation').should('not.exist')
cy.get('.tiptap .annotation').should('not.exist')
cy.wait(1000)
cy.get('.comment').should('not.exist')
})

2
demos/src/Experiments/CollaborationAnnotation/Vue/index.vue
View File

@ -137,7 +137,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

18
demos/src/Experiments/Commands/Vue/index.spec.js
View File

@ -4,7 +4,7 @@ context('/src/Experiments/Commands/Vue/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.clearContent()
})
})
@ -18,27 +18,27 @@ context('/src/Experiments/Commands/Vue/', () => {
]
items.forEach((item, i) => {
cy.get('.ProseMirror').type('{selectall}{backspace}/')
cy.get('.tiptap').type('{selectall}{backspace}/')
cy.get('.tippy-content .items').should('exist')
cy.get('.tippy-content .items .item').eq(i).click()
cy.get('.ProseMirror').type(`I am a ${item.tag}`)
cy.get(`.ProseMirror ${item.tag}`).should('exist').should('have.text', `I am a ${item.tag}`)
cy.get('.tiptap').type(`I am a ${item.tag}`)
cy.get(`.tiptap ${item.tag}`).should('exist').should('have.text', `I am a ${item.tag}`)
})
})
it('should close the popup without any command via esc', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}/')
cy.get('.tiptap').type('{selectall}{backspace}/')
cy.get('.tippy-content .items').should('exist')
cy.get('.ProseMirror').type('{esc}')
cy.get('.tiptap').type('{esc}')
cy.get('.tippy-content .items').should('not.exist')
})
it('should open the popup when the cursor is after a slash', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}/')
cy.get('.tiptap').type('{selectall}{backspace}/')
cy.get('.tippy-content .items').should('exist')
cy.get('.ProseMirror').type('{leftArrow}')
cy.get('.tiptap').type('{leftArrow}')
cy.get('.tippy-content .items').should('not.exist')
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('.tippy-content .items').should('exist')
})
})

2
demos/src/Experiments/Commands/Vue/index.vue
View File

@ -45,7 +45,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/DestroyingEditor/Vue/index.vue
View File

@ -41,7 +41,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/Embeds/Vue/index.vue
View File

@ -56,7 +56,7 @@ export default {
<style lang="scss">
@use "sass:math";
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/ExtensionStorage/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/ExtensionStorage/Vue/index.vue
View File

@ -49,7 +49,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/Figure/Vue/index.vue
View File

@ -85,7 +85,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/GenericFigure/Vue/index.vue
View File

@ -244,7 +244,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/GlobalDragHandle/Vue/index.vue
View File

@ -71,7 +71,7 @@ export default {
</style>
<style lang="scss">
.ProseMirror {
.tiptap {
padding: 0 1rem;
> * + * {

74
demos/src/Experiments/IsolatingClear/React/index.spec.js
View File

@ -4,17 +4,17 @@ context('/src/Examples/Default/React/', () => {
})
beforeEach(() => {
cy.get('.ProseMirror').then(([{ editor }]) => {
cy.get('.tiptap').then(([{ editor }]) => {
editor.commands.setContent('<h1>Example Text</h1>')
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
})
})
it('should apply the paragraph style when the keyboard shortcut is pressed', () => {
cy.get('.ProseMirror h1').should('exist')
cy.get('.ProseMirror p').should('not.exist')
cy.get('.tiptap h1').should('exist')
cy.get('.tiptap p').should('not.exist')
cy.get('.ProseMirror')
cy.get('.tiptap')
.trigger('keydown', { modKey: true, altKey: true, key: '0' })
.find('p')
.should('contain', 'Example Text')
@ -28,58 +28,58 @@ context('/src/Examples/Default/React/', () => {
buttonMarks.forEach(m => {
it(`should disable ${m.label} when the code tag is enabled for cursor`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('be.disabled')
})
it(`should enable ${m.label} when the code tag is disabled for cursor`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('code').click()
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('not.be.disabled')
})
it(`should disable ${m.label} when the code tag is enabled for selection`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('be.disabled')
})
it(`should enable ${m.label} when the code tag is disabled for selection`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains('code').click()
cy.get('button').contains('code').click()
cy.get('button').contains(m.label).should('not.be.disabled')
})
it(`should apply ${m.label} when the button is pressed`, () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains(m.label).click()
cy.get(`.ProseMirror ${m.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${m.tag}`).should('exist').should('have.text', 'Hello world')
})
})
it('should clear marks when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}')
cy.get('.tiptap').type('{selectall}')
cy.get('button').contains('bold').click()
cy.get('.ProseMirror strong').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap strong').should('exist').should('have.text', 'Hello world')
cy.get('button').contains('clear marks').click()
cy.get('.ProseMirror strong').should('not.exist')
cy.get('.tiptap strong').should('not.exist')
})
it('should clear nodes when the button is pressed', () => {
cy.get('.ProseMirror').type('{selectall}Hello world')
cy.get('.tiptap').type('{selectall}Hello world')
cy.get('button').contains('bullet list').click()
cy.get('.ProseMirror ul').should('exist').should('have.text', 'Hello world')
cy.get('.ProseMirror').type('{enter}A second item{enter}A third item{selectall}')
cy.get('.tiptap ul').should('exist').should('have.text', 'Hello world')
cy.get('.tiptap').type('{enter}A second item{enter}A third item{selectall}')
cy.get('button').contains('clear nodes').click()
cy.get('.ProseMirror ul').should('not.exist')
cy.get('.ProseMirror p').should('have.length', 3)
cy.get('.tiptap ul').should('not.exist')
cy.get('.tiptap p').should('have.length', 3)
})
const buttonNodes = [
@ -98,46 +98,46 @@ context('/src/Examples/Default/React/', () => {
buttonNodes.forEach(n => {
it(`should set ${n.label} when the button is pressed`, () => {
cy.get('button').contains('paragraph').click()
cy.get('.ProseMirror').type('{selectall}Hello world{selectall}')
cy.get('.tiptap').type('{selectall}Hello world{selectall}')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get(`.tiptap ${n.tag}`).should('exist').should('have.text', 'Hello world')
cy.get('button').contains(n.label).click()
cy.get(`.ProseMirror ${n.tag}`).should('not.exist')
cy.get(`.tiptap ${n.tag}`).should('not.exist')
})
})
it('should add a hr when on the same line as a node', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a hr when on a new line', () => {
cy.get('.ProseMirror').type('{rightArrow}{enter}')
cy.get('.tiptap').type('{rightArrow}{enter}')
cy.get('button').contains('horizontal rule').click()
cy.get('.ProseMirror hr').should('exist')
cy.get('.ProseMirror h1').should('exist')
cy.get('.tiptap hr').should('exist')
cy.get('.tiptap h1').should('exist')
})
it('should add a br', () => {
cy.get('.ProseMirror').type('{rightArrow}')
cy.get('.tiptap').type('{rightArrow}')
cy.get('button').contains('hard break').click()
cy.get('.ProseMirror h1 br').should('exist')
cy.get('.tiptap h1 br').should('exist')
})
it('should undo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
})
it('should redo', () => {
cy.get('.ProseMirror').type('{selectall}{backspace}')
cy.get('.tiptap').type('{selectall}{backspace}')
cy.get('button').contains('undo').click()
cy.get('.ProseMirror').should('contain', 'Hello world')
cy.get('.tiptap').should('contain', 'Hello world')
cy.get('button').contains('redo').click()
cy.get('.ProseMirror').should('not.contain', 'Hello world')
cy.get('.tiptap').should('not.contain', 'Hello world')
})
})

2
demos/src/Experiments/IsolatingClear/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/Linter/Vue/index.vue
View File

@ -91,7 +91,7 @@ export default {
content: "!";
}
.ProseMirror {
.tiptap {
padding-right: 20px;
}
</style>

2
demos/src/Experiments/MultipleEditors/Vue/index.vue
View File

@ -142,7 +142,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/OnUpdateRerender/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Experiments/TrailingNode/Vue/index.vue
View File

@ -41,7 +41,7 @@ export default {
</script>
<style lang="scss">
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Extensions/BubbleMenu/React/styles.scss
View File

@ -1,4 +1,4 @@
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Extensions/BubbleMenu/Vue/index.vue
View File

@ -67,7 +67,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Extensions/CharacterCount/React/styles.scss
View File

@ -1,5 +1,5 @@
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

2
demos/src/Extensions/CharacterCount/Vue/index.vue
View File

@ -55,7 +55,7 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
.tiptap {
> * + * {
margin-top: 0.75em;
}

4
demos/src/Extensions/Collaboration/React/styles.scss
View File

@ -1,12 +1,12 @@
/* Basic editor styles */
.ProseMirror {
tiptap {
> * + * {
margin-top: 0.75em;
}
}
/* Placeholder (at the top) */
.ProseMirror p.is-editor-empty:first-child::before {
tiptap p.is-editor-empty:first-child::before {
color: #adb5bd;
content: attr(data-placeholder);
float: left;

4
demos/src/Extensions/Collaboration/Vue/index.vue
View File

@ -53,14 +53,14 @@ export default {
<style lang="scss">
/* Basic editor styles */
.ProseMirror {
tiptap {
> * + * {
margin-top: 0.75em;
}
}
/* Placeholder (at the top) */
.ProseMirror p.is-editor-empty:first-child::before {
tiptap p.is-editor-empty:first-child::before {
content: attr(data-placeholder);
float: left;
color: #adb5bd;

Some files were not shown because too many files have changed in this diff Show More