Как входные элементы проверяют, соответствуют ли строки регулярному выражению, указанному в атрибуте pattern?

Question

Я создаю модуль npm, который будет коллекцией шаблонов проверки регулярных выражений из http://html5pattern.com/ и других источников.

Мой вопрос возник, когда я попытался проверить некоторые выражения. Я использую Ava.js для простых утверждений.

Внутренне, при тестировании регулярных выражений, Ava использует метод RegEx test(). Так, например, /[a-zA-Z0-9]+/.test("Us3rN@m3") вернет true.

Однако, когда вы фактически используете /[a-zA-Z0-9]+/ в качестве регулярного выражения для атрибута шаблона входного элемента, "Us3rN@m3" возвращает false.

Итак, я предполагаю, что внутри элемента ввода выполняется другой тест?

HTML spec гласит, что данное регулярное выражение скомпилировано как регулярное выражение JavaScript с указанным только флагом "u" , что мне мало что говорит.

Если я напишу регулярное выражение наподобие этого /^[a-zA-Z0-9]+$/.test("Us3rNm3"), оно вернет true точно так же, как элемент ввода, но я не уверен, так ли это работает внутри?

Answer 1

Чтобы правильно протестировать шаблоны HTML5, убедитесь, что вы завернули весь шаблон строки с помощью ^(?: и )$, чтобы обеспечить совпадение всей строки.

Согласно pattern атрибутивной документации :

Этот язык регулярных выражений, используемый для этого атрибута, такой же, как и в JavaScript, за исключением того, что атрибут pattern сопоставляется со всем значением, а не с каким-либо подмножеством (в некоторой степени, как если бы оно подразумевало ^(?: в начале шаблон и )$ в конце).