Replace font size slugs with values in typography preprocessor

[MAILPOET-5740]

mailpoet/lib/EmailEditor/Engine/Renderer/Preprocessors/TypographyPreprocessor.php

@@ -53,6 +53,12 @@ class TypographyPreprocessor implements Preprocessor {
     if (isset($block['attrs']['style']['color']['text'])) {
       $emailAttrs['color'] = $block['attrs']['style']['color']['text'];
     }
+    // In case the fontSize is set via a slug (small, medium, large, etc.) we translate it to a number
+    // The font size slug is set in $block['attrs']['fontSize'] and value in $block['attrs']['style']['typography']['fontSize']
+    if (isset($block['attrs']['fontSize'])) {
+      $block['attrs']['style']['typography']['fontSize'] = $this->settingsController->translateSlugToFontSize($block['attrs']['fontSize']);
+    }
+    // Pass font size to email_attrs
     if (isset($block['attrs']['style']['typography']['fontSize'])) {
       $emailAttrs['font-size'] = $block['attrs']['style']['typography']['fontSize'];
     }

mailpoet/lib/EmailEditor/Engine/SettingsController.php

@@ -199,4 +199,15 @@ class SettingsController {
     }
     return $css;
   }
+
+  public function translateSlugToFontSize(string $fontSize): string {
+    $coreTheme = \WP_Theme_JSON_Resolver::get_core_data();
+    $coreSettings = $coreTheme->get_settings();
+    foreach ($coreSettings['typography']['fontSizes']['default'] as $fontSizeDefinition) {
+      if ($fontSizeDefinition['slug'] === $fontSize) {
+        return $fontSizeDefinition['size'];
+      }
+    }
+    return $fontSize;
+  }
 }

mailpoet/tests/integration/EmailEditor/Engine/SettingsControllerTest.php

@@ -36,4 +36,12 @@ class SettingsControllerTest extends \MailPoetTest {
     verify($css)->stringContainsString('.has-permanent-marker-font-family');
     verify($css)->stringContainsString('.has-pacifico-font-family');
   }
+
+  public function testItCanTranslateFontSizeSlug() {
+    verify($this->settingsController->translateSlugToFontSize('small'))->equals('13px');
+    verify($this->settingsController->translateSlugToFontSize('medium'))->equals('20px');
+    verify($this->settingsController->translateSlugToFontSize('large'))->equals('36px');
+    verify($this->settingsController->translateSlugToFontSize('x-large'))->equals('42px');
+    verify($this->settingsController->translateSlugToFontSize('unknown'))->equals('unknown');
+  }
 }

mailpoet/tests/unit/EmailEditor/Engine/Renderer/Preprocessors/TypographyPreprocessorTest.php

@@ -42,6 +42,10 @@ class TypographyPreprocessorTest extends \MailPoetUnitTest {
       ],
     ]);
     $settingsMock->method('getTheme')->willReturn($themeMock);
+    // This slug translate mock expect slugs in format slug-10px and will return 10px
+    $settingsMock->method('translateSlugToFontSize')->willReturnCallback(function($slug) {
+      return str_replace('slug-', '', $slug);
+    });
     $this->preprocessor = new TypographyPreprocessor($settingsMock);
   }
 
@@ -91,6 +95,43 @@ class TypographyPreprocessorTest extends \MailPoetUnitTest {
     verify($result['innerBlocks'][1]['innerBlocks'][0]['email_attrs'])->equals($expectedEmailAttrs);
   }
 
+  public function testItReplacesFontSizeSlugsWithValues(): void {
+    $blocks = [[
+      'blockName' => 'core/columns',
+      'attrs' => [
+        'fontSize' => 'slug-20px',
+        'style' => [],
+      ],
+      'innerBlocks' => [
+        [
+          'blockName' => 'core/column',
+          'innerBlocks' => [],
+        ],
+        [
+          'blockName' => 'core/column',
+          'innerBlocks' => [
+            [
+              'blockName' => 'core/paragraph',
+              'attrs' => [],
+              'innerBlocks' => [],
+            ],
+          ],
+        ],
+      ],
+    ]];
+    $expectedEmailAttrs = [
+      'color' => '#000000',
+      'font-size' => '20px',
+    ];
+    $result = $this->preprocessor->preprocess($blocks, []);
+    $result = $result[0];
+    verify($result['innerBlocks'])->arrayCount(2);
+    verify($result['email_attrs'])->equals($expectedEmailAttrs);
+    verify($result['innerBlocks'][0]['email_attrs'])->equals($expectedEmailAttrs);
+    verify($result['innerBlocks'][1]['email_attrs'])->equals($expectedEmailAttrs);
+    verify($result['innerBlocks'][1]['innerBlocks'][0]['email_attrs'])->equals($expectedEmailAttrs);
+  }
+
   public function testItDoesNotCopyColumnsWidth(): void {
     $blocks = [[
       'blockName' => 'core/columns',