D8CORE-7211 Header behaviors for card and banners (#763)

SU-SWS · Feb 27, 2024 · 769eb4e · 769eb4e
1 parent 2311c40
commit 769eb4e
Show file tree

Hide file tree

Showing 4 changed files with 184 additions and 5 deletions.
diff --git a/composer.json b/composer.json
@@ -163,7 +163,7 @@
         "su-sws/stanford_fields": "^8.2",
         "su-sws/stanford_media": "^11.0",
         "su-sws/stanford_migrate": "^8.3",
-        "su-sws/stanford_profile_helper": "^9.5",
+        "su-sws/stanford_profile_helper": "9.x-dev",
         "su-sws/stanford_samlauth": "^1.0"
     },
     "config": {

diff --git a/tests/codeception/acceptance/Paragraphs/StanfordCardCest.php b/tests/codeception/acceptance/Paragraphs/StanfordCardCest.php
@@ -24,7 +24,7 @@ public function __construct() {
   /**
    * Test a card with a button link.
    */
-  public function testCardButtonLinkText(\AcceptanceTester $I) {
+  public function testCardButtonLinkText(AcceptanceTester $I) {
     $node = $this->createNodeWithLink($I);
     $I->amOnPage($node->toUrl()->toString());
     $I->canSeeLink('It\'s a "test" link & title', 'http://google.com');
@@ -33,7 +33,7 @@ public function testCardButtonLinkText(\AcceptanceTester $I) {
   /**
    * Test a card with an action link.
    */
-  public function testCardActionLinkText(\AcceptanceTester $I) {
+  public function testCardActionLinkText(AcceptanceTester $I) {
     $node = $this->createNodeWithLink($I, 'action');
     $I->amOnPage($node->toUrl()->toString());
     $I->canSeeLink('It\'s a "test" link & title', 'http://google.com');
@@ -42,7 +42,7 @@ public function testCardActionLinkText(\AcceptanceTester $I) {
   /**
    * Generate a node with a paragraph that contains a link.
    */
-  protected function createNodeWithLink(\AcceptanceTester $I, $link_type = 'button') {
+  protected function createNodeWithLink(AcceptanceTester $I, $link_type = 'button') {
     /** @var \Drupal\paragraphs\ParagraphInterface $paragraph */
     $paragraph = $I->createEntity([
       'type' => 'stanford_card',

diff --git a/tests/codeception/functional/Paragraphs/BannerCest.php b/tests/codeception/functional/Paragraphs/BannerCest.php
@@ -59,26 +59,77 @@ public function testBannerBehaviors(FunctionalTester $I) {
 
     $I->amOnPage($node->toUrl()->toString());
     $I->canSee($field_values['sup_header']);
-    $I->canSee($field_values['header']);
+    $I->canSee($field_values['header'], 'h2');
     $I->canSee($field_values['body']);
     $I->canSeeLink($field_values['title'], $field_values['uri']);
 
     $I->cantSeeElement('.overlay-right');
 
     $I->logInWithRole('site_manager');
 
+    // Overlay position and h3 heading.
     $I->amOnPage($node->toUrl('edit-form')->toString());
     $I->scrollTo('.js-lpb-component', 0, -100);
     $I->moveMouseOver('.js-lpb-component', 10, 10);
     $I->click('Edit', '.lpb-controls');
     $I->waitForText('Behaviors');
     $I->clickWithLeftButton('.lpb-behavior-plugins summary');
     $I->selectOption('Text Overlay Position', 'Right');;
+    $I->selectOption('Heading Level', 'h3');
 
     $I->click('Save', '.ui-dialog-buttonpane');
     $I->waitForElementNotVisible('.ui-dialog');
     $I->click('Save');
     $I->canSeeElement('.overlay-right');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->canSee($field_values['header'], 'h3');
+
+    // H4 heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'h4');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->canSee($field_values['header'], 'h4');
+
+    // Splash Text heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'Splash Text');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->cantSee($field_values['header'], 'h3');
+    $I->cantSee($field_values['header'], 'h4');
+    $I->canSee($field_values['header'], 'div.su-font-splash');
+
+    // Visually hidden heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'h2');
+    $I->checkOption('Visually Hide Heading');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->canSee($field_values['header'], 'h2.visually-hidden');
   }
 
 }
diff --git a/tests/codeception/functional/Paragraphs/CardCest.php b/tests/codeception/functional/Paragraphs/CardCest.php
@@ -0,0 +1,128 @@
+<?php
+
+use Faker\Factory;
+
+/**
+ * Card paragraph tests.
+ */
+class CardCest {
+
+  /**
+   * Faker service.
+   *
+   * @var \Faker\Generator
+   */
+  protected $faker;
+
+  /**
+   * Test constructor.
+   */
+  public function __construct() {
+    $this->faker = Factory::create();
+  }
+
+  /**
+   * The banner paragraph should display its fields.
+   *
+   * @group foobar
+   */
+  public function testCardBehaviors(FunctionalTester $I) {
+    $field_values = [
+      'sup_header' => $this->faker->words(3, TRUE),
+      'header' => $this->faker->words(3, TRUE),
+      'body' => $this->faker->words(3, TRUE),
+      'uri' => $this->faker->url,
+      'title' => $this->faker->words(3, TRUE),
+    ];
+
+    $paragraph = $I->createEntity([
+      'type' => 'stanford_card',
+      'su_card_super_header' => $field_values['sup_header'],
+      'su_card_header' => $field_values['header'],
+      'su_card_link' => [
+        'uri' => $field_values['uri'],
+        'title' => $field_values['title'],
+        'options' => [],
+      ],
+      'su_card_body' => $field_values['body'],
+    ], 'paragraph');
+
+    $node = $I->createEntity([
+      'type' => 'stanford_page',
+      'title' => $this->faker->words(4, TRUE),
+      'su_page_components' => [
+        'target_id' => $paragraph->id(),
+        'entity' => $paragraph,
+      ],
+    ]);
+
+    $I->amOnPage($node->toUrl()->toString());
+    $I->canSee($node->label(), 'h1');
+    $I->canSee($field_values['header'], 'h2');
+
+    $I->logInWithRole('site_manager');
+
+    // Overlay position and h3 heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'h3');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->canSee($field_values['header'], 'h3');
+
+    // H4 heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'h4');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->canSee($field_values['header'], 'h4');
+
+    // Splash Text heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'Splash Text');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->cantSee($field_values['header'], 'h2');
+    $I->cantSee($field_values['header'], 'h3');
+    $I->cantSee($field_values['header'], 'h4');
+    $I->canSee($field_values['header'], 'div.su-font-splash');
+
+    // Visually hidden heading.
+    $I->amOnPage($node->toUrl('edit-form')->toString());
+    $I->scrollTo('.js-lpb-component', 0, -100);
+    $I->moveMouseOver('.js-lpb-component', 10, 10);
+    $I->click('Edit', '.lpb-controls');
+    $I->waitForText('Behaviors');
+    $I->clickWithLeftButton('.lpb-behavior-plugins summary');
+    $I->selectOption('Heading Level', 'h2');
+    $I->checkOption('Visually Hide Heading');
+
+    $I->click('Save', '.ui-dialog-buttonpane');
+    $I->waitForElementNotVisible('.ui-dialog');
+    $I->click('Save');
+    $I->canSee($field_values['header'], 'h2.visually-hidden');
+  }
+
+}