如何在 Cypress Automation 的 CKeditor (v4) 中添加/键入文本？或者在 Cypress Automation 中设置 Ckeditor 值的任何方法？

Question

我在commands.js中使用这个方法

Cypress.Commands.add(
'iframeLoaded', { prevSubject: 'element' },
($iframe) => {
    const contentWindow = $iframe.prop('contentWindow')
    return new Promise(resolve => {
        if (
            contentWindow &&
            contentWindow.document.readyState === 'complete'
        ) {
            resolve(contentWindow)
        } else {
            $iframe.on('load', () => {
                resolve(contentWindow)
            })
        }
    })
})
Cypress.Commands.add(
'getInDocument', { prevSubject: 'document' },
(document, selector) => Cypress.$(selector, document))

我需要您的建议或任何其他方法来解决这个问题。

以下代码工作正常，但没有显示任何输出。

cy.get('iframe')
        .iframeLoaded()
        .its('document')
        .get('#cke_10_contents > .cke_wysiwyg_frame')
        .type("Text");

这是我的脚本并在控制台中显示“超时重试：预期”等于“一些新文本”。

describe('demo', function() {
it('test', function() {


    cy.visit('https://automationtestname688296/create')
    cy.get('#email').type('test@email.com');
    cy.get('#password').type('test2020');
    cy.get('.checkmark').click().wait(2000);

    cy.get(':nth-child(6) > .form-control').contains('Login').click()
// I want to Enter Text in First Text Editor
.then(() => {

cy.get('iframe.cke_wysiwyg_frame')  // "cke_wysiwyg_frame" class is used here
  .iframeLoaded()                   // wait for the iframe to be loaded
  .then($frameWindow => {

    const win = cy.state('window'); // grab the window Cypress is testing
    const ckEditor = win.CKEDITOR;  // CKEditor has added itself to the window
    const instances = ckEditor.instances;  // can be multiple editors on the page

    const myEditor = Object.values(instances)
      .filter(instance => instance.id === 'cke_8')[0]; // select the instance by id

    // use CKEditor API to change the text
    myEditor.setData('<h1>some new text</h1>'); 

    // Verify
    cy.wrap($frameWindow)
      .its('document')
      .its('body')
      .invoke('text')
      .should('eq', 'some new text')

})
})

Answer 1

我感觉还有更多内容，但是像这样的基本测试适用于 CKEditor v5

cy.visit('https://ckeditor.com/ckeditor-5/demo/')
  .then(() => {

    cy.get('.ck-content')
      .clear()
      .type('Hello CKEditor');

    cy.get('.ck-content')
      .invoke('text')
      .should('eq','Hello CKEditor')

  })

对于 CKEditor v4，

cy.visit('https://ckeditor.com/ckeditor-5/demo/')
  .then(() => {

    cy.get('.ck-content')
      .clear()
      .type('Hello CKEditor');

    cy.get('.ck-content')
      .invoke('text')
      .should('eq','Hello CKEditor')

  })