Validation "required-file" or "required" does not work in the system.xml file if a field type is image.

[dzima-chyzhou]

Summary

If you create a field with the "image" type, validation "required" or "required-file" doesn't work.

Preconditions

1. Magento 2.2.5 CE with sample data
2. PHP 7.0.30

Steps to reproduce

1. Create any custom module.
2. Create system.xml configuration and add a field with image type for example:

<field id="custom" translate="label" type="image" sortOrder="40" showInDefault="1" showInStore="1" showInWebsite="1" >
   <label>Custom Label</label>
   <backend_model>Magento\Theme\Model\Design\Backend\Image</backend_model> 
   <base_url type="media" scope_info="1">vendor_module/label/custom</base_url>
   <upload_dir config="system/filesystem/media" scope_info="1">vendor_module/label/custom</upload_dir>
   <validate>required required-file</validate>
</field>

3. Go to admin side configuration -> do not upload an image in this field -> save configuration.

Expected result

1. The require validation error appears.

Actual result

1. Configuration is saved without require validation.

[magento-engcom-team]

Hi @chizhov13. 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-engcom-team give me {$VERSION} instance

where {$VERSION} is version tags (starting from 2.2.0+) or develop branches (2.2-develop +).
For more details, please, review the Magento Contributor Assistant documentation.

@chizhov13 do you confirm that you was able to reproduce the issue on vanilla Magento instance following steps to reproduce?

• yes
• no

@chizhov13 , thank you for your report.
Please refer to the Community Forums or the Magento Stack Exchange site for advice or general discussion about this issue. The GitHub issue tracker is intended for Magento Core technical issues only.

[mezus-xd]

Summary

If you create a field with the "image" type, validation "required" or "required-file" doesn't work.

Preconditions

1. Magento 2.2.5 CE with sample data

2. PHP 7.0.30

Steps to reproduce

1. Create any custom module.

2. Create system.xml configuration and add a field with image type for example:

<field id="custom" translate="label" type="image" sortOrder="40" showInDefault="1" showInStore="1" showInWebsite="1" >
   <label>Custom Label</label>
   <backend_model>Magento\Theme\Model\Design\Backend\Image</backend_model> 
   <base_url type="media" scope_info="1">vendor_module/label/custom</base_url>
   <upload_dir config="system/filesystem/media" scope_info="1">vendor_module/label/custom</upload_dir>
   <validate>required required-file</validate>
</field>

1. Go to admin side configuration -> do not upload an image in this field -> save configuration.

Expected result

1. The require validation error appears.

Actual result

1. Configuration is saved without require validation.

I have same problem, did you found any solution or way on how to add validation on field type image ?

[speller]

The following composer patch on the magento/framework package solves the issue:

--- a/Data/Form/Element/Image.php
+++ b/Data/Form/Element/Image.php
@@ -96,6 +96,9 @@
                 $this->_getUiId() .
                 ' />' .
                 '</a> ';
+            if ($this->getImprovedValidation()) {
+                $html .= '<input type="hidden" id="' . $this->getHtmlId() . '_value" value="' . $this->getEscapedValue() . '"/>';
+            }
             $html .= $this->secureRenderer->renderEventListenerAsTag(
                 'onclick',
                 "imagePreview('{$this->getHtmlId()}_image');\nreturn false;",
@@ -103,6 +106,9 @@
             );
         }
         $this->setClass('input-file');
+        if ($this->getImprovedValidation() && $this->getRequired()) {
+            $this->addClass('required-file');
+        }
         $html .= parent::getElementHtml();
         $html .= $this->_getDeleteCheckbox();

The required-file CSS class enables the existing file field validation. The additional hidden field allows to check for already uploaded file value as well, not only the currently selected file in the input HTML field.

To not break anything existing, it uses the improved_validation data value to turn on the check on intended fields only. Tested on 2.4.7.