Strict CSP issue with onclick

[ganeddact]

Preconditions

Apply a strict CSP, not allowing inline event handlers

Magento Version : 2.4.6-p8

ElasticSuite Version : 2.11.9.2

Environment : developer

Third party modules :

Steps to reproduce

1. Have a multiselect filter attribute in a category page
2. Select one checkbox
3. Check the console

Expected result

1. Filter should apply

Actual result

1. No filtering applies
2. Console log reports "Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src .."

Looks like in vendor/smile/elasticsuite/src/module-elasticsuite-catalog/view/frontend/web/template/attribute-filter.html on line 15 there is an onclick event that does not sit well with this strict CSP. Unrelated to the above, there is another one in line 28 in vendor/smile/elasticsuite/src/module-elasticsuite-catalog/view/frontend/templates/layer/filter/default.phtml

Inline onclicks are generally considered bad practice, and should be replaced by event handlers.

[vahonc]

Hello @ganeddact,

I agree that Inline 'onclicks' are generally bad practices and should be replaced by event handlers. I will try to add some fixes for these.

But what is really strange for me is that you pointed out that after clicking on one checkbox of the multi-select filter attribute in a category page, no filtering applies, and you see the Console log report "Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src." I could not reproduce this on my test environment with fresh Magento 2.4.6-p8 EE and ES 2.11.9.2. I don't see errors in the Console log report, and the filters that I select are applied.

Therefore, I'm not sure that the not applying filters issue is linked to using inline 'onclicks', especially when it targets smth with directive: "script-src.", of course I could be wrong. And I just want to know if there are no other things that could effect on this. Maybe you could add more details about your environment and your issue (attributes configuration, etc.), screenshots are welcome, which help to understand where exactly the problem is described by your issue.

BR, Vadym

[ganeddact]

Hi @vahonc , thanks for your reply. As I stated in my precondition, the problem arise when applying a strict CSP, not allowing inline event handlers by adding specific policies in a config.xml file of a module, like:

<policies>
    <storefront>
        <scripts>
            <policy_id>script-src</policy_id>
            <self>1</self>
            <inline>0</inline>
            <eval>1</eval>
            <dynamic>0</dynamic>
        </scripts>
    </storefront>
</policies>

With default CSP rules that ship with Magento, it would not show up and in fact in your test did not emerge. But if a store is set up for stricter content security policies, this may happen.

[vahonc]

@ganeddact, thanks for this clarification.

Could you test my fix on your environment? I will test it with your additional info on my side also.

BR, Vadym

[ganeddact]

I've applied your change and it works like a charm