[no-unused-vars] Reports errors on variables used in globally declared TypeScript namespaces

[alfechner]

{
  "rules": {
     "@typescript-eslint/no-unused-vars": "on"
  }
}

app-server.d.ts:

import { Node } from 'slate';

declare global {
  namespace AppServer {
    type TemplateContent = readonly Node[];
  }
}

Expected Result

typescript-eslint/no-unused-vars should not report an error on Node not being used.

Actual Result

typescript-eslint/no-unused-vars reports an error on Node not being used.

Additional Info

Works fine when defining the namespace not flobalie:

import { Node } from 'slate';

namespace AppServer {
  type TemplateContent = readonly Node[];
}

Versions

package	version
@typescript-eslint/eslint-plugin	2.18.0
@typescript-eslint/parser	2.16.0
TypeScript	^3.7.4
ESLint	^6.8.0
node	v12.14.1
npm	6.13.4

[mightyiam]

Can this also explain this rule false-positive on div?

import { assert } from 'chai'
import { jsx } from '../jsx'

describe('snabbdom', function () {
  describe('jsx', function () {
    it('can be used as a jsxFactory method', function () {
      const vnode = <div title="Hello World">Hello World</div>

      assert.deepStrictEqual(vnode, {
        sel: 'div',
        data: { title: 'Hello World' },
        children: undefined,
        elm: undefined,
        text: 'Hello World',
        key: undefined
      })
    })
  })
})

[bradzacher]

if anything that's due to the rule not handling jsx.

[nojvek]

@mightyiam you need to add react-jsx eslint plugin to handle this.
package.json

    "eslint-plugin-react": "7.18.3",

.eslintrc.js options

module.exports = {
  ...
  parserOptions: {
    ecmaVersion: 2020,
    sourceType: `module`,
    ecmaFeatures: {
      jsx: true,
    },
  },
  plugins: [`react`],
  settings: {
    react: {
      pragma: `h`,
    },
  },
  rules: {
     ...,
     'react/jsx-uses-react': [`error`],
     'react/jsx-uses-vars': [`error`],
  }
}

[nojvek]

Also @mightyiam , the eslint and tslint rules conflict, you have to turn of eslint rule, and enable the corresponding tseslint rule.

My config looks like, and I don't see the undefined vars errors you are seeing.

function asTsEslintRules(/** @type {Record<String, [string, ...any[]]>} */ rules) {
  const tsRules = {};
  for (const [rule, ruleOpts] of Object.entries(rules)) {
    tsRules[`@typescript-eslint/${rule}`] = ruleOpts;
    tsRules[rule] = [`off`];
  }
  return tsRules;
}

/** @type {Record<String, [string, ...any[]]>} */
const TS_ES_RULES = {
  'no-unused-expressions': [`error`, {allowShortCircuit: true, allowTernary: true}],
  'no-unused-vars': [`error`, {argsIgnorePattern: `^_`}],
  'no-use-before-define': [`error`],
  'require-await': [`error`],
  camelcase: [`error`],
  quotes: [`error`, `backtick`],
};

const TS_OVERRIDE = {
  files: [`**/*.ts`, `**/*.tsx`],
  parser: `@typescript-eslint/parser`,
  parserOptions: {
    project: `./tsconfig.json`,
    tsconfigRootDir: __dirname,
  },
  plugins: [`@typescript-eslint`],
  extends: [
    `eslint:recommended`,
    `plugin:@typescript-eslint/eslint-recommended`,
    `plugin:@typescript-eslint/recommended`,
    `plugin:@typescript-eslint/recommended-requiring-type-checking`,
    `prettier`,
    `prettier/@typescript-eslint`,
  ],
  rules: {
    // these eslint rules conflict with typescript-eslint rules
    // we replace the eslint rule with @typescript-eslint/{rule}
    ...asTsEslintRules(TS_ES_RULES),
    '@typescript-eslint/array-type': [`error`, {default: `array-simple`}],
  },
};

Also remember to get latest packages.

[bradzacher]

Merging into #1856