diff --git a/demos/src/Examples/Drawing/Vue/index.spec.js b/demos/src/Examples/Drawing/Vue/index.spec.js new file mode 100644 index 00000000..94d4a686 --- /dev/null +++ b/demos/src/Examples/Drawing/Vue/index.spec.js @@ -0,0 +1,38 @@ +context('/src/Examples/Drawing/Vue/', () => { + beforeEach(() => { + cy.visit('/src/Examples/Drawing/Vue/') + }) + + it('should have a working tiptap instance', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + // eslint-disable-next-line + expect(editor).to.not.be.null + }) + }) + + it('should have a svg canvas', () => { + cy.get('.ProseMirror svg').should('exist') + }) + + it('should draw on the svg canvas', () => { + cy.get('.ProseMirror svg').should('exist') + + cy.wait(500) + + cy.get('input').then(inputs => { + const color = inputs[0].value + const size = inputs[1].value + + cy.get('.ProseMirror 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') + .should('exist') + .should('have.attr', 'stroke-width', size) + .should('have.attr', 'stroke', color.toUpperCase()) + }) + }) +}) diff --git a/demos/src/Examples/Formatting/React/index.spec.js b/demos/src/Examples/Formatting/React/index.spec.js new file mode 100644 index 00000000..77027455 --- /dev/null +++ b/demos/src/Examples/Formatting/React/index.spec.js @@ -0,0 +1,38 @@ +context('/src/Examples/Formatting/React/', () => { + before(() => { + cy.visit('/src/Examples/Formatting/React/') + }) + + beforeEach(() => { + cy.get('.ProseMirror').type('{selectall}{backspace}') + }) + + const marks = [ + { label: 'highlight', mark: 'mark' }, + ] + + marks.forEach(m => { + it(`sets ${m.label}`, () => { + cy.get('.ProseMirror').type('Hello world.{selectall}') + cy.get('button').contains(m.label).click() + cy.get('.ProseMirror mark').should('exist') + }) + }) + + const alignments = [ + { label: 'left', alignment: 'left' }, + { label: 'center', alignment: 'center' }, + { label: 'right', alignment: 'right' }, + { label: 'justify', alignment: 'justify' }, + ] + + alignments.forEach(a => { + it(`sets ${a.label}`, () => { + cy.get('.ProseMirror').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) + } + }) + }) +}) diff --git a/demos/src/Examples/Formatting/Vue/index.spec.js b/demos/src/Examples/Formatting/Vue/index.spec.js index 30eb38f2..2d7363bd 100644 --- a/demos/src/Examples/Formatting/Vue/index.spec.js +++ b/demos/src/Examples/Formatting/Vue/index.spec.js @@ -3,5 +3,36 @@ context('/src/Examples/Formatting/Vue/', () => { cy.visit('/src/Examples/Formatting/Vue/') }) - // TODO: Write tests + beforeEach(() => { + cy.get('.ProseMirror').type('{selectall}{backspace}') + }) + + const marks = [ + { label: 'highlight', mark: 'mark' }, + ] + + marks.forEach(m => { + it(`sets ${m.label}`, () => { + cy.get('.ProseMirror').type('Hello world.{selectall}') + cy.get('button').contains(m.label).click() + cy.get('.ProseMirror mark').should('exist') + }) + }) + + const alignments = [ + { label: 'left', alignment: 'left' }, + { label: 'center', alignment: 'center' }, + { label: 'right', alignment: 'right' }, + { label: 'justify', alignment: 'justify' }, + ] + + alignments.forEach(a => { + it(`sets ${a.label}`, () => { + cy.get('.ProseMirror').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) + } + }) + }) }) diff --git a/demos/src/Examples/Images/React/index.spec.js b/demos/src/Examples/Images/React/index.spec.js new file mode 100644 index 00000000..5c48da81 --- /dev/null +++ b/demos/src/Examples/Images/React/index.spec.js @@ -0,0 +1,27 @@ +context('/src/Examples/Images/React/', () => { + beforeEach(() => { + cy.visit('/src/Examples/Images/React/') + }) + + // TODO: Write tests + it('finds image elements inside editor', () => { + cy.get('.ProseMirror 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) + }) + + 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() + cy.wait(1000) + cy.get('.ProseMirror img').should('have.length', 3) + }) + }) +}) diff --git a/demos/src/Examples/Images/Vue/index.spec.js b/demos/src/Examples/Images/Vue/index.spec.js index ad97c407..e35f0873 100644 --- a/demos/src/Examples/Images/Vue/index.spec.js +++ b/demos/src/Examples/Images/Vue/index.spec.js @@ -1,7 +1,27 @@ context('/src/Examples/Images/Vue/', () => { - before(() => { + beforeEach(() => { cy.visit('/src/Examples/Images/Vue/') }) // TODO: Write tests + it('finds image elements inside editor', () => { + cy.get('.ProseMirror 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) + }) + + 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() + cy.wait(1000) + cy.get('.ProseMirror img').should('have.length', 3) + }) + }) }) diff --git a/demos/src/Examples/InteractivityComponent/React/index.spec.js b/demos/src/Examples/InteractivityComponent/React/index.spec.js new file mode 100644 index 00000000..3486e1d5 --- /dev/null +++ b/demos/src/Examples/InteractivityComponent/React/index.spec.js @@ -0,0 +1,27 @@ +context('/src/Examples/InteractivityComponent/React/', () => { + beforeEach(() => { + cy.visit('/src/Examples/InteractivityComponent/React/') + }) + + it('should have a working tiptap instance', () => { + cy.get('.ProseMirror').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) + }) + + it('should handle count click inside custom node', () => { + cy.get('.ProseMirror .react-component button') + .should('have.text', 'This button has been clicked 0 times.') + .click() + .should('have.text', 'This button has been clicked 1 times.') + .click() + .should('have.text', 'This button has been clicked 2 times.') + .click() + .should('have.text', 'This button has been clicked 3 times.') + }) +}) diff --git a/demos/src/Examples/InteractivityComponent/Vue/Component.vue b/demos/src/Examples/InteractivityComponent/Vue/Component.vue index 1fe5d072..a15b6f0b 100644 --- a/demos/src/Examples/InteractivityComponent/Vue/Component.vue +++ b/demos/src/Examples/InteractivityComponent/Vue/Component.vue @@ -3,9 +3,7 @@ Vue Component
- +
diff --git a/demos/src/Examples/InteractivityComponent/Vue/index.spec.js b/demos/src/Examples/InteractivityComponent/Vue/index.spec.js new file mode 100644 index 00000000..5719b9ee --- /dev/null +++ b/demos/src/Examples/InteractivityComponent/Vue/index.spec.js @@ -0,0 +1,27 @@ +context('/src/Examples/InteractivityComponent/Vue/', () => { + beforeEach(() => { + cy.visit('/src/Examples/InteractivityComponent/Vue/') + }) + + it('should have a working tiptap instance', () => { + cy.get('.ProseMirror').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) + }) + + it('should handle count click inside custom node', () => { + cy.get('.ProseMirror .vue-component button') + .should('have.text', 'This button has been clicked 0 times.') + .click() + .should('have.text', 'This button has been clicked 1 times.') + .click() + .should('have.text', 'This button has been clicked 2 times.') + .click() + .should('have.text', 'This button has been clicked 3 times.') + }) +}) diff --git a/demos/src/Examples/InteractivityComponentContent/React/index.spec.js b/demos/src/Examples/InteractivityComponentContent/React/index.spec.js new file mode 100644 index 00000000..cfa9af7f --- /dev/null +++ b/demos/src/Examples/InteractivityComponentContent/React/index.spec.js @@ -0,0 +1,47 @@ +context('/src/Examples/InteractivityComponentContent/React/', () => { + beforeEach(() => { + cy.visit('/src/Examples/InteractivityComponentContent/React/') + }) + + it('should have a working tiptap instance', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + // eslint-disable-next-line + expect(editor).to.not.be.null + }) + }) + + it('should render a custom node', () => { + cy.get('.ProseMirror .react-component-with-content') + .should('have.length', 1) + }) + + it('should allow text editing inside component', () => { + cy.get('.ProseMirror .react-component-with-content .content div') + .invoke('attr', 'contentEditable', true) + .invoke('text', '') + .type('Hello World!') + .should('have.text', 'Hello World!') + }) + + it('should allow text editing inside component with markdown text', () => { + cy.get('.ProseMirror .react-component-with-content .content div') + .invoke('attr', 'contentEditable', true) + .invoke('text', '') + .type('Hello World! This is **bold**.') + .should('have.text', 'Hello World! This is bold.') + + cy.get('.ProseMirror .react-component-with-content .content strong') + .should('exist') + }) + + it('should remove node via selectall', () => { + cy.get('.ProseMirror .react-component-with-content') + .should('have.length', 1) + + cy.get('.ProseMirror') + .type('{selectall}{backspace}') + + cy.get('.ProseMirror .react-component-with-content') + .should('have.length', 0) + }) +}) diff --git a/demos/src/Examples/InteractivityComponentContent/Vue/index.spec.js b/demos/src/Examples/InteractivityComponentContent/Vue/index.spec.js new file mode 100644 index 00000000..e70b4a5b --- /dev/null +++ b/demos/src/Examples/InteractivityComponentContent/Vue/index.spec.js @@ -0,0 +1,47 @@ +context('/src/Examples/InteractivityComponentContent/Vue/', () => { + beforeEach(() => { + cy.visit('/src/Examples/InteractivityComponentContent/Vue/') + }) + + it('should have a working tiptap instance', () => { + cy.get('.ProseMirror').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) + }) + + it('should allow text editing inside component', () => { + cy.get('.ProseMirror .vue-component .content') + .invoke('attr', 'contentEditable', true) + .invoke('text', '') + .type('Hello World!') + .should('have.text', 'Hello World!') + }) + + it('should allow text editing inside component with markdown text', () => { + cy.get('.ProseMirror .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') + .should('exist') + }) + + it('should remove node via selectall', () => { + cy.get('.ProseMirror .vue-component') + .should('have.length', 1) + + cy.get('.ProseMirror') + .type('{selectall}{backspace}') + + cy.get('.ProseMirror .vue-component') + .should('have.length', 0) + }) +}) diff --git a/demos/src/Examples/MarkdownShortcuts/React/index.spec.js b/demos/src/Examples/MarkdownShortcuts/React/index.spec.js new file mode 100644 index 00000000..0aa52c80 --- /dev/null +++ b/demos/src/Examples/MarkdownShortcuts/React/index.spec.js @@ -0,0 +1,102 @@ +context('/src/Examples/MarkdownShortcuts/React/', () => { + before(() => { + cy.visit('/src/Examples/MarkdownShortcuts/React/') + }) + + beforeEach(() => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.clearContent() + }) + }) + + it('should make a h1', () => { + cy.get('.ProseMirror') + .type('# Headline') + .find('h1') + .should('contain', 'Headline') + }) + + it('should make a h2', () => { + cy.get('.ProseMirror') + .type('## Headline') + .find('h2') + .should('contain', 'Headline') + }) + + it('should make a h3', () => { + cy.get('.ProseMirror') + .type('### Headline') + .find('h3') + .should('contain', 'Headline') + }) + + it('should make a h4', () => { + cy.get('.ProseMirror') + .type('#### Headline') + .find('h4') + .should('contain', 'Headline') + }) + + it('should make a h5', () => { + cy.get('.ProseMirror') + .type('##### Headline') + .find('h5') + .should('contain', 'Headline') + }) + + it('should make a h6', () => { + cy.get('.ProseMirror') + .type('###### Headline') + .find('h6') + .should('contain', 'Headline') + }) + + it('should create inline code', () => { + cy.get('.ProseMirror') + .type('`$foobar`') + .find('code') + .should('contain', '$foobar') + }) + + it('should create a code block without language', () => { + cy.get('.ProseMirror') + .type('``` {enter}const foo = bar{enter}```') + .find('pre') + .should('contain', 'const foo = bar') + }) + + it('should create a bullet list from asteriks', () => { + cy.get('.ProseMirror') + .type('* foobar') + .find('ul') + .should('contain', 'foobar') + }) + + it('should create a bullet list from dashes', () => { + cy.get('.ProseMirror') + .type('- foobar') + .find('ul') + .should('contain', 'foobar') + }) + + it('should create a bullet list from pluses', () => { + cy.get('.ProseMirror') + .type('+ foobar') + .find('ul') + .should('contain', 'foobar') + }) + + it('should create a ordered list', () => { + cy.get('.ProseMirror') + .type('1. foobar') + .find('ol') + .should('contain', 'foobar') + }) + + it('should create a blockquote', () => { + cy.get('.ProseMirror') + .type('> foobar') + .find('blockquote') + .should('contain', 'foobar') + }) +}) diff --git a/demos/src/Examples/Menus/React/index.spec.js b/demos/src/Examples/Menus/React/index.spec.js index ee2f3b03..57218b42 100644 --- a/demos/src/Examples/Menus/React/index.spec.js +++ b/demos/src/Examples/Menus/React/index.spec.js @@ -9,11 +9,10 @@ context('/src/Examples/Menus/React/', () => { }) }) - // TODO: fix test - // it('should show menu when the editor is empty', () => { - // cy.get('#app') - // .find('[data-tippy-root]') - // }) + it('should show menu when the editor is empty', () => { + cy.get('#app') + .find('[data-tippy-root]') + }) it('should show menu when text is selected', () => { cy.get('.ProseMirror') diff --git a/demos/src/Examples/Minimal/React/index.spec.js b/demos/src/Examples/Minimal/React/index.spec.js new file mode 100644 index 00000000..faa1507e --- /dev/null +++ b/demos/src/Examples/Minimal/React/index.spec.js @@ -0,0 +1,47 @@ +context('/src/Examples/Minimal/React/', () => { + before(() => { + cy.visit('/src/Examples/Minimal/React/') + }) + + beforeEach(() => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.clearContent() + }) + }) + + it('text should be wrapped in a paragraph by default', () => { + cy.get('.ProseMirror') + .type('Example Text') + .find('p') + .should('contain', 'Example Text') + }) + + it('should parse paragraphs correctly', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.setContent('

Example Text

') + expect(editor.getHTML()).to.eq('

Example Text

') + + editor.commands.setContent('

Example Text

') + expect(editor.getHTML()).to.eq('

Example Text

') + }) + }) + + it('enter should make a new paragraph', () => { + cy.get('.ProseMirror') + .type('First Paragraph{enter}Second Paragraph') + .find('p') + .should('have.length', 2) + }) + + it('backspace should remove the last paragraph', () => { + cy.get('.ProseMirror') + .type('{enter}') + .find('p') + .should('have.length', 2) + + cy.get('.ProseMirror') + .type('{backspace}') + .find('p') + .should('have.length', 1) + }) +}) diff --git a/demos/src/Examples/Tables/React/index.spec.js b/demos/src/Examples/Tables/React/index.spec.js new file mode 100644 index 00000000..b541da60 --- /dev/null +++ b/demos/src/Examples/Tables/React/index.spec.js @@ -0,0 +1,125 @@ +context('/src/Examples/Tables/React/', () => { + before(() => { + cy.visit('/src/Examples/Tables/React/') + }) + + beforeEach(() => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.clearContent() + cy.get('button').contains('insertTable').click() + }) + }) + + // TODO: Write tests + it('adds a table with three columns and three rows', () => { + cy.get('.ProseMirror table') + .should('exist') + + cy.get('.ProseMirror table tr') + .should('exist') + .should('have.length', 3) + + cy.get('.ProseMirror table th') + .should('exist') + .should('have.length', 3) + + cy.get('.ProseMirror table td') + .should('exist') + .should('have.length', 6) + }) + + it('adds & delete columns', () => { + cy.get('button').contains('addColumnBefore').click() + cy.get('.ProseMirror table th') + .should('have.length', 4) + + cy.get('button').contains('addColumnAfter').click() + cy.get('.ProseMirror table th') + .should('have.length', 5) + + cy.get('button').contains('deleteColumn') + .click() + .click() + cy.get('.ProseMirror table th') + .should('have.length', 3) + }) + + it('adds & delete rows', () => { + cy.get('button').contains('addRowBefore').click() + cy.get('.ProseMirror table tr') + .should('have.length', 4) + + cy.get('button').contains('addRowAfter').click() + cy.get('.ProseMirror table tr') + .should('have.length', 5) + + cy.get('button').contains('deleteRow') + .click() + .click() + cy.get('.ProseMirror table tr') + .should('have.length', 3) + }) + + it('should delete table', () => { + cy.get('button').contains('deleteTable').click() + cy.get('.ProseMirror table').should('not.exist') + }) + + it('should merge cells', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror table th').should('have.length', 2) + }) + + it('should split cells', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror table th').should('have.length', 2) + cy.get('button').contains('splitCell').click() + cy.get('.ProseMirror table th').should('have.length', 3) + }) + + it('should toggle header columns', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.toggleHeaderColumn() + cy.get('.ProseMirror table th').should('have.length', 5) + }) + }) + + it('should toggle header row', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.toggleHeaderRow() + cy.get('.ProseMirror table th').should('have.length', 0) + }) + }) + + it('should merge split', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror th[colspan="2"]') + .should('exist') + cy.get('button') + .contains('mergeOrSplit') + .click() + cy.get('.ProseMirror th[colspan="2"]') + .should('not.exist') + }) + + it('should set cell attribute', () => { + cy.get('.ProseMirror').type('{downArrow}') + cy.get('button').contains('setCellAttribute').click() + cy.get('.ProseMirror 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('button').contains('goToNextCell').click() + cy.get('.ProseMirror').type('Column 2') + cy.get('button').contains('goToPreviousCell').click() + + cy.get('.ProseMirror th').then(elements => { + expect(elements[0].innerText).to.equal('Column 1') + expect(elements[1].innerText).to.equal('Column 2') + }) + }) +}) diff --git a/demos/src/Examples/Tables/Vue/index.spec.js b/demos/src/Examples/Tables/Vue/index.spec.js index 5c747d00..093b8439 100644 --- a/demos/src/Examples/Tables/Vue/index.spec.js +++ b/demos/src/Examples/Tables/Vue/index.spec.js @@ -3,5 +3,123 @@ context('/src/Examples/Tables/Vue/', () => { cy.visit('/src/Examples/Tables/Vue/') }) + beforeEach(() => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.clearContent() + cy.get('button').contains('insertTable').click() + }) + }) + // TODO: Write tests + it('adds a table with three columns and three rows', () => { + cy.get('.ProseMirror table') + .should('exist') + + cy.get('.ProseMirror table tr') + .should('exist') + .should('have.length', 3) + + cy.get('.ProseMirror table th') + .should('exist') + .should('have.length', 3) + + cy.get('.ProseMirror table td') + .should('exist') + .should('have.length', 6) + }) + + it('adds & delete columns', () => { + cy.get('button').contains('addColumnBefore').click() + cy.get('.ProseMirror table th') + .should('have.length', 4) + + cy.get('button').contains('addColumnAfter').click() + cy.get('.ProseMirror table th') + .should('have.length', 5) + + cy.get('button').contains('deleteColumn') + .click() + .click() + cy.get('.ProseMirror table th') + .should('have.length', 3) + }) + + it('adds & delete rows', () => { + cy.get('button').contains('addRowBefore').click() + cy.get('.ProseMirror table tr') + .should('have.length', 4) + + cy.get('button').contains('addRowAfter').click() + cy.get('.ProseMirror table tr') + .should('have.length', 5) + + cy.get('button').contains('deleteRow') + .click() + .click() + cy.get('.ProseMirror table tr') + .should('have.length', 3) + }) + + it('should delete table', () => { + cy.get('button').contains('deleteTable').click() + cy.get('.ProseMirror table').should('not.exist') + }) + + it('should merge cells', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror table th').should('have.length', 2) + }) + + it('should split cells', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror table th').should('have.length', 2) + cy.get('button').contains('splitCell').click() + cy.get('.ProseMirror table th').should('have.length', 3) + }) + + it('should toggle header columns', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.toggleHeaderColumn() + cy.get('.ProseMirror table th').should('have.length', 5) + }) + }) + + it('should toggle header row', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.commands.toggleHeaderRow() + cy.get('.ProseMirror table th').should('have.length', 0) + }) + }) + + it('should merge split', () => { + cy.get('.ProseMirror').type('{shift}{rightArrow}') + cy.get('button').contains('mergeCells').click() + cy.get('.ProseMirror th[colspan="2"]') + .should('exist') + cy.get('button') + .contains('mergeOrSplit') + .click() + cy.get('.ProseMirror th[colspan="2"]') + .should('not.exist') + }) + + it('should set cell attribute', () => { + cy.get('.ProseMirror').type('{downArrow}') + cy.get('button').contains('setCellAttribute').click() + cy.get('.ProseMirror 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('button').contains('goToNextCell').click() + cy.get('.ProseMirror').type('Column 2') + cy.get('button').contains('goToPreviousCell').click() + + cy.get('.ProseMirror th').then(elements => { + expect(elements[0].innerText).to.equal('Column 1') + expect(elements[1].innerText).to.equal('Column 2') + }) + }) })