diff --git a/packages/website/src/components/editor/LoadedEditor.tsx b/packages/website/src/components/editor/LoadedEditor.tsx
index 6dab67a39278..da02b4e9352d 100644
--- a/packages/website/src/components/editor/LoadedEditor.tsx
+++ b/packages/website/src/components/editor/LoadedEditor.tsx
@@ -13,7 +13,11 @@ import {
 } from '../lib/jsonSchema';
 import { parseTSConfig, tryParseEslintModule } from '../lib/parseConfig';
 import type { LintCodeAction } from '../linter/utils';
-import { parseLintResults, parseMarkers } from '../linter/utils';
+import {
+  createFileName,
+  parseLintResults,
+  parseMarkers,
+} from '../linter/utils';
 import type { TabType } from '../types';
 import { createProvideCodeActions } from './createProvideCodeActions';
 import type { CommonEditorProps } from './types';
@@ -89,7 +93,7 @@ export const LoadedEditor: React.FC<LoadedEditorProps> = ({
   }, [webLinter, sourceType]);
 
   useEffect(() => {
-    const newPath = `/input${fileType}`;
+    const newPath = createFileName(fileType);
     if (tabs.code.uri.path !== newPath) {
       const code = tabs.code.getValue();
       const newModel = monaco.editor.createModel(
@@ -240,7 +244,7 @@ export const LoadedEditor: React.FC<LoadedEditorProps> = ({
       system.watchFile('/.eslintrc', filename => {
         onChange({ eslintrc: system.readFile(filename) });
       }),
-      system.watchFile('/input.*', filename => {
+      system.watchFile('/{file,react}.*', filename => {
         onChange({ code: system.readFile(filename) });
       }),
     ];
diff --git a/packages/website/src/components/linter/bridge.ts b/packages/website/src/components/linter/bridge.ts
index a553b7d7f283..ef5892837ac8 100644
--- a/packages/website/src/components/linter/bridge.ts
+++ b/packages/website/src/components/linter/bridge.ts
@@ -4,7 +4,7 @@ import type * as ts from 'typescript';
 import { debounce } from '../lib/debounce';
 import type { ConfigModel } from '../types';
 import type { PlaygroundSystem } from './types';
-import { getPathRegExp } from './utils';
+import { createFileName, getPathRegExp } from './utils';
 
 export function createFileSystem(
   config: Pick<ConfigModel, 'code' | 'eslintrc' | 'fileType' | 'tsconfig'>,
@@ -13,7 +13,7 @@ export function createFileSystem(
   const files = new Map<string, string>();
   files.set(`/.eslintrc`, config.eslintrc);
   files.set(`/tsconfig.json`, config.tsconfig);
-  files.set(`/input${config.fileType}`, config.code);
+  files.set(createFileName(config.fileType), config.code);
 
   const fileWatcherCallbacks = new Map<RegExp, Set<ts.FileWatcherCallback>>();
 
diff --git a/packages/website/src/components/linter/createLinter.ts b/packages/website/src/components/linter/createLinter.ts
index 9ce38ce032b3..770e5fb429f7 100644
--- a/packages/website/src/components/linter/createLinter.ts
+++ b/packages/website/src/components/linter/createLinter.ts
@@ -164,10 +164,10 @@ export function createLinter(
   };
 
   const triggerLintAll = (): void => {
-    system.searchFiles('/input.*').forEach(triggerLint);
+    system.searchFiles('/{file,react}.*').forEach(triggerLint);
   };
 
-  system.watchFile('/input.*', triggerLint);
+  system.watchFile('/{file,react}.*', triggerLint);
   system.watchFile('/.eslintrc', filename => {
     applyEslintConfig(filename);
     triggerLintAll();
diff --git a/packages/website/src/components/linter/createParser.ts b/packages/website/src/components/linter/createParser.ts
index c8348c77da87..6848dea658c5 100644
--- a/packages/website/src/components/linter/createParser.ts
+++ b/packages/website/src/components/linter/createParser.ts
@@ -10,6 +10,7 @@ import type {
   UpdateModel,
   WebLinterModule,
 } from './types';
+import { createFileName } from './utils';
 
 export function createParser(
   system: PlaygroundSystem,
@@ -43,7 +44,7 @@ export function createParser(
       text: string,
       options: ParserOptions = {},
     ): Parser.ParseResult => {
-      const filePath = options.filePath ?? '/input.ts';
+      const filePath = options.filePath ?? createFileName('.ts');
 
       // if text is empty use empty line to avoid error
       const code = text || '\n';
diff --git a/packages/website/src/components/linter/utils.ts b/packages/website/src/components/linter/utils.ts
index 1d44a322bc4a..ea99c7cfee1a 100644
--- a/packages/website/src/components/linter/utils.ts
+++ b/packages/website/src/components/linter/utils.ts
@@ -48,6 +48,13 @@ export function createEditOperation(
   };
 }
 
+/**
+ * @see https://typescript-eslint.io/packages/rule-tester/#type-aware-testing
+ */
+export function createFileName(extension = '.ts'): string {
+  return `/${extension.endsWith('sx') ? 'react' : 'file'}.${extension}`;
+}
+
 function normalizeCode(code: Monaco.editor.IMarker['code']): {
   value: string;
   target?: string;