diff --git a/packages/tailwindcss-language-server/tests/env/v4.test.js b/packages/tailwindcss-language-server/tests/env/v4.test.js index 56de119b..0375cf98 100644 --- a/packages/tailwindcss-language-server/tests/env/v4.test.js +++ b/packages/tailwindcss-language-server/tests/env/v4.test.js @@ -1,7 +1,7 @@ import { expect } from 'vitest' import { init } from '../common' import { HoverRequest } from 'vscode-languageserver' -import { css, defineTest, js, json } from '../../src/testing' +import { css, defineTest, html, js, json } from '../../src/testing' import dedent from 'dedent' import { CompletionRequest } from 'vscode-languageserver-protocol' @@ -529,3 +529,48 @@ defineTest({ }) }, }) + +defineTest({ + name: 'script + lang=tsx is treated as containing JSX', + fs: { + 'app.css': css` + @import 'tailwindcss'; + `, + }, + prepare: async ({ root }) => ({ c: await init(root) }), + handle: async ({ c }) => { + let document = await c.openDocument({ + lang: 'vue', + text: html` + + `, + }) + + let hover = await c.sendRequest(HoverRequest.type, { + textDocument: document, + + // return
+ // ^ + position: { line: 2, character: 24 }, + }) + + expect(hover).toEqual({ + contents: { + language: 'css', + value: dedent` + .bg-black { + background-color: var(--color-black) /* #000 = #000000 */; + } + `, + }, + range: { + start: { line: 2, character: 23 }, + end: { line: 2, character: 31 }, + }, + }) + }, +}) diff --git a/packages/tailwindcss-language-service/src/util/getLanguageBoundaries.ts b/packages/tailwindcss-language-service/src/util/getLanguageBoundaries.ts index 5aec503a..42a4a495 100644 --- a/packages/tailwindcss-language-service/src/util/getLanguageBoundaries.ts +++ b/packages/tailwindcss-language-service/src/util/getLanguageBoundaries.ts @@ -197,6 +197,14 @@ export function getLanguageBoundaries( boundaries.push({ type: defaultType, range: { start: position, end: undefined } }) } else if (token.type === 'lang') { boundaries[boundaries.length - 1].type = token.text + + if (token.text === 'tsx') { + boundaries[boundaries.length - 1].type = 'jsx' + boundaries[boundaries.length - 1].lang = 'tsx' + } else if (token.text === 'ts') { + boundaries[boundaries.length - 1].type = 'js' + boundaries[boundaries.length - 1].lang = 'ts' + } } else if (token.type === 'type' && htmlScriptTypes.includes(token.text)) { boundaries[boundaries.length - 1].type = 'html' } else if (token.type === 'type' && jsxScriptTypes.includes(token.text)) { diff --git a/packages/vscode-tailwindcss/CHANGELOG.md b/packages/vscode-tailwindcss/CHANGELOG.md index 090cb831..30a5cbf4 100644 --- a/packages/vscode-tailwindcss/CHANGELOG.md +++ b/packages/vscode-tailwindcss/CHANGELOG.md @@ -3,6 +3,7 @@ ## Prerelease - Ensure hover information for `theme(…)` and other functions are shown when used in `@media` queries ([#1172](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1172)) +- Treat `