TextInput: validators EMAIL, URL, INTEGER and FLOAT automatically sets type to 'email', 'url' or 'number' (BC break)

Author: dg

src/Forms/Controls/TextInput.php

@@ -63,6 +63,10 @@ public function getControl()
 		foreach ($this->getRules() as $rule) {
 			if ($rule->isNegative || $rule->branch) {
 
+			} elseif ($input->type === 'text' && in_array($rule->validator, [Form::EMAIL, Form::URL, Form::INTEGER, Form::FLOAT], TRUE)) {
+				static $types = [Form::EMAIL => 'email', Form::URL => 'url', Form::INTEGER => 'number', Form::FLOAT => 'number'];
+				$input->type = $types[$rule->validator];
+
 			} elseif (in_array($rule->validator, [Form::MIN, Form::MAX, Form::RANGE], TRUE)
 				&& in_array($input->type, ['number', 'range', 'datetime-local', 'datetime', 'date', 'month', 'week', 'time'], TRUE)
 			) {

tests/Forms/Controls.translate().phpt

@@ -83,13 +83,13 @@ test(function () {
 
 	$email = $form->addText('email')
 		->addRule($form::EMAIL, 'error');
-	Assert::match('<input type="text" name="email" id="frm-email" data-nette-rules=\'[{"op":":email","msg":"error"}]\'>', (string) $email->getControl());
+	Assert::match('<input type="email" name="email" id="frm-email" data-nette-rules=\'[{"op":":email","msg":"error"}]\'>', (string) $email->getControl());
 	$email->validate();
 	Assert::same(['error'], $email->getErrors());
 
 	$email2 = $form->addText('email2')
 		->addRule($form::EMAIL, new StringWrapper('Your name'));
-	Assert::match('<input type="text" name="email2" id="frm-email2" data-nette-rules=\'[{"op":":email","msg":"StringWrapper"}]\'>', (string) $email2->getControl());
+	Assert::match('<input type="email" name="email2" id="frm-email2" data-nette-rules=\'[{"op":":email","msg":"StringWrapper"}]\'>', (string) $email2->getControl());
 	$email2->validate();
 	Assert::same(['StringWrapper'], $email2->getErrors());
 });

tests/Forms/Forms.renderer.1.expect

@@ -14,7 +14,7 @@
 <tr class="required">
 	<th><label for="frm-age" class="required">Your age:</label></th>
 
-	<td><input type="text" name="age" id="frm-age" required data-nette-rules='[{"op":":filled","msg":"Enter your age"},{"op":":integer","msg":"Age must be numeric value"},{"op":":range","msg":"Age must be in range from 10 to 100","arg":[10,100]}]' class="text">
+	<td><input type="number" name="age" id="frm-age" required data-nette-rules='[{"op":":filled","msg":"Enter your age"},{"op":":integer","msg":"Age must be numeric value"},{"op":":range","msg":"Age must be in range from 10 to 100","arg":[10,100]}]' min="10" max="100">
 
 	<span class="error">
 		Enter your age

tests/Forms/Forms.renderer.2.expect

@@ -13,7 +13,7 @@
 
 	<dt><label for="frm-age" class="required">Your age:</label></dt>
 
-	<dd class="odd"><input type="text" name="age" id="frm-age" required data-nette-rules='[{"op":":filled","msg":"Enter your age"},{"op":":integer","msg":"Age must be numeric value"},{"op":":range","msg":"Age must be in range from 10 to 100","arg":[10,100]}]' value="9.9" class="text"> •
+	<dd class="odd"><input type="number" name="age" id="frm-age" required data-nette-rules='[{"op":":filled","msg":"Enter your age"},{"op":":integer","msg":"Age must be numeric value"},{"op":":range","msg":"Age must be in range from 10 to 100","arg":[10,100]}]' min="10" max="100" value="9.9"> •
 
 	<span class="error">
 		Age must be numeric value