tailwindcss/tests/space-utilities.test.js at master · aniediudo/tailwindcss · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
import { run, html, css, defaults } from './util/run'

test('space-x uses non-logical properties', () => {
  let config = {
    future: {
      logicalSiblingUtilities: false,
    },
    content: [{ raw: html`<div class="space-x-4"></div>` }],
    corePlugins: { preflight: false },
  }

  return run('@tailwind base; @tailwind utilities;', config).then((result) => {
    expect(result.css).toMatchFormattedCss(css`
      ${defaults}
      .space-x-4 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(1rem * var(--tw-space-x-reverse));
        margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
      }
    `)
  })
})

test('space-x uses logical properties', () => {
  let config = {
    future: {
      logicalSiblingUtilities: true,
    },
    content: [{ raw: html`<div class="space-x-4"></div>` }],
    corePlugins: { preflight: false },
  }

  return run('@tailwind base; @tailwind utilities;', config).then((result) => {
    expect(result.css).toMatchFormattedCss(css`
      ${defaults}
      .space-x-4 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-inline-start: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
        margin-inline-end: calc(1rem * var(--tw-space-x-reverse));
      }
    `)
  })
})