Error: The prop value with an expression type of TSAsExpression could not be resolved.

[JustFly1984]

I have my Gatsby.js project refactored to TypeScript, and while fixing my eslint config, and getting next error.

 options: {"typeRoots":["/Users/justfly/projects/agrarian-gatsby/node_modules/@types","/Users/justfly/projects/agrarian-gatsby/src/types"],"types":["classnames","jest","redux-debounced","credit-card-type","intl","graphql","node","node-fetch","qrcode.react","reach__router","react-dom","react-helmet","react-hot-loader","react-toastify","react-redux","recompose","redux-thunk","redux-actions","redux-debounced","redux-immutable","uniqid","webpack","webpack-env"],"target":1,"module":1,"lib":["lib.dom.d.ts","lib.es2017.d.ts"],"allowSyntheticDefaultImports":false,"esModuleInterop":false,"allowJs":false,"checkJs":false,"jsx":2,"strict":true,"declaration":false,"noUnusedLocals":true,"noUnusedParameters":true,"noImplicitReturns":false,"experimentalDecorators":true,"emitDecoratorMetadata":true,"strictNullChecks":true,"noEmit":true,"skipLibCheck":false,"noEmitOnError":true,"removeComments":true,"moduleResolution":2,"disableSizeLimit":true,"diagnostics":true,"alwaysStrict":true,"forceConsistentCasingInFileNames":true,"noErrorTruncation":true,"noFallthroughCasesInSwitch":true,"pretty":true,"noImplicitThis":true,"plugins":[{"name":"typescript-plugin-css-modules"},{"name":"css-module-types"}],"baseUrl":"/Users/justfly/projects/agrarian-gatsby/","paths":{"*":["tests/*","src/types/*","src/graphql/*"]},"allowNonTsExtensions":true,"configFilePath":"/Users/justfly/projects/agrarian-gatsby/tsconfig.json"}
Error: The prop value with an expression type of TSAsExpression could not be resolved.
  Please file issue to get this fixed immediately.
    at Object.extract [as JSXExpressionContainer] (/Users/justfly/projects/agrarian-gatsby/node_modules/jsx-ast-utils/lib/values/expressions/index.js:179:11)
    at getValue (/Users/justfly/projects/agrarian-gatsby/node_modules/jsx-ast-utils/lib/values/index.js:48:27)
    at extractValue (/Users/justfly/projects/agrarian-gatsby/node_modules/jsx-ast-utils/lib/getPropValue.js:24:12)
    at getPropValue (/Users/justfly/projects/agrarian-gatsby/node_modules/jsx-ast-utils/lib/getPropValue.js:41:10)
    at JSXOpeningElement (/Users/justfly/projects/agrarian-gatsby/node_modules/eslint-plugin-jsx-a11y/lib/rules/html-has-lang.js:37:50)
    at listeners.(anonymous function).forEach.listener (/Users/justfly/projects/agrarian-gatsby/node_modules/eslint/lib/util/safe-emitter.js:45:58)
    at Array.forEach (<anonymous>)
    at Object.emit (/Users/justfly/projects/agrarian-gatsby/node_modules/eslint/lib/util/safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (/Users/justfly/projects/agrarian-gatsby/node_modules/eslint/lib/util/node-event-generator.js:251:26)
    at NodeEventGenerator.applySelectors (/Users/justfly/projects/agrarian-gatsby/node_modules/eslint/lib/util/node-event-generator.js:280:22)

setting 'jsx-a11y/html-has-lang': 'off' in eslint config solved issue

[jessebeach]

Oy, yes. I think that jsx-ast-utils just needs to fail silently here. It's becoming way too disruptive.

@ljharb @evcohen given the profusion of new AST node types (especially with TypsScript in the mix), think the best way forward here is for jsx-ast-util and eslint-plugin-jsx-a11y to just fail silently on unknown AST node types. We can't keep up with the rate of introduction.

Rather than wait for jsx-eslint/jsx-ast-utils#77 to land, I'll just fix the projects with some defensive existence checks so that we don't disrupt the ecosystem with errors like this.

[ljharb]

I agree - it could still console.log the node type with a request to report an issue tho :-)

[jessebeach]

Still working on this. Maintaining support for Node 4 and 5 is making it very difficult and burning my time.

[TomasHubelbauer]

I ran into the same issue when trying to find ways to fix #580:

<a href={"#" as any /* https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/580 */}>link</a>

It would be cool to at least drop the project name in messages like this. I am using this plugin through CRA3 and I had to google the message to find out what project produces it so that I know where to file that issue. For me it was just a result of running npm start with CRA which makes it look like the issue is coming from CRA. Or the new issue link directly, even better.

[TomasHubelbauer]

I also don't know how to disable this. ESLint has this to say to using eslint-ignore-next-line in JSX:

{
  // eslint-disable-next-line
}
<a href="#">link</a>

Or this:

<a
  // eslint-disable-next-line
  href="#">link</a>

But neither works and I am not sure if this is due to the TSX AST parsing or not.

eslint/eslint#7030

The issue has since been silenced, please can you let me know if this is an issue with the AST parser here or not? If not, I will open a new issue with ESLint providing the above cases as reproes as they should work but don't.

[ljharb]

Since this is a parsing issue, there is no workaround but to completely disable the rule in your config.

The issue likely needs to be fixed in this plugin or in jsx-ast-utils, and it’s awaiting a PR to do so.

[jessebeach]

@JustFly1984 I'm flat out at work right now. I don't have time to address TSX parsing errors for at least another week. If you put up a PR, I'm glad to review.

[JacobSoderblom]

Hi!

Any updates on this issue? We are facing this issue now as well.. Is there anything I can help out with to solve this issue?

[jessebeach]

@TomasHubelbauer try an expression container around the comment

<a
  {// eslint-disable-next-line}
  href="#">link</a>

[jessebeach]

Fixed by updating to jsx-ast-utils@v2.2.1