Regression issue with React import when using `"jsx": "react"` compiler

[patrickracicot]

🔎 Search Terms

"verbatimModuleSyntax", "ts6133, "react", "jsx"

🕗 Version & Regression Information

• This changed between versions 5.4.5 and 5.5.3

⏯ Playground Link

https://www.typescriptlang.org/play/?noUnusedLocals=true&noUnusedParameters=true&target=7&verbatimModuleSyntax=true&isolatedModules=false&allowSyntheticDefaultImports=false#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4AocpAD0ljkwFcA7DYCZuAYV0maWYwAjAAoAlHADe5OHCIxGUTgB4AJsABucAPQA+CgF9yQA

💻 Code

import React from 'react';

export function Component1() {
  return <div />;
}

🙁 Actual behavior

When using "jsx": "react" in the compiler option, we are still required to import React in our components. Now with the version 5.5 of typescript doing such import in conjunction with verbatimModuleSyntax returns an unused import error because the code doesn't directly refer to the React import before its transpiled.

🙂 Expected behavior

This kind of import should not raise any errors as this is required for the code to work at runtime.

Additional information about the issue

No response

[jakebailey]

Bisects to #58366.

[jakebailey]

Notably, the new code there explicitly skips all reference marks in verbatimModuleSyntax, while the old code did this unconditionally for JSX (and other cases, it seems).