Improve error message when compiling a .js file (#34861)

* Improve error message when compiling a .js file

* Add dedicated error message for .json and .js files

* Update missing baseline tests

* Remove error hint for .json files

src/compiler/diagnosticMessages.json

@@ -3478,7 +3478,7 @@
         "category": "Error",
         "code": 6053
     },
-    "File '{0}' has unsupported extension. The only supported extensions are {1}.": {
+    "File '{0}' has an unsupported extension. The only supported extensions are {1}.": {
         "category": "Error",
         "code": 6054
     },
@@ -4323,6 +4323,10 @@
         "category": "Message",
         "code": 6503
     },
+    "File '{0}' is a JavaScript file. Did you mean to enable the 'allowJs' option?": {
+        "category": "Error",
+        "code": 6504
+    },
 
     "Variable '{0}' implicitly has an '{1}' type.": {
         "category": "Error",

src/compiler/program.ts

@@ -2189,8 +2189,16 @@ namespace ts {
             refFile?: SourceFile): SourceFile | undefined {
 
             if (hasExtension(fileName)) {
-                if (!options.allowNonTsExtensions && !forEach(supportedExtensionsWithJsonIfResolveJsonModule, extension => fileExtensionIs(host.getCanonicalFileName(fileName), extension))) {
-                    if (fail) fail(Diagnostics.File_0_has_unsupported_extension_The_only_supported_extensions_are_1, fileName, "'" + supportedExtensions.join("', '") + "'");
+                const canonicalFileName = host.getCanonicalFileName(fileName);
+                if (!options.allowNonTsExtensions && !forEach(supportedExtensionsWithJsonIfResolveJsonModule, extension => fileExtensionIs(canonicalFileName, extension))) {
+                    if (fail) {
+                        if (hasJSFileExtension(canonicalFileName)) {
+                            fail(Diagnostics.File_0_is_a_JavaScript_file_Did_you_mean_to_enable_the_allowJs_option, fileName);
+                        }
+                        else {
+                            fail(Diagnostics.File_0_has_an_unsupported_extension_The_only_supported_extensions_are_1, fileName, "'" + supportedExtensions.join("', '") + "'");
+                        }
+                    }
                     return undefined;
                 }
 
@@ -2205,7 +2213,7 @@ namespace ts {
                             fail(Diagnostics.File_0_not_found, fileName);
                         }
                     }
-                    else if (refFile && host.getCanonicalFileName(fileName) === host.getCanonicalFileName(refFile.fileName)) {
+                    else if (refFile && canonicalFileName === host.getCanonicalFileName(refFile.fileName)) {
                         fail(Diagnostics.A_file_cannot_have_a_reference_to_itself);
                     }
                 }

tests/baselines/reference/checkJsFiles6.errors.txt

@@ -1,8 +1,8 @@
 error TS5052: Option 'checkJs' cannot be specified without specifying option 'allowJs'.
-error TS6054: File 'tests/cases/compiler/a.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6504: File 'tests/cases/compiler/a.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 
 
 !!! error TS5052: Option 'checkJs' cannot be specified without specifying option 'allowJs'.
-!!! error TS6054: File 'tests/cases/compiler/a.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6504: File 'tests/cases/compiler/a.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 ==== tests/cases/compiler/a.js (0 errors) ====
     var x;

tests/baselines/reference/jsFileCompilationWithMapFileAsJs.errors.txt

@@ -1,11 +1,11 @@
 error TS5055: Cannot write file 'tests/cases/compiler/b.js' because it would overwrite input file.
   Adding a tsconfig.json file will help organize projects that contain both TypeScript and JavaScript files. Learn more at https://aka.ms/tsconfig.
-error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
+error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
 
 
 !!! error TS5055: Cannot write file 'tests/cases/compiler/b.js' because it would overwrite input file.
 !!! error TS5055:   Adding a tsconfig.json file will help organize projects that contain both TypeScript and JavaScript files. Learn more at https://aka.ms/tsconfig.
-!!! error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
+!!! error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
 ==== tests/cases/compiler/a.ts (0 errors) ====
     class c {
     }

tests/baselines/reference/jsFileCompilationWithMapFileAsJsWithInlineSourceMap.errors.txt

@@ -1,11 +1,11 @@
 error TS5055: Cannot write file 'tests/cases/compiler/b.js' because it would overwrite input file.
   Adding a tsconfig.json file will help organize projects that contain both TypeScript and JavaScript files. Learn more at https://aka.ms/tsconfig.
-error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
+error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
 
 
 !!! error TS5055: Cannot write file 'tests/cases/compiler/b.js' because it would overwrite input file.
 !!! error TS5055:   Adding a tsconfig.json file will help organize projects that contain both TypeScript and JavaScript files. Learn more at https://aka.ms/tsconfig.
-!!! error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
+!!! error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts', '.js', '.jsx'.
 ==== tests/cases/compiler/a.ts (0 errors) ====
     class c {
     }

tests/baselines/reference/jsFileCompilationWithMapFileAsJsWithOutDir.errors.txt

@@ -1,9 +1,9 @@
-error TS6054: File 'tests/cases/compiler/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
-error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6504: File 'tests/cases/compiler/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 
 
-!!! error TS6054: File 'tests/cases/compiler/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
-!!! error TS6054: File 'tests/cases/compiler/b.js.map' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6054: File 'tests/cases/compiler/b.js.map' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6504: File 'tests/cases/compiler/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 ==== tests/cases/compiler/a.ts (0 errors) ====
     class c {
     }

tests/baselines/reference/jsFileCompilationWithoutJsExtensions.errors.txt

@@ -1,6 +1,6 @@
-error TS6054: File 'tests/cases/compiler/a.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6504: File 'tests/cases/compiler/a.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 
 
-!!! error TS6054: File 'tests/cases/compiler/a.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6504: File 'tests/cases/compiler/a.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 ==== tests/cases/compiler/a.js (0 errors) ====
     declare var v;

tests/baselines/reference/project/invalidRootFile/amd/invalidRootFile.errors.txt

@@ -1,6 +1,6 @@
 error TS6053: File 'a.ts' not found.
-error TS6054: File 'a.t' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6054: File 'a.t' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
 
 
 !!! error TS6053: File 'a.ts' not found.
-!!! error TS6054: File 'a.t' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6054: File 'a.t' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.

tests/baselines/reference/project/invalidRootFile/node/invalidRootFile.errors.txt

@@ -1,6 +1,6 @@
 error TS6053: File 'a.ts' not found.
-error TS6054: File 'a.t' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6054: File 'a.t' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
 
 
 !!! error TS6053: File 'a.ts' not found.
-!!! error TS6054: File 'a.t' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6054: File 'a.t' has an unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.

tests/baselines/reference/project/jsFileCompilationDifferentNamesSpecified/amd/jsFileCompilationDifferentNamesSpecified.errors.txt

@@ -1,7 +1,7 @@
-error TS6054: File 'DifferentNamesSpecified/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6504: File 'DifferentNamesSpecified/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 
 
-!!! error TS6054: File 'DifferentNamesSpecified/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6504: File 'DifferentNamesSpecified/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 ==== DifferentNamesSpecified/tsconfig.json (0 errors) ====
     {
       "compilerOptions": { "out": "test.js" },

tests/baselines/reference/project/jsFileCompilationDifferentNamesSpecified/node/jsFileCompilationDifferentNamesSpecified.errors.txt

@@ -1,8 +1,8 @@
-error TS6054: File 'DifferentNamesSpecified/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+error TS6504: File 'DifferentNamesSpecified/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 DifferentNamesSpecified/tsconfig.json(2,24): error TS6082: Only 'amd' and 'system' modules are supported alongside --out.
 
 
-!!! error TS6054: File 'DifferentNamesSpecified/b.js' has unsupported extension. The only supported extensions are '.ts', '.tsx', '.d.ts'.
+!!! error TS6504: File 'DifferentNamesSpecified/b.js' is a JavaScript file. Did you mean to enable the 'allowJs' option?
 ==== DifferentNamesSpecified/tsconfig.json (1 errors) ====
     {
       "compilerOptions": { "out": "test.js" },