Problem/Motivation

It looks like tests are failing on Drupal 8.8 due to changes to linkability in this issue: #2994696: Render embedded media items in CKEditor

See https://www.drupal.org/pift-ci-job/1374140

Proposed resolution

Use the new api drupallink.registerLinkableWidget() if available (Drupal is >= 8.8), otherwise fallback to existing code that uses a workaround where we borrow the functionality form the drupalimage plugin.

New API:

+    if (CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget')) {
+      CKEDITOR.plugins.drupallink.registerLinkableWidget('drupalentity');
+    }

Remaining tasks

review/commit

User interface changes

none

API changes

none on our end.

Data model changes

none

Release notes snippet

CommentFileSizeAuthor
#23 3074061-23.patch6.06 KBoknate
#23 3074061-interdiff--21-23.txt2.47 KBoknate
#21 3074061-21.patch5.95 KBoknate
#21 3074061-interdiff--18-21.txt1.63 KBoknate
#18 3074061-18.patch6.16 KBoknate
#18 3074061-interdiff--15-18.txt763 bytesoknate
#16 3074061--interdiff-14-15.txt748 bytesoknate
#15 3074061-15.patch6.16 KBoknate
#15 3074061-15.patch6.16 KBoknate
#14 3073338-14.patch6.11 KBoknate
#14 3074061--interdiff-11-14.txt2.28 KBoknate
#11 3074061-11.patch5.17 KBoknate
#11 3074061--interdiff-10-11.txt1.56 KBoknate
#10 3074061-10.patch3.61 KBoknate
#8 3074061--interdiff-6-8.txt2.01 KBoknate
#8 3074061-8.patch5.08 KBoknate
#6 3074061-6.patch3.32 KBoknate
#6 3074061--interdiff-3-6.txt709 bytesoknate
#3 3074061-3.patch3.27 KBoknate
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

oknate created an issue. See original summary.

oknate’s picture

Issue summary: View changes
oknate’s picture

Here's the fix. It updates the plugin to use new drupallink API with a fallback for backwards compatibility.

oknate’s picture

Issue summary: View changes

Status: Needs review » Needs work

The last submitted patch, 3: 3074061-3.patch, failed testing. View results

oknate’s picture

Status: Needs work » Needs review
FileSize
709 bytes
3.32 KB

Handling case where drupallink doesn't exist:

-      if (CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget') === false) {
+      if (typeof CKEDITOR.plugins.drupallink === 'undefined' || CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget') === false) {

Status: Needs review » Needs work

The last submitted patch, 6: 3074061-6.patch, failed testing. View results

oknate’s picture

Status: Needs work » Needs review
FileSize
5.08 KB
2.01 KB

I can't recreate the failure in the 8.8 test in comment #6 locally. I'm trying to adjust the code to be more robust, let's see if this helps.

Status: Needs review » Needs work

The last submitted patch, 8: 3074061-8.patch, failed testing. View results

oknate’s picture

Reverting the change to the test in #8 as it didn't help. I'm now kind of stuck on this. I can't reproduce the failure locally, and I'm not sure why it's failing.

oknate’s picture

Status: Needs work » Needs review
FileSize
1.56 KB
5.17 KB

. I'm now kind of stuck on this. I can't reproduce locally.

Testing another set of changes on testbot.

Status: Needs review » Needs work

The last submitted patch, 11: 3074061-11.patch, failed testing. View results

oknate’s picture

Alright, sweet! Now I can see the bug locally, I needed to update composer in the root of the repo:

> Drupal\Core\Composer\Composer::vendorTestCodeCleanup
  - Updating behat/mink dev-master (9ea1ceb => a534fe7):     The package has modified files:
    M src/Element/TraversableElement.php
    M tests/Element/DocumentElementTest.php
    Discard changes [y,n,v,d,s,?]? y
 Checking out a534fe7dac
> Drupal\Core\Composer\Composer::vendorTestCodeCleanup
  - Updating behat/mink-selenium2-driver dev-master (93474c6 => 8684ee4):  Checking out 8684ee4e63
> Drupal\Core\Composer\Composer::vendorTestCodeCleanup

oknate’s picture

I think I have it now. I was able to reproduce and fix the autocomplete bug locally on 8.8.

The issue is some change in either behat or the selenium driver that was causing the focus to change after filling in the field, making the autocomplete disappear.

I borrowed a fix from EntityReferenceAutocompleteWidgetTest:

$autocomplete_field->setValue('Test');
$this->getSession()->getDriver()->keyDown($autocomplete_field->getXpath(), ' ');
oknate’s picture

oknate’s picture

FileSize
748 bytes

Oops, attached the patch twice instead of the interdiff in the last comment.

This $this->assertSession()->waitOnAutocomplete(); is perhaps unnecessary. It was working without it, but EntityReferenceAutocompleteWidgetTest has it, and it seems like it might make the test more stable, so throwing it in.

oknate’s picture

Phenaproxima raised the issue that checking if the drupallink plugin exists before adding the workaround doesn't make sense:

The only real red flag, for me, is typeof drupallink === 'undefined'

If drupallink is undefined, why would we want to put the BC layer there?

oknate’s picture

Testing changing the logic so that workaround isn't added if drupallink not enabled. This makes more sense. I was fixing the bug where CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget') was throwing an error by adding a check if

typeof CKEDITOR.plugins.drupallink === 'undefined'

But linking shouldn't be enabled without CKEDITOR.plugins.drupallink, so reversing the logic:

typeof CKEDITOR.plugins.drupallink !== 'undefined'

oknate’s picture

Triggered a retest for #18 after #2994699: Create a CKEditor plugin to select and embed a media item from the Media Library went in to 8.8. And it passed: all green!

Wim Leers’s picture

  1. +++ b/js/plugins/drupalentity/plugin.js
    @@ -22,6 +22,12 @@
    +    // The ::registerLinkableWidget method added in Drupal 8.8.
    +    // Adding it conditionally for backwards compatibility.
    +    if (CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget')) {
    +      CKEDITOR.plugins.drupallink.registerLinkableWidget('drupalentity');
    +    }
    

    👍

  2. +++ b/js/plugins/drupalentity/plugin.js
    @@ -66,25 +72,27 @@
    +      if (typeof CKEDITOR.plugins.drupallink !== 'undefined' && CKEDITOR.plugins.drupallink.hasOwnProperty('registerLinkableWidget') === false) {
    

    🤔 This is repeating the same if-test. How about we check that once around line 28, assign the result to a variable, and use that in both lines 28 and 76?

  3. +++ b/js/plugins/drupalentity/plugin.js
    --- a/tests/src/FunctionalJavascript/ContentTranslationTest.php
    +++ b/tests/src/FunctionalJavascript/ContentTranslationTest.php
    
    +++ b/tests/src/FunctionalJavascript/ContentTranslationTest.php
    --- a/tests/src/FunctionalJavascript/MediaImageTest.php
    +++ b/tests/src/FunctionalJavascript/MediaImageTest.php
    

    😨 Why does this need to change?

oknate’s picture

Re #20.2:
After looking at registerLinkableWidget(), I see it takes a string, so we can do it before the plugin is instantiated, so moving the code into beforeInit() method of drupalentity plugin, right where the other condition sits.

Re #20.3:
The change to ContentTranslationTest has to do with #13. Some change to Behat or Selenium was breaking my autocomplete test code. Fixed in #14. I don't know the cause of it, but I was able to adjust the code, by borrowing the process used to test entity reference autocomplete fields.

@@ -124,10 +128,8 @@ class ContentTranslationTest extends EntityEmbedTestBase {
     $this->drupalLogin($this->translator);
     $this->drupalGet('node/' . $host->id() . '/edit');
     $this->waitForEditor();
-    $this->assertSession()
-      ->waitForElementVisible('css', 'a.cke_button__test_node')
-      ->click();
-    $this->assertSession()->waitForId('drupal-modal');
+    $this->pressEditorButton('test_node');
+    $this->assertTrue($this->assertSession()->waitForElementVisible('css', '#entity-embed-dialog-form'));

Status: Needs review » Needs work

The last submitted patch, 21: 3074061-21.patch, failed testing. View results

oknate’s picture

Status: Needs work » Needs review
FileSize
2.47 KB
6.06 KB

Wrapping the whole thing in if (editor.plugins.drupallink).

I forgot, this was the same reason I had failures in #3 (fixed in #6). In some cases editor.plugins.drupallink is undefined.

This passed all the function javascript tests for me locally on Drupal 8.8.

oknate’s picture

Title: Tests failing on Drupal 8.8 » Update CKEditor plugin to be compatible with Drupal 8.8
oknate’s picture

Issue summary: View changes
oknate’s picture

I think this is in a good place now. Ready for another review.

Wim Leers’s picture

Status: Needs review » Reviewed & tested by the community
+++ b/js/plugins/drupalentity/plugin.js
@@ -66,25 +66,34 @@
-      // drupallink has a hardcoded integration with drupalimage. Work around that, to reuse the same integration.
+++ b/js/plugins/drupalentity/plugin.js
@@ -66,25 +66,34 @@
+          //Work around the hardcoded integration with drupalimage by reusing the same integration.

Why change this comment? And the change contains a typo too: s///W/// W/

I'd just keep the original comment.

Assuming you fix this on commit, RTBC :)

The last submitted patch, 10: 3074061-10.patch, failed testing. View results

oknate’s picture

I think the linter was complaining the comment didn't start with a capital letter. I'll just revert the change on commit.

Wim Leers’s picture

👍

oknate’s picture

  • oknate committed 7f11bd9 on 8.x-1.x
    Issue #3074061 by oknate, Wim Leers: Update CKEditor plugin to be...
oknate’s picture

Status: Reviewed & tested by the community » Fixed

Committed!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.