Skip to content

Commit

Permalink
fix: lists and list item blocks in WP 6.1 (#1000)
Browse files Browse the repository at this point in the history
  • Loading branch information
@dkoo
dkoo authored Nov 3, 2022
1 parent e86f379 commit ec7ef86
Show file tree
Hide file tree
Showing 4 changed files with 62 additions and 31 deletions.
1 change: 1 addition & 0 deletions includes/class-newspack-newsletters-editor.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -244,6 +244,7 @@ public static function newsletters_allowed_block_types( $allowed_block_types, $p
'core/image',
'core/separator',
'core/list',
'core/list-item',
'core/quote',
'core/site-logo',
'core/site-tagline',
Expand Down
34 changes: 29 additions & 5 deletions includes/class-newspack-newsletters-renderer.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -332,10 +332,11 @@ public static function is_empty_block( $block ) {
* @return string MJML component.
*/
public static function render_mjml_component( $block, $is_in_column = false, $is_in_group = false, $default_attrs = [] ) {
$block_name = $block['blockName'];
$attrs = $block['attrs'];
$inner_blocks = $block['innerBlocks'];
$inner_html = $block['innerHTML'];
$block_name = $block['blockName'];
$attrs = $block['attrs'];
$inner_blocks = $block['innerBlocks'];
$inner_content = $block['innerContent'];
$inner_html = $block['innerHTML'];

if ( ! isset( $attrs['innerBlocksToInsert'] ) && self::is_empty_block( $block ) ) {
return '';
Expand Down Expand Up @@ -376,7 +377,6 @@ public static function render_mjml_component( $block, $is_in_column = false, $is
* Text-based blocks.
*/
case 'core/paragraph':
case 'core/list':
case 'core/heading':
case 'core/quote':
case 'core/site-title':
Expand Down Expand Up @@ -714,6 +714,30 @@ public static function render_mjml_component( $block, $is_in_column = false, $is
$block_mjml_markup = $markup;
break;

/**
* List block.
*/
case 'core/list':
$text_attrs = array_merge(
array(
'padding' => '0',
'line-height' => '1.5',
'font-size' => '16px',
'font-family' => $font_family,
),
$attrs
);

$block_mjml_markup = '<mj-text ' . self::array_to_attributes( $text_attrs ) . '>' . $inner_content[0];
if ( ! empty( $inner_blocks ) && 1 < count( $inner_content ) ) {
foreach ( $inner_blocks as $block ) {
$block_mjml_markup .= $block['innerHTML'];
}
$block_mjml_markup .= $inner_content[ count( $inner_content ) - 1 ];
}
$block_mjml_markup .= '</mj-text>';
break;

/**
* Group block.
*/
Expand Down
4 changes: 2 additions & 2 deletions tests/test-controlled-statuses.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ public function set_up() {
*/
public function test_publish_private_newsletter() {
// Create draft.
$post_id = $this->factory->post->create(
$post_id = self::factory()->post->create(
[
'post_type' => \Newspack_Newsletters::NEWSPACK_NEWSLETTERS_CPT,
'post_status' => 'draft',
Expand All @@ -47,7 +47,7 @@ public function test_publish_private_newsletter() {
*/
public function test_publish_public_newsletter() {
// Create draft.
$post_id = $this->factory->post->create(
$post_id = self::factory()->post->create(
[
'post_type' => \Newspack_Newsletters::NEWSPACK_NEWSLETTERS_CPT,
'post_status' => 'draft',
Expand Down
54 changes: 30 additions & 24 deletions tests/test-renderer.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,11 @@ public function test_render_mjml_component() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/paragraph',
'attrs' => [],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'blockName' => 'core/paragraph',
'attrs' => [],
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
'<mj-section padding="0"><mj-column padding="12px" width="100%"><mj-text padding="0" line-height="1.5" font-size="16px" >' . $inner_html . '</mj-text></mj-column></mj-section>',
Expand All @@ -35,8 +36,8 @@ public function test_render_mjml_component() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/paragraph',
'attrs' => [
'blockName' => 'core/paragraph',
'attrs' => [
'textColor' => 'vivid-purple',
'fontSize' => 'normal',
'style' => [
Expand All @@ -45,8 +46,9 @@ public function test_render_mjml_component() {
],
],
],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
'<mj-section textColor="vivid-purple" color="#db18e6 !important" background-color="#4aadd7 !important" font-size="16px" padding="0"><mj-column padding="12px" width="100%"><mj-text padding="0" line-height="1.5" font-size="16px" textColor="vivid-purple" color="#db18e6 !important" container-background-color="#4aadd7 !important">' . $inner_html . '</mj-text></mj-column></mj-section>',
Expand All @@ -63,12 +65,13 @@ public function test_render_embed_blocks() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/embed',
'attrs' => [
'blockName' => 'core/embed',
'attrs' => [
'url' => 'https://www.youtube.com/watch?v=aIRgcb3cQ1Q',
],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
'<mj-section url="https://www.youtube.com/watch?v=aIRgcb3cQ1Q" padding="0"><mj-column padding="12px" width="100%"><mj-image padding="0" src="https://i.ytimg.com/vi/aIRgcb3cQ1Q/hqdefault.jpg" width="480px" height="360px" href="https://www.youtube.com/watch?v=aIRgcb3cQ1Q" /><mj-text align="center" color="#555d66" line-height="1.56" font-size="13px" >How to use the Newspack Newsletter plugin - YouTube</mj-text></mj-column></mj-section>',
Expand All @@ -80,12 +83,13 @@ public function test_render_embed_blocks() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/embed',
'attrs' => [
'blockName' => 'core/embed',
'attrs' => [
'url' => 'https://flickr.com/photos/thomashawk/9274246246',
],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
'<mj-section url="https://flickr.com/photos/thomashawk/9274246246" padding="0"><mj-column padding="12px" width="100%"><mj-image src="https://live.staticflickr.com/7357/9274246246_201d71cf9a.jpg" alt="Automattic" width="500" height="333" href="https://flickr.com/photos/thomashawk/9274246246" /><mj-text align="center" color="#555d66" line-height="1.56" font-size="13px" >Automattic - Flickr</mj-text></mj-column></mj-section>',
Expand All @@ -97,12 +101,13 @@ public function test_render_embed_blocks() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/embed',
'attrs' => [
'blockName' => 'core/embed',
'attrs' => [
'url' => 'https://twitter.com/automattic/status/1395447061336711181',
],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
"<mj-section url=\"https://twitter.com/automattic/status/1395447061336711181\" padding=\"0\"><mj-column padding=\"12px\" width=\"100%\"><mj-text padding=\"0\" line-height=\"1.5\" font-size=\"16px\" ><blockquote>We&#039;re Hiring! We are continuing to grow and have some exciting open positions available, including in Engineering, Product, Marketing, Business Development, HR, Customer Support, and more. Work with us, from anywhere. <a href=\"https://t.co/EZST4WBsy2\">https://t.co/EZST4WBsy2</a> <a href=\"https://t.co/z8bKfCgn14\">pic.twitter.com/z8bKfCgn14</a>&mdash; Automattic (@automattic) <a href=\"https://twitter.com/automattic/status/1395447061336711181?ref_src=twsrc%5Etfw\">May 20, 2021</a></blockquote>\n\n</mj-text></mj-column></mj-section>",
Expand All @@ -114,12 +119,13 @@ public function test_render_embed_blocks() {
$this->assertEquals(
Newspack_Newsletters_Renderer::render_mjml_component(
[
'blockName' => 'core/embed',
'attrs' => [
'blockName' => 'core/embed',
'attrs' => [
'url' => 'https://www.amazon.com/Learning-PHP-MySQL-JavaScript-Javascript/dp/1491978910',
],
'innerBlocks' => [],
'innerHTML' => $inner_html,
'innerBlocks' => [],
'innerContent' => [],
'innerHTML' => $inner_html,
]
),
'<mj-section url="https://www.amazon.com/Learning-PHP-MySQL-JavaScript-Javascript/dp/1491978910" padding="0"><mj-column padding="12px" width="100%"><mj-text padding="0" line-height="1.5" font-size="16px" ><a href="https://www.amazon.com/Learning-PHP-MySQL-JavaScript-Javascript/dp/1491978910">Learning PHP, MySQL &amp; JavaScript: With jQuery, CSS &amp; HTML5 (Learning PHP, MYSQL, Javascript, CSS &amp; HTML5)</a></mj-text></mj-column></mj-section>',
Expand Down

0 comments on commit ec7ef86

Please sign in to comment.