Update ESLint to version 7.8+ for more optional chaining support in TM editor

[Eccenux]

I have this in code:

		let title = document.querySelector('#portaldetails .title')?.textContent;
		let url = document.querySelector('#portaldetails .linkdetails a')?.href;

Expected Behavior

Optional chaining should be permitted.

See also: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining

Actual Behavior

This brakes ESLint built in TM editor and also code highlighting goes funky... For example text in backticks never ends. See example script below.

Specifications

• Chrome: 86.0.4240.111 (same on Fox)
• TM: 4.11
• OS: Windows 10

Script

You can see an example code here:
https://github.com/Eccenux/iitc-plugin-fs-puzzle-helper/tree/master/my-plugin/dist

[spiralx]

There are a few related new operators that need support:

Optional chaining operator

obj.val?.prop
obj.val?.[expr]
obj.arr?.[index]
obj.func?.(args)

Null-ish coalescing operator

leftExpr ?? rightExpr

Logical assignment operators

expr1 &&= expr2 // AND
expr1 ||= expr2 // OR
expr1 ??= expr2 // null-ish coalescing

Also the new async loop syntax:

for await (variable of iterable) {
  statement
}

and the private field syntax for classes:

class ClassWithPrivateField {
  #privateField
}

class ClassWithPrivateMethod { 
  #privateMethod() { 
    return 'hello world'
  }
}

class ClassWithPrivateStaticField {
  static #PRIVATE_STATIC_FIELD
}

I think that's everything that's not supported in the current spec.

[derjanb]

All, except

expr1 &&= expr2 // AND

should work at the latest BETA version 4.12.6121.

[Dediggefedde]

Optional chaining seems to break indentation in general and highlighting when used in template-strings.

By changing el.thumb.coverImage to el.thumb?.coverImage in line 165 the following string template gets a bit crazy after ${ at starting/ending/escaping.

[derjanb]

@Dediggefedde What is the Tampermonkey version used for your test?

[Dediggefedde]

@derjanb
I have Tampermonkey v4.11.6120.
It looks the same in Firefox 84.0.1 and Chrome 87.0.4280.

A minimal example would be

function test() {
    document?.head;
    `asd${document.head}`;
    "asd";
}

Remove the ? and highlighting/indention seems fine. Execution with ? works without errors or warnings.

[derjanb]

All, except
expr1 &&= expr2 // AND
should work at the latest BETA version 4.12.6121.

You can get the beta version from here: https://www.tampermonkey.net/?browser=firefox