Как набрать с помощью cypress .type () внутри редактора codemirror? - PullRequest
Новая
       59

Как набрать с помощью cypress .type () внутри редактора codemirror?

3 голосов
/ 26 марта 2019

Я пишу какой-то cypress тест для редактора Codemirror.Я должен использовать cypress для ввода в поле ввода.

Я пытаюсь достичь cy.type() в редакторе CodeMirror.Данные, которые у меня есть в codemirror, находятся внутри диапазона. 

<code><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"> &lt; h1 &gt; Welcome to your web project canvas! &lt; /h1&gt;</span>

Код спецификации Cypress cy.get ('pre.CodeMirror-line') .type ('Cypress HTML Data')

Я не могу набрать некоторые данные с помощью кипариса.

Буду признателен, если кто-нибудь сможет помочь?

1 Ответ

2 голосов
/ 26 марта 2019

Вы не указали правильный элемент в своем коде спецификации.Вы делаете cy.get('pre.CodeMirror-line'), но тег <pre> не является элементом cy.type().

Вместо этого вам нужно получить скрытый CodeMirror <textarea>.Это можно выбрать с помощью .CodeMirror textarea.Следующий JS является демонстрационной спецификацией, которая работает на codemirror.net: 

describe('Codemirror', () => {
  it('can be tested using textarea', () => {
    cy.visit('https://codemirror.net/')
    // CodeMirror's editor doesn't let us clear it from the
    // textarea, but we can read the Window object and then
    // invoke `setValue` on the editor global
    cy.window().then(win => {
      win.editor.setValue("")
    })
    cy.get('.CodeMirror textarea')
    // we use `force: true` below because the textarea is hidden
    // and by default Cypress won't interact with hidden elements
      .type('test test test test', { force: true })
  })
})
...