Move form wrapping to widget

[MAILPOET-2600]

lib/Form/DisplayFormInWPContent.php

@@ -94,6 +94,7 @@ class DisplayFormInWPContent {
     $formData = [
       'body' => $form->getBody(),
       'styles' => $form->getStyles(),
+      'settings' => $form->getSettings(),
     ];
     $formSettings = $form->getSettings();
     $templateData = [
@@ -103,6 +104,7 @@ class DisplayFormInWPContent {
       'form_type' => 'below_post',
       'styles' => $this->formRenderer->renderStyles($formData, '#' . $form->getId()),
       'html' => $this->formRenderer->renderHTML($formData),
+      'form_element_styles' => $this->formRenderer->renderFormElementStyles($formData),
     ];
 
     // (POST) non ajax success/error variables

lib/Form/Renderer.php

@@ -37,10 +37,7 @@ class Renderer {
 
   public function renderHTML(array $form = []): string {
     if (isset($form['body']) && !empty($form['body'])) {
-      return $this->wrapForm(
-        $this->renderBlocks($form['body'], $form['settings']),
-        $form['settings']
-      );
+      return $this->renderBlocks($form['body'], $form['settings'] ?? []);
     }
     return '';
   }
@@ -92,7 +89,9 @@ class Renderer {
     </div>';
   }
 
-  private function wrapForm(string $formBody, array $formSettings): string {
+  public function renderFormElementStyles(array $form): string {
+    if (!isset($form['settings'])) return '';
+    $formSettings = $form['settings'];
     $styles = [];
 
     if (isset($formSettings['backgroundColor'])) {
@@ -103,7 +102,6 @@ class Renderer {
       $styles[] = 'color: ' . trim($formSettings['fontColor']);
     }
 
-    if (empty($styles)) return $formBody;
-    return '<div style="' . join(';', $styles) . '">' . $formBody . '</div>';
+    return join(';', $styles);
   }
 }

lib/Form/Util/Styles.php

@@ -8,7 +8,7 @@ class Styles {
   private $defaultStyles = <<<EOL
 /* form */
 .mailpoet_form {
-
+  padding: 10px;
 }
 
 /* paragraphs (label + input) */

lib/Form/Widget.php

@@ -226,6 +226,7 @@ class Widget extends \WP_Widget {
         'after_widget' => $afterWidget,
         'before_title' => $beforeTitle,
         'after_title' => $afterTitle,
+        'form_element_styles' => $this->formRenderer->renderFormElementStyles($form),
       ];
 
       // (POST) non ajax success/error variables

tests/unit/Form/DisplayFormInWPContentTest.php

@@ -38,6 +38,7 @@ class DisplayFormInWPContentTest extends \MailPoetUnitTest {
     $this->renderer = $this->createMock(Renderer::class);
     $this->renderer->expects($this->any())->method('renderStyles')->willReturn('<style></style>');
     $this->renderer->expects($this->any())->method('renderHTML')->willReturn('<form></form>');
+    $this->renderer->expects($this->any())->method('renderFormElementStyles')->willReturn('');
     $this->hook = new DisplayFormInWPContent($this->wp, $this->repository, $this->renderer, $this->assetsController, $this->templateRenderer);
   }
 

tests/unit/Form/RendererTest.php

@@ -97,50 +97,4 @@ class RendererTest extends \MailPoetUnitTest {
     $recaptcha = $this->htmlParser->findByXpath($html, "//div[@class='mailpoet_recaptcha']");
     expect($recaptcha->length)->equals(0);
   }
-
-  public function testItShouldRenderBackgroundColour() {
-    $this->blocksRendererMock
-      ->expects($this->exactly(2))
-      ->method('renderBlock')
-      ->willReturn('<span class="block">Dummy</span>');
-    $this->settingsMock
-      ->method('get')
-      ->with('captcha.type')
-      ->willReturn(Captcha::TYPE_DISABLED);
-    $formBody = Fixtures::get('simple_form_body');
-    $html = $this->renderer->renderHTML([
-      'body' => $formBody,
-      'settings' => ['backgroundColor' => 'red'],
-    ]);
-    $found = $this->htmlParser->findByXpath($html, "//div");
-    expect($found->length)->equals(1);
-    $div = $found->item(0);
-    assert($div instanceof \DOMNode);
-    $source = $div->attributes->getNamedItem('style');
-    assert($source instanceof \DOMAttr);
-    expect($source->value)->equals("background-color: red");
-  }
-
-  public function testItShouldRenderColour() {
-    $this->blocksRendererMock
-      ->expects($this->exactly(2))
-      ->method('renderBlock')
-      ->willReturn('<span class="block">Dummy</span>');
-    $this->settingsMock
-      ->method('get')
-      ->with('captcha.type')
-      ->willReturn(Captcha::TYPE_DISABLED);
-    $formBody = Fixtures::get('simple_form_body');
-    $html = $this->renderer->renderHTML([
-      'body' => $formBody,
-      'settings' => ['fontColor' => 'red'],
-    ]);
-    $found = $this->htmlParser->findByXpath($html, "//div");
-    expect($found->length)->equals(1);
-    $div = $found->item(0);
-    assert($div instanceof \DOMNode);
-    $source = $div->attributes->getNamedItem('style');
-    assert($source instanceof \DOMAttr);
-    expect($source->value)->equals("color: red");
-  }
 }

views/form/front_end_form.html

@@ -15,6 +15,7 @@
       action="<%= admin_url('admin-post.php?action=mailpoet_subscription_form') | raw %>"
       class="mailpoet_form mailpoet_form_<%= form_type %>"
       novalidate
+      style="<%= form_element_styles %>"/* paragraphs (label + input)
     >
       <input type="hidden" name="data[form_id]" value="<%= form_id %>" />
       <input type="hidden" name="token" value="<%= token %>" />