mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-16 16:14:43 -04:00
Rewrite tests (#948)
Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
Tilman Vatteroth
GitHub
parent
9f6b1a9a46
commit
908a5ce984
15 changed files with 286 additions and 398 deletions
|
|
@ -4,7 +4,7 @@
|
|||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
describe('Toolbar', () => {
|
||||
describe('Toolbar Buttons', () => {
|
||||
const testText = 'textText'
|
||||
const testLink = 'http://hedgedoc.org'
|
||||
|
||||
|
|
@ -17,258 +17,238 @@ describe('Toolbar', () => {
|
|||
.as('codeinput')
|
||||
})
|
||||
|
||||
const fillTestText = () => {
|
||||
cy.get('@codeinput')
|
||||
.fill(testText)
|
||||
cy.get('.CodeMirror-line > span')
|
||||
.should("exist")
|
||||
.should('have.text', testText)
|
||||
}
|
||||
|
||||
const fillTestLink = () => {
|
||||
cy.get('@codeinput')
|
||||
.fill(testLink)
|
||||
cy.get('.CodeMirror-line > span')
|
||||
.should("exist")
|
||||
.should('have.text', testLink)
|
||||
}
|
||||
|
||||
it('bold', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-bold')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `**${testText}**`)
|
||||
})
|
||||
|
||||
it('italic', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-italic')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `*${testText}*`)
|
||||
})
|
||||
|
||||
it('underline', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-underline')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `++${testText}++`)
|
||||
})
|
||||
|
||||
it('strikethrough', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-strikethrough')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `~~${testText}~~`)
|
||||
})
|
||||
|
||||
it('subscript', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-subscript')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `~${testText}~`)
|
||||
})
|
||||
|
||||
it('superscript', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-superscript')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `^${testText}^`)
|
||||
})
|
||||
|
||||
it('heading', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-header')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `# ${testText}`)
|
||||
cy.get('.fa-header')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `## ${testText}`)
|
||||
})
|
||||
|
||||
describe('code', () => {
|
||||
it('nothing selected empty line', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
.type('{backspace}')
|
||||
cy.get('.fa-code')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
})
|
||||
|
||||
it('nothing selected non line', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
.type('{leftArrow}')
|
||||
cy.get('.fa-code')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
describe('for single line text', () => {
|
||||
beforeEach(() => {
|
||||
cy.codemirrorFill(testText)
|
||||
cy.get('.CodeMirror-line > span')
|
||||
.should("exist")
|
||||
.should('have.text', testText)
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
})
|
||||
|
||||
it('line selected', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-code')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', testText)
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
describe('with selection', () => {
|
||||
beforeEach(() => {
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
})
|
||||
|
||||
it('should format as bold', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-bold"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `**${testText}**`)
|
||||
})
|
||||
|
||||
it('should format as italic', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-italic"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `*${testText}*`)
|
||||
})
|
||||
|
||||
it('should format as underline', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-underline"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `++${testText}++`)
|
||||
})
|
||||
|
||||
it('should format as strikethrough', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-strikethrough"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `~~${testText}~~`)
|
||||
})
|
||||
|
||||
it('should format as subscript', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-subscript"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `~${testText}~`)
|
||||
})
|
||||
|
||||
it('should format as superscript', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-superscript"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `^${testText}^`)
|
||||
})
|
||||
|
||||
it('should format the line as code block', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-code-block"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', testText)
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
})
|
||||
|
||||
it('should format links', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-link"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `[${testText}](https://)`)
|
||||
})
|
||||
|
||||
it('should format as image', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-image"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', ``)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('quote', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-quote-right')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `> ${testText}`)
|
||||
cy.get('.fa-quote-right')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `> > ${testText}`)
|
||||
})
|
||||
|
||||
it('unordered list', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-list')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- ${testText}`)
|
||||
cy.get('.fa-list')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- - ${testText}`)
|
||||
})
|
||||
|
||||
it('ordered list', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-list-ol')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `1. ${testText}`)
|
||||
cy.get('.fa-list-ol')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `1. 1. ${testText}`)
|
||||
})
|
||||
|
||||
it('todo list', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-check-square')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- [ ] ${testText}`)
|
||||
cy.get('.fa-check-square')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- [ ] - [ ] ${testText}`)
|
||||
})
|
||||
|
||||
describe('link', () => {
|
||||
it('with selection text', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-link')
|
||||
it('should format line as heading', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-heading"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `[${testText}](https://)`)
|
||||
.should('have.text', `# ${testText}`)
|
||||
cy.get('.btn-toolbar [data-cy="format-heading"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `## ${testText}`)
|
||||
})
|
||||
|
||||
it('without selection', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-link')
|
||||
it('should format the line as code', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-code-block"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', testText)
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
})
|
||||
|
||||
it('should add a quote', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-block-quote"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `> ${testText}`)
|
||||
cy.get('.btn-toolbar [data-cy="format-block-quote"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `> > ${testText}`)
|
||||
})
|
||||
|
||||
it('should format as unordered list', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-unordered-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- ${testText}`)
|
||||
cy.get('.btn-toolbar [data-cy="format-unordered-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- - ${testText}`)
|
||||
})
|
||||
|
||||
it('should format as ordered list', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-ordered-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `1. ${testText}`)
|
||||
cy.get('.btn-toolbar [data-cy="format-ordered-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `1. 1. ${testText}`)
|
||||
})
|
||||
|
||||
it('should format as check list', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-check-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- [ ] ${testText}`)
|
||||
cy.get('.btn-toolbar [data-cy="format-check-list"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `- [ ] - [ ] ${testText}`)
|
||||
})
|
||||
|
||||
it('should insert links', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-link"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `${testText}[](https://)`)
|
||||
})
|
||||
|
||||
it('with selection link', () => {
|
||||
fillTestLink()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-link')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `[](${testLink})`)
|
||||
})
|
||||
})
|
||||
|
||||
describe('image', () => {
|
||||
it('with selection', () => {
|
||||
fillTestText()
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-picture-o')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', ``)
|
||||
})
|
||||
|
||||
it('without selection', () => {
|
||||
fillTestText()
|
||||
cy.get('.fa-picture-o')
|
||||
it('should insert an empty image link', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-image"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `${testText}`)
|
||||
})
|
||||
})
|
||||
|
||||
it('with selection link', () => {
|
||||
fillTestLink()
|
||||
describe('for single line link with selection', () => {
|
||||
beforeEach(() => {
|
||||
cy.codemirrorFill(testLink)
|
||||
cy.get('.CodeMirror-line > span')
|
||||
.should("exist")
|
||||
.should('have.text', testLink)
|
||||
cy.get('@codeinput')
|
||||
.type('{ctrl}a')
|
||||
cy.get('.fa-picture-o')
|
||||
})
|
||||
|
||||
it('should format as link', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-link"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', `[](${testLink})`)
|
||||
})
|
||||
|
||||
it('should format as image', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-image"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
|
||||
.should('have.text', ``)
|
||||
})
|
||||
})
|
||||
|
||||
describe('table', () => {
|
||||
describe('for no text', () => {
|
||||
it('should add an empty code block', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-code-block"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span')
|
||||
.should('have.text', '```')
|
||||
cy.get('.CodeMirror-code > div.CodeMirror-activeline > .CodeMirror-line > span span')
|
||||
.should('have.text', '```')
|
||||
})
|
||||
|
||||
it('should insert lines', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-add-line"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', '----')
|
||||
})
|
||||
|
||||
it('should add a collapsable block', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-collapsable-block"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', ':::spoiler Toggle label')
|
||||
})
|
||||
|
||||
it('should add a comment', () => {
|
||||
cy.get('.btn-toolbar [data-cy="format-add-comment"]')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', '> []')
|
||||
})
|
||||
})
|
||||
|
||||
describe('for new tables', () => {
|
||||
beforeEach(() => {
|
||||
cy.get('.table-picker-container')
|
||||
.should('not.be.visible')
|
||||
cy.get('.fa-table')
|
||||
cy.get('[data-cy="show-table-overlay"]')
|
||||
.last()
|
||||
.click()
|
||||
cy.get('.table-picker-container')
|
||||
.should('be.visible')
|
||||
})
|
||||
|
||||
it('overlay', () => {
|
||||
it('should open an overlay', () => {
|
||||
cy.get('.table-container > div:nth-of-type(25)')
|
||||
.trigger('mouseover')
|
||||
cy.get('.table-cell.bg-primary')
|
||||
|
|
@ -279,10 +259,10 @@ describe('Toolbar', () => {
|
|||
.click()
|
||||
})
|
||||
|
||||
it('custom', () => {
|
||||
it('should open a modal for custom table sizes in the overlay', () => {
|
||||
cy.get('.modal-dialog')
|
||||
.should('not.exist')
|
||||
cy.get('.fa-table')
|
||||
cy.get('[data-cy="show-custom-table-modal"]')
|
||||
.first()
|
||||
.click()
|
||||
cy.get('.modal-dialog')
|
||||
|
|
@ -311,32 +291,11 @@ describe('Toolbar', () => {
|
|||
})
|
||||
})
|
||||
|
||||
it('line', () => {
|
||||
cy.get('.fa-minus')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', '----')
|
||||
})
|
||||
|
||||
it('collapsable block', () => {
|
||||
cy.get('.fa-caret-square-o-down')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', ':::spoiler Toggle label')
|
||||
})
|
||||
|
||||
it('comment', () => {
|
||||
cy.get('.fa-comment')
|
||||
.click()
|
||||
cy.get('.CodeMirror-code > div:nth-of-type(2) > .CodeMirror-line > span span')
|
||||
.should('have.text', '> []')
|
||||
})
|
||||
|
||||
describe('emoji-picker', () => {
|
||||
it('show when clicked', () => {
|
||||
describe('for the emoji-picker', () => {
|
||||
it('should open overlay', () => {
|
||||
cy.get('emoji-picker')
|
||||
.should('not.be.visible')
|
||||
cy.get('.fa-smile-o')
|
||||
cy.get('[data-cy="show-emoji-picker"]')
|
||||
.click()
|
||||
cy.get('emoji-picker')
|
||||
.should('be.visible')
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue