Use last detected JSX import source pragma as canonical source, rather than first (#43351)

This commit is contained in:
Wesley Wigham 2021-03-23 18:02:37 -07:00 committed by GitHub
parent 04205ca32c
commit fb60c9f46e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 118 additions and 1 deletions

View File

@ -6054,7 +6054,7 @@ namespace ts {
export function getJSXImplicitImportBase(compilerOptions: CompilerOptions, file?: SourceFile): string | undefined {
const jsxImportSourcePragmas = file?.pragmas.get("jsximportsource");
const jsxImportSourcePragma = isArray(jsxImportSourcePragmas) ? jsxImportSourcePragmas[0] : jsxImportSourcePragmas;
const jsxImportSourcePragma = isArray(jsxImportSourcePragmas) ? jsxImportSourcePragmas[jsxImportSourcePragmas.length - 1] : jsxImportSourcePragmas;
return compilerOptions.jsx === JsxEmit.ReactJSX ||
compilerOptions.jsx === JsxEmit.ReactJSXDev ||
compilerOptions.jsxImportSource ||

View File

@ -0,0 +1,26 @@
tests/cases/compiler/jsxImportSourceNonPragmaComment.tsx(3,21): error TS2307: Cannot find module '@emotion/react' or its corresponding type declarations.
tests/cases/compiler/jsxImportSourceNonPragmaComment.tsx(7,5): error TS2307: Cannot find module '@emotion/react/jsx-runtime' or its corresponding type declarations.
==== tests/cases/compiler/jsxImportSourceNonPragmaComment.tsx (2 errors) ====
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
import { css } from "@emotion/react";
~~~~~~~~~~~~~~~~
!!! error TS2307: Cannot find module '@emotion/react' or its corresponding type declarations.
export default function Component() {
return (
<input
~~~~~~
css={css`
~~~~~~~~~~~~~~~
color: red;
~~~~~~~~~~~~~~~~~~~
`}
~~~~~~~~
/>
~~~~~~
!!! error TS2307: Cannot find module '@emotion/react/jsx-runtime' or its corresponding type declarations.
);
}

View File

@ -0,0 +1,30 @@
//// [jsxImportSourceNonPragmaComment.tsx]
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
import { css } from "@emotion/react";
export default function Component() {
return (
<input
css={css`
color: red;
`}
/>
);
}
//// [jsxImportSourceNonPragmaComment.jsx]
"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
exports.__esModule = true;
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
var react_1 = require("@emotion/react");
function Component() {
return (<input css={(0, react_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: red;\n "], ["\n color: red;\n "])))}/>);
}
exports["default"] = Component;
var templateObject_1;

View File

@ -0,0 +1,20 @@
=== tests/cases/compiler/jsxImportSourceNonPragmaComment.tsx ===
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
import { css } from "@emotion/react";
>css : Symbol(css, Decl(jsxImportSourceNonPragmaComment.tsx, 2, 8))
export default function Component() {
>Component : Symbol(Component, Decl(jsxImportSourceNonPragmaComment.tsx, 2, 37))
return (
<input
css={css`
>css : Symbol(css, Decl(jsxImportSourceNonPragmaComment.tsx, 6, 10))
>css : Symbol(css, Decl(jsxImportSourceNonPragmaComment.tsx, 2, 8))
color: red;
`}
/>
);
}

View File

@ -0,0 +1,27 @@
=== tests/cases/compiler/jsxImportSourceNonPragmaComment.tsx ===
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
import { css } from "@emotion/react";
>css : any
export default function Component() {
>Component : () => any
return (
>( <input css={css` color: red; `} /> ) : any
<input
><input css={css` color: red; `} /> : any
>input : any
css={css`
>css : any
>css` color: red; ` : any
>css : any
>` color: red; ` : "\n color: red;\n "
color: red;
`}
/>
);
}

View File

@ -0,0 +1,14 @@
// @jsx: preserve
/* eslint-disable react/react-in-jsx-scope -- Unaware of @jsxImportSource */
/** @jsxImportSource @emotion/react */
import { css } from "@emotion/react";
export default function Component() {
return (
<input
css={css`
color: red;
`}
/>
);
}