/* * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file) * * SPDX-License-Identifier: AGPL-3.0-only */ describe('Autocompletion', () => { beforeEach(() => { cy.visit('/n/test') cy.get('.btn.active.btn-outline-secondary > i.fa-columns') .should('exist') cy.get('.CodeMirror') .click() .get('textarea') .as('codeinput') }) describe('code block', () => { it('via Enter', () => { cy.get('@codeinput') .fill('```') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span') .should('have.text', '```abnf') cy.get('.CodeMirror-code > div:nth-of-type(3) > .CodeMirror-line > span span') .should('have.text', '```') cy.get('.markdown-body > pre > code') .should('exist') }) it('via doubleclick', () => { cy.get('@codeinput') .fill('```') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span') .should('have.text', '```abnf') cy.get('.CodeMirror-code > div:nth-of-type(3) > .CodeMirror-line > span span') .should('have.text', '```') cy.get('.markdown-body > pre > code') .should('exist') }) }) describe('container', () => { it('via Enter', () => { cy.get('@codeinput') .fill(':::') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span') .should('have.text', ':::success') cy.get('.CodeMirror-code > div:nth-of-type(3) > .CodeMirror-line > span span') .should('have.text', '::: ') cy.get('.markdown-body > div.alert') .should('exist') }) it('via doubleclick', () => { cy.get('@codeinput') .fill(':::') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-code > div:nth-of-type(1) > .CodeMirror-line > span > span') .should('have.text', ':::success') cy.get('.CodeMirror-code > div:nth-of-type(3) > .CodeMirror-line > span span') .should('have.text', '::: ') cy.get('.markdown-body > div.alert') .should('exist') }) }) describe('emoji', () => { describe('normal emoji', () => { it('via Enter', () => { cy.get('@codeinput') .fill(':hedg') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', ':hedgehog:') cy.get('.markdown-body') .should('have.text', '🦔') }) it('via doubleclick', () => { cy.get('@codeinput') .fill(':hedg') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', ':hedgehog:') cy.get('.markdown-body') .should('have.text', '🦔') }) }) describe('fork-awesome-icon', () => { it('via Enter', () => { cy.get('@codeinput') .fill(':fa-face') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', ':fa-facebook:') cy.get('.markdown-body > p > i.fa.fa-facebook') .should('exist') }) it('via doubleclick', () => { cy.get('@codeinput') .fill(':fa-face') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', ':fa-facebook:') cy.get('.markdown-body > p > i.fa.fa-facebook') .should('exist') }) }) }) describe('header', () => { it('via Enter', () => { cy.get('@codeinput') .fill('#') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '# ') cy.get('.markdown-body > h1 ') .should('have.text', ' ') }) it('via doubleclick', () => { cy.get('@codeinput') .fill('#') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '# ') cy.get('.markdown-body > h1') .should('have.text', ' ') }) }) describe('images', () => { it('via Enter', () => { cy.get('@codeinput') .fill('!') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '![image alt](https:// "title")') cy.get('.markdown-body > p > img') .should('have.attr', 'alt', 'image alt') .should('have.attr', 'src', 'https://') .should('have.attr', 'title', 'title') }) it('via doubleclick', () => { cy.get('@codeinput') .fill('!') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '![image alt](https:// "title")') cy.get('.markdown-body > p > img') .should('have.attr', 'alt', 'image alt') .should('have.attr', 'src', 'https://') .should('have.attr', 'title', 'title') }) }) describe('links', () => { it('via Enter', () => { cy.get('@codeinput') .fill('[') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '[link text](https:// "title") ') cy.get('.markdown-body > p > a') .should('have.text', 'link text') .should('have.attr', 'href', 'https://') .should('have.attr', 'title', 'title') }) it('via doubleclick', () => { cy.get('@codeinput') .fill('[') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '[link text](https:// "title") ') cy.get('.markdown-body > p > a') .should('have.text', 'link text') .should('have.attr', 'href', 'https://') .should('have.attr', 'title', 'title') }) }) describe('pdf', () => { it('via Enter', () => { cy.get('@codeinput') .fill('{') cy.get('.CodeMirror-hints') .should('exist') cy.get('@codeinput') .type('{enter}') cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '{%pdf https:// %}') cy.get('.markdown-body > p') .should('exist') }) it('via doubleclick', () => { cy.get('@codeinput') .fill('{') cy.get('.CodeMirror-hints > li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '{%pdf https:// %}') cy.get('.markdown-body > p') .should('exist') }) }) describe('collapsable blocks', () => { it('via Enter', () => { cy.get('@codeinput') .fill(' .CodeMirror-line > span') .should('have.text', '') // after selecting the hint, the last line of the inserted suggestion is active cy.get('.markdown-body > details') .should('exist') }) it('via doubleclick', () => { cy.get('@codeinput') .fill(' li') .first() .dblclick() cy.get('.CodeMirror-hints') .should('not.exist') cy.get('.CodeMirror-activeline > .CodeMirror-line > span') .should('have.text', '') cy.get('.markdown-body > details') .should('exist') }) }) })