magento / magento2

Prior to making any Submission(s), you must sign an Adobe Contributor License Agreement, available here at: https://opensource.adobe.com/cla.html. All Submissions you make to Adobe Inc. and its affiliates, assigns and subsidiaries (collectively “Adobe”) are subject to the terms of the Adobe Contributor License Agreement.
http://www.magento.com
Open Software License 3.0
11.38k stars 9.29k forks source link

Payment Failed Emails cannot be styled with css by including the default email header #38847

Open gwharton opened 3 weeks ago

gwharton commented 3 weeks ago

Preconditions and environment

2.4.7-p1

Steps to reproduce

Deploy vanilla 2.4.7-p1 Configure payment provider in test mode, such that payment failed emails can be triggered Configure the payment failed emails to generate and specify a recipient email address Modify the standard payment failed email template to include the standard header and footer includes. Trigger a failed payment

Expected result

The email received has the standard email headers and footers and is styled via css.

Actual result

The email contains the following error.

CSS inlining error: Compilation from source: LESS file is empty: adminhtml////css/email-inline.less

This is correct, email style sheets are not generated for the admin theme.

Either the emails should be sent under the scope of the store that generated the failed payment, or email styles should be included in the admin theme?

Additional information

No response

Release note

No response

Triage and priority

m2-assistant[bot] commented 3 weeks ago

Hi @gwharton. Thank you for your report. To speed up processing of this issue, make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, Add a comment to the issue:

m2-assistant[bot] commented 3 weeks ago

Hi @engcom-Delta. Thank you for working on this issue. In order to make sure that issue has enough information and ready for development, please read and check the following instruction: :point_down:

mrtuvn commented 3 weeks ago

you should add styles via less file ? Add via email header can missed in some case depends on devices/app i will suggest you add styles via less and magento will auto inject inline to email https://github.com/magento/magento2/blob/2.4-develop/app/design/frontend/Magento/blank/web/css/source/_email-extend.less

gwharton commented 3 weeks ago

Email styles are completely missing from the admin theme, so it's not just a case of adding a style to admin themes email less files. You would need to copy over the email.less files from your frontend theme Into admin theme and maintain them both for style consistency. This I suspect wouldn't be a straight forward process due to the differences between the admin and frontend theme dependencies.

engcom-Delta commented 3 weeks ago

Hi @gwharton ,

Thank you for your reporting and collaboration.

We are still working on this issue and will update you soon.

Thanks,

mrtuvn commented 2 weeks ago

so you want styles preview in admin email same as output in frontend ?@gwharton

mrtuvn commented 2 weeks ago

It's limitation of core base. I think it's need some extra customise when it's difference store/area code admin -> always store 0 and area code -> adminhtml So you need re-set store follow email store view and set area code frontend to archieve your demand

m2-assistant[bot] commented 2 weeks ago

Hi @engcom-November. Thank you for working on this issue. In order to make sure that issue has enough information and ready for development, please read and check the following instruction: :point_down:

engcom-November commented 2 weeks ago

Hello @gwharton, Thank you for the report and collaboration! Thank you @mrtuvn for the input!

We are able to reproduce this on 2.4.7-p1 instance. The payment failed email with default luma header and footer is not being generated in the mail. we are seeing an exception as below:

UnexpectedValueException: Template file 'header.html' is not found. in /opt/homebrew/var/www/magento247p1/vendor/magento/module-email/Model/Template/Config.php:253

@gwharton can you try with the workaround mentioned here, and let us know if this fixes your issue.

Thank you.

engcom-November commented 3 days ago

Hello @gwharton,

As there is no activity on this issue for a long time, we believe the issue has been resolved, hence closing this issue. Feel free to raise a new issue or reopen this if you need more assistance.

Thank you.

hostep commented 3 days ago

@engcom-November: you reproduced the bug but closed it anyways? That's not a good way of doing things. Can you re-open? It sounds like a core bug to me (unless somebody can tell me otherwise?)

gwharton commented 2 days ago

I guess not so much a bug, but design feature. email styles are just not present in the admin theme, so any attempt to add any sort of styling to any emails sent out under the ADMIN scope are doomed to be dull.

I tried adding the email styles less files to my admin theme, but soon lost the will to live due to the different dependency and inheritance oddities between the frontend and backend themes.

engcom-November commented 2 days ago

Hello @gwharton,

The result we got is different from what is mentioned in the actual result, instead of the styles being empty we are getting the header template is missing.

This is the template used:

{{template config_path="design/email/header_template"}}

<h1>{{trans "Payment Transaction Failed"}}</h1>

<ul>
    <li>
        <strong>{{trans "Reason"}}</strong><br />
        {{var reason}}
    </li>
    <li>
        <strong>{{trans "Checkout Type"}}</strong><br />
        {{var checkoutType}}
    </li>
    <li>
        <strong>{{trans "Customer:"}}</strong><br />
        <a href="mailto:{{var customerEmail}}">{{var customer}}</a> <{{var customerEmail}}>
    </li>
    <li>
        <strong>{{trans "Items"}}</strong><br />
        {{var items|raw}}
    </li>
    <li>
        <strong>{{trans "Total:"}}</strong><br />
        {{var total}}
    </li>
    <li>
        <strong>{{trans "Billing Address:"}}</strong><br />
        {{var billingAddressHtml|raw}}
    </li>
    <li>
        <strong>{{trans "Shipping Address:"}}</strong><br />
        {{var shippingAddressHtml|raw}}
    </li>
    <li>
        <strong>{{trans "Shipping Method:"}}</strong><br />
        {{var shippingMethod}}
    </li>
    <li>
        <strong>{{trans "Payment Method:"}}</strong><br />
        {{var paymentMethod}}
    </li>
    <li>
        <strong>{{trans "Date & Time:"}}</strong><br />
        {{var dateAndTime}}
    </li>
</ul>

{{template config_path="design/email/footer_template"}}

Can you let us know if we are missing something here.