diff --git a/lib/DI/ContainerConfigurator.php b/lib/DI/ContainerConfigurator.php index 7696fa12e6..5aadd82469 100644 --- a/lib/DI/ContainerConfigurator.php +++ b/lib/DI/ContainerConfigurator.php @@ -174,6 +174,7 @@ class ContainerConfigurator implements IContainerConfigurator { $container->autowire(\MailPoet\Form\FormsRepository::class); $container->autowire(\MailPoet\Form\Renderer::class)->setPublic(true); $container->autowire(\MailPoet\Form\BlocksRenderer::class); + $container->autowire(\MailPoet\Form\TextInputStylesRenderer::class); $container->autowire(\MailPoet\Form\Block\BlockRendererHelper::class); $container->autowire(\MailPoet\Form\Block\Column::class); $container->autowire(\MailPoet\Form\Block\Columns::class); diff --git a/lib/Form/Block/Text.php b/lib/Form/Block/Text.php index 53bc11bf70..1e6c7dc97b 100644 --- a/lib/Form/Block/Text.php +++ b/lib/Form/Block/Text.php @@ -2,13 +2,19 @@ namespace MailPoet\Form\Block; +use MailPoet\Form\TextInputStylesRenderer; + class Text { /** @var BlockRendererHelper */ private $rendererHelper; - public function __construct(BlockRendererHelper $rendererHelper) { + /** @var TextInputStylesRenderer */ + private $inputStylesRenderer; + + public function __construct(BlockRendererHelper $rendererHelper, TextInputStylesRenderer $inputStylesRenderer) { $this->rendererHelper = $rendererHelper; + $this->inputStylesRenderer = $inputStylesRenderer; } public function render(array $block, array $formSettings): string { @@ -17,6 +23,7 @@ class Text { if ($block['id'] === 'email') { $type = 'email'; } + $styles = $this->inputStylesRenderer->render($block['styles'] ?? []); if (in_array($block['id'], ['email', 'last_name', 'first_name'], true)) { $automationId = 'data-automation-id="form_' . $block['id'] . '" '; @@ -34,6 +41,10 @@ class Text { $html .= 'value="' . $this->rendererHelper->getFieldValue($block) . '" '; + if ($styles) { + $html .= 'style="' . $styles . '" '; + } + $html .= $automationId; $html .= $this->rendererHelper->renderInputPlaceholder($block); diff --git a/lib/Form/Block/Textarea.php b/lib/Form/Block/Textarea.php index 0125dbe25c..919e512377 100644 --- a/lib/Form/Block/Textarea.php +++ b/lib/Form/Block/Textarea.php @@ -2,16 +2,23 @@ namespace MailPoet\Form\Block; +use MailPoet\Form\TextInputStylesRenderer; + class Textarea { /** @var BlockRendererHelper */ private $rendererHelper; - public function __construct(BlockRendererHelper $rendererHelper) { + /** @var TextInputStylesRenderer */ + private $inputStylesRenderer; + + public function __construct(BlockRendererHelper $rendererHelper, TextInputStylesRenderer $inputStylesRenderer) { $this->rendererHelper = $rendererHelper; + $this->inputStylesRenderer = $inputStylesRenderer; } public function render(array $block, array $formSettings): string { $html = ''; + $styles = $this->inputStylesRenderer->render($block['styles'] ?? []); $html .= '
'; @@ -29,6 +36,10 @@ class Textarea { $html .= $this->rendererHelper->getInputModifiers($block); + if ($styles) { + $html .= 'style="' . $styles . '" '; + } + $html .= '>' . $this->rendererHelper->getFieldValue($block) . ''; $html .= '
'; diff --git a/lib/Form/TextInputStylesRenderer.php b/lib/Form/TextInputStylesRenderer.php new file mode 100644 index 0000000000..4f0cb883bd --- /dev/null +++ b/lib/Form/TextInputStylesRenderer.php @@ -0,0 +1,25 @@ +rendererHelperMock = $this->createMock(BlockRendererHelper::class); - $this->text = new Text($this->rendererHelperMock); + $this->stylesRendererMock = $this->createMock(TextInputStylesRenderer::class); + $this->text = new Text($this->rendererHelperMock, $this->stylesRendererMock); $this->htmlParser = new HtmlParser(); } @@ -48,6 +53,7 @@ class TextTest extends \MailPoetUnitTest { $this->rendererHelperMock->expects($this->once())->method('getFieldValue')->willReturn('val'); $this->rendererHelperMock->expects($this->once())->method('renderInputPlaceholder')->willReturn(''); $this->rendererHelperMock->expects($this->once())->method('getInputModifiers')->willReturn(' modifiers="mod" '); + $this->stylesRendererMock->expects($this->once())->method('render')->willReturn('border-radius: 10px;'); $html = $this->text->render($this->block, []); $input = $this->htmlParser->getElementByXpath($html, '//input'); @@ -57,11 +63,13 @@ class TextTest extends \MailPoetUnitTest { $value = $this->htmlParser->getAttribute($input, 'value'); $modifiers = $this->htmlParser->getAttribute($input, 'modifiers'); $class = $this->htmlParser->getAttribute($input, 'class'); + $style = $this->htmlParser->getAttribute($input, 'style'); expect($name->value)->equals('data[Field name]'); expect($type->value)->equals('text'); expect($validation->value)->equals('1'); expect($value->value)->equals('val'); expect($modifiers->value)->equals('mod'); expect($class->value)->equals('mailpoet_text'); + expect($style->value)->equals('border-radius: 10px;'); } } diff --git a/tests/unit/Form/Block/TextareaTest.php b/tests/unit/Form/Block/TextareaTest.php index afb5ffcac6..d54844fcaa 100644 --- a/tests/unit/Form/Block/TextareaTest.php +++ b/tests/unit/Form/Block/TextareaTest.php @@ -4,6 +4,7 @@ namespace MailPoet\Test\Form\Block; use MailPoet\Form\Block\BlockRendererHelper; use MailPoet\Form\Block\Textarea; +use MailPoet\Form\TextInputStylesRenderer; use MailPoet\Test\Form\HtmlParser; use PHPUnit\Framework\MockObject\MockObject; @@ -16,6 +17,9 @@ class TextareaTest extends \MailPoetUnitTest { /** @var MockObject & BlockRendererHelper */ private $rendererHelperMock; + /** @var MockObject & TextInputStylesRenderer */ + private $stylesRendererMock; + /** @var HtmlParser */ private $htmlParser; @@ -37,7 +41,8 @@ class TextareaTest extends \MailPoetUnitTest { public function _before() { parent::_before(); $this->rendererHelperMock = $this->createMock(BlockRendererHelper::class); - $this->textarea = new Textarea($this->rendererHelperMock); + $this->stylesRendererMock = $this->createMock(TextInputStylesRenderer::class); + $this->textarea = new Textarea($this->rendererHelperMock, $this->stylesRendererMock); $this->htmlParser = new HtmlParser(); } @@ -48,6 +53,7 @@ class TextareaTest extends \MailPoetUnitTest { $this->rendererHelperMock->expects($this->once())->method('getInputValidation')->willReturn(' validation="1" '); $this->rendererHelperMock->expects($this->once())->method('getInputModifiers')->willReturn(' modifiers="mod" '); $this->rendererHelperMock->expects($this->once())->method('getFieldValue')->willReturn('val'); + $this->stylesRendererMock->expects($this->once())->method('render')->willReturn('border-radius: 10px;'); $html = $this->textarea->render($this->block, []); $textarea = $this->htmlParser->getElementByXpath($html, '//textarea'); @@ -55,10 +61,12 @@ class TextareaTest extends \MailPoetUnitTest { $validation = $this->htmlParser->getAttribute($textarea, 'validation'); $modifiers = $this->htmlParser->getAttribute($textarea, 'modifiers'); $class = $this->htmlParser->getAttribute($textarea, 'class'); + $style = $this->htmlParser->getAttribute($textarea, 'style'); expect($textarea->textContent)->equals('val'); expect($name->value)->equals('data[Field name]'); expect($validation->value)->equals('1'); expect($class->value)->equals('mailpoet_textarea'); expect($modifiers->value)->equals('mod'); + expect($style->value)->equals('border-radius: 10px;'); } } diff --git a/tests/unit/Form/TextInputStylesRendererTest.php b/tests/unit/Form/TextInputStylesRendererTest.php new file mode 100644 index 0000000000..74e5727971 --- /dev/null +++ b/tests/unit/Form/TextInputStylesRendererTest.php @@ -0,0 +1,43 @@ +renderer = new TextInputStylesRenderer(); + } + + public function testItShouldReturnEmptyStringForNoStylesOrUnsupportedStyles() { + expect($this->renderer->render([]))->equals(''); + expect($this->renderer->render(['nonsense' => '10px']))->equals(''); + } + + public function testItShouldRenderSingleStyles() { + expect($this->renderer->render(['border_radius' => 10]))->equals('border-radius:10px;'); + expect($this->renderer->render(['border_color' => '#fff']))->equals('border-color:#fff;'); + expect($this->renderer->render(['border_size' => 10]))->equals('border-width:10px;'); + expect($this->renderer->render(['background_color' => '#dddddd']))->equals('background-color:#dddddd;'); + } + + public function testItShouldCompleteStyles() { + $styles = [ + 'border_radius' => 10, + 'border_color' => '#fff', + 'border_size' => 10, + 'background_color' => '#dddddd', + ]; + $result = $this->renderer->render($styles); + expect($result)->contains('border-radius:10px;'); + expect($result)->contains('border-color:#fff;'); + expect($result)->contains('border-width:10px;'); + expect($result)->contains('background-color:#dddddd;'); + } +}