Làm cách nào để kiểm tra trường định dạng văn bản CKEditor 5 với Behat/Mink?

Drupal 10 đang chuyển từ CKEditor 4 sang 5.

Vì vậy, tôi đã cài đặt mô-đun CKEditor 5 thử nghiệm và đang cố cập nhật các bài kiểm tra Behat của mình để sử dụng CKEditor 5.

Tôi đang sử dụng thử nghiệm @javascript trong Behat trên CircleCI để kiểm tra trang web Drupal 8 của mình.

Tiêu chuẩn Tôi điền vào "trường của tôi" với "giá trị" bước không thành công cho các lĩnh vực sử dụng CKEditor. Ví dụ: đối với trường văn bản dài có nhãn Câu hỏi, nếu tôi thêm một bước:

Và tôi điền vào "Câu hỏi" với "Điều này có hiệu quả không?"

Sau đó, tôi nhận được lỗi: Phần tử không thể tương tác

Như được mô tả trong câu hỏi này về CKEditor 4, đây là một ý chính của johnennewdeeson nó hoạt động với CKEditor 4 (về cơ bản sử dụng JS để tìm phiên bản trình soạn thảo và thiết lập dữ liệu), nhưng nó không hoạt động với CKEditor 5 (CKEDITOR không được xác định lỗi).

Vậy làm cách nào tôi có thể đặt giá trị của trường định dạng văn bản trong Behat bằng CKEditor 5?

Như được mô tả trong Làm cách nào để lấy đối tượng phiên bản trình soạn thảo từ phần tử DOM?, bạn có thể tìm kiếm ck-editor__editable và sử dụng nó để xác định phiên bản trình soạn thảo cụ thể mà bạn cần thao tác.

Sau đây là một ví dụ làm việc. Lưu ý rằng bạn phải thay thế bất kỳ dấu gạch dưới nào bằng dấu gạch nối trong tên máy cho $field_hyphenated_machine_name.

  /**
   * Nhập văn bản bằng CKEditor.
   *
   * @Sau đó, tôi điền vào trường wysiwyg :field_hyphenated_machine_name với :value
   * @Sau đó, tôi nhập :value cho trường wysiwyg :field_hyphenated_machine_name
   */
  hàm công khai iFillInWysiwygOnFieldWith($field_hyphenated_machine_name, $value) {
    # https://ckeditor.com/docs/ckeditor5/latest/support/faq.html#how-to-get-the-editor-instance-object-from-the-dom-element
    $ckeditor5_drupal_editable_element = "div.form-item-$field_hyphenated_machine_name-display-0-value .ck-editor__editable";

    $this->getSession()
      ->executeScript(
        "
        const domEditableElement = document.querySelector(\"$ckeditor5_drupal_editable_element\");
        nếu (domEditableElement.ckeditorInstance) {
          const editorInstance = domEditableElement.ckeditorInstance;
          nếu (editorInstance) {
            editorInstance.setData(\"$value\");
          } khác {
            ném Ngoại lệ mới ('Không thể lấy phiên bản trình chỉnh sửa!');
          }
        } khác {
          ném ngoại lệ mới ('Không thể tìm thấy phần tử!');
        }
        ");
  }