typescript-eslint/typescript-eslintPublic

NotificationsYou must be signed in to change notification settings
Fork2.8k
Star15.7k

fix(website): acquired types are shown in the editor but not reflected in linting#11198

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Jump to bottom

Open

mdm317 wants to merge3 commits intotypescript-eslint:main

base:main

Choose a base branch

frommdm317:11120-acquired-types-not-in-linting

Open

fix(website): acquired types are shown in the editor but not reflected in linting#11198

mdm317 wants to merge3 commits intotypescript-eslint:mainfrommdm317:11120-acquired-types-not-in-linting

+31 −8

Conversation

Copy link

Contributor

mdm317 commentedMay 9, 2025•
edited
Loading

PR Checklist

Addresses an existing open issue:fixesBug(website): Acquired types are shown in the editor but not reflected in linting #11120
That issue was marked asaccepting prs
Steps inContributing were taken

Overview

I think this issue occurs because of differences in the properties used when creating a ts.Program between Monaco and TypeScript-VFS.

typescript-eslint/packages/website/src/components/linter/createParser.ts
Line 29 ine57126a
returnvfs.createVirtualTypeScriptEnvironment(

The modules likemonaco, [typescript]
(https://github.com/microsoft/TypeScript), andtypescript-website are scattered, so it’s a bit confusing

1. createts.program by monace

When monaco-editor creating this code will excutelink
private _languageService = ts.createLanguageService(this);

createLanguageService in typescript.link

const rootFileNames = host.getScriptFileNames().slice(); // some codeconst options: CreateProgramOptions = {  rootNames: rootFileNames,  options: newSettings,  host: compilerHost,   oldProgram: program,  projectReferences,};program = createProgram(options);

And filenames output bygetScriptFileNames will be added in the code below.
defaults.addExtraLib(code, path) intypescript-website =>defaults.addExtraLib(code, path) inmonaco

So, when creating a ts.Program, the rootNames array includes some libraries, such as Node or React.

2. createts.program by TypeScript-VFS.

typescript-eslint/packages/website/src/components/linter/createParser.ts
Lines 24 to 31 ine57126a
constregisteredFiles=newSet<string>();
constcreateEnv=(
compilerOptions:ts.CompilerOptions,
):tsvfs.VirtualTypeScriptEnvironment=>{
returnvfs.createVirtualTypeScriptEnvironment(
system,
[...registeredFiles],

Unlike case 1 above,We don't pass the name of a node_modules folder in fileNames.

In the sentence above, I modified it so that rootNames are provided when creating thets.Program for both the Editor and Linting

Testing

Click alink that already has code pre-filled.
Enter code in an empty playground

fix : add rootfile name when create program

529ce80

Copy link

Contributor

typescript-eslintbot commentedMay 9, 2025

Thanks for the PR,@mdm317!

typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community.

The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately.

Thanks again!

🙏Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint.

Copy link

netlifybot commentedMay 9, 2025•
edited
Loading

✅ Deploy Preview fortypescript-eslint ready!

Name	Link
🔨 Latest commit	`f9bd202`
🔍 Latest deploy log	https://app.netlify.com/projects/typescript-eslint/deploys/682da407195f0a00083babd7
😎 Deploy Preview	https://deploy-preview-11198--typescript-eslint.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 99 (🟢 up 1 from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 98 (no change from production) PWA: 80 (no change from production) View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to yourNetlify project configuration.

Copy link

nx-cloudbot commentedMay 9, 2025•
edited
Loading

View yourCI Pipeline Execution ↗ for commitf9bd202.

Command	Status	Duration	Result
`nx typecheck ast-spec`	✅ Succeeded	<1s	View ↗
`nx run-many -t build --exclude website website-...`	✅ Succeeded	3s	View ↗
`nx run-many -t clean --parallel=20`	✅ Succeeded	12s	View ↗

☁️Nx Cloud last updated this comment at2025-05-21 16:54:04 UTC

kirkwaiblinger changed the title~~fix(website): Acquired types are shown in the editor but not reflected in linting~~fix(website): acquired types are shown in the editor but not reflected in linting

May 9, 2025

fix : not including lib file and fix error

f5d9dfb

Copy link

codecovbot commentedMay 19, 2025•
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 90.92%. Comparing base(e57126a) to head(f9bd202).
Report is 20 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@##             main   #11198   +/-   ##=======================================  Coverage   90.91%   90.92%           =======================================  Files         499      499             Lines       50809    50847   +38       Branches     8369     8384   +15     =======================================+ Hits        46195    46233   +38  Misses       4599     4599             Partials       15       15

Flag	Coverage Δ
unittest	`90.92% <ø> (+<0.01%)`	⬆️

Flags with carried forward coverage won't be shown.Click here to find out more.

see 8 files with indirect coverage changes

🚀 New features to boost your workflow:

❄️Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

fix: make features work when code is written in an empty playground

f9bd202

mdm317 commented

May 21, 2025

View reviewed changes

packages/website/src/components/linter/bridge.ts


		system.getScriptFileNames = (): string[] => {
		return [...files.keys()]
		.filter(fileName => !fileName.startsWith('/lib.'))

Copy link

ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Lib files will be excluded from the Monaco Editor GitHub repository.monaco-editor

  const models = allModels.filter((uri) => !fileNameIsLib(uri)).map((uri) => uri.toString());

packages/website/src/components/linter/bridge.ts

		system.getScriptFileNames = (): string[] => {
		return [...files.keys()]
		.filter(fileName => !fileName.startsWith('/lib.'))
		.filter(f => !f.endsWith('/.eslintrc') && !f.endsWith('.json'));

Copy link

ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

These files cause an error in the code below.typescript-website

  if (diagnostics.length) {    const compilerHost = createVirtualCompilerHost(sys, compilerOptions, ts)    throw new Error(ts.formatDiagnostics(diagnostics, compilerHost.compilerHost))  }

packages/website/src/components/linter/createParser.ts

Comment on lines +110 to +112

		registerFile(filePath: string, code: string): void {
		compilerHost.createFile(filePath, code);
		},

Copy link

ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

We have to add library files usingcompilerHost.createFile, because adding them directly to thesystem doesn't make them appear ingetScriptFileNames, and thus they aren't included in therootNames when creating program.typescript-website

export function createVirtualLanguageServiceHost(  sys: System,  rootFiles: string[],  compilerOptions: CompilerOptions,  ts: TS,  customTransformers?: CustomTransformers) {  const fileNames = [...rootFiles]  ...somecode  const languageServiceHost: LanguageServiceHost = {    getScriptFileNames: () => fileNames.slice(),  }  ...somecode}

packages/website/src/components/linter/createLinter.ts

Comment on lines +169 to +172

		const registerFile = (fileName: string, code: string) => {
		parser.registerFile(fileName, code);
		triggerLintAll();
		};

Copy link

ContributorAuthor

mdm317May 21, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

We need this code to add the library and trigger linting after the parser is created, in case the user starts typing code in an empty playground.

mdm317 marked this pull request as ready for review

May 21, 2025 16:52

Labels

None yet

1 participant

	constregisteredFiles=newSet<string>();

	constcreateEnv=(
	compilerOptions:ts.CompilerOptions,
	):tsvfs.VirtualTypeScriptEnvironment=>{
	returnvfs.createVirtualTypeScriptEnvironment(
	system,
	[...registeredFiles],

Movatterモバイル変換

Uh oh!

fix(website): acquired types are shown in the editor but not reflected in linting#11198

Are you sure you want to change the base?

fix(website): acquired types are shown in the editor but not reflected in linting#11198

Conversation

mdm317 commentedMay 9, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

PR Checklist

Overview

Testing

Uh oh!

typescript-eslintbot commentedMay 9, 2025

Uh oh!

netlifybot commentedMay 9, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

✅ Deploy Preview fortypescript-eslint ready!

Uh oh!

nx-cloudbot commentedMay 9, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Uh oh!

codecovbot commentedMay 19, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Codecov Report

Uh oh!

mdm317May 21, 2025

Choose a reason for hiding this comment

Uh oh!

mdm317May 21, 2025

Choose a reason for hiding this comment

Uh oh!

mdm317May 21, 2025

Choose a reason for hiding this comment

Uh oh!

mdm317May 21, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

mdm317 commentedMay 9, 2025•
edited
Loading

netlifybot commentedMay 9, 2025•
edited
Loading

nx-cloudbot commentedMay 9, 2025•
edited
Loading

codecovbot commentedMay 19, 2025•
edited
Loading