no-misleading-character-class

Disallow characters which are made with multiple code points in character class syntax

Unicode includes characters which are made by multiple code points. RegExp character class syntax (/[abc]/) cannot handle characters which are made by multiple code points as a character; those characters will be dissolved to each code point. For example, ❇️ is made by ❇ (U+2747) and VARIATION SELECTOR-16 (U+FE0F). If this character is in a RegExp character class, it will match either ❇ (U+2747) or VARIATION SELECTOR-16 (U+FE0F) rather than ❇️.

This rule reports regular expressions which include multiple code point characters in character class syntax. This rule considers the following characters as multiple code point characters.

A character with combining characters:

The combining characters are characters which belong to one of Mc, Me, and Mn Unicode general categories.

/^[Á]$/u.test("Á"); //→ false
/^[❇️]$/u.test("❇️"); //→ false
1
2

A character with Emoji modifiers:

/^[👶🏻]$/u.test("👶🏻"); //→ false
/^[👶🏽]$/u.test("👶🏽"); //→ false
1
2

A pair of regional indicator symbols:

/^[🇯🇵]$/u.test("🇯🇵"); //→ false
1

Characters that ZWJ joins:

/^[👨‍👩‍👦]$/u.test("👨‍👩‍👦"); //→ false
1

A surrogate pair without Unicode flag:

/^[👍]$/.test("👍"); //→ false

// Surrogate pair is OK if with u flag.
/^[👍]$/u.test("👍"); //→ true
1
2
3
4

Rule Details

This rule reports regular expressions which include multiple code point characters in character class syntax.

Examples of incorrect code for this rule:

/*eslint no-misleading-character-class: error */

/^[Á]$/u;
/^[❇️]$/u;
/^[👶🏻]$/u;
/^[🇯🇵]$/u;
/^[👨‍👩‍👦]$/u;
/^[👍]$/;
new RegExp("[🎵]");
1
2
3
4
5
6
7
8
9

Examples of correct code for this rule:

/*eslint no-misleading-character-class: error */

/^[abc]$/;
/^[👍]$/u;
/^[\q{👶🏻}]$/v;
new RegExp("^[]$");
new RegExp(`[Á-${z}]`, "u"); // variable pattern
1
2
3
4
5
6
7

Options

This rule has an object option:

• "allowEscape": When set to true, the rule allows any grouping of code points inside a character class as long as they are written using escape sequences. This option only has effect on regular expression literals and on regular expressions created with the RegExp constructor with a literal argument as a pattern.

allowEscape

Examples of incorrect code for this rule with the { "allowEscape": true } option:

/* eslint no-misleading-character-class: ["error", { "allowEscape": true }] */

/[\👍]/; // backslash can be omitted

new RegExp("[\ud83d" + "\udc4d]");

const pattern = "[\ud83d\udc4d]";
new RegExp(pattern);
1
2
3
4
5
6
7
8

Examples of correct code for this rule with the { "allowEscape": true } option:

/* eslint no-misleading-character-class: ["error", { "allowEscape": true }] */

/[\ud83d\udc4d]/;
/[\u00B7\u0300-\u036F]/u;
/[👨\u200d👩]/u;
new RegExp("[\x41\u0301]");
new RegExp(`[\u{1F1EF}\u{1F1F5}]`, "u");
new RegExp("[\\u{1F1EF}\\u{1F1F5}]", "u");
1
2
3
4
5
6
7
8

When Not To Use It

You can turn this rule off if you don’t want to check RegExp character class syntax for multiple code point characters.

Version

This rule was introduced in ESLint v5.3.0.

Resources

• Rule source
• Tests source