diff --git a/core/modules/layout_builder/layout_builder.module b/core/modules/layout_builder/layout_builder.module index 2138a045f3..f579cdbd80 100644 --- a/core/modules/layout_builder/layout_builder.module +++ b/core/modules/layout_builder/layout_builder.module @@ -5,13 +5,21 @@ * Provides hook implementations for Layout Builder. */ +use Drupal\Core\Entity\Display\EntityViewDisplayInterface; +use Drupal\Core\Entity\Entity\EntityViewDisplay; +use Drupal\Core\Entity\EntityInterface; +use Drupal\Core\Entity\FieldableEntityInterface; use Drupal\Core\Form\FormStateInterface; +use Drupal\Core\Plugin\Context\Context; +use Drupal\Core\Plugin\Context\ContextDefinition; use Drupal\Core\Routing\RouteMatchInterface; use Drupal\Core\Url; use Drupal\field\FieldConfigInterface; use Drupal\layout_builder\Entity\LayoutBuilderEntityViewDisplay; use Drupal\layout_builder\Entity\LayoutBuilderEntityViewDisplayStorage; use Drupal\layout_builder\Form\LayoutBuilderEntityViewDisplayForm; +use Drupal\layout_builder\Entity\LayoutEntityDisplayInterface; +use Drupal\Core\StringTranslation\TranslatableMarkup; /** * Implements hook_help(). @@ -81,3 +89,52 @@ function layout_builder_field_config_delete(FieldConfigInterface $field_config) $sample_entity_generator->delete($field_config->getTargetEntityTypeId(), $field_config->getTargetBundle()); \Drupal::service('plugin.manager.block')->clearCachedDefinitions(); } + +/** + * Implements hook_quickedit_render_field(). + * + * Re-renders a field rendered by Layout Builder, edited with Quick Edit. + * + * @see layout_builder_entity_view_alter() + * @see \Drupal\quickedit\QuickEditController::renderField() + */ +function layout_builder_quickedit_render_field(EntityInterface $entity, $field_name, $view_mode_id, $langcode) { + $build = []; + list(, $delta, $component_uuid) = explode('-', $view_mode_id, 3); + if ($entity instanceof FieldableEntityInterface) { + $view_display = EntityViewDisplay::collectRenderDisplay($entity, $view_mode_id); + if ($view_display instanceof LayoutEntityDisplayInterface) { + $sections = $view_display->getRuntimeSections($entity); + $component = $sections[$delta]->getComponent($component_uuid); + $contexts = \Drupal::service('context.repository')->getAvailableContexts(); + $contexts['layout_builder.entity'] = new Context(new ContextDefinition("entity:{$entity->getEntityTypeId()}", new TranslatableMarkup('@entity being viewed', ['@entity' => $entity->getEntityType()->getLabel()])), $entity); + $block = $component->toRenderArray($contexts); + $build = $block['content']; + $build['#view_mode'] = $view_mode_id; + } + } + return $build; +} + +/** + * Implements hook_entity_view_alter(). + * + * When rendering fields outside of normal view modes, Quick Edit requires that + * modules identify themselves with a view mode in the format module_name-id. + * + * @see hook_quickedit_render_field() + * @see layout_builder_quickedit_render_field() + */ +function layout_builder_entity_view_alter(array &$build, EntityInterface $entity, EntityViewDisplayInterface $display) { + if ($display instanceof LayoutEntityDisplayInterface && isset($build['_layout_builder'])) { + foreach ($build['_layout_builder'] as $delta => &$section) { + if (isset($section['content'])) { + foreach ($section['content'] as $component_uuid => &$component) { + if (isset($component['content']) && isset($component['content']['#theme']) && $component['content']['#theme'] === 'field') { + $component['content']['#view_mode'] = implode('-', ['layout_builder', $delta, $component_uuid]); + } + } + } + } + } +} diff --git a/core/modules/layout_builder/src/Entity/LayoutBuilderEntityViewDisplay.php b/core/modules/layout_builder/src/Entity/LayoutBuilderEntityViewDisplay.php index 4df6afe89a..b1882f483b 100644 --- a/core/modules/layout_builder/src/Entity/LayoutBuilderEntityViewDisplay.php +++ b/core/modules/layout_builder/src/Entity/LayoutBuilderEntityViewDisplay.php @@ -163,15 +163,9 @@ public function buildMultiple(array $entities) { } /** - * Gets the runtime sections for a given entity. - * - * @param \Drupal\Core\Entity\FieldableEntityInterface $entity - * The entity. - * - * @return \Drupal\layout_builder\Section[] - * The sections. + * {@inheritdoc} */ - protected function getRuntimeSections(FieldableEntityInterface $entity) { + public function getRuntimeSections(FieldableEntityInterface $entity) { if ($this->isOverridable() && !$entity->get('layout_builder__layout')->isEmpty()) { return $entity->get('layout_builder__layout')->getSections(); } diff --git a/core/modules/layout_builder/src/Entity/LayoutEntityDisplayInterface.php b/core/modules/layout_builder/src/Entity/LayoutEntityDisplayInterface.php index b8fd21d822..de3ae29af4 100644 --- a/core/modules/layout_builder/src/Entity/LayoutEntityDisplayInterface.php +++ b/core/modules/layout_builder/src/Entity/LayoutEntityDisplayInterface.php @@ -3,6 +3,7 @@ namespace Drupal\layout_builder\Entity; use Drupal\Core\Entity\Display\EntityDisplayInterface; +use Drupal\Core\Entity\FieldableEntityInterface; use Drupal\layout_builder\SectionListInterface; /** @@ -33,4 +34,15 @@ public function isOverridable(); */ public function setOverridable($overridable = TRUE); + /** + * Gets the runtime sections for a given entity. + * + * @param \Drupal\Core\Entity\FieldableEntityInterface $entity + * The entity. + * + * @return \Drupal\layout_builder\Section[] + * The sections. + */ + public function getRuntimeSections(FieldableEntityInterface $entity); + } diff --git a/core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderQuickEditTest.php b/core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderQuickEditTest.php new file mode 100644 index 0000000000..bcdc56bfe7 --- /dev/null +++ b/core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderQuickEditTest.php @@ -0,0 +1,123 @@ +createContentType(['type' => 'article']); + + $editor = Editor::create([ + 'editor' => 'ckeditor', + 'format' => 'full_html', + ]); + $editor->save(); + + $this->drupalLogin($this->drupalCreateUser([ + 'access contextual links', + 'access toolbar', + 'access in-place editing', + 'access content', + 'create article content', + 'edit any article content', + 'use text format full_html', + ])); + } + + /** + * Tests that Layout Builder functions with Quick Edit. + */ + public function testLayoutBuilderQuickEdit() { + $assert_session = $this->assertSession(); + + // Create a test node. + $node = $this->createNode([ + 'type' => 'article', + 'title' => 'The node title', + 'body' => [ + [ + 'value' => '

The node body

', + 'format' => 'full_html', + ], + ], + ]); + + // Get the UUID of the default body field block. + /** @var \Drupal\layout_builder\Entity\LayoutEntityDisplayInterface $view_display */ + $view_display = EntityViewDisplay::collectRenderDisplay($node, 'default'); + $sections = $view_display->getRuntimeSections($node); + $section = reset($sections); + $component_uuid = array_keys($section->getComponents())[0]; + $field_id = 'node/' . $node->id() . '/body/' . $node->language()->getId() . '/layout_builder-0-' . $component_uuid; + + // Assemble common CSS selectors. + $entity_selector = '[data-quickedit-entity-id="node/' . $node->id() . '"]'; + $field_selector = '[data-quickedit-field-id="' . $field_id . '"]'; + + // Verify that our custom view mode is present. + /* @see layout_builder_entity_view_alter() */ + $this->drupalGet('node/' . $node->id()); + $assert_session->elementExists('css', $field_selector); + + // Wait until Quick Edit loads. + $condition = "jQuery('" . $entity_selector . " .quickedit').length > 0"; + $this->assertJsCondition($condition, 10000); + + // Initiate Quick Editing. + $this->getSession()->executeScript("jQuery('.toolbar-icon-menu.is-active').click()"); + $this->click('.contextual-toolbar-tab button'); + $this->click($entity_selector . ' [data-contextual-id] > button'); + $this->click($entity_selector . ' [data-contextual-id] .quickedit > a'); + $this->click($field_selector); + $this->assertSession()->assertWaitOnAjaxRequest(); + + // Trigger an edit with Javascript (this is a "contenteditable" element). + $this->getSession()->executeScript("jQuery('" . $field_selector . "').text('Hello world').trigger('keyup');"); + + // To prevent 403s on save, we re-set our request (cookie) state. + $this->prepareRequest(); + + // Save the change. + $this->getSession()->executeScript("jQuery('.quickedit-button.action-save').click()"); + $this->assertSession()->assertWaitOnAjaxRequest(); + + // Assert that the field was re-rendered properly. + /* @see layout_builder_quickedit_render_field() */ + $assert_session->pageTextContains('Hello world'); + $assert_session->elementExists('css', $field_selector); + } + +}