LayoutBuilderSectionTest.php in Block Style Plugins 8.2

Namespace

Drupal\Tests\block_style_plugins\FunctionalJavascript

File

tests/src/FunctionalJavascript/LayoutBuilderSectionTest.php

<?php

namespace Drupal\Tests\block_style_plugins\FunctionalJavascript;

use Drupal\FunctionalJavascriptTests\WebDriverTestBase;

/**
 * Layout Builder section tests.
 *
 * @group block_style_plugins
 */
class LayoutBuilderSectionTest extends WebDriverTestBase {

  /**
   * {@inheritdoc}
   */
  protected static $modules = [
    'node',
    'layout_builder',
    'block_style_plugins',
    'block_style_plugins_test',
  ];

  /**
   * Default Theme.
   */
  protected $defaultTheme = 'classy';

  /**
   * {@inheritdoc}
   */
  protected function setUp() : void {
    parent::setUp();
    $user = $this
      ->drupalCreateUser([
      'configure any layout',
      'administer node display',
      'administer node fields',
    ]);
    $user
      ->save();
    $this
      ->drupalLogin($user);
    $this
      ->createContentType([
      'type' => 'bundle_with_section_field',
    ]);

    // The Layout Builder UI relies on local tasks.
    $this
      ->drupalPlaceBlock('local_tasks_block');

    // Enable layout builder.
    $field_ui_prefix = 'admin/structure/types/manage/bundle_with_section_field';
    $this
      ->drupalGet("{$field_ui_prefix}/display/default");
    $this
      ->submitForm([
      'layout[enabled]' => TRUE,
      'layout[allow_custom]' => TRUE,
    ], 'Save');

    // Start by creating a node.
    $node = $this
      ->createNode([
      'type' => 'bundle_with_section_field',
      'body' => [
        [
          'value' => 'The node body',
        ],
      ],
    ]);
    $node
      ->save();
  }

  /**
   * Tests that styles can be applied via Layout Builder sections.
   */
  public function testLayoutBuilderSectionForm() {

    /** @var \Drupal\FunctionalJavascriptTests\WebDriverWebAssert $assert */
    $assert = $this
      ->assertSession();
    $page = $this
      ->getSession()
      ->getPage();
    $section_css_locator = '.layout--onecol';
    $this
      ->drupalGet('node/1/layout');
    $assert
      ->pageTextContains('The node body');

    // Edit the Section config form.
    $this
      ->clickLink('Configure Section 1');
    $assert
      ->assertWaitOnAjaxRequest();

    // Choose a style to apply.
    $assert
      ->pageTextContains('Section Styles');
    $page
      ->fillField('third_party_settings[block_style_plugins][section_class][test_section_field]', 'section-class');
    $page
      ->pressButton('Update');
    $assert
      ->assertNoElementAfterWait('css', '#drupal-off-canvas');
    $assert
      ->assertWaitOnAjaxRequest();

    // Check to see if classes were applied.
    $section_element = $assert
      ->waitForElementVisible('css', $section_css_locator);
    $section_element
      ->hasClass('section-class');

    // Edit the style.
    $this
      ->clickLink('Configure Section 1');
    $assert
      ->assertWaitOnAjaxRequest();
    $page
      ->fillField('third_party_settings[block_style_plugins][section_class][test_section_field]', 'edited-section-class');
    $page
      ->pressButton('Update');
    $assert
      ->assertNoElementAfterWait('css', '#drupal-off-canvas');
    $assert
      ->assertWaitOnAjaxRequest();

    // Check to see if classes were applied.
    $section_element = $assert
      ->waitForElementVisible('css', $section_css_locator);
    $section_element
      ->hasClass('section-class2');

    // Save the Layout.
    $page
      ->pressButton('Save layout');

    // Check to see if classes are still applied.
    $section_element = $assert
      ->waitForElementVisible('css', $section_css_locator);
    $section_element
      ->hasClass('edited-section-class');

    // Delete the style.
    $this
      ->drupalGet('node/1/layout');
    $this
      ->clickLink('Configure Section 1');
    $assert
      ->assertWaitOnAjaxRequest();
    $assert
      ->pageTextContains('Section Styles');
    $page
      ->fillField('third_party_settings[block_style_plugins][section_class][test_section_field]', '');
    $page
      ->pressButton('Update');
    $assert
      ->assertNoElementAfterWait('css', '#drupal-off-canvas');
    $assert
      ->assertWaitOnAjaxRequest();

    // Check to see if classes have been removed.
    $assert
      ->responseNotContains('edited-section-class');

    // Save the Layout.
    $page
      ->pressButton('Save layout');

    // Check to see if classes have been removed.
    $assert
      ->responseContains('The layout override has been saved');
    $assert
      ->responseNotContains('edited-section-class');
  }

}

Classes

Name	Description
LayoutBuilderSectionTest	Layout Builder section tests.