TypeScript: Untyped JS module is not assignable to type even though it satisfies it

🔎 Search Terms

Untyped JS module is not assignable to type even though it satisfies it, “Object literal may only specify known properties”

⏯ Playground Link

https://github.com/bradzacher/bug-repros/tree/ts-js-issue-huh

💻 Code

import eslintReact from 'eslint-plugin-react/configs/recommended.js';

(eslintReact satisfies {
  plugins: {
      react: {
          rules: any;
      };
  };
});

🙁 Actual behavior

There should be no errors because the type { plugins: { react: { deprecatedRules: any; rules: any; }; }; } is assignable to { plugins: { react: { rules: any; }; }; }

🙂 Expected behavior

Type '{ plugins: { react: { deprecatedRules: any; rules: any; }; }; rules: any; readonly languageOptions: any; } & { languageOptions: any; rules: { 'react/display-name': number; 'react/jsx-key': number; 'react/jsx-no-comment-textnodes': number; ... 18 more ...; 'react/require-render-return': number; }; }' does not satisfy the expected type '{ plugins: { react: { rules: any; }; }; }'.
  The types of 'plugins.react' are incompatible between these types.
    Object literal may only specify known properties, and 'deprecatedRules' does not exist in type '{ rules: any; }'

Additional information about the issue

This issue is particularly weird because it only occurs in a JS file!

For more context this is the original bug report https://github.com/typescript-eslint/typescript-eslint/issues/8522 And the original repro from the issue (the usecase we really want to fix): https://github.com/printfn/tseslint-react-repro

We have built support for ESLint flat configs via our typescript-eslint package and it exports a function to allow typechecking of the config array. So the repo looks like this

// @filename eslint.config.js


// @ts-check

import tseslint from 'typescript-eslint';
import eslintReact from 'eslint-plugin-react/configs/recommended.js';

export default tseslint.config(
	eslintReact, // type error is on this line
);

Best I can tell it looks like TS is treating the eslintReact variable the same way it would as an inline object expression - hence it’s erroring saying “too many properties”.