typescript-eslint/naming-conventions function not being applied? - eslint

Question

Given my .eslintrc.js file:
module.exports = {
root: true,
parser: '#typescript-eslint/parser',
parserOptions: {
ecmaVersion: 2020,
sourceType: 'module',
project: './tsconfig.json',
tsconfigRootDir: __dirname,
createDefaultProgram: true,
},
plugins: ['#typescript-eslint'],
settings: {
'import/resolver': {
// See https://github.com/benmosher/eslint-plugin-import/issues/1396#issuecomment-575727774 for line below
node: {},
typescript: {},
},
'import/parsers': {
'#typescript-eslint/parser': ['.ts', '.tsx'],
},
},
rules: {
// https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/naming-convention.md
'#typescript-eslint/naming-convention': [
'error',
{
selector: 'default',
format: ['camelCase'],
},
// destructured variables come from other places so no format is enforced
{
selector: 'variable',
modifiers: ['destructured'],
format: null,
},
// functions defined as constants must be constants (not var/let)
{
selector: 'variable',
types: ['function'],
modifiers: ['const'],
format: ['camelCase', 'PascalCase'],
},
// Constants can also be camelCase apart from UPPER_CASE
{
selector: 'variable',
modifiers: ['const'],
format: ['UPPER_CASE', 'camelCase'],
},
// functions can be:
// - regular functions (camelCase)
// - functional components (PascalCase)
{
selector: 'function',
format: ['camelCase', 'PascalCase'],
},
// type definitions (class, interface, typeAlias, enum, typeParameter)
// should be PascalCase
{
selector: 'typeLike',
format: ['PascalCase'],
},
// each member of an enum (const-like) should be UPPER_CASE
{
selector: 'enumMember',
format: ['UPPER_CASE'],
},
{
// Ignore properties that require quotes
selector: [
'classProperty',
'objectLiteralProperty',
'typeProperty',
'classMethod',
'objectLiteralMethod',
'typeMethod',
'accessor',
'enumMember',
],
format: null,
modifiers: ['requiresQuotes'],
},
],
},
};
I think it should detect as errors UPPER_CASE named functions, but it doesn't
function FUNCTION1() {
// this function name should be an error but it isn't
}
const FUNCTION2 = () => {}; // this should be an error too
const function3 = () => {}; // this should be ok
function4() {} // this should be ok too
Am I missing anything in this config?

Answer 1

One of those is easy, in const FUNCTION2 = () => {};, FUNCTION2 is actually a variable, and const.
Helpful tip: you can use error messages to your advantage by forcing a failure condition to see which one it's matching. Adding custom: { regex: 'FUNCTION2', match: false} to that rule adds the caveat "but it can't match FUNCTION2" to it, which will turn that line into the error:
Variable name FUNCTION2 must not match the RegExp: /FUNCTION2/u
which exposes that it's a variable.
Doing that one rule at a time for FUNCTION1 will at least tell you which rule it's matching.