plugin.test.ts — tailwindcss Source File

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

File typescript OxideEngine 3 imports

Entity Profile

OxideEngine→ plugin.test.ts — tailwindcss Source File

Dependency Diagram

graph LR
  2dc0ab3a_ecb0_dc59_98ec_07930bd55ee8["plugin.test.ts"]
  fda9325c_b5ff_9f58_5fbb_98511cb0b478["plugin.ts"]
  2dc0ab3a_ecb0_dc59_98ec_07930bd55ee8 --> fda9325c_b5ff_9f58_5fbb_98511cb0b478
  696bd648_5f24_1b59_8e8b_7a97a692869e["vitest"]
  2dc0ab3a_ecb0_dc59_98ec_07930bd55ee8 --> 696bd648_5f24_1b59_8e8b_7a97a692869e
  901927f2_bc06_7bba_3b59_6521372af070["."]
  2dc0ab3a_ecb0_dc59_98ec_07930bd55ee8 --> 901927f2_bc06_7bba_3b59_6521372af070
  style 2dc0ab3a_ecb0_dc59_98ec_07930bd55ee8 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('plugin', async () => {
  let input = css`
    @plugin "my-plugin";
  `

  let compiler = await compile(input, {
    loadModule: async () => ({
      module: plugin(function ({ addBase }) {
        addBase({
          body: {
            margin: '0',
          },
        })
      }),
      base: '/root',
      path: '',
    }),
  })

  expect(compiler.build([])).toMatchInlineSnapshot(`
    "@layer base {
      body {
        margin: 0;
      }
    }
    "
  `)
})

test('plugin.withOptions', async () => {
  let input = css`
    @plugin "my-plugin";
  `

  let compiler = await compile(input, {
    loadModule: async () => ({
      module: plugin.withOptions(function (opts = { foo: '1px' }) {
        return function ({ addBase }) {
          addBase({
            body: {
              margin: opts.foo,
            },
          })
        }
      }),
      base: '/root',
      path: '',
    }),
  })

  expect(compiler.build([])).toMatchInlineSnapshot(`
    "@layer base {
      body {
        margin: 1px;
      }
    }
    "
  `)
})