Feature/32702

[Januszpl]

Pelago/emogrifier is used for transforming email-inline css into inline css inside email content that later is send to the customer by Magento. It has some limitation related to selector and special character and @charset "UTF-8"; is one of the problem. However not sure if my solution is the best - maybe some "if" to remove it only for flagged files like email* ?

[Igloczek]

I think we should ask for changes in the mentioned M2 dependency, b/c replacing this in this way is not so elegant and didn't fix the issue for everyone.

Related issue: MyIntervals/emogrifier#296

[Igloczek]

Let's limit this just to email-inline file and I'm okay to merge it.

[Stevie-Ray]

As a workaround we created a Composer patch:

patches/composer/github-issue-emogrifier-296.diff

 ### Fixed
+- Allow `@charset` in the CSS without error (note: its value is currently
+  ignored, [#507](https://github.com/MyIntervals/emogrifier/pull/507))
 - Allow attribute selectors in descendants
   ([#506](https://github.com/MyIntervals/emogrifier/pull/506),
   [#381](https://github.com/MyIntervals/emogrifier/issues/381))
diff --git a/Classes/Emogrifier.php b/Classes/Emogrifier.php
index f227ada..538e060 100644
--- a/Classes/Emogrifier.php
+++ b/Classes/Emogrifier.php
@@ -1252,7 +1252,7 @@ function ($matches) use (&$media) {

         // filter the CSS
         $search = [
-            'import directives' => '/^\\s*@import\\s[^;]+;/misU',
+            'import/charset directives' => '/^\\s*@(?:import|charset)\\s[^;]+;/misU',
             'remaining media enclosures' => '/^\\s*@media\\s[^{]+{(.*)}\\s*}\\s/misU',
         ];

composer.json

"extra": {
        "magento-force": "override",
        "composer-exit-on-patch-failure": true,
        "patches": {
            "pelago/emogrifier": {
                "Support @charset in the CSS #296": "patches/composer/github-issue-emogrifier-296.diff"
            }
        }
    }

[Januszpl]

@Igloczek what do you think? I think better to make as you said - just limit this replace to one css file

[Stevie-Ray]

Magento Open Source 2.3.0 Release Notes

Emogrifier dependency has been updated to ^2.0.0. Fix submitted by Oliver Klee in pull request 13351.

[Januszpl]

@Stevie-Ray great. However I will still add extra task next week for email-inline.css only so if someone would need it (like previous M2 versions etc) he can use it.

[Januszpl]

@Igloczek tested
gulp styles and email inbox before and after running gulp email-fix
https://i.gyazo.com/8bc1ca044d935aaa458612627b9981d4.png