'range' of null TypeError from template-curly-spacing rule

[Niels-NTG]

Tell us about your environment

Environment Info:

Node version: v13.11.0
npm version: v6.13.7
Local ESLint version: v6.8.0 (Currently used)
Global ESLint version: v5.14.1

What parser (default, Babel-ESLint, etc.) are you using?

• Babel-ESLint: v10.1.0 (also tested with v10.0.3)

Please show your full configuration:

Configuration

{
    "extends": "eslint:recommended",
    "parser": "babel-eslint",
    "parserOptions": {
        "sourceType": "module"
    },
    "env": {
        "browser": true,
        "node": true,
        "es6": true,
        "amd": true,
        "jquery": true
    },
    "globals": {
        "_": false,
        "Backbone": false,
        "define": false,
        "TweenMax": false,
        "Expo": false,
        "Quart": false,
        "Back": false,
        "Circ": false,
        "Quad": false,
        "Power1": false,
        "Power2": false,
        "Power3": false,
        "Power4": false,
        "SlowMo": false,
        "TimelineLite": false,
        "DocumentTouch": false,
        "LANGUAGE": false,
        "Template": false,
        "Styles": false,
        "BaseView": false,
        "VERSIONHASH": false,
        "PRODUCTION": false,
        "ISMOBILE": false,
        "APPLICATION": false,
        "Sentry": false,
        "__webpack_public_path__": true
    },
    "rules": {
        "max-len": [
            "error",
            {
                "code": 120,
                "tabWidth": 4,
                "ignoreRegExpLiterals": true,
                "ignoreTemplateLiterals": true,
                "ignoreStrings": true,
                "ignoreUrls": true
            }
        ],
        "camelcase": 0,
        "valid-jsdoc": [
            "error",
            {
                "requireReturn": false
            }
        ],
        "no-console": "off",
        "no-useless-escape": "off",
        "no-new-wrappers": "error",
        "no-extend-native": "error",
        "curly": "error",
        "no-eval": "error",
        "indent": [
            "error",
            4,
            {
                "SwitchCase": 1
            }
        ],
        "no-multi-str": "error",
        "no-fallthrough": "off",
        "no-multi-spaces": "error",
        "no-undef-init": "error",
        "no-inline-comments": "error",
        "quotes": [
            "error",
            "single"
        ],
        "no-multiple-empty-lines": [
            "error",
            {
                "max": 1,
                "maxEOF": 1,
                "maxBOF": 0
            }
        ],
        "spaced-comment": [
            "error",
            "always"
        ],
        "eqeqeq": "warn",
        "prefer-template": "off",
        "template-curly-spacing": [
            "error",
            "never"
        ],
        "no-useless-concat": "error",
        "no-template-curly-in-string": "error",
        "object-shorthand": "warn",
        "quote-props": [
            "warn",
            "as-needed"
        ],
        "no-else-return": "warn",
        "keyword-spacing": "error",
        "comma-spacing": "error",
        "key-spacing": "error",
        "no-prototype-builtins": "off",
        "no-bitwise": [
            "error",
            {
                "int32Hint": true
            }
        ]
    }
}

What did you do? Please include the actual source code causing the issue, as well as the command that you used to run ESLint.

// Expose underscore to console
window._ = _;

// Load language PO file.
import(`locale/${LANGUAGE}/default.po`).then((languagePo) => {
    window.i18n = new Jed(languagePo.default);
})

var host_names = document.location.host.split('.');

(Fragment of application/main.js)

npx eslint application/main.js

What did you expect to happen?
ESLint would report no errors, warnings

What actually happened? Please include the actual, raw output from ESLint.
ESLint does not lint the file application/main.js like normal. Instead it throws the following error, which seem to originate from the template-curly-spacing rule.

[Error - 14:36:29] ESLint stack trace:
[Error - 14:36:29] TypeError: Cannot read property 'range' of null
Occurred while linting application/main.js:32
    at SourceCode.getTokenBefore (node_modules/eslint/lib/source-code/token-store/index.js:298:18)
    at checkSpacingBefore (node_modules/eslint/lib/rules/template-curly-spacing.js:60:42)
    at TemplateElement (node_modules/eslint/lib/rules/template-curly-spacing.js:119:17)
    at node_modules/eslint/lib/linter/safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (node_modules/eslint/lib/linter/safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (node_modules/eslint/lib/linter/node-event-generator.js:254:26)
    at NodeEventGenerator.applySelectors (node_modules/eslint/lib/linter/node-event-generator.js:283:22)
    at NodeEventGenerator.enterNode (node_modules/eslint/lib/linter/node-event-generator.js:297:14)
    at CodePathAnalyzer.enterNode (node_modules/eslint/lib/linter/code-path-analysis/code-path-analyzer.js:634:23)

(log used full, absolute paths. I replaced them with the relative path for this issue for privacy reasons)

Are you willing to submit a pull request to fix this bug?
Unsure.

[anikethsaha]

the code is lint-free in demo

I also, did a test on the master and its working fine!

[mdjermanovic]

Hi @Niels-NTG, thanks for the issue!

This is a bug in babel-eslint, I believe it is expected to be fixed in v11.0.0.

Related issue: babel/babel#10904

[jlchereau]

The following does not trigger the 'range' of null error:

const { location } = window;
const root = `${location.protocol}//${location.host}/`;

but the following does:

const { location } = window;
const schemes = {
    root: `${location.protocol}//${location.host}/`
};

Note: maybe this is a different issue

[Niels-NTG]

The following does not trigger the 'range' of null error:

const { location } = window;
const root = `${location.protocol}//${location.host}/`;

but the following does:

const { location } = window;
const schemes = {
    root: `${location.protocol}//${location.host}/`
};

Note: maybe this is a different issue

It seems very much related.
Changing this…

import(
    `locale/${LANGUAGE}/default.po`
).then((languagePo) => {
    window.i18n = new Jed(languagePo.default);
});

… to this makes the error disappear.

import(
    'locale/' + LANGUAGE + '/default.po'
).then((languagePo) => {
    window.i18n = new Jed(languagePo.default);
});

How to determine just based on your and my case what exactly is going wrong.

[kaicataldo]

Closing since this is a bug in babel-eslint.