Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Add Button renderer test

Browse Source 
This commit adds a button renderer test and fixes a couple of issues
found when working on the test
[MAILPOET-5644]
This commit is contained in:
Rostislav Wolny
2023-12-22 13:27:42 +01:00
committed by Jan Lysý
parent 8054088852
commit 70273c626d
2 changed files with 173 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
mailpoet/lib/EmailEditor/Integrations/Core/Renderer/Blocks/Button.php
View File

@@ -60,11 +60,14 @@ class Button implements BlockRenderer {
// Border
if ($parsedBlock['attrs']['style']['border'] ?? '') {
// Use text color if border color is not set
if (!($parsedBlock['attrs']['style']['border']['color'] ?? '')) {
$parsedBlock['attrs']['style']['border']['color'] = $parsedBlock['attrs']['style']['color']['text'] ?? null;
}
$wrapperStyles = array_merge($wrapperStyles, wp_style_engine_get_styles(['border' => $parsedBlock['attrs']['style']['border']])['declarations']);
}
if ($parsedBlock['attrs']['style']['border']['width'] ?? '') {
$wrapperStyles['border-style'] = 'solid';
} else {
// Some clients render 1px border when not set as none
$wrapperStyles['border'] = 'none';
}
@@ -72,7 +75,10 @@ class Button implements BlockRenderer {
if ($parsedBlock['attrs']['style']['spacing']['padding'] ?? '') {
$padding = $parsedBlock['attrs']['style']['spacing']['padding'];
$wrapperStyles['mso-padding-alt'] = "{$padding['top']} {$padding['right']} {$padding['bottom']} {$padding['left']}";
$linkStyles['padding'] = "{$padding['top']} {$padding['right']} {$padding['bottom']} {$padding['left']}";
$linkStyles['padding-top'] = $padding['top'];
$linkStyles['padding-right'] = $padding['right'];
$linkStyles['padding-bottom'] = $padding['bottom'];
$linkStyles['padding-left'] = $padding['left'];
}
// Typography

164
mailpoet/tests/integration/EmailEditor/Integration/Core/Renderer/Blocks/ButtonTest.php Normal file
View File

@@ -0,0 +1,164 @@
<?php declare(strict_types = 1);
namespace MailPoet\EmailEditor\Integrations\Core\Renderer\Blocks;
use MailPoet\EmailEditor\Engine\EmailEditor;
use MailPoet\EmailEditor\Engine\SettingsController;
class ButtonTest extends \MailPoetTest {
/** @var Button */
private $buttonRenderer;
/** @var array */
private $parsedButton = [
'blockName' => 'core/button',
'attrs' => [
'width' => 50,
'style' => [
'spacing' => [
'padding' => [
'left' => '10px',
'right' => '10px',
'top' => '10px',
'bottom' => '10px',
],
],
'color' => [
'background' => '#dddddd',
'text' => '#111111',
],
],
],
'innerBlocks' => [],
'innerHTML' => '<div class="wp-block-button has-custom-width wp-block-button__width-50"><a href="http://example.com" class="wp-block-button__link has-text-color has-background has-link-color wp-element-button" style="color:#111111;background-color:#dddddd;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px">Button Text</a></div>',
'innerContent' => ['<div class="wp-block-button has-custom-width wp-block-button__width-50"><a href="http://example.com" class="wp-block-button__link has-text-color has-background has-link-color wp-element-button" style="color:#111111;background-color:#dddddd;padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px">Button Text</a></div>'],
'email_attrs' => [
'color' => '#111111',
'width' => '320px',
],
];
/** @var SettingsController */
private $settingsController;
public function _before() {
$this->diContainer->get(EmailEditor::class)->initialize();
$this->buttonRenderer = new Button();
$this->settingsController = $this->diContainer->get(SettingsController::class);
}
public function testItRendersLink() {
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('href="http://example.com"');
verify($output)->stringContainsString('Button Text');
}
public function testItRendersPaddingBasedOnAttributesValue() {
$this->parsedButton['attrs']['style']['spacing']['padding'] = [
'left' => '10px',
'right' => '20px',
'top' => '30px',
'bottom' => '40px',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('padding-left:10px;');
verify($output)->stringContainsString('padding-right:20px;');
verify($output)->stringContainsString('padding-top:30px;');
verify($output)->stringContainsString('padding-bottom:40px;');
}
public function testItRendersColors() {
$this->parsedButton['attrs']['style']['color'] = [
'background' => '#000000',
'text' => '#111111',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('bgcolor="#000000"');
verify($output)->stringContainsString('background:#000000;');
verify($output)->stringContainsString('color:#111111;');
}
public function testItRendersBorder() {
$this->parsedButton['attrs']['style']['border'] = [
'width' => '10px',
'color' => '#111111',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border-color:#111111;');
verify($output)->stringContainsString('border-width:10px;');
verify($output)->stringContainsString('border-style:solid;');
}
public function testItRendersBorderNone() {
$this->parsedButton['attrs']['style']['border'] = [];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border:none;');
}
public function testItRendersBorderWithTextColorFallback() {
$this->parsedButton['attrs']['style']['border'] = [
'width' => '10px',
];
$this->parsedButton['attrs']['style']['color'] = [
'text' => '#111111',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border-color:#111111;');
}
public function testItRendersEachSideSpecificBorder() {
$this->parsedButton['attrs']['style']['border'] = [
'top' => ['width' => '1px', 'color' => '#111111'],
'right' => ['width' => '2px', 'color' => '#222222'],
'bottom' => ['width' => '3px', 'color' => '#333333'],
'left' => ['width' => '4px', 'color' => '#444444'],
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border-top-width:1px;');
verify($output)->stringContainsString('border-top-color:#111111;');
verify($output)->stringContainsString('border-right-width:2px;');
verify($output)->stringContainsString('border-right-color:#222222;');
verify($output)->stringContainsString('border-bottom-width:3px;');
verify($output)->stringContainsString('border-bottom-color:#333333;');
verify($output)->stringContainsString('border-left-width:4px;');
verify($output)->stringContainsString('border-left-color:#444444;');
verify($output)->stringContainsString('border-style:solid;');
}
public function testItRendersBorderRadius() {
$this->parsedButton['attrs']['style']['border'] = [
'radius' => '10px',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border-radius:10px;');
}
public function testItRendersCornerSpecificBorderRadius() {
$this->parsedButton['attrs']['style']['border']['radius'] = [
'topLeft' => '1px',
'topRight' => '2px',
'bottomLeft' => '3px',
'bottomRight' => '4px',
];
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $this->settingsController);
verify($output)->stringContainsString('border-top-left-radius:1px;');
verify($output)->stringContainsString('border-top-right-radius:2px;');
verify($output)->stringContainsString('border-bottom-left-radius:3px;');
verify($output)->stringContainsString('border-bottom-right-radius:4px;');
}
public function testItAllowsSingleQuotesInFontFamilyDefinition() {
$settingsControllerMock = $this->createPartialMock(SettingsController::class, ['getEmailContentStyles']);
$settingsControllerMock->method('getEmailContentStyles')->willReturn([
'typography' => [
'fontFamily' => '"Font\'", serif',
],
]);
$output = $this->buttonRenderer->render($this->parsedButton['innerHTML'], $this->parsedButton, $settingsControllerMock);
verify($output)->stringContainsString('&quot;Font\'&quot;, serif');
}
}