Home / File/ prefix.test.ts — tailwindcss Source File

prefix.test.ts — tailwindcss Source File

Architecture documentation for prefix.test.ts, a typescript file in the tailwindcss codebase. 3 imports, 0 dependents.

Entity Profile

Dependency Diagram

graph LR
  afce4fb6_fb22_67b5_d86d_4336c9d54b8e["prefix.test.ts"]
  fda9325c_b5ff_9f58_5fbb_98511cb0b478["plugin.ts"]
  afce4fb6_fb22_67b5_d86d_4336c9d54b8e --> fda9325c_b5ff_9f58_5fbb_98511cb0b478
  696bd648_5f24_1b59_8e8b_7a97a692869e["vitest"]
  afce4fb6_fb22_67b5_d86d_4336c9d54b8e --> 696bd648_5f24_1b59_8e8b_7a97a692869e
  901927f2_bc06_7bba_3b59_6521372af070["."]
  afce4fb6_fb22_67b5_d86d_4336c9d54b8e --> 901927f2_bc06_7bba_3b59_6521372af070
  style afce4fb6_fb22_67b5_d86d_4336c9d54b8e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { expect, test } from 'vitest'
import { compile } from '.'
import plugin from './plugin'

const css = String.raw

test('utilities must be prefixed', async () => {
  let input = css`
    @theme reference prefix(tw);
    @tailwind utilities;

    @utility custom {
      color: red;
    }
  `

  let compiler = await compile(input)

  // Prefixed utilities are generated
  expect(
    compiler.build([
      'tw:underline',
      'tw:hover:line-through',
      'tw:custom',
      'tw:group-hover:flex',
      'tw:peer-hover:flex',
    ]),
  ).toMatchInlineSnapshot(`
    ".tw\\:custom {
      color: red;
    }
    .tw\\:underline {
      text-decoration-line: underline;
    }
    .tw\\:group-hover\\:flex {
      &:is(:where(.tw\\:group):hover *) {
        @media (hover: hover) {
          display: flex;
        }
      }
    }
    .tw\\:peer-hover\\:flex {
      &:is(:where(.tw\\:peer):hover ~ *) {
        @media (hover: hover) {
          display: flex;
        }
      }
    }
    .tw\\:hover\\:line-through {
      &:hover {
        @media (hover: hover) {
          text-decoration-line: line-through;
        }
      }
    }
    "
  `)

  // Non-prefixed utilities are ignored
  compiler = await compile(input)
// ... (301 more lines)

Domain

Dependencies

Frequently Asked Questions

What does prefix.test.ts do?
prefix.test.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the OxideEngine domain.
What does prefix.test.ts depend on?
prefix.test.ts imports 3 module(s): ., plugin.ts, vitest.
Where is prefix.test.ts in the architecture?
prefix.test.ts is located at packages/tailwindcss/src/prefix.test.ts (domain: OxideEngine, directory: packages/tailwindcss/src).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free