class CKEditor5ToolbarTest
Same name and namespace in other branches
- 11.x core/modules/ckeditor5/tests/src/FunctionalJavascript/CKEditor5ToolbarTest.php \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5ToolbarTest
- 10 core/modules/ckeditor5/tests/src/FunctionalJavascript/CKEditor5ToolbarTest.php \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5ToolbarTest
Tests for CKEditor 5 editor UI with Toolbar module.
@group ckeditor5 @internal
Hierarchy
- class \Drupal\Tests\BrowserTestBase uses \Drupal\Core\Test\FunctionalTestSetupTrait, \Drupal\Tests\UiHelperTrait, \Drupal\Core\Test\TestSetupTrait, \Drupal\Tests\block\Traits\BlockCreationTrait, \Drupal\FunctionalTests\AssertLegacyTrait, \Drupal\Tests\RandomGeneratorTrait, \Drupal\Tests\node\Traits\NodeCreationTrait, \Drupal\Tests\node\Traits\ContentTypeCreationTrait, \Drupal\Tests\ConfigTestTrait, \Drupal\Tests\TestRequirementsTrait, \Drupal\Tests\user\Traits\UserCreationTrait, \Drupal\Tests\XdebugRequestTrait, \Drupal\Tests\Traits\PhpUnitWarnings, \Drupal\Tests\PhpUnitCompatibilityTrait, \Symfony\Bridge\PhpUnit\ExpectDeprecationTrait, \Drupal\Tests\ExtensionListTestTrait extends \PHPUnit\Framework\TestCase
- class \Drupal\FunctionalJavascriptTests\WebDriverTestBase extends \Drupal\Tests\BrowserTestBase
- class \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5TestBase extends \Drupal\FunctionalJavascriptTests\WebDriverTestBase
- class \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5ToolbarTest extends \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5TestBase
- class \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5TestBase extends \Drupal\FunctionalJavascriptTests\WebDriverTestBase
- class \Drupal\FunctionalJavascriptTests\WebDriverTestBase extends \Drupal\Tests\BrowserTestBase
Expanded class hierarchy of CKEditor5ToolbarTest
File
-
core/
modules/ ckeditor5/ tests/ src/ FunctionalJavascript/ CKEditor5ToolbarTest.php, line 18
Namespace
Drupal\Tests\ckeditor5\FunctionalJavascriptView source
class CKEditor5ToolbarTest extends CKEditor5TestBase {
/**
* {@inheritdoc}
*/
protected static $modules = [
'toolbar',
];
/**
* The admin user.
*
* @var \Drupal\user\Entity\User
*/
protected $user;
/**
* {@inheritdoc}
*/
protected function setUp() : void {
parent::setUp();
FilterFormat::create([
'format' => 'test_format',
'name' => 'Test format',
'filters' => [],
])->save();
Editor::create([
'editor' => 'ckeditor5',
'format' => 'test_format',
'settings' => [],
])->save();
$this->assertSame([], array_map(function (ConstraintViolation $v) {
return (string) $v->getMessage();
}, iterator_to_array(CKEditor5::validatePair(Editor::load('test_format'), FilterFormat::load('test_format')))));
$this->drupalCreateContentType([
'type' => 'article',
'name' => 'Article',
]);
$this->user = $this->drupalCreateUser([
'use text format test_format',
'access toolbar',
'edit any article content',
'administer site configuration',
]);
$this->drupalLogin($this->user);
}
/**
* Ensures that CKEditor 5 toolbar renders below Drupal Toolbar.
*/
public function test() : void {
$assert_session = $this->assertSession();
// Create test content to ensure that CKEditor 5 text editor can be
// scrolled.
$body = '';
for ($i = 0; $i < 10; $i++) {
$body .= '<p>' . $this->randomMachineName(32) . '</p>';
}
$edit_url = $this->drupalCreateNode([
'type' => 'article',
'body' => [
'value' => $body,
'format' => 'test_format',
],
])
->toUrl('edit-form');
$this->drupalGet($edit_url);
$this->assertNotEmpty($assert_session->waitForElement('css', '#toolbar-bar'));
$this->assertNotEmpty($assert_session->waitForElement('css', '.ck-editor'));
// Ensure the body has enough height to enable scrolling. Scroll 110px from
// top of body field to ensure CKEditor 5 toolbar is sticky.
$this->getSession()
->evaluateScript('document.body.style.height = "10000px";');
$this->getSession()
->evaluateScript('location.hash = "#edit-body-0-value";');
$this->getSession()
->evaluateScript('scroll(0, document.documentElement.scrollTop + 110);');
// Focus CKEditor 5 text editor.
$javascript = <<<JS
Drupal.CKEditor5Instances.get(document.getElementById("edit-body-0-value").dataset["ckeditor5Id"]).editing.view.focus();
JS;
$this->getSession()
->evaluateScript($javascript);
$this->assertNotEmpty($assert_session->waitForElementVisible('css', '.ck-sticky-panel__placeholder'));
$toolbar_height = (int) $this->getSession()
->evaluateScript('document.getElementById("toolbar-bar").offsetHeight');
$ckeditor5_toolbar_position = (int) $this->getSession()
->evaluateScript("document.querySelector('.ck-toolbar').getBoundingClientRect().top");
$this->assertEqualsWithDelta($toolbar_height, $ckeditor5_toolbar_position, 2);
}
}
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.