Issue #3296335 by Tasneem Natshah: Finalize the Gherkin Script field type...

Issue #3296335 by Tasneem Natshah: Finalize the Gherkin Script field type widget and formatter with options to read from a list of step definitions

README.md

-# Gherkin Editor
\ No newline at end of file
+# Gherkin Script
\ No newline at end of file

composer.json

 {
   "name": "drupal/gherkin",
-  "description": "Gherkin Editor",
+  "description": "Gherkin Script",
   "type": "drupal-module",
   "homepage": "https://www.drupal.org/project/gherkin",
   "license": "GPL-2.0-or-later",

config/install/gherkin.settings.yml

+theme_list:
+  dark: 'Dark'
+  light: 'Light'
+
+theme: 'dark'

config/schema/gherkin.schema.yml

@@ -4,4 +4,7 @@ field.field_settings.gherkin_default_widget:
   mapping:
     size:
       type: integer
-      label: 'Size'
\ No newline at end of file
+      label: 'Size'
+    theme:  
+      type: string
+      label: 'Gherkin Theme'
\ No newline at end of file

css/theme/gherkin.style.theme.css

+.dark{
+  width: 100% !important;
+  background: black !important;
+  color: white !important;
+}
+
+.light{
+  width: 100% !important;
+  background: white !important;
+  color: black !important;
+}

gherkin.info.yml

 name: 'Gherkin Script'
 type: module
 description: 'Gherkin editing interface.'
+configure: gherkin.settings
 package: Other
 core_version_requirement: '^9 || ^10'

gherkin.install

+<?php
+
+/**
+ * @file
+ * Install, update, and uninstall functions for the gherkin module.
+ */
+
+/**
+ * Implements hook_install().
+ */
+function gherkin_install() {
+  $install_message = t("Automated tests using Gherkin, Run tests, and create tests under Administration -> Configuration -> Development -> Gherkin");
+  \Drupal::logger('gherkin')->notice($install_message);
+  \Drupal::messenger()->addWarning($install_message);
+}

gherkin.libraries.yml

-editor:
+style:
+  version: VERSION
+  css:
+    theme:
+      css/theme/gherkin.style.theme.css: {}
+gherkin-editor:
   version: VERSION
   js:
-    js/gherkin.js: {}
+    js/gherkin-editor.js: {}
   dependencies:
+    - core/drupal
+    - core/drupal.ajax
     - core/jquery
+    - core/jquery.once
+ace-editor:
+  remote: https://raw.githubusercontent.com/ajaxorg/ace-builds/v1.9.6/src/ace.js
+  version: 1.9.6
+  license:
+    name: Ace Editor
+    url: https://ace.c9.io
+  js:
+    //raw.githubusercontent.com/ajaxorg/ace-builds/v1.9.6/src/ace.js: { type: external, minified: true }
+    //raw.githubusercontent.com/ajaxorg/ace-builds/v1.9.6/src/ext-language_tools.js:
+      { type: external, minified: true }
+    //https://raw.githubusercontent.com/ajaxorg/ace-builds/v1.9.6/src/ext-keybinding_menu.js:
+      { type: external, minified: true }
+    js/behat-ui.ace-editor.js: {}
+  dependencies:
+    - core/jquery.ui.resizable

gherkin.links.menu.yml

+gherkin.form:
+  title: 'Gherkin settings'
+  description: 'Configure settings for the Gherkin field area.'
+  route_name: gherkin.form
+  parent: 'system.admin_config_development'
\ No newline at end of file

gherkin.routing.yml

+gherkin.form:
+  path: '/admin/config/development/gherkin'
+  defaults:
+    _form: '\Drupal\gherkin\Form\GherkinSettingForm'
+    _title: 'Gherkin settings'
+  requirements:
+    _permission: 'administer site configuration'
\ No newline at end of file

src/Plugin/Field/FieldWidget/GherkinDefaultWidget.php

@@ -5,6 +5,7 @@ namespace Drupal\gherkin\Plugin\Field\FieldWidget;
 use Drupal\Core\Field\FieldItemListInterface;
 use Drupal\Core\Field\WidgetBase;
 use Drupal\Core\Form\FormStateInterface;
+
 /**
  * @FieldWidget(
  *      id = "gherkin_default_widget",
@@ -22,6 +23,7 @@ class GherkinDefaultwidget extends widgetBase   {
 
         return [
         'size' => 15,
+        'theme' => 'dark'
         ] + parent::defaultSettings();
     }
 
@@ -33,7 +35,18 @@ class GherkinDefaultwidget extends widgetBase   {
           '#required' => TRUE,
           '#min' => 1,
         ];
-      
+
+        $config = \Drupal::config('gherkin.settings');
+
+        $element['theme'] = [
+            '#type' => 'select',
+            '#title' => $this->t('Theme'),
+            '#options' => $config->get('theme_list'),
+            '#attributes' => [
+            // 'style' => 'width: 150px;',
+            ],
+            '#default_value' => $this->getSetting('theme'),
+        ];
         return $element;
       }
 
@@ -41,6 +54,7 @@ class GherkinDefaultwidget extends widgetBase   {
         $summary = [];
       
         $summary[] = $this->t('Script area size: @size', array('@size' => $this->getSetting('size')));
+        $summary[] = $this->t('Theme: @theme', array('@theme' => $this->getSetting('theme')));
       
         return $summary;
       }
@@ -48,14 +62,66 @@ class GherkinDefaultwidget extends widgetBase   {
     public function formElement(FieldItemListInterface $items, $delta, array $element, array &$form, FormStateInterface $form_state) {
     $value = isset($items[$delta]->value) ? $items[$delta]->value : '';
 
-    $element[] = [
-        '#type' => 'textarea',
-        '#Title' => 'Gherkin Script',
-        '#rows' => $this->getSetting('size'),
-        '#resizable' => TRUE,
-        '#default_value' => $value,
-      ];
- 
+    $AreaTheme = $this->getSetting('theme');
+    
+    // $behat_ui_steps_link = new Url('behat_ui.behat_dl');
+    //   $form['behat_ui_new_scenario']['behat_ui_steps_link'] = [
+    //     '#type' => 'markup',
+    //     '#markup' => '<a class="button use-ajax"
+    //           data-dialog-options="{&quot;width&quot;:500}" 
+    //           data-dialog-renderer="off_canvas" 
+    //           data-dialog-type="dialog"
+    //           href="' . $this->currentRequest->getSchemeAndHttpHost() . $behat_ui_steps_link->toString() . '" >' . $this->t('Check available steps') . '</a>',
+    //   ];
+
+    $element['gherkin_feature_code'] = [
+      '#id' => 'gherkin_feature_code',
+      '#type' => 'textarea',
+      '#Title' => $this->t('Gherkin Script:'),
+      '#rows' => $this->getSetting('size'),
+      '#resizable' => TRUE,
+      '#attributes' => [
+          'class' => [$AreaTheme],
+          ],
+      '#default_value' => $this->getFeature(),
+    ];
+
+    $element['gherkin_feature_code']['free_text_ace_editor'] = [
+      '#type' => 'markup',
+      '#markup' => '<div id="free_text_ace_editor">' . $this->getFeature() . '</div>',
+    ];
+
+    $element['#attached']['library'][] = 'gherkin/style';
+    $element['#attached']['library'][] = 'gherkin/ace-editor';
+    
     return ['value' => $element];
   }
+
+  public function getFeature($feature_name = 'default.feature') {
+    // $config = $this->configFactory->getEditable('gherkin.settings');
+
+    // $behat_ui_behat_config_path = $config->get('behat_ui_behat_config_path');
+    // $behat_ui_behat_features_path = $config->get('behat_ui_behat_features_path');
+
+    // $default_feature_path = $behat_ui_behat_config_path . '/' . $behat_ui_behat_features_path . '/' . $feature_name;
+
+    // if (file_exists($default_feature_path)) {
+    //   return file_get_contents($default_feature_path);
+    // }
+    // else {
+      return '
+        Feature: Website requeirment: Website home page.
+          As a visitor to the website 
+          I want to navigate to the home page
+          So that I will be able to see all homepage content
+
+          @javascript @init @check
+          Scenario: check the welcome message at the homepage
+            Given I am an anonymous user
+            When I go to the homepage
+            Then I should see "No front page content has been created yet."
+      ';
+    // }
+
+  }
 }
\ No newline at end of file

src/Plugin/Form/GherkinSettingForm.php

+<?php
+
+/**
+ * @file
+ * Contains Drupal\gherkin\Form\GherkinSettingForm.
+ */
+
+ namespace Drupal\gherkin\Form;
+
+use Drupal\Core\Form\ConfigFormBase;
+use Drupal\Core\Form\FormStateInterface;
+
+class GherkinSettingForm extends ConfigFormBase {
+
+    /**
+    * {@inheritdoc}
+    */
+    public function getFormId() {
+        return 'gherkin_setting_form';
+    }
+
+    /**
+    * {@inheritdoc}
+    */
+    public function buildForm(array $form, FormStateInterface $form_state) {
+
+        $config = $this->config('gherkin.settings');
+        $form = parent::buildForm($form, $form_state);
+
+        $form['theme'] = [
+            '#type' => 'select',
+            '#title' => $this->t('Theme'),
+            '#options' => $config->get('theme_list'),
+            '#attributes' => [
+            'style' => 'width: 150px;',
+            ],
+            '#default_value' => $config->get('theme'),
+        ];
+
+        return $form;
+    }
+
+    /**
+   * {@inheritdoc}
+   */
+  public function validateForm(array &$form, FormStateInterface $form_state) {
+
+    }
+    
+    /**
+    * {@inheritdoc}
+    */
+    public function submitForm(array &$form, FormStateInterface $form_state) {
+        $config = $this->config('gherkin.settings');
+        $config->set('gherkin.theme', $form_state->getValue('theme'));
+        $config->save();
+        return parent::submitForm($form, $form_state);
+    }
+
+    /**
+    * {@inheritdoc}
+    */
+    protected function getEditableConfigNames() {
+        return [
+        'gherkin.settings',
+        ];
+    }
+
+    
+}
\ No newline at end of file