test: apply prefix

This commit is contained in:
zernonia 2024-03-05 11:58:36 +08:00
parent 62e6dc978a
commit 8496ae44bd
3 changed files with 46 additions and 3 deletions

View File

@ -24,6 +24,7 @@ export default antfu(
'no-tabs': 0, 'no-tabs': 0,
'import/first': 0, 'import/first': 0,
'node/prefer-global/process': 0, 'node/prefer-global/process': 0,
'style/no-tabs': 0,
}, },
}, },
) )

View File

@ -1,4 +1,4 @@
import { describe, expect, test } from 'vitest' import { describe, expect, it } from 'vitest'
import { import {
applyColorMapping, applyColorMapping,
@ -7,7 +7,7 @@ import {
import baseColor from '../fixtures/colors/slate.json' import baseColor from '../fixtures/colors/slate.json'
describe('split class', () => { describe('split class', () => {
test.each([ it.each([
{ {
input: 'bg-popover', input: 'bg-popover',
output: [null, 'bg-popover', null], output: [null, 'bg-popover', null],
@ -50,7 +50,7 @@ describe('split class', () => {
}) })
describe('apply color mapping', async () => { describe('apply color mapping', async () => {
test.each([ it.each([
{ {
input: 'bg-background text-foreground', input: 'bg-background text-foreground',
output: 'bg-white text-slate-950 dark:bg-slate-950 dark:text-slate-50', output: 'bg-white text-slate-950 dark:bg-slate-950 dark:text-slate-50',

View File

@ -0,0 +1,42 @@
import { describe, expect, it } from 'vitest'
import { applyPrefix } from '../../src/utils/transformers/transform-tw-prefix'
describe('apply tailwind prefix', () => {
it.each([
{
input: 'bg-slate-800 text-gray-500',
output: 'tw-bg-slate-800 tw-text-gray-500',
},
{
input: 'hover:dark:bg-background dark:text-foreground',
output: 'hover:dark:tw-bg-background dark:tw-text-foreground',
},
{
input:
'rounded-lg border border-slate-200 bg-white text-slate-950 shadow-sm dark:border-slate-800 dark:bg-slate-950 dark:text-slate-50',
output:
'tw-rounded-lg tw-border tw-border-slate-200 tw-bg-white tw-text-slate-950 tw-shadow-sm dark:tw-border-slate-800 dark:tw-bg-slate-950 dark:tw-text-slate-50',
},
{
input:
'text-red-500 border-red-500/50 dark:border-red-500 [&>svg]:text-red-500 text-red-500 dark:text-red-900 dark:border-red-900/50 dark:dark:border-red-900 dark:[&>svg]:text-red-900 dark:text-red-900',
output:
'tw-text-red-500 tw-border-red-500/50 dark:tw-border-red-500 [&>svg]:tw-text-red-500 tw-text-red-500 dark:tw-text-red-900 dark:tw-border-red-900/50 dark:dark:tw-border-red-900 dark:[&>svg]:tw-text-red-900 dark:tw-text-red-900',
},
{
input:
'flex h-full w-full items-center justify-center rounded-full bg-muted',
output:
'tw-flex tw-h-full tw-w-full tw-items-center tw-justify-center tw-rounded-full tw-bg-muted',
},
{
input:
'absolute right-4 top-4 bg-primary rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary',
output:
'tw-absolute tw-right-4 tw-top-4 tw-bg-primary tw-rounded-sm tw-opacity-70 tw-ring-offset-background tw-transition-opacity hover:tw-opacity-100 focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-ring focus:tw-ring-offset-2 disabled:tw-pointer-events-none data-[state=open]:tw-bg-secondary',
},
])(`applyTwPrefix($input) -> $output`, ({ input, output }) => {
expect(applyPrefix(input, 'tw-')).toBe(output)
})
})