Add semantic behavior for import attributes in ambient module declarations

Implements module resolution and type checking to match imports with
attributes to ambient module declarations with matching attributes.

Changes:
- Added importAttributesMatch() helper to compare import attributes
- Added getImportAttributesFromLocation() to extract attributes from imports
- Updated tryFindAmbientModule() to check attribute matching for exact matches
- Updated resolveExternalModule() to check attribute matching for pattern matches
- Added comprehensive test coverage for all matching scenarios

Imports now properly resolve to ambient declarations only when attributes match:
- import x from 'foo.css' with { type: 'css' } matches declare module '*.css' with { type: 'css' }
- import x from 'foo.css' does NOT match declare module '*.css' with { type: 'css' }
- Mismatched, missing, or extra attributes result in no match (type: any)

Author: jonathantneal

src/compiler/checker.ts

@@ -4705,14 +4705,34 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
             : undefined;
     }
 
+    function getImportAttributesFromLocation(location: Node): ImportAttributes | undefined {
+        // Try to find import attributes from the location node
+        const importDecl = findAncestor(location, isImportDeclaration);
+        if (importDecl?.attributes) {
+            return importDecl.attributes;
+        }
+        const exportDecl = findAncestor(location, isExportDeclaration);
+        if (exportDecl?.attributes) {
+            return exportDecl.attributes;
+        }
+        const importType = findAncestor(location, isImportTypeNode);
+        if (importType?.attributes) {
+            return importType.attributes;
+        }
+        return undefined;
+    }
+
     function resolveExternalModule(location: Node, moduleReference: string, moduleNotFoundError: DiagnosticMessage | undefined, errorNode: Node | undefined, isForAugmentation = false): Symbol | undefined {
         if (errorNode && startsWith(moduleReference, "@types/")) {
             const diag = Diagnostics.Cannot_import_type_declaration_files_Consider_importing_0_instead_of_1;
             const withoutAtTypePrefix = removePrefix(moduleReference, "@types/");
             error(errorNode, diag, withoutAtTypePrefix, moduleReference);
         }
 
-        const ambientModule = tryFindAmbientModule(moduleReference, /*withAugmentations*/ true);
+        // Get import attributes from the import/export statement
+        const importAttributes = getImportAttributesFromLocation(location);
+
+        const ambientModule = tryFindAmbientModule(moduleReference, /*withAugmentations*/ true, importAttributes);
         if (ambientModule) {
             return ambientModule;
         }
@@ -4845,6 +4865,20 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
         if (patternAmbientModules) {
             const pattern = findBestPatternMatch(patternAmbientModules, _ => _.pattern, moduleReference);
             if (pattern) {
+                // Check if the pattern module has matching import attributes
+                const patternSymbol = pattern.symbol;
+                if (patternSymbol.declarations) {
+                    const hasMatchingDeclaration = patternSymbol.declarations.some(decl => {
+                        if (isModuleDeclaration(decl) && isStringLiteral(decl.name)) {
+                            return importAttributesMatch(importAttributes, decl.withClause);
+                        }
+                        return false;
+                    });
+                    if (!hasMatchingDeclaration) {
+                        // Pattern matched but attributes don't match - continue searching
+                        return undefined;
+                    }
+                }
                 // If the module reference matched a pattern ambient module ('*.foo') but there's also a
                 // module augmentation by the specific name requested ('a.foo'), we store the merged symbol
                 // by the augmentation name ('a.foo'), because asking for *.foo should not give you exports
@@ -16010,11 +16044,61 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
         return result;
     }
 
-    function tryFindAmbientModule(moduleName: string, withAugmentations: boolean) {
+    function importAttributesMatch(importAttributes: ImportAttributes | undefined, moduleAttributes: ImportAttributes | undefined): boolean {
+        // If neither has attributes, they match
+        if (!importAttributes && !moduleAttributes) {
+            return true;
+        }
+        // If only one has attributes, they don't match
+        if (!importAttributes || !moduleAttributes) {
+            return false;
+        }
+        // Both have attributes - check if they match
+        // For now, we require exact match of all attributes
+        if (importAttributes.elements.length !== moduleAttributes.elements.length) {
+            return false;
+        }
+        // Create a map of module attributes for easier lookup
+        const moduleAttrsMap = new Map<string, string>();
+        for (const attr of moduleAttributes.elements) {
+            const name = isIdentifier(attr.name) ? idText(attr.name) : attr.name.text;
+            const value = isStringLiteral(attr.value) ? attr.value.text : undefined;
+            if (value !== undefined) {
+                moduleAttrsMap.set(name, value);
+            }
+        }
+        // Check that all import attributes match
+        for (const attr of importAttributes.elements) {
+            const name = isIdentifier(attr.name) ? idText(attr.name) : attr.name.text;
+            const value = isStringLiteral(attr.value) ? attr.value.text : undefined;
+            if (value === undefined || moduleAttrsMap.get(name) !== value) {
+                return false;
+            }
+        }
+        return true;
+    }
+
+    function tryFindAmbientModule(moduleName: string, withAugmentations: boolean, importAttributes?: ImportAttributes) {
         if (isExternalModuleNameRelative(moduleName)) {
             return undefined;
         }
         const symbol = getSymbol(globals, '"' + moduleName + '"' as __String, SymbolFlags.ValueModule);
+        if (!symbol) {
+            return undefined;
+        }
+        // Check if the module declaration has matching import attributes
+        const declarations = symbol.declarations;
+        if (declarations) {
+            const hasMatchingDeclaration = declarations.some(decl => {
+                if (isModuleDeclaration(decl) && isStringLiteral(decl.name)) {
+                    return importAttributesMatch(importAttributes, decl.withClause);
+                }
+                return false;
+            });
+            if (!hasMatchingDeclaration) {
+                return undefined;
+            }
+        }
         // merged symbol is module declaration symbol combined with all augmentations
         return symbol && withAugmentations ? getMergedSymbol(symbol) : symbol;
     }

tests/baselines/reference/ambientModuleWithImportAttributesSemantics.errors.txt

@@ -0,0 +1,86 @@
+test.ts(2,33): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(6,30): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(14,38): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(18,31): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(26,35): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(30,40): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+test.ts(34,40): error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+
+
+==== types.d.ts (0 errors) ====
+    // Test exact match with attributes
+    declare module "*.css" with { type: "css" } {
+        const stylesheet: CSSStyleSheet;
+        export default stylesheet;
+    }
+    
+    // Test exact match with different attributes
+    declare module "*.json" with { type: "json" } {
+        const data: any;
+        export default data;
+    }
+    
+    // Test exact match without attributes
+    declare module "*.txt" {
+        const content: string;
+        export default content;
+    }
+    
+    // Test multiple attributes
+    declare module "*.wasm" with { type: "module", version: "1" } {
+        const module: WebAssembly.Module;
+        export default module;
+    }
+    
+==== test.ts (7 errors) ====
+    // Should resolve correctly - matching attributes
+    import styles from "styles.css" with { type: "css" };
+                                    ~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    styles; // Should be CSSStyleSheet
+    
+    // Should resolve correctly - matching attributes
+    import data from "data.json" with { type: "json" };
+                                 ~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    data; // Should be any
+    
+    // Should resolve correctly - no attributes on either side
+    import text from "file.txt";
+    text; // Should be string
+    
+    // Should resolve correctly - multiple matching attributes
+    import wasmModule from "module.wasm" with { type: "module", version: "1" };
+                                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    wasmModule; // Should be WebAssembly.Module
+    
+    // Should NOT resolve - import has attributes but declaration doesn't
+    import text2 from "file2.txt" with { type: "text" };
+                                  ~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    text2; // Should be any (no match)
+    
+    // Should NOT resolve - import has no attributes but declaration does
+    import styles2 from "styles2.css";
+    styles2; // Should be any (no match)
+    
+    // Should NOT resolve - mismatched attribute values
+    import styles3 from "styles3.css" with { type: "style" };
+                                      ~~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    styles3; // Should be any (no match)
+    
+    // Should NOT resolve - missing attribute
+    import wasmModule2 from "module2.wasm" with { type: "module" };
+                                           ~~~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    wasmModule2; // Should be any (no match - missing version attribute)
+    
+    // Should NOT resolve - extra attribute
+    import wasmModule3 from "module3.wasm" with { type: "module", version: "1", extra: "value" };
+                                           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+!!! error TS2856: Import attributes are not allowed on statements that compile to CommonJS 'require' calls.
+    wasmModule3; // Should be any (no match - extra attribute)
+    
+    

tests/baselines/reference/ambientModuleWithImportAttributesSemantics.js

@@ -0,0 +1,99 @@
+//// [tests/cases/conformance/ambient/ambientModuleWithImportAttributesSemantics.ts] ////
+
+//// [types.d.ts]
+// Test exact match with attributes
+declare module "*.css" with { type: "css" } {
+    const stylesheet: CSSStyleSheet;
+    export default stylesheet;
+}
+
+// Test exact match with different attributes
+declare module "*.json" with { type: "json" } {
+    const data: any;
+    export default data;
+}
+
+// Test exact match without attributes
+declare module "*.txt" {
+    const content: string;
+    export default content;
+}
+
+// Test multiple attributes
+declare module "*.wasm" with { type: "module", version: "1" } {
+    const module: WebAssembly.Module;
+    export default module;
+}
+
+//// [test.ts]
+// Should resolve correctly - matching attributes
+import styles from "styles.css" with { type: "css" };
+styles; // Should be CSSStyleSheet
+
+// Should resolve correctly - matching attributes
+import data from "data.json" with { type: "json" };
+data; // Should be any
+
+// Should resolve correctly - no attributes on either side
+import text from "file.txt";
+text; // Should be string
+
+// Should resolve correctly - multiple matching attributes
+import wasmModule from "module.wasm" with { type: "module", version: "1" };
+wasmModule; // Should be WebAssembly.Module
+
+// Should NOT resolve - import has attributes but declaration doesn't
+import text2 from "file2.txt" with { type: "text" };
+text2; // Should be any (no match)
+
+// Should NOT resolve - import has no attributes but declaration does
+import styles2 from "styles2.css";
+styles2; // Should be any (no match)
+
+// Should NOT resolve - mismatched attribute values
+import styles3 from "styles3.css" with { type: "style" };
+styles3; // Should be any (no match)
+
+// Should NOT resolve - missing attribute
+import wasmModule2 from "module2.wasm" with { type: "module" };
+wasmModule2; // Should be any (no match - missing version attribute)
+
+// Should NOT resolve - extra attribute
+import wasmModule3 from "module3.wasm" with { type: "module", version: "1", extra: "value" };
+wasmModule3; // Should be any (no match - extra attribute)
+
+
+
+//// [test.js]
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+// Should resolve correctly - matching attributes
+const styles_css_1 = __importDefault(require("styles.css"));
+styles_css_1.default; // Should be CSSStyleSheet
+// Should resolve correctly - matching attributes
+const data_json_1 = __importDefault(require("data.json"));
+data_json_1.default; // Should be any
+// Should resolve correctly - no attributes on either side
+const file_txt_1 = __importDefault(require("file.txt"));
+file_txt_1.default; // Should be string
+// Should resolve correctly - multiple matching attributes
+const module_wasm_1 = __importDefault(require("module.wasm"));
+module_wasm_1.default; // Should be WebAssembly.Module
+// Should NOT resolve - import has attributes but declaration doesn't
+const file2_txt_1 = __importDefault(require("file2.txt"));
+file2_txt_1.default; // Should be any (no match)
+// Should NOT resolve - import has no attributes but declaration does
+const styles2_css_1 = __importDefault(require("styles2.css"));
+styles2_css_1.default; // Should be any (no match)
+// Should NOT resolve - mismatched attribute values
+const styles3_css_1 = __importDefault(require("styles3.css"));
+styles3_css_1.default; // Should be any (no match)
+// Should NOT resolve - missing attribute
+const module2_wasm_1 = __importDefault(require("module2.wasm"));
+module2_wasm_1.default; // Should be any (no match - missing version attribute)
+// Should NOT resolve - extra attribute
+const module3_wasm_1 = __importDefault(require("module3.wasm"));
+module3_wasm_1.default; // Should be any (no match - extra attribute)