tailwind-v3.spec.ts — vite Source File

Architecture documentation for tailwind-v3.spec.ts, a typescript file in the vite codebase. 2 imports, 0 dependents.

File typescript 2 imports

Entity Profile

Dependency Diagram

graph LR
  19648f45_f0ff_6c31_8b07_5cceee139cc5["tailwind-v3.spec.ts"]
  a340ba46_b2b7_3048_3bb3_6907a74c8464["vitest"]
  19648f45_f0ff_6c31_8b07_5cceee139cc5 --> a340ba46_b2b7_3048_3bb3_6907a74c8464
  d3fd5575_295b_d6be_24dd_62d277645dc9["~utils"]
  19648f45_f0ff_6c31_8b07_5cceee139cc5 --> d3fd5575_295b_d6be_24dd_62d277645dc9
  style 19648f45_f0ff_6c31_8b07_5cceee139cc5 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { expect, test } from 'vitest'
import { editFile, getColor, isServe, page, untilBrowserLogAfter } from '~utils'

test('should render', async () => {
  expect(await page.textContent('#pagetitle')).toBe('Page title')
})

test.runIf(isServe)('regenerate CSS and HMR (glob pattern)', async () => {
  const el = page.locator('#view1-text')
  expect(await getColor(el)).toBe('rgb(22, 163, 74)')

  await untilBrowserLogAfter(
    () =>
      editFile('src/views/view1.js', (code) =>
        code.replace('|view1|', '|view1 updated|'),
      ),
    [
      '[vite] css hot updated: /index.css',
      '[vite] hot updated: /src/views/view1.js via /src/main.js',
    ],
    false,
  )
  await expect.poll(() => el.textContent()).toMatch('|view1 updated|')

  await untilBrowserLogAfter(
    () =>
      editFile('src/views/view1.js', (code) =>
        code.replace('text-green-600', 'text-orange-600'),
      ),
    [
      '[vite] css hot updated: /index.css',
      '[vite] hot updated: /src/views/view1.js via /src/main.js',
    ],
    false,
  )
  await expect.poll(() => getColor(el)).toBe('rgb(234, 88, 12)')
})

test.runIf(isServe)(
  'same file duplicated in module graph (#4267)',
  async () => {
    const el = page.locator('#component1')
    expect(await getColor(el)).toBe('rgb(220, 38, 38)')

    // when duplicated, page reload happens
    await untilBrowserLogAfter(
      () =>
        editFile('src/components/component1.js', (code) =>
          code.replace('text-red-600', 'text-blue-600'),
        ),
      [
        '[vite] css hot updated: /index.css',
        '[vite] hot updated: /src/components/component1.js',
      ],
      false,
    )
    await expect.poll(() => getColor(el)).toBe('rgb(37, 99, 235)')
  },
)

test.runIf(isServe)('regenerate CSS and HMR (relative path)', async () => {
  const el = page.locator('#pagetitle')
  expect(await getColor(el)).toBe('rgb(124, 58, 237)')

  await untilBrowserLogAfter(
    () =>
      editFile('src/main.js', (code) =>
        code.replace('text-violet-600', 'text-cyan-600'),
      ),
    ['[vite] css hot updated: /index.css', '[vite] hot updated: /src/main.js'],
    false,
  )
  await expect.poll(() => getColor(el)).toBe('rgb(8, 145, 178)')
})

Dependencies

vitest
~utils

Source

View on GitHub

Frequently Asked Questions

What does tailwind-v3.spec.ts do?

tailwind-v3.spec.ts is a source file in the vite codebase, written in typescript.

What does tailwind-v3.spec.ts depend on?

tailwind-v3.spec.ts imports 2 module(s): vitest, ~utils.

Where is tailwind-v3.spec.ts in the architecture?

tailwind-v3.spec.ts is located at playground/tailwind-v3/__test__/tailwind-v3.spec.ts (directory: playground/tailwind-v3/__test__).

Analyze Your Own Codebase

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

Try Supermodel Free