Tooltip not appearing with experimental class-regex if at least 2001 characters in file precede the class

[MichaelAllenWarner]

What version of VS Code are you using?

v1.81.1

What version of Tailwind CSS IntelliSense are you using?

v0.9.13

What version of Tailwind CSS are you using?

v3.3.3

What package manager are you using?

npm

What operating system are you using?

macOS

Tailwind config

(This isn't quite the full Tailwind config, for reasons that will become clear when you view the video below, but it's the substantial part of what you get by default with create-next-app.)

import type { Config } from "tailwindcss";

const config: Config = {
  content: [
    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      backgroundImage: {
        "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
        "gradient-conic":
          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
      },
    },
  },
  plugins: [],
};
export default config;

VS Code settings

{
  "[markdown]": {
    "editor.quickSuggestions": {
      "comments": "on",
      "strings": "on",
      "other": "on"
    }
  },
  "eslint.options": {
    "extensions": [".js", ".jsx", ".mdx", ".ts", ".tsx"]
  },
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "svelte",
    "mdx"
  ],
  "eslint.runtime": "node",
  "eslint.execArgv": ["--max_old_space_size=8192"],
  "editor.fontSize": 17,
  "editor.fontFamily": "'Victor Mono', 'Fira Code', Menlo, Monaco, 'Courier New', monospace",
  "editor.tabSize": 2,
  "editor.fontLigatures": true,
  "editor.fontWeight": "700",
  "editor.letterSpacing": 0.5,
  "workbench.colorTheme": "Boxy Ocean (dimmed bg)",
  "terminal.integrated.shell.osx": "/bin/zsh",
  "editor.renderWhitespace": "selection",
  "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": [
          // all comment types
          "comment",

          // true, false, null
          "constant.language",

          // import, from, export, default, return, if, for, break, continue, try, catch, finally,
          // throw, default, yield, await
          "keyword.control",

          // in, void, delete, instanceof
          "keyword.operator.expression",

          // debugger
          "keyword.other",

          // new
          "keyword.operator.new",

          // super, this, arguments
          "variable.language",

          // attributes in html, jsx, etc.
          "entity.other.attribute-name",

          // static, extends, async, private, public, implements
          // constructor, const, let, var, enum, class, function, interface
          // no explicit scopes for constructor, const, let, var
          // also no explicit scope for function without the arrow
          // therefore we enable all storage and explictly exclude the arrow in another scope
          "storage"

          // // no explicit scope for the eval keyword yet
          // // can be targeted with the scope below, but scope is too broad
          // "support.function",

          // // no explicit scope for the package keyword yet
          // // can be targeted with the scope below, but scope is too broad
          // "variable.other.readwrite",
        ],
        "settings": {
          "fontStyle": "italic"
        }
      },
      {
        "scope": [
          //following will be excluded from italics (VSCode has some defaults for italics)
          "invalid",
          "keyword.operator",
          "constant.numeric.css",
          "keyword.other.unit.px.css",
          "constant.numeric.decimal.js",
          "constant.numeric.json",
          "storage.type.function.arrow",
          "variable",
          "entity"
        ],
        "settings": {
          "fontStyle": ""
        }
      }
    ]
  },
  "explorer.sortOrder": "type",
  "workbench.fontAliasing": "antialiased",
  "new-fractal-folder.configFileFormat": "yml",
  "new-fractal-folder.customExtensions": "scss",
  "new-fractal-folder.fractalFileFormat": "twig",
  "new-fractal-folder.readmeFile": true,
  "colorize.languages": ["typescript", "javascript"],
  "php.suggest.basic": false,
  "files.associations": {
    "*.inc": "php"
  },
  "markdownlint.config": {
    "MD033": false
  },
  "scss.validate": false,
  "css.validate": false,
  "redhat.telemetry.enabled": false,
  "editor.bracketPairColorization.enabled": true,
  "twigcs.executablePath": "/Users/michaelwarner/.composer/vendor/friendsoftwig/twigcs/bin/twigcs",
  "twigcs.rulesetClass": "FriendsOfTwig\\Twigcs\\Ruleset\\Custom",
  "markdown.extension.italic.indicator": "_",
  "tailwindCSS.experimental.classRegex": [
    // so we can put `/* tw */ ` in front of a JS/TS string and get Tailwind Intellisense in custom spots
    "/\\* tw \\*/ '([^']*)",
    "/\\* tw \\*/ `([^`]*)",
    "/\\* tw \\*/ \"([^\"]*)",
    // these must go directly before a `{` (w/ space in between) and apply to strings until it hits a semi-colon (good for JS/TS if using semi-colons)
    ["/\\* tw \\*/ {([^;]*);", "'([^']*)'"],
    ["/\\* tw \\*/ {([^;]*);", "`([^']*)`"],
    ["/\\* tw \\*/ {([^;]*);", "\"([^\"]*)\""],
    // for Twig: these apply to strings until it hits a `}`
    ["{# tw #} ([^}]*)}", "'([^']*)'"],
    ["{# tw #} ([^}]*)}", "\"([^\"]*)\""]
  ],
  "explorer.confirmUndo": "verbose",
  "emmet.includeLanguages": {
    "twig": "html"
  },
  "mdx.experimentalLanguageServer": true,
  "diffEditor.ignoreTrimWhitespace": false,
  "json.schemas": [],
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "svelte.enable-ts-plugin": true,
  "[svelte]": {
    "editor.defaultFormatter": "svelte.svelte-vscode"
  },
}

Reproduction URL

https://github.com/MichaelAllenWarner/tailwind-intellisense-config-file-demo

(I've included a setting in my .vscode/settings.json file that I think will make my experimental class-regex work for you if you view the Tailwind config file in VS Code, but I've also included my global VS Code settings above as requested.)

Describe your issue

When using experimental class-regex, it seems that tooltips no longer work if there are at least 2001 characters in the file that precede the class. I'm not sure if that's the entirety of what's going on, but I'm seeing this sort of behavior. The video below shows what I mean, and maybe you can reproduce this behavior when you view the repo in VS Code.

I'd guess it might have something to do with this PR: https://github.com/tailwindlabs/tailwindcss-intellisense/pull/840

https://github.com/tailwindlabs/tailwindcss-intellisense/assets/44578578/efd413a8-2672-4caf-ad7d-b0228ff9a64d

[MichaelAllenWarner]

To clarify: until very recently, this was working no matter how far into a file I was. And even now, everything else works just fine regardless of depth (autocomplete, color-squares); I think it's only the tooltip that's the problem.

[bradlc]

Hey @MichaelAllenWarner, this was previously fixed in #846, and upgrading to the latest version of the extension (v0.10.0) should resolve the issue 👍 (There may be a slight delay in this version being available.)