EWPP-4833: Adapt Date type form element to ECL format.

openeuropa · Oct 23, 2024 · 7f3326a · 7f3326a
1 parent 11bff0d
commit 7f3326a
Show file tree

Hide file tree

Showing 6 changed files with 7 additions and 21 deletions.
diff --git a/js/ecl_datepicker.js b/js/ecl_datepicker.js
@@ -7,9 +7,7 @@
     attach: function attach(context, settings) {
       var elements = document.querySelectorAll('[data-ecl-datepicker-toggle]');
       for (var i = 0; i < elements.length; i++) {
-        var datepicker = new ECL.Datepicker(elements[i], {
-          format: settings.oe_theme.ecl_datepicker_format
-        });
+        var datepicker = new ECL.Datepicker(elements[i]);
         datepicker.init();
       }
     }

diff --git a/oe_theme.theme b/oe_theme.theme
@@ -339,16 +339,7 @@ function oe_theme_preprocess_input__checkbox(array &$variables): void {
  * Implements template_preprocess_input__date().
  */
 function oe_theme_preprocess_input__date(array &$variables): void {
-  $php_date_format = $variables['element']['#date_date_format'] ?? 'Y-m-d';
-  $format_map = [
-    // @todo find a cleverer way of mapping PHP date formats to the expected
-    // ECL ones.
-    'Y-m-d' => 'YYYY-MM-DD',
-  ];
-  $ecl_format = $format_map[$php_date_format] ?? 'YYYY-MM-DD';
   $variables['#attached']['library'][] = 'oe_theme/ecl_datepicker';
-  $variables['#attached']['drupalSettings']['oe_theme']['ecl_datepicker_format'] = $ecl_format;
-  $variables['placeholder'] = $ecl_format;
 }
 
 /**

diff --git a/templates/form/input--date.html.twig b/templates/form/input--date.html.twig
@@ -24,7 +24,7 @@
     required: element['#required'],
     disabled: attributes.disabled is defined,
     invalid: element['#errors'] is not empty,
-    placeholder: placeholder,
+    placeholder: 'DD-MM-YYYY',
     default_value: attributes.value,
     extra_classes: classes|default(''),
     extra_attributes: extra_attributes|default([]),

diff --git a/tests/modules/oe_theme_js_test/src/Form/DatePickerTestForm.php b/tests/modules/oe_theme_js_test/src/Form/DatePickerTestForm.php
@@ -66,7 +66,7 @@ public function buildForm(array $form, FormStateInterface $form_state) {
       '#type' => 'date',
       '#title' => $this->t('Test date picker two'),
       '#description' => $this->t('Date field two.'),
-      '#default_value' => DrupalDateTime::createFromFormat('Y-m-d', '2020-05-10'),
+      '#default_value' => DrupalDateTime::createFromFormat('d-m-Y', '10-05-2020', 'UTC'),
       '#required' => FALSE,
     ];
 
@@ -94,7 +94,7 @@ public function submitForm(array &$form, FormStateInterface $form_state) {
       if (!$value) {
         continue;
       }
-      $date = DrupalDateTime::createFromFormat('Y-m-d', $value);
+      $date = DrupalDateTime::createFromFormat('d-m-Y', $value);
       $this->messenger->addStatus($this->t('Date @key is @date', [
         '@key' => $key,
         '@date' => $date->format('j F Y'),

diff --git a/tests/src/Functional/ConfigurationTest.php b/tests/src/Functional/ConfigurationTest.php
@@ -65,7 +65,6 @@ public function testDefaultLibraryLoading(): void {
       $this->assertLinkContainsHref('/oe_theme/dist/ec/styles/optional/ecl-ec-default.css');
       $this->assertLinkContainsHref('/oe_theme/css/style-ec.css');
 
-      $this->assertScriptContainsSrc('/oe_theme/dist/js/moment.min.js');
       $this->assertScriptContainsSrc('/oe_theme/dist/ec/scripts/ecl-ec.js');
       $this->assertScriptContainsSrc('/oe_theme/js/ecl_auto_init.js');
 
@@ -119,7 +118,6 @@ public function testChangeComponentLibrary(): void {
       $this->assertLinkContainsHref('/oe_theme/dist/eu/styles/optional/ecl-eu-default.css');
       $this->assertLinkContainsHref('/oe_theme/css/style-eu.css');
 
-      $this->assertScriptContainsSrc('/oe_theme/dist/js/moment.min.js');
       $this->assertScriptContainsSrc('/oe_theme/dist/eu/scripts/ecl-eu.js');
       $this->assertScriptContainsSrc('/oe_theme/js/ecl_auto_init.js');
 
@@ -163,7 +161,6 @@ public function testChangeComponentLibrary(): void {
 
       $this->assertScriptContainsSrc('/oe_theme/dist/ec/scripts/ecl-ec.js');
       $this->assertScriptContainsSrc('/oe_theme/js/ecl_auto_init.js');
-      $this->assertScriptContainsSrc('/oe_theme/dist/js/moment.min.js');
 
       // Assert that we don't load rtl styling.
       $this->assertLinkNotContainsHref('/oe_theme/dist/ec/styles/optional/ecl-rtl.css');

diff --git a/tests/src/FunctionalJavascript/JavascriptBehavioursTest.php b/tests/src/FunctionalJavascript/JavascriptBehavioursTest.php
@@ -162,7 +162,7 @@ public function testEclDatePicker(): void {
 
     // Assert the first date picker.
     $input = $this->getSession()->getPage()->find('css', 'input[name="test_datepicker_one"]');
-    $this->assertEquals('YYYY-MM-DD', $input->getAttribute('placeholder'));
+    $this->assertEquals('DD-MM-YYYY', $input->getAttribute('placeholder'));
     $this->assertNull($input->getAttribute('value'));
     $this->assertTrue($input->hasAttribute('data-ecl-datepicker-toggle'));
     $this->assertTrue($input->hasAttribute('required'));
@@ -205,14 +205,14 @@ public function testEclDatePicker(): void {
     // Pick a date and assert it was set.
     $day = $datepickers[0]->find('css', 'button[data-pika-day=1]');
     $day->click();
-    $this->assertEquals($now->format('Y-m') . '-01', $input->getValue());
+    $this->assertEquals('01-' . $now->format('m-Y'), $input->getValue());
     // Give the datepicker a chance to hide.
     sleep(1);
     $this->assertFalse($datepickers[0]->isVisible());
 
     // Assert some small differences on the second date input element.
     $input = $this->getSession()->getPage()->find('css', 'input[name="test_datepicker_two"]');
-    $this->assertEquals('YYYY-MM-DD', $input->getAttribute('placeholder'));
+    $this->assertEquals('DD-MM-YYYY', $input->getAttribute('placeholder'));
     $this->assertStringContainsString('2020-05-10', $input->getAttribute('value'));
     $this->assertTrue($input->hasAttribute('data-ecl-datepicker-toggle'));
     $this->assertFalse($input->hasAttribute('required'));