Identify JavaScript function parameters

components/prism-flow.js

@@ -10,6 +10,7 @@
 		]
 	});
 	Prism.languages.flow['function-variable'].pattern = /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=\s*(?:function\b|(?:\([^()]*\)(?:\s*:\s*\w+)?|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i;
+	delete Prism.languages.flow['parameter'];
 
 	Prism.languages.insertBefore('flow', 'operator', {
 		'flow-punctuation': {
@@ -31,4 +32,4 @@
 			lookbehind: true
 		}
 	);
-}(Prism));
+}(Prism));

components/prism-javascript.js

@@ -29,9 +29,30 @@ Prism.languages.insertBefore('javascript', 'keyword', {
 	},
 	// This must be declared before keyword because we use "function" inside the look-forward
 	'function-variable': {
-		pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:function\b|(?:\([^()]*\)|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i,
+		pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\([^()]*\)|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i,
 		alias: 'function'
 	},
+	'parameter': [
+		{
+			pattern: /(function(?:\s+[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)?\s*\(\s*)[^\s()][^()]*?(?=\s*\))/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=>)/,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /(\(\s*)[^\s()][^()]*?(?=\s*\)\s*=>)/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*\s*)\(\s*)[^\s()][^()]*?(?=\s*\)\s*\{)/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		}
+	],
 	'constant': /\b[A-Z][A-Z\d_]*\b/
 });
 

prism.js

@@ -744,9 +744,30 @@ Prism.languages.insertBefore('javascript', 'keyword', {
 	},
 	// This must be declared before keyword because we use "function" inside the look-forward
 	'function-variable': {
-		pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:function\b|(?:\([^()]*\)|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i,
+		pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\([^()]*\)|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i,
 		alias: 'function'
 	},
+	'parameter': [
+		{
+			pattern: /(function(?:\s+[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)?\s*\(\s*)[^\s()][^()]*?(?=\s*\))/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=>)/,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /(\(\s*)[^\s()][^()]*?(?=\s*\)\s*=>)/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		},
+		{
+			pattern: /((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*\s*)\(\s*)[^\s()][^()]*?(?=\s*\)\s*\{)/,
+			lookbehind: true,
+			inside: Prism.languages.javascript
+		}
+	],
 	'constant': /\b[A-Z][A-Z\d_]*\b/
 });
 

tests/languages/javascript/class-method_feature.test

@@ -0,0 +1,59 @@
+class Test {
+	foo( x, y = 0) {}
+	async bar(x, y = 0 ) {}
+	$ ( ) {}
+	awaitFoo(){}
+}
+
+----------------------------------------------------
+
+[
+	["keyword", "class"],
+	["class-name", ["Test"]],
+	["punctuation", "{"],
+
+	["function", "foo"],
+	["punctuation", "("],
+	["parameter", [
+		"x",
+		["punctuation", ","],
+		" y ",
+		["operator", "="],
+		["number", "0"]
+	]],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["keyword", "async"],
+	["function", "bar"],
+	["punctuation", "("],
+	["parameter", [
+		"x",
+		["punctuation", ","],
+		" y ",
+		["operator", "="],
+		["number", "0"]
+	]],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["function", "$"],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["function", "awaitFoo"],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["punctuation", "}"]
+]
+
+----------------------------------------------------
+
+Checks for class methods.

tests/languages/javascript/function-variable_feature.test

@@ -1,25 +1,102 @@
-foo = function () {}
+foo = function ( x, y) {}
 {foo: function () {}}
-bar = function baz () {}
+bar = async function baz (x ) {}
+baz = async(x) => x
 fooBar = x => x
+fooBar = ( x, y ) => x
 ಠ_ಠ = () => {}
-Ƞȡ_҇ = (ಠ, Ƞ = 2) => {}
+Ƞȡ_҇ = async (ಠ, Ƞ = 2) => {}
 
 ----------------------------------------------------
 
 [
-	["function-variable", "foo"], ["operator", "="], ["keyword", "function"],
-	["punctuation", "("], ["punctuation", ")"], ["punctuation", "{"], ["punctuation", "}"],
-	["punctuation", "{"], ["function-variable", "foo"], ["punctuation", ":"], ["keyword", "function"],
-	["punctuation", "("], ["punctuation", ")"], ["punctuation", "{"],["punctuation","}"],["punctuation","}"],
-	["function-variable", "bar"], ["operator", "="], ["keyword", "function"], ["function", "baz"],
-	["punctuation", "("], ["punctuation", ")"], ["punctuation", "{"], ["punctuation", "}"],
-	["function-variable", "fooBar"], ["operator", "="], " x ", ["operator", "=>"], " x\r\n",
-	["function-variable", "ಠ_ಠ"], ["operator", "="], ["punctuation", "("], ["punctuation", ")"],
-	["operator", "=>"], ["punctuation", "{"], ["punctuation", "}"],
-	["function-variable", "Ƞȡ_҇"], ["operator", "="],
-	["punctuation", "("], "ಠ", ["punctuation", ","], " Ƞ ", ["operator", "="], ["number", "2"], ["punctuation", ")"],
-	["operator", "=>"], ["punctuation", "{"], ["punctuation", "}"]
+	["function-variable", "foo"],
+	["operator", "="],
+	["keyword", "function"],
+	["punctuation", "("],
+	["parameter", [
+		"x",
+		["punctuation", ","],
+		" y"
+	]],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["punctuation", "{"],
+	["function-variable", "foo"],
+	["punctuation", ":"],
+	["keyword", "function"],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation","}"],
+	["punctuation","}"],
+
+	["function-variable", "bar"],
+	["operator", "="],
+	["keyword", "async"],
+	["keyword", "function"],
+	["function", "baz"],
+	["punctuation", "("],
+	["parameter", [
+		"x"
+	]],
+	["punctuation", ")"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["function-variable", "baz"],
+	["operator", "="],
+	["keyword", "async"],
+	["punctuation", "("],
+	["parameter", [
+		"x"
+	]],
+	["punctuation", ")"],
+	["operator", "=>"], " x\r\n",
+
+	["function-variable", "fooBar"],
+	["operator", "="],
+	["parameter", [
+		"x"
+	]],
+	["operator", "=>"], " x\r\n",
+
+	["function-variable", "fooBar"],
+	["operator", "="],
+	["punctuation", "("],
+	["parameter", [
+		"x",
+		["punctuation", ","],
+		" y"
+	]],
+	["punctuation", ")"],
+	["operator", "=>"], " x\r\n",
+
+	["function-variable", "ಠ_ಠ"],
+	["operator", "="],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["operator", "=>"],
+	["punctuation", "{"],
+	["punctuation", "}"],
+
+	["function-variable", "Ƞȡ_҇"],
+	["operator", "="],
+	["keyword", "async"],
+	["punctuation", "("],
+	["parameter", [
+		"ಠ",
+		["punctuation", ","],
+		" Ƞ ",
+		["operator", "="],
+		["number", "2"]
+	]],
+	["punctuation", ")"],
+	["operator", "=>"],
+	["punctuation", "{"],
+	["punctuation", "}"]
 ]
 
 ----------------------------------------------------

tests/languages/javascript/function_feature.test

@@ -7,6 +7,7 @@ _()
 $()
 ಠ_ಠ()
 Ƞȡ_҇()
+if(notAFunction)
 
 ----------------------------------------------------
 
@@ -19,7 +20,8 @@ $()
 	["function", "_"], ["punctuation", "("], ["punctuation", ")"],
 	["function", "$"], ["punctuation", "("], ["punctuation", ")"],
 	["function", "ಠ_ಠ"], ["punctuation", "("], ["punctuation", ")"],
-	["function", "Ƞȡ_҇"], ["punctuation", "("], ["punctuation", ")"]
+	["function", "Ƞȡ_҇"], ["punctuation", "("], ["punctuation", ")"],
+	["keyword", "if"], ["punctuation", "("], "notAFunction", ["punctuation", ")"]
 ]
 
 ----------------------------------------------------

tests/languages/javascript/issue1526.test

@@ -1,35 +1,35 @@
-fetch('some-resource.json')
-	.then(response => response.json())
-	.catch(console.error);
-
-----------------------------------------------------
-
-[
-	["function", "fetch"],
-	["punctuation", "("],
-	["string", "'some-resource.json'"],
-	["punctuation", ")"],
-	["punctuation", "."],
-	["function", "then"],
-	["punctuation", "("],
-	"response ",
-	["operator", "=>"],
-	" response",
-	["punctuation", "."],
-	["function", "json"],
-	["punctuation", "("],
-	["punctuation", ")"],
-	["punctuation", ")"],
-	["punctuation", "."],
-	["function", "catch"],
-	["punctuation", "("],
-	"console",
-	["punctuation", "."],
-	"error",
-	["punctuation", ")"],
-	["punctuation", ";"]
-]
-
-----------------------------------------------------
-
-Checks for catch function which is not a keyword. See #1526
+fetch('some-resource.json')
+	.then(response => response.json())
+	.catch(console.error);
+
+----------------------------------------------------
+
+[
+	["function", "fetch"],
+	["punctuation", "("],
+	["string", "'some-resource.json'"],
+	["punctuation", ")"],
+	["punctuation", "."],
+	["function", "then"],
+	["punctuation", "("],
+	["parameter", ["response"]],
+	["operator", "=>"],
+	" response",
+	["punctuation", "."],
+	["function", "json"],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["punctuation", ")"],
+	["punctuation", "."],
+	["function", "catch"],
+	["punctuation", "("],
+	"console",
+	["punctuation", "."],
+	"error",
+	["punctuation", ")"],
+	["punctuation", ";"]
+]
+
+----------------------------------------------------
+
+Checks for catch function which is not a keyword. See #1526

tests/languages/jsx/issue1294.test

@@ -13,7 +13,9 @@ export default () => (
 [
 	["keyword", "export"],
 	["keyword", "default"],
-	["punctuation", "("], ["punctuation", ")"], ["operator", "=>"], ["punctuation", "("],
+	["punctuation", "("],
+	["punctuation", ")"],
+	["operator", "=>"], ["punctuation", "("],
 	["tag", [
 		["tag", [
 			["punctuation", "<"],
@@ -66,4 +68,4 @@ export default () => (
 
 ----------------------------------------------------
 
-See #1294.
+See #1294.

tests/languages/jsx/issue1335.test

@@ -21,7 +21,9 @@
 			["script-punctuation", "="],
 			["punctuation", "{"],
 			["punctuation", "("],
-			"e",
+			["parameter", [
+				"e"
+			]],
 			["punctuation", ")"],
 			["operator", "=>"],
 			["keyword", "this"],

tests/languages/jsx/issue1421.test

@@ -55,4 +55,4 @@ class Columns extends React.Component {
 ]
 
 ----------------------------------------------------
-Checks for fragments short syntax. See #1421
+Checks for fragments short syntax. See #1421