function LayoutBuilderTest::testLayoutBuilderUi

Tests the Layout Builder UI.

File

core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderTest.php, line 104

Class

LayoutBuilderTest

Tests the Layout Builder UI.

Namespace

Code

public function testLayoutBuilderUi() : void {
  $layout_url = 'node/1/layout';
  $node_url = 'node/1';
  $assert_session = $this->assertSession();
  $page = $this->getSession()
    ->getPage();
  // Ensure the block is not displayed initially.
  $this->drupalGet($node_url);
  $assert_session->pageTextContains('The node body');
  $assert_session->pageTextNotContains('Powered by Drupal');
  $assert_session->linkNotExists('Layout');
  $this->enableLayoutsForBundle('admin/structure/types/manage/bundle_with_section_field/display', TRUE);
  // The existing content is still shown until overridden.
  $this->drupalGet($node_url);
  $assert_session->pageTextContains('The node body');
  // Enter the layout editing mode.
  $assert_session->linkExists('Layout');
  $this->clickLink('Layout');
  $this->markCurrentPage();
  $assert_session->pageTextContains('The node body');
  $assert_session->linkExists('Add section');
  // Add a new block.
  $this->openAddBlockForm('Powered by Drupal');
  $page->fillField('settings[label]', 'This is the label');
  $page->checkField('settings[label_display]');
  // Save the new block, and ensure it is displayed on the page.
  $page->pressButton('Add block');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->assertNoElementAfterWait('css', '#drupal-off-canvas');
  $assert_session->addressEquals($layout_url);
  $assert_session->pageTextContains('Powered by Drupal');
  $assert_session->pageTextContains('This is the label');
  $this->assertPageNotReloaded();
  // Until the layout is saved, the new block is not visible on the node page.
  $this->drupalGet($node_url);
  $assert_session->pageTextNotContains('Powered by Drupal');
  // When returning to the layout edit mode, the new block is visible.
  $this->drupalGet($layout_url);
  $assert_session->pageTextContains('Powered by Drupal');
  // Save the layout, and the new block is visible.
  $page->pressButton('Save layout');
  $assert_session->addressEquals($node_url);
  $assert_session->pageTextContains('Powered by Drupal');
  $assert_session->pageTextContains('This is the label');
  $assert_session->elementExists('css', '.layout');
  $this->drupalGet($layout_url);
  $this->markCurrentPage();
  $assert_session->linkExists('Add section');
  $this->clickLink('Add section');
  $this->assertNotEmpty($assert_session->waitForElementVisible('named', [
    'link',
    'Two column',
  ]));
  $this->clickLink('Two column');
  $assert_session->waitForElementVisible('named', [
    'button',
    'Add section',
  ]);
  $page->pressButton('Add section');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->assertNoElementAfterWait('css', '.layout__region--second .block-system-powered-by-block');
  $assert_session->elementTextNotContains('css', '.layout__region--second', 'Powered by Drupal');
  // Drag the block to a region in different section.
  $this->sortableTo('.block-system-powered-by-block', '.layout__region--content', '.layout__region--second');
  $assert_session->assertWaitOnAjaxRequest();
  // Ensure the drag succeeded.
  $assert_session->elementExists('css', '.layout__region--second .block-system-powered-by-block');
  $assert_session->elementTextContains('css', '.layout__region--second', 'Powered by Drupal');
  $this->assertPageNotReloaded();
  // Ensure the dragged block is still in the correct position after reload.
  $this->drupalGet($layout_url);
  $assert_session->elementExists('css', '.layout__region--second .block-system-powered-by-block');
  $assert_session->elementTextContains('css', '.layout__region--second', 'Powered by Drupal');
  // Ensure the dragged block is still in the correct position after save.
  $page->pressButton('Save layout');
  $assert_session->elementExists('css', '.layout__region--second .block-system-powered-by-block');
  $assert_session->elementTextContains('css', '.layout__region--second', 'Powered by Drupal');
  // Reconfigure a block and ensure that the layout content is updated.
  $this->drupalGet($layout_url);
  $this->markCurrentPage();
  $this->clickContextualLink('.block-system-powered-by-block', 'Configure');
  $this->assertOffCanvasFormAfterWait('layout_builder_update_block');
  $page->fillField('settings[label]', 'This is the new label');
  $page->pressButton('Update');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->assertNoElementAfterWait('css', '#drupal-off-canvas');
  $assert_session->addressEquals($layout_url);
  $assert_session->pageTextContains('Powered by Drupal');
  $assert_session->pageTextContains('This is the new label');
  $assert_session->pageTextNotContains('This is the label');
  // Remove a block.
  $this->clickContextualLink('.block-system-powered-by-block', 'Remove block');
  $this->assertOffCanvasFormAfterWait('layout_builder_remove_block');
  $assert_session->pageTextContains('Are you sure you want to remove the This is the new label block?');
  $assert_session->pageTextContains('This action cannot be undone.');
  $page->pressButton('Remove');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->assertNoElementAfterWait('css', '#drupal-off-canvas');
  $assert_session->pageTextNotContains('Powered by Drupal');
  $assert_session->linkExists('Add block');
  $assert_session->addressEquals($layout_url);
  $this->assertPageNotReloaded();
  $page->pressButton('Save layout');
  $assert_session->elementExists('css', '.layout');
  // Test deriver-based blocks.
  $this->drupalGet($layout_url);
  $this->markCurrentPage();
  $this->openAddBlockForm('My content block');
  $page->pressButton('Add block');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->pageTextContains('This is the block content');
  // Remove both sections.
  $assert_session->linkExists('Remove Section 1');
  $this->clickLink('Remove Section 1');
  $this->assertOffCanvasFormAfterWait('layout_builder_remove_section');
  $assert_session->pageTextContains('Are you sure you want to remove section 1?');
  $assert_session->pageTextContains('This action cannot be undone.');
  $page->pressButton('Remove');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->linkExists('Remove Section 1');
  $this->clickLink('Remove Section 1');
  $this->assertOffCanvasFormAfterWait('layout_builder_remove_section');
  $page->pressButton('Remove');
  $assert_session->assertWaitOnAjaxRequest();
  $assert_session->pageTextNotContains('This is the block content');
  $assert_session->linkNotExists('Add block');
  $this->assertPageNotReloaded();
  $page->pressButton('Save layout');
  // Removing all sections results in no layout being used.
  $assert_session->addressEquals($node_url);
  $assert_session->elementNotExists('css', '.layout');
  $assert_session->pageTextNotContains('The node body');
}