search

Lombiq / NodeJs-Extensions

Utilities and extensions for Node.js, used in ASP.NET (Core) MVC and Orchard (Core) CMS development.
BSD 3-Clause "New" or "Revised" License
8 stars 2 forks source link

Use ESLint to lint JavaScript code blocks inside .cshtml (OSOE-585) #9

Open 0liver opened 2 years ago

0liver commented 2 years ago

Linting external JavaScript files is great, but let's also cover inline script as it's still widely used.

The html plugin already supports inline <script> block in html files - maybe it's enough to add .cshtml to the list of html extensions? Maybe not.

Let's try it out!

Jira issue

sarahelsaig commented 2 years ago

I think you will get syntax errors from the Razor. Copy a script block into a JS file first to check what can you expect before investing time setting up the plugin,

0liver commented 2 years ago

What do you mean by this:

Copy a script block into a JS file first to check what can you expect

?

sarahelsaig commented 2 years ago

What I wrote in the previous sentence. :) I expect that you will get syntax errors in the script block if you treat cshtml as html. You can verify it by just taking the content of the script block and putting it into a JS file and running ESLint on it.

Also see razor-vue-lint. It doesn't seem to be maintained, but the readme shows an attempt at wrapping Razor syntax for ESLint.

0liver commented 2 years ago

Oh, I totally forgot about code inside of script blocks, too - that'd be tricky to work around.

Piedone commented 2 years ago

Due to C# and JS being mixed, this would indeed be tricky. I think we can't realistically tackle this, rather, we should focus on having as little inline JS as possible. Serious issues also impacting runtime will then be surfaced during UI tests.

sarahelsaig commented 2 years ago

Perhaps the html eslint plugin could be invoked by the UI test like we do with html-validate?

Piedone commented 2 years ago

Hmm, interesting, yeah, we could do that, I guess.