tailwindcss Architecture Docs
Home / File/ variants.test.ts — tailwindcss Source File

variants.test.ts — tailwindcss Source File

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

File typescript OxideEngine 10 imports

Entity Profile

Dependency Diagram

graph LR
  5c5675ef_1831_5c03_8e4e_28a1c231e987["variants.test.ts"]
  fda9325c_b5ff_9f58_5fbb_98511cb0b478["plugin.ts"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> fda9325c_b5ff_9f58_5fbb_98511cb0b478
  34e5c339_8af8_7d45_d2bf_6dcdb0abb21d["createPlugin"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 34e5c339_8af8_7d45_d2bf_6dcdb0abb21d
  cf14281b_29d9_c059_3148_2e2cc2fe19ae["run.ts"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> cf14281b_29d9_c059_3148_2e2cc2fe19ae
  4c014585_4ec9_378c_bc1a_9d4ad5c2708c["compileCss"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 4c014585_4ec9_378c_bc1a_9d4ad5c2708c
  613aea88_7231_059c_f480_39c6f1487e16["run"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 613aea88_7231_059c_f480_39c6f1487e16
  db9eae47_695c_23c3_68bd_bae5bb363efe["variants.ts"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> db9eae47_695c_23c3_68bd_bae5bb363efe
  992b3be6_9fa0_cf25_a4b2_ca0099247e78["Compounds"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 992b3be6_9fa0_cf25_a4b2_ca0099247e78
  759ab8d0_0e80_5789_e945_a5f814874e59["compoundsForSelectors"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 759ab8d0_0e80_5789_e945_a5f814874e59
  211db6bb_9759_d0cf_acda_36d7f5733ce2["dedent"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 211db6bb_9759_d0cf_acda_36d7f5733ce2
  696bd648_5f24_1b59_8e8b_7a97a692869e["vitest"]
  5c5675ef_1831_5c03_8e4e_28a1c231e987 --> 696bd648_5f24_1b59_8e8b_7a97a692869e
  style 5c5675ef_1831_5c03_8e4e_28a1c231e987 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import dedent from 'dedent'
import { expect, test } from 'vitest'
import createPlugin from './plugin'
import { compileCss, run } from './test-utils/run'
import { Compounds, compoundsForSelectors } from './variants'

const css = String.raw

test('*', async () => {
  expect(await run(['*:flex'])).toMatchInlineSnapshot(`
    ":is(.\\*\\:flex > *) {
      display: flex;
    }"
  `)
  expect(await run(['*/foo:flex'])).toEqual('')
})

test('**', async () => {
  expect(await run(['**:flex'])).toMatchInlineSnapshot(`
    ":is(.\\*\\*\\:flex *) {
      display: flex;
    }"
  `)
  expect(await run(['**/foo:flex'])).toEqual('')
})

test('first-letter', async () => {
  expect(await run(['first-letter:flex'])).toMatchInlineSnapshot(`
    ".first-letter\\:flex:first-letter {
      display: flex;
    }"
  `)
  expect(await run(['first-letter/foo:flex'])).toEqual('')
})

test('first-line', async () => {
  expect(await run(['first-line:flex'])).toMatchInlineSnapshot(`
    ".first-line\\:flex:first-line {
      display: flex;
    }"
  `)
  expect(await run(['first-line/foo:flex'])).toEqual('')
})

test('marker', async () => {
  expect(await run(['marker:flex'])).toMatchInlineSnapshot(`
    ".marker\\:flex ::marker {
      display: flex;
    }

    .marker\\:flex::marker {
      display: flex;
    }

    .marker\\:flex ::-webkit-details-marker {
      display: flex;
    }

    .marker\\:flex::-webkit-details-marker {
      display: flex;
// ... (2572 more lines)

Domain

Dependencies

Source

Frequently Asked Questions

What does variants.test.ts do?
variants.test.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the OxideEngine domain.
What does variants.test.ts depend on?
variants.test.ts imports 10 module(s): Compounds, compileCss, compoundsForSelectors, createPlugin, dedent, plugin.ts, run, run.ts, and 2 more.
Where is variants.test.ts in the architecture?
variants.test.ts is located at packages/tailwindcss/src/variants.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