You are here

public function LayoutBuilderTest::testLayoutBuilderUi in Drupal 9

Same name in this branch
  1. 9 core/modules/layout_builder/tests/src/Functional/LayoutBuilderTest.php \Drupal\Tests\layout_builder\Functional\LayoutBuilderTest::testLayoutBuilderUi()
  2. 9 core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderTest.php \Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderTest::testLayoutBuilderUi()
Same name and namespace in other branches
  1. 8 core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderTest.php \Drupal\Tests\layout_builder\FunctionalJavascript\LayoutBuilderTest::testLayoutBuilderUi()

Tests the Layout Builder UI.

File

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

Class

LayoutBuilderTest
Tests the Layout Builder UI.

Namespace

Drupal\Tests\layout_builder\FunctionalJavascript

Code

public function testLayoutBuilderUi() {
  $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 custom 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');
}