Depending from multiselect in backend is broken

[bjornsnoen]

Preconditions (*)

1. Magento ^2.2 (and probably earlier)

Steps to reproduce (*)

1. Create a module with an etc/adminhtml/system.xml file

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
    <system>
        <section id="general">
            <group id="test" showInStore="1" showInWebsite="1" showInDefault="1" type="text" sortOrder="999">
                <label>Proof of concept</label>
                <field id="multiselect_id" translate="label" type="multiselect" sortOrder="2" showInDefault="1" showInWebsite="1" showInStore="0" canRestore="1">
                    <label>multiselect_id</label>
                    <source_model>Magento\Sales\Model\Config\Source\Order\Status</source_model>
                </field>
                <field id="brand_attribute" type="text" sortOrder="3" showInStore="1" showInWebsite="1" showInDefault="1" translate="label,comment">
                    <label>Brand attribute</label>
                    <depends>
                        <field id="multiselect_id" separator=",">processing</field>
                    </depends>
                </field>
            </group>
        </section>
    </system>
</config>

2. Select all the options

Expected result (*)

1. The depending field should appear and become editable

Actual result (*)

1. The field remains hidden until one unselects all options preceding the one one depends from
   

---

Please provide Severity assessment for the Issue as Reporter. This information will help during Confirmation and Issue triage processes.

• Severity: S0 - Affects critical data or functionality and leaves users without workaround.
• Severity: S1 - Affects critical data or functionality and forces users to employ a workaround.
• Severity: S2 - Affects non-critical data or functionality and forces users to employ a workaround.
• Severity: S3 - Affects non-critical data or functionality and does not force users to employ a workaround.
• Severity: S4 - Affects aesthetics, professional look and feel, “quality” or “usability”.

[m2-assistant]

Hi @bjornsnoen. Thank you for your report.
To help us process this issue please make sure that you provided the following information:

• Summary of the issue
• Information on your environment
• Steps to reproduce
• Expected and actual results

Please make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, please, add a comment to the issue:

@magento give me 2.4-develop instance - upcoming 2.4.x release

For more details, please, review the Magento Contributor Assistant documentation.

Please, add a comment to assign the issue: @magento I am working on this

---

• Join Magento Community Engineering Slack and ask your questions in #github channel.

⚠️ According to the Magento Contribution requirements, all issues must go through the Community Contributions Triage process. Community Contributions Triage is a public meeting.

🕙 You can find the schedule on the Magento Community Calendar page.

📞 The triage of issues happens in the queue order. If you want to speed up the delivery of your contribution, please join the Community Contributions Triage session to discuss the appropriate ticket.

🎥 You can find the recording of the previous Community Contributions Triage on the Magento Youtube Channel

✏️ Feel free to post questions/proposals/feedback related to the Community Contributions Triage process to the corresponding Slack Channel

[ihorvansach]

@bjornsnoen, thank you for your report.

I've made tests on latest Magento2.3.5p2 and 2.4.0 and was not able to reproduce the issue.

I used this code for testing

<field id="multiselect_id" translate="label" type="multiselect" sortOrder="2" showInDefault="1" showInWebsite="1" showInStore="0" canRestore="1">
    <label>multiselect_id</label>
    <source_model>Magento\Sales\Model\Config\Source\Order\Status</source_model>
</field>

<field id="brand_attribute" type="text" sortOrder="3" showInStore="1" showInWebsite="1" showInDefault="1" translate="label,comment">
    <label>Brand attribute</label>
    <depends>
        <field id="multiselect_id" separator=",">processing</field>
     </depends>
</field>

@bjornsnoen, please make sure that you can reproduce this issue on the latest Magento version. Let me know if I missed something.

[bjornsnoen]

Hm, I was reproducing it on 2.3.4-p2, and since the broken js is still there in 2.4 I was sure it would still be broken. I guess the functionality may have been amended elsewhere. I'll see if my module will reproduce it on 2.3.5-p2, if it doesn't I'll happily close :)

[koushikch7]

@magento give me 2.3-develop instance

[magento-deployment-service]

Hi @koushikch7. Thank you for your request. I'm working on Magento instance for you.

[magento-deployment-service]

Hi @koushikch7, unfortunately there is no ability to deploy Magento instance at the moment. Please try again later.

[bjornsnoen]

@ihorvansach

I can reproduce it in 2.4. You have to save the selection first, with a value that is not the preferred value. So in your example you've declared that you depend on the value processing being selected in multiselect_id. If you first select Pending and save, then ctrl-click Processing in the multiselect, voila, the depending field does not show up.

As soon as you apply my proposed patch, it starts working as expected.

I made an empty module in app/code on a clean 2.4 install, and added this system.xml:

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
    <system>
        <section id="general">
            <group id="test" showInStore="1" showInWebsite="1" showInDefault="1" type="text" sortOrder="999">
                <label>Proof of concept</label>
                <field id="multiselect_id" translate="label" type="multiselect" sortOrder="2" showInDefault="1" showInWebsite="1" showInStore="0" canRestore="1">
                    <label>multiselect_id</label>
                    <source_model>Magento\Sales\Model\Config\Source\Order\Status</source_model>
                </field>
                <field id="brand_attribute" type="text" sortOrder="3" showInStore="1" showInWebsite="1" showInDefault="1" translate="label,comment">
                    <label>Brand attribute</label>
                    <depends>
                        <field id="multiselect_id" separator=",">processing</field>
                    </depends>
                </field>
            </group>
        </section>
    </system>
</config>

I've updated steps to reproduce to reflect this.

[ihorvansach]

@bjornsnoen , I've made re-test and get the same result. It works for me.
I used this simple extension to test
Archive: https://drive.google.com/uc?id=1WVk0uULPBmdJs_NShY6X0mE1tSxq2thg&export=download

Maybe the issue related to the specific browser or admin panel locale.
Can you please specify what browser, OS, and admin panel locale you use?

[bjornsnoen]

@ihorvansach in your recording you do not follow the steps to reproduce. After you saved you selected only processing, which indeed works. After saving you have to ctrl-click processing so it is added to your selection instead of replacing the selection.
I'll see about getting some kind of screen recording to demonstrate.

I am using the Brave browser on linux in default us english locale.

[bjornsnoen]

While recording I found the correct way to trigger this. Saving doesn't seem to affect it. What matters is the order of items selected in the multiselect. If the item you depend on being selected is after another selected item in the list, the depend will not trigger.

Once more I've edited the steps to reproduce, there are now only two.

[gwharton]

I wonder if this is related to a problem I solved recently on the Tax Rules page.

There was an issue with the jquery.multiselect.js module that is used in Admin, where it internally uses !!.attr('checked') to see which items are selected and which aren't. Seems that under certain circumstances attr works correctly, and under others it doesn't, so when you select an item, the multiselect does not reflect that it is selected, even though it looks it on screen. If you delve into the html, you will see the html list for the onscreen part with css set to selected when you select an item, but there is also a hidden set of <select>/<options> which are the actual data items that should be kept in sync with the on screen selection by js. It is the <options> that is used when the form is queried and saved. It is the sync of this part that isnt working due to the attr problem.

I see under certain docs, .attr is deprecated. And I also see the jquery.multiselect module hasn't been updated in 8 years. I changed the code to use checkbox.is(':checked') instead of attr and havent had problems since. I could never reproduce it with vanilla magento for some reason, but would fail 100% of the time on my dev node.

My fix is here

--- lib/web/jquery/editableMultiselect/js/jquery.multiselect.orig.js	2020-09-22 20:10:21.190000000 +0100
+++ lib/web/jquery/editableMultiselect/js/jquery.multiselect.js	2020-09-22 20:09:29.270000000 +0100
@@ -108,7 +108,7 @@
                         var checkbox = $(this),
                             index = checkbox.closest('.' + o.mselectListItemClass + '').index();
 
-                        select.find('option').eq(index).attr('selected', !!checkbox.attr('checked'));
+                        select.find('option').eq(index).attr('selected', checkbox.is(':checked'));
                     }),
                 list = widget.find('.' + o.mselectItemsWrapperClass + ''),
                 buttonAdd = widget.find('.' + o.mselectButtonAddClass + '')

Let me know if you think it may be this? It sounds familiar, and being JS, is browser specific, which may explain why you cannot reproduce reliably.

I posted about it on slack. https://magentocommeng.slack.com/archives/CJCB7G0KZ/p1600801179000800

Edit: I've re-read the previous posts and this doen't look like what is going on, but I'll leave it here for reference just in case.

[bjornsnoen]

@magento give me 2.4-develop instance

[magento-deployment-service]

Hi @bjornsnoen. Thank you for your request. I'm working on Magento instance for you.

[magento-deployment-service]

Hi @bjornsnoen, unfortunately there is no ability to deploy Magento instance at the moment. Please try again later.

[m2-assistant]

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: 👇

• 1. Verify that issue has all the required information. (Preconditions, Steps to reproduce, Expected result, Actual result).
• 2. Verify that issue has a meaningful description and provides enough information to reproduce the issue.
• 3. Add Area: XXXXX label to the ticket, indicating the functional areas it may be related to.
• 4. Verify that the issue is reproducible on 2.4-develop branch
  Details

  - Add the comment @magento give me 2.4-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.4-develop branch, please, add the label Reproduced on 2.4.x.
  - If the issue is not reproducible, add your comment that issue is not reproducible and close the issue and stop verification process here!
• 5. Add label Issue: Confirmed once verification is complete.
• 6. Make sure that automatic system confirms that report has been added to the backlog.

[engcom-November]

Hello @bjornsnoen,

Thank you for the report and collaboration1

Verified this issue on 2.4-develop.
When custom fields are added which is dependent on a specific value in multiselect, selecting all the options should make the field visible.

Please take a look at the screencast below:

Screen.Recording.2024-03-08.at.2.18.01.PM.mov

Here we can see selecting all the options should have revealed the field.
Hence confirming the issue.

Please find the attached module used to reproduce this issue.
FieldVendor.zip

Thank you.

[github-jira-sync-bot]

✅ Jira issue https://jira.corp.adobe.com/browse/AC-11547 is successfully created for this GitHub issue.

[m2-assistant]

✅ Confirmed by @engcom-November. Thank you for verifying the issue.
Issue Available: @engcom-November, You will be automatically unassigned. Contributors/Maintainers can claim this issue to continue. To reclaim and continue work, reassign the ticket to yourself.

[bjornsnoen]

Hello @bjornsnoen,

Thank you for the report and collaboration1

Verified this issue on 2.4-develop. When custom fields are added which is dependent on a specific value in multiselect, selecting all the options should make the field visible.

Please take a look at the screencast below:
Screen.Recording.2024-03-08.at.2.18.01.PM.mov

Here we can see selecting all the options should have revealed the field. Hence confirming the issue.

Please find the attached module used to reproduce this issue. FieldVendor.zip

Thank you.

Hello! Glad to see this issue is now being looked into. I have not worked on magento in a few years at this point and am not set up to do any follow-up, but again I'm glad it's being looked into. No need to tag me in any further updates.