/
test-tailwindcss.js
115 lines (98 loc) · 2.92 KB
/
test-tailwindcss.js
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
const test = require('ava')
const Tailwind = require('../src/generators/tailwindcss')
test('throws on compile error', async t => {
await t.throwsAsync(async () => {
await Tailwind.compile('.test {@apply inexistent;}', '<div class="test">Test</a>', {}, {})
}, {instanceOf: SyntaxError})
})
test('uses defaults if no config specified', async t => {
const css = await Tailwind.compile(
'@tailwind utilities;',
'<p class="xl:z-0"></p>',
{},
{env: 'production'}
)
t.not(css, undefined)
t.true(css.includes('.xl\\:z-0'))
})
test('uses css file provided in environment config', async t => {
const config = {
env: 'production',
build: {
tailwind: {
css: './test/stubs/main.css'
}
}
}
const css = await Tailwind.compile('', '<div class="text-center foo">test</div>', {}, config)
t.not(css, undefined)
t.true(css.includes('.text-center'))
t.true(css.includes('.foo'))
})
test('works with custom `content` sources', async t => {
const css = await Tailwind.compile(
'@tailwind utilities;',
'<div class="hidden"></div>',
{
content: ['./test/stubs/tailwind/*.*']
}
)
t.true(css.includes('.hidden'))
})
test('works with custom `files` sources', async t => {
const css = await Tailwind.compile(
'@tailwind utilities;',
'<div></div>',
{
content: {
files: ['./test/stubs/tailwind/*.*']
}
}
)
t.true(css.includes('.hidden'))
})
test('uses maizzle template path as content source', async t => {
const css = await Tailwind.compile(
'@tailwind utilities;',
'<div></div>',
{},
{
build: {
templates: {
source: './test/stubs/tailwind'
}
}
}
)
t.true(css.includes('.hidden'))
})
test('uses maizzle template path as content source (single file)', async t => {
const css = await Tailwind.compile(
'@tailwind utilities;',
'<div></div>',
{},
{
build: {
templates: {
source: './test/stubs/tailwind/content-source.html'
}
}
}
)
t.true(css.includes('.hidden'))
})
test('uses custom postcss plugins from the maizzle config', async t => {
const maizzleConfig = {
env: 'production',
build: {
postcss: {
plugins: [
require('autoprefixer')({overrideBrowserslist: ['> 0.1%']})
]
}
}
}
const css = await Tailwind.compile('.test {transform: scale(0.5)}', '<div class="test">Test</a>', {}, maizzleConfig)
t.not(css, undefined)
t.is(css.trim(), '.inline {display: inline !important} .table {display: table !important} .contents {display: contents !important} .truncate {overflow: hidden !important;text-overflow: ellipsis !important;white-space: nowrap !important} .uppercase {text-transform: uppercase !important} .lowercase {text-transform: lowercase !important} .capitalize {text-transform: capitalize !important} .test {-webkit-transform: scale(0.5);transform: scale(0.5)}')
})