symfony · fabpot · Sep 24, 2020 · May 6, 2020 · xabbuh · May 8, 2020
diff --git a/src/Symfony/Component/Form/CHANGELOG.md b/src/Symfony/Component/Form/CHANGELOG.md
@@ -7,6 +7,7 @@ CHANGELOG
  * Added support for using the `{{ label }}` placeholder in constraint messages, which is replaced in the `ViolationMapper` by the corresponding field form label.
  * Added `DataMapper`, `ChainAccessor`, `PropertyPathAccessor` and `CallbackAccessor` with new callable `getter` and `setter` options for each form type
  * Deprecated `PropertyPathMapper` in favor of `DataMapper` and `PropertyPathAccessor`
+ * Added a `html5` option to `MoneyType` and `PercentType`, to use `<input type="number" />`
 
 5.1.0
 -----

diff --git a/...mfony/Component/Form/Extension/Core/DataTransformer/MoneyToLocalizedStringTransformer.php b/...mfony/Component/Form/Extension/Core/DataTransformer/MoneyToLocalizedStringTransformer.php
@@ -23,7 +23,7 @@ class MoneyToLocalizedStringTransformer extends NumberToLocalizedStringTransform
 {
     private $divisor;
 
-    public function __construct(?int $scale = 2, ?bool $grouping = true, ?int $roundingMode = \NumberFormatter::ROUND_HALFUP, ?int $divisor = 1)
+    public function __construct(?int $scale = 2, ?bool $grouping = true, ?int $roundingMode = \NumberFormatter::ROUND_HALFUP, ?int $divisor = 1, string $locale = null)
     {
         if (null === $grouping) {
             $grouping = true;
@@ -33,7 +33,7 @@ public function __construct(?int $scale = 2, ?bool $grouping = true, ?int $round
             $scale = 2;
         }
 
-        parent::__construct($scale, $grouping, $roundingMode);
+        parent::__construct($scale, $grouping, $roundingMode, $locale);
 
         if (null === $divisor) {
             $divisor = 1;

diff --git a/...ony/Component/Form/Extension/Core/DataTransformer/PercentToLocalizedStringTransformer.php b/...ony/Component/Form/Extension/Core/DataTransformer/PercentToLocalizedStringTransformer.php
@@ -34,16 +34,19 @@ class PercentToLocalizedStringTransformer implements DataTransformerInterface
     private $roundingMode;
     private $type;
     private $scale;
+    private $html5Format;
 
     /**
      * @see self::$types for a list of supported types
      *
-     * @param int    $scale The scale
-     * @param string $type  One of the supported types
+     * @param int      $scale        The scale
+     * @param string   $type         One of the supported types
+     * @param int|null $roundingMode A value from \NumberFormatter, such as \NumberFormatter::ROUND_HALFUP
+     * @param bool     $html5Format  Use an HTML5 specific format, see https://www.w3.org/TR/html51/sec-forms.html#date-time-and-number-formats
      *
      * @throws UnexpectedTypeException if the given value of type is unknown
      */
-    public function __construct(int $scale = null, string $type = null, ?int $roundingMode = null)
+    public function __construct(int $scale = null, string $type = null, ?int $roundingMode = null, bool $html5Format = false)
     {
         if (null === $scale) {
             $scale = 0;
@@ -64,6 +67,7 @@ public function __construct(int $scale = null, string $type = null, ?int $roundi
         $this->type = $type;
         $this->scale = $scale;
         $this->roundingMode = $roundingMode;
+        $this->html5Format = $html5Format;
     }
 
     /**
@@ -182,7 +186,13 @@ public function reverseTransform($value)
      */
     protected function getNumberFormatter()
     {
-        $formatter = new \NumberFormatter(\Locale::getDefault(), \NumberFormatter::DECIMAL);
+        // Values used in HTML5 number inputs should be formatted as in "1234.5", ie. 'en' format without grouping,
+        // according to https://www.w3.org/TR/html51/sec-forms.html#date-time-and-number-formats
+        $formatter = new \NumberFormatter($this->html5Format ? 'en' : \Locale::getDefault(), \NumberFormatter::DECIMAL);
+
+        if ($this->html5Format) {
+            $formatter->setAttribute(\NumberFormatter::GROUPING_USED, 0);
+        }
 
         $formatter->setAttribute(\NumberFormatter::FRACTION_DIGITS, $this->scale);
 

diff --git a/src/Symfony/Component/Form/Extension/Core/Type/MoneyType.php b/src/Symfony/Component/Form/Extension/Core/Type/MoneyType.php
@@ -12,6 +12,7 @@
 namespace Symfony\Component\Form\Extension\Core\Type;
 
 use Symfony\Component\Form\AbstractType;
+use Symfony\Component\Form\Exception\LogicException;
 use Symfony\Component\Form\Extension\Core\DataTransformer\MoneyToLocalizedStringTransformer;
 use Symfony\Component\Form\FormBuilderInterface;
 use Symfony\Component\Form\FormInterface;
@@ -28,12 +29,15 @@ class MoneyType extends AbstractType
      */
     public function buildForm(FormBuilderInterface $builder, array $options)
     {
+        // Values used in HTML5 number inputs should be formatted as in "1234.5", ie. 'en' format without grouping,
+        // according to https://www.w3.org/TR/html51/sec-forms.html#date-time-and-number-formats
         $builder
             ->addViewTransformer(new MoneyToLocalizedStringTransformer(
                 $options['scale'],
                 $options['grouping'],
                 $options['rounding_mode'],
-                $options['divisor']
+                $options['divisor'],
+                $options['html5'] ? 'en' : null
             ))
         ;
     }
@@ -44,6 +48,10 @@ public function buildForm(FormBuilderInterface $builder, array $options)
     public function buildView(FormView $view, FormInterface $form, array $options)
     {
         $view->vars['money_pattern'] = self::getPattern($options['currency']);
+
+        if ($options['html5']) {
+            $view->vars['type'] = 'number';
+        }
     }
 
     /**
@@ -58,6 +66,7 @@ public function configureOptions(OptionsResolver $resolver)
             'divisor' => 1,
             'currency' => 'EUR',
             'compound' => false,
+            'html5' => false,
             'invalid_message' => function (Options $options, $previousValue) {
                 return ($options['legacy_error_messages'] ?? true)
                     ? $previousValue
@@ -76,6 +85,16 @@ public function configureOptions(OptionsResolver $resolver)
         ]);
 
         $resolver->setAllowedTypes('scale', 'int');
+
+        $resolver->setAllowedTypes('html5', 'bool');
+
+        $resolver->setNormalizer('grouping', function (Options $options, $value) {
+            if ($value && $options['html5']) {
+                throw new LogicException('Cannot use the "grouping" option when the "html5" option is enabled.');
+            }
+
+            return $value;
+        });
     }
 
     /**

diff --git a/src/Symfony/Component/Form/Extension/Core/Type/PercentType.php b/src/Symfony/Component/Form/Extension/Core/Type/PercentType.php
@@ -30,7 +30,7 @@ public function buildForm(FormBuilderInterface $builder, array $options)
             $options['scale'],
             $options['type'],
             $options['rounding_mode'],
-            false
+            $options['html5']
         ));
     }
 
@@ -40,6 +40,10 @@ public function buildForm(FormBuilderInterface $builder, array $options)
     public function buildView(FormView $view, FormInterface $form, array $options)
     {
         $view->vars['symbol'] = $options['symbol'];
+
+        if ($options['html5']) {
+            $view->vars['type'] = 'number';
+        }
     }
 
     /**
@@ -57,6 +61,7 @@ public function configureOptions(OptionsResolver $resolver)
             'symbol' => '%',
             'type' => 'fractional',
             'compound' => false,
+            'html5' => false,
             'invalid_message' => function (Options $options, $previousValue) {
                 return ($options['legacy_error_messages'] ?? true)
                     ? $previousValue
@@ -87,6 +92,7 @@ public function configureOptions(OptionsResolver $resolver)
 
             return '';
         });
+        $resolver->setAllowedTypes('html5', 'bool');
     }
 
     /**

diff --git a/...ent/Form/Tests/Extension/Core/DataTransformer/PercentToLocalizedStringTransformerTest.php b/...ent/Form/Tests/Extension/Core/DataTransformer/PercentToLocalizedStringTransformerTest.php
@@ -412,4 +412,84 @@ public function testReverseTransformDisallowsTrailingExtraCharactersMultibyte()
 
         $transformer->reverseTransform("12\xc2\xa0345,678foo");
     }
+
+    public function testTransformForHtml5Format()
+    {
+        $transformer = new PercentToLocalizedStringTransformer(null, null, \NumberFormatter::ROUND_HALFUP, true);
+
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $this->assertEquals('10', $transformer->transform(0.104));
+        $this->assertEquals('11', $transformer->transform(0.105));
+        $this->assertEquals('200000', $transformer->transform(2000));
+    }
+
+    public function testTransformForHtml5FormatWithInteger()
+    {
+        $transformer = new PercentToLocalizedStringTransformer(null, 'integer', \NumberFormatter::ROUND_HALFUP, true);
+
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $this->assertEquals('0', $transformer->transform(0.1));
+        $this->assertEquals('1234', $transformer->transform(1234));
+    }
+
+    public function testTransformForHtml5FormatWithScale()
+    {
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $transformer = new PercentToLocalizedStringTransformer(2, null, \NumberFormatter::ROUND_HALFUP, true);
+
+        $this->assertEquals('12.34', $transformer->transform(0.1234));
+    }
+
+    public function testReverseTransformForHtml5Format()
+    {
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $transformer = new PercentToLocalizedStringTransformer(null, null, \NumberFormatter::ROUND_HALFUP, true);
+
+        $this->assertEquals(0.02, $transformer->reverseTransform('1.5')); // rounded up, for 2 decimals
+        $this->assertEquals(0.15, $transformer->reverseTransform('15'));
+        $this->assertEquals(2000, $transformer->reverseTransform('200000'));
+    }
+
+    public function testReverseTransformForHtml5FormatWithInteger()
+    {
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $transformer = new PercentToLocalizedStringTransformer(null, 'integer', \NumberFormatter::ROUND_HALFUP, true);
+
+        $this->assertEquals(10, $transformer->reverseTransform('10'));
+        $this->assertEquals(15, $transformer->reverseTransform('15'));
+        $this->assertEquals(12, $transformer->reverseTransform('12'));
+        $this->assertEquals(200, $transformer->reverseTransform('200'));
+    }
+
+    public function testReverseTransformForHtml5FormatWithScale()
+    {
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $transformer = new PercentToLocalizedStringTransformer(2, null, \NumberFormatter::ROUND_HALFUP, true);
+
+        $this->assertEquals(0.1234, $transformer->reverseTransform('12.34'));
+    }
 }
diff --git a/src/Symfony/Component/Form/Tests/Extension/Core/Type/MoneyTypeTest.php b/src/Symfony/Component/Form/Tests/Extension/Core/Type/MoneyTypeTest.php
@@ -109,4 +109,18 @@ public function testDefaultFormattingWithSpecifiedRounding()
 
         $this->assertSame('12345', $form->createView()->vars['value']);
     }
+
+    public function testHtml5EnablesSpecificFormatting()
+    {
+        // Since we test against "de_CH", we need the full implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        \Locale::setDefault('de_CH');
+
+        $form = $this->factory->create(static::TESTED_TYPE, null, ['html5' => true, 'scale' => 2]);
+        $form->setData('12345.6');
+
+        $this->assertSame('12345.60', $form->createView()->vars['value']);
+        $this->assertSame('number', $form->createView()->vars['type']);
+    }
 }
diff --git a/src/Symfony/Component/Form/Tests/Extension/Core/Type/PercentTypeTest.php b/src/Symfony/Component/Form/Tests/Extension/Core/Type/PercentTypeTest.php
@@ -14,13 +14,34 @@
 use Symfony\Bridge\PhpUnit\ExpectDeprecationTrait;
 use Symfony\Component\Form\Extension\Core\Type\PercentType;
 use Symfony\Component\Form\Test\TypeTestCase;
+use Symfony\Component\Intl\Util\IntlTestHelper;
 
 class PercentTypeTest extends TypeTestCase
 {
     use ExpectDeprecationTrait;
 
     const TESTED_TYPE = PercentType::class;
 
+    private $defaultLocale;
+
+    protected function setUp(): void
+    {
+        // we test against different locales, so we need the full
+        // implementation
+        IntlTestHelper::requireFullIntl($this, false);
+
+        parent::setUp();
+
+        $this->defaultLocale = \Locale::getDefault();
+    }
+
+    protected function tearDown(): void
+    {
+        parent::tearDown();
+
+        \Locale::setDefault($this->defaultLocale);
+    }
+
     public function testSubmitWithRoundingMode()
     {
         $form = $this->factory->create(self::TESTED_TYPE, null, [
@@ -33,6 +54,35 @@ public function testSubmitWithRoundingMode()
         $this->assertEquals(0.0124, $form->getData());
     }
 
+    public function testSubmitNullUsesDefaultEmptyData($emptyData = '10', $expectedData = 0.1)
+    {
+        $form = $this->factory->create(static::TESTED_TYPE, null, [
+            'empty_data' => $emptyData,
+            'rounding_mode' => \NumberFormatter::ROUND_UP,
+        ]);
+        $form->submit(null);
+
+        $this->assertSame($emptyData, $form->getViewData());
+        $this->assertSame($expectedData, $form->getNormData());
+        $this->assertSame($expectedData, $form->getData());
+    }
+
+    public function testHtml5EnablesSpecificFormatting()
+    {
+        \Locale::setDefault('de_CH');
+
+        $form = $this->factory->create(static::TESTED_TYPE, null, [
+            'html5' => true,
+            'rounding_mode' => \NumberFormatter::ROUND_UP,
+            'scale' => 2,
+            'type' => 'integer',
+        ]);
+        $form->setData('1234.56');
+
+        $this->assertSame('1234.56', $form->createView()->vars['value']);
+        $this->assertSame('number', $form->createView()->vars['type']);
+    }
+
     /**
      * @group legacy
      */