Component Lacks Tailwind Styling When Injected Dynamically

[ntdgo]

Describe the bug

I am dynamically injecting a container component using the injectTailwind function. What I expect is that the dynamically created component displays with the Tailwind CSS styles (such as h-[300px], bg-slate-50, dark:bg-slate-900, etc.). What is actually happening is that the container renders without any Tailwind styling.

Reproduction

https://github.com/ntdgo/wxt-react-shadcn-tailwindcss-chrome-extension/blob/f13d3b5140a787d01c77240133e47b3ac0ce3c40/entrypoints/content/App.tsx#L56

Steps to reproduce

1. Run npm install followed by npm run dev to start the application in development mode.
2. Ensure that the DOM includes an element with the class .name so that injectTailwind can properly target its parent.
3. Observe that the dynamically injected container is added to the DOM.
4. Notice that the expected Tailwind styles are not applied to the container.

System Info

System:
    OS: Windows 11 10.0.26100
    CPU: (16) x64 Intel(R) Core(TM) i5-14400F
    Memory: 15.31 GB / 31.83 GB
  Binaries:
    Node: 22.14.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.9.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: 10.4.0 - ~\AppData\Roaming\npm\pnpm.CMD
  Browsers:
    Edge: Chromium (133.0.3065.59)
  npmPackages:
    wxt: ^0.17.0 => 0.17.12

Used Package Manager

npm

Validations

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.