Skip to content

Commit

Permalink
Updated Cypress tests for monaco code editor
Browse files Browse the repository at this point in the history
- Need to get() monaco editor differently a sthe data-cy="code-editor"
  is on a wrapping div, not the code editor itself
- Cypress interactions with monaco code editor work slightly
  differently, especially type(), so these have been updated
  • Loading branch information
shapeseas committed Sep 24, 2024
1 parent 8541bd2 commit 8685ed4
Showing 1 changed file with 10 additions and 6 deletions.
16 changes: 10 additions & 6 deletions cypress/e2e/test.cy.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
// npm run cypress:open

describe('test spec', () => {
it('passes', () => {

Expand All @@ -11,7 +10,11 @@ describe('test spec', () => {
cy.viewport(2000, 1000, { log: false });

cy.visit('http://localhost:3000/editor')
cy.get('[data-cy="code-editor"]').clear().type(yamltreatment)
cy.get('[data-cy="code-editor"]').get('.monaco-editor').type('{ctrl+a}{del}', { release: false }) // equivalent to clear() in cypress
cy.get('[data-cy="code-editor"]').get('.monaco-editor').type(yamltreatment)
//this fails because getting monaco-editor will include line numbers, but the yamltreatment variable does not
// also monaco-editor will remove line breaks, but yamltreatment will have the line breaks
//cy.get('[data-cy="code-editor"]').get('.monaco-editor').should('include.text', yamltreatment)
cy.get('[data-cy="yaml-save"]').click()

// create first stage
Expand Down Expand Up @@ -89,18 +92,19 @@ describe('test spec', () => {
cy.get('[data-cy="stage-0"]').should("not.contain", "Element 2")

// add fourth element to second stage via code editor
cy.get('[data-cy="code-editor"]').type(" - name: Element 4\n type: prompt\nfile: file/address")
cy.get('[data-cy="code-editor"]').get('.monaco-editor').type(" - name: Element 4\n type: prompt\nfile: file/address")
cy.get('[data-cy="yaml-save"]').click()

cy.get('[data-cy="code-editor"]').contains("- name: Element 4").should("be.visible")
cy.get('[data-cy="code-editor"]').get('.monaco-editor').contains("- name: Element 4").should("be.visible")
cy.get('[data-cy="element-1-1"]').contains("prompt").should("be.visible")
cy.get('[data-cy="element-1-1"]').contains("Element 4").should("be.visible")

// add third stage via code editor
cy.get('[data-cy="code-editor"]').type("\n{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}- name: Stage 3\n duration: 300\nelements: []")
cy.get('[data-cy="code-editor"]').get('.monaco-editor').type("{moveToEnd}{enter}", { release: false })
cy.get('[data-cy="code-editor"]').get('.monaco-editor').type("{home} - name: Stage 3\n duration: 300\nelements: []")
cy.get('[data-cy="yaml-save"]').click()

cy.get('[data-cy="code-editor"]').contains("- name: Stage 3").should("be.visible")
cy.get('[data-cy="code-editor"]').get('.monaco-editor').contains("- name: Stage 3").should("be.visible")
cy.get('[data-cy="stage-2"]').contains("Stage 3").should("be.visible")

// edit first stage
Expand Down

0 comments on commit 8685ed4

Please sign in to comment.