describe('Autocompletion', () => {
  beforeEach(() => {
    cy.visit('/n/test')
    cy.get('.btn.active.btn-outline-secondary > i.fa-columns')
    .should('exist')
    cy.get('.CodeMirror textarea')
      .type('{ctrl}a', { force: true })
      .type('{backspace}')
  })

  describe('normal emoji', () => {
    it('via Enter', () => {
      cy.get('.CodeMirror textarea')
        .type(':book')
        .type('{enter}')
      cy.get('.CodeMirror-hints')
        .should('not.exist')
      cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
        .should('have.text', ':book:')
      cy.get('.markdown-body')
        .should('have.text', '📖')
    })
    it('via doubleclick', () => {
      cy.get('.CodeMirror textarea')
        .type(':book')
      cy.get('.CodeMirror-hints > li')
        .first()
        .dblclick()
      cy.get('.CodeMirror-hints')
        .should('not.exist')
      cy.get('.CodeMirror-activeline > .CodeMirror-line > span')
        .should('have.text', ':book:')
      cy.get('.markdown-body')
        .should('have.text', '📖')
    })
  })

  describe('fork-awesome-icon', () => {
    it('via Enter', () => {
      cy.get('.CodeMirror textarea')
        .type(':facebook')
        .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('.CodeMirror textarea')
        .type(':facebook')
      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')
    })
  })
})