Merge pull request #203 from openeuropa/OEL-1915

OEL-1915: Add Date to the Event teaser.

composer.json

@@ -12,7 +12,7 @@
         "drupal/daterange_compact": "^2.0",
         "drupal/twig_field_value": "^2.0",
         "openeuropa/composer-artifacts": "^1.0.0-alpha1",
-        "openeuropa/oe_bootstrap_theme": "^1.0.0"
+        "openeuropa/oe_bootstrap_theme": "0.1.202301130938"
     },
     "require-dev": {
         "composer/installers": "^1.11",

config/schema/oe_whitelabel.schema.yml

@@ -1,5 +1,5 @@
 oe_whitelabel.settings:
-  type: theme_settings
+  type: oe_bootstrap_theme.settings
   label: 'OE Whitelabel settings'
   mapping:
     component_library:

modules/oe_whitelabel_starter_event/oe_whitelabel_starter_event.module

@@ -79,7 +79,7 @@ function _oe_whitelabel_starter_event_preprocess_links(array &$variables): void
  * Implements template_preprocess_node() for the Event node type.
  */
 function oe_whitelabel_starter_event_preprocess_node__oe_sc_event__teaser(&$variables) {
-  _oe_whitelabel_starter_event_preprocess_featured_media($variables);
+  _oe_whitelabel_starter_event_preprocess_date($variables);
 }
 
 /**
@@ -171,3 +171,41 @@ function _oe_whitelabel_starter_event_preprocess_inpage_nav(array &$variables):
     ];
   }
 }
+
+/**
+ * Helper function to preprocess the date field.
+ *
+ * @param array $variables
+ *   Render array variables.
+ */
+function _oe_whitelabel_starter_event_preprocess_date(array &$variables): void {
+  /** @var \Drupal\node\NodeInterface $node */
+  $node = $variables['node'];
+
+  if ($node->get('oe_sc_event_dates')->isEmpty()) {
+    return;
+  }
+
+  $dates = $node->get('oe_sc_event_dates')->first();
+  /** @var \Drupal\Core\Datetime\DrupalDateTime $start */
+  $start = $dates->get('start_date')->getValue();
+  $variables['date_block'] = [
+    'year' => $start->format('Y'),
+    'month' => $start->format('M'),
+    'day' => $start->format('d'),
+    'date_time' => $start->format('Y-m-d'),
+  ];
+  /** @var \Drupal\Core\Datetime\DrupalDateTime $end */
+  $end = $dates->get('end_date')->getValue();
+
+  if (!empty($end) && $start->format('d-m-y') !== $end->format('d-m-y')) {
+    $variables['date_block'] += [
+      'end_month' => $end->format('M'),
+      'end_day' => $end->format('d'),
+    ];
+
+    if ($start->format('y') !== $end->format('y')) {
+      $variables['date_block']['end_year'] = $end->format('Y');
+    }
+  }
+}

templates/content/node--oe-sc-event--teaser.html.twig

@@ -12,7 +12,7 @@
   variant: 'search',
   title: _title,
   text: content.oe_summary,
-  image: image,
+  date: date_block,
   meta: [
     content.oe_sc_event_dates|field_value,
     content.oe_sc_event_location|field_value

tests/src/Functional/ContentEventRenderTest.php

@@ -8,8 +8,8 @@
 use Drupal\media\Entity\Media;
 use Drupal\node\NodeInterface;
 use Drupal\Tests\media\Traits\MediaTypeCreationTrait;
+use Drupal\Tests\oe_bootstrap_theme\PatternAssertion\CardPatternAssert;
 use Drupal\Tests\TestFileCreationTrait;
-use Symfony\Component\DomCrawler\Crawler;
 
 /**
  * Tests that the Event content type renders correctly.
@@ -164,28 +164,25 @@ public function testEventRenderingTeaser(): void {
     // Build node teaser view.
     $builder = \Drupal::entityTypeManager()->getViewBuilder('node');
     $build = $builder->view($node, 'teaser');
-    $render = $this->container->get('renderer')->renderRoot($build);
-    $crawler = new Crawler((string) $render);
-
-    $article = $crawler->filter('article');
-    $this->assertCount(1, $article);
-
-    $this->assertEquals(
-      'Test event node',
-      trim($article->filter('h1.card-title')->text())
-    );
-    $image = $article->filter('img');
-    $this->assertCount(1, $image);
-    $this->assertCount(1, $image->filter('.card-img-top'));
-    $this->assertStringContainsString(
-      'image-test.png',
-      trim($image->attr('src'))
-    );
-
-    $time = $crawler->filter('div > span.text-muted:nth-of-type(1)');
-    $this->assertEquals('9 Feb 2022', trim($time->text()));
-    $address = $crawler->filter('div > span.text-muted:nth-of-type(2)');
-    $this->assertEquals('Brussel, Belgium', trim($address->text()));
+    $html = (string) $this->container->get('renderer')->renderRoot($build);
+
+    $expected = [
+      'title' => 'Test event node',
+      'description' => 'https://www.example.org is a web page',
+      'content' => [
+        '9 Feb 2022',
+        'Brussel, Belgium',
+      ],
+      'date' => [
+        'year' => '2022',
+        'month' => 'Feb',
+        'day' => '09',
+        'date_time' => '2022-02-09',
+      ],
+    ];
+    $card_assert = new CardPatternAssert();
+    $card_assert->assertVariant('search', $html);
+    $card_assert->assertPattern($expected, $html);
 
     // Assert event dates starting and ending at different days.
     $node->set('oe_sc_event_dates', [
@@ -194,16 +191,24 @@ public function testEventRenderingTeaser(): void {
     ]);
     $node->save();
 
-    $builder = \Drupal::entityTypeManager()->getViewBuilder('node');
     $build = $builder->view($node, 'teaser');
-    $render = $this->container->get('renderer')->renderRoot($build);
-    $crawler = new Crawler((string) $render);
-    $this->drupalGet($node->toUrl());
-
-    $time = $crawler->filter('div > span.text-muted:nth-of-type(1)');
-    $this->assertEquals('7 Feb 2022 - 22 Feb 2022', trim($time->text()));
-    $address = $crawler->filter('div > span.text-muted:nth-of-type(2)');
-    $this->assertEquals('Brussel, Belgium', trim($address->text()));
+    $html = (string) $this->container->get('renderer')->renderRoot($build);
+
+    $expected['content'] = [
+      '7 Feb 2022 - 22 Feb 2022',
+      'Brussel, Belgium',
+    ];
+    $expected['date'] = [
+      'year' => '2022',
+      'month' => 'Feb',
+      'day' => '07',
+      'end_year' => '2022',
+      'end_month' => 'Feb',
+      'end_day' => '22',
+      'date_time' => '2022-02-07',
+    ];
+    $card_assert->assertVariant('search', $html);
+    $card_assert->assertPattern($expected, $html);
   }
 
   /**

tests/src/Functional/PublicationContentRenderTest.php

@@ -4,8 +4,8 @@
 
 namespace Drupal\Tests\oe_whitelabel\Functional;
 
+use Drupal\Tests\oe_bootstrap_theme\PatternAssertion\CardPatternAssert;
 use Drupal\Tests\oe_bootstrap_theme\PatternAssertion\FilePatternAssert;
-use Drupal\Tests\oe_whitelabel\PatternAssertions\CardAssert;
 use Drupal\Tests\oe_whitelabel\PatternAssertions\ContentBannerAssert;
 use Drupal\Tests\oe_whitelabel\PatternAssertions\InPageNavigationAssert;
 use Drupal\Tests\oe_whitelabel\Traits\MediaCreationTrait;
@@ -157,7 +157,7 @@ public function testTeaserViewMode(): void {
     $build = $builder->view($node, 'teaser');
     $html = (string) $this->container->get('renderer')->renderRoot($build);
 
-    $card_assert = new CardAssert();
+    $card_assert = new CardPatternAssert();
     $card_assert->assertVariant('search', $html);
     $card_assert->assertPattern([
       'title' => $title,

tests/src/Kernel/ProjectRenderTest.php

@@ -6,7 +6,7 @@
 
 use Drupal\media\Entity\Media;
 use Drupal\node\Entity\Node;
-use Drupal\Tests\oe_whitelabel\PatternAssertions\CardAssert;
+use Drupal\Tests\oe_bootstrap_theme\PatternAssertion\CardPatternAssert;
 use Drupal\Tests\user\Traits\UserCreationTrait;
 
 /**
@@ -94,7 +94,7 @@ public function testProjectTeaser(): void {
     $build = $this->nodeViewBuilder->view($node, 'teaser');
     $html = $this->renderRoot($build);
 
-    $assert = new CardAssert();
+    $assert = new CardPatternAssert();
 
     $expected_values = [
       'title' => 'Project 1',