ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

improve tests

Browse Source
This commit is contained in:
Hans Pagel
2020-10-12 17:47:22 +02:00
parent 2364ebd974
commit 7ad63a2921
1 changed files with 47 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
docs/src/demos/Extensions/Highlight/index.spec.js
View File

@@ -20,26 +20,24 @@ context('/api/extensions/highlight', () => {
}) })
it('should highlight the text in a specific color', () => { it('should highlight the text in a specific color', () => {
cy.get('.demo__preview button:nth-child(2)') cy.get('.ProseMirror').then(([{ editor }]) => {
.click() editor.highlight({ color: 'rgb(255, 0, 0)' })
cy.get('.ProseMirror') cy.get('.ProseMirror')
.find('mark') .find('mark')
.should('contain', 'Example Text') .should('contain', 'Example Text')
.should('have.css', 'background-color', 'rgb(255, 0, 0)') .should('have.css', 'background-color', 'rgb(255, 0, 0)')
})
}) })
it('should update the attributes of existing marks', () => { it('should update the attributes of existing marks', () => {
cy.get('.ProseMirror').then(([{ editor }]) => { cy.get('.ProseMirror').then(([{ editor }]) => {
editor.setContent('<p><mark style="background-color: blue;">Example Text</mark></p>') editor
editor.selectAll() .chain()
.setContent('<p><mark style="background-color: blue;">Example Text</mark></p>')
cy.get('.ProseMirror') .selectAll()
.find('mark') .highlight({ color: 'rgb(255, 0, 0)' })
.should('have.css', 'background-color', 'rgb(0, 0, 255)') .run()
cy.get('.demo__preview button:nth-child(2)')
.click()
cy.get('.ProseMirror') cy.get('.ProseMirror')
.find('mark') .find('mark')
@@ -49,29 +47,50 @@ context('/api/extensions/highlight', () => {
it('should remove existing marks with the same attributes', () => { it('should remove existing marks with the same attributes', () => {
cy.get('.ProseMirror').then(([{ editor }]) => { cy.get('.ProseMirror').then(([{ editor }]) => {
editor.setContent('<p><mark style="background-color: red;">Example Text</mark></p>') editor.setContent('<p><mark style="background-color: rgb(255, 0, 0);">Example Text</mark></p>')
editor.selectAll() editor.selectAll()
cy.get('.ProseMirror') editor.highlight({ color: 'rgb(255, 0, 0)' })
.find('mark')
.should('have.css', 'background-color', 'rgb(255, 0, 0)')
cy.get('.demo__preview button:nth-child(2)')
.click()
cy.get('.ProseMirror') cy.get('.ProseMirror')
.find('mark') .find('mark')
.should('not.exist') .should('not.exist')
editor.isActive('highlight', {
color: 'rgb(255, 0, 0)',
})
}) })
}) })
it('the button should highlight the selected text', () => { it.only('is active for mark with any attributes', () => {
cy.get('.demo__preview button:first') cy.get('.ProseMirror').then(([{ editor }]) => {
.click() editor.setContent('<p><mark style="background-color: rgb(255, 0, 0);">Example Text</mark></p>')
editor.selectAll()
cy.get('.ProseMirror') expect(editor.isActive('highlight')).to.eq(1)
.find('mark') })
.should('contain', 'Example Text') })
it.only('is active for mark with same attributes', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
editor.setContent('<p><mark style="background-color: rgb(255, 0, 0);">Example Text</mark></p>')
editor.selectAll()
expect(editor.isActive('highlight', {
color: 'rgb(255, 0, 0)',
})).to.eq(1)
})
})
it.only('isn’t active for mark with other attributes', () => {
cy.get('.ProseMirror').then(([{ editor }]) => {
editor.setContent('<p><mark style="background-color: rgb(255, 0, 0);">Example Text</mark></p>')
editor.selectAll()
expect(editor.isActive('highlight', {
color: 'rgb(0, 0, 0)',
})).to.eq(0)
})
}) })
it('the button should toggle the selected text highlighted', () => { it('the button should toggle the selected text highlighted', () => {