30 lines
1.7 KiB
JavaScript
30 lines
1.7 KiB
JavaScript
import assert from 'node:assert/strict'
|
|
import test from 'node:test'
|
|
import { build } from 'vite'
|
|
import { pathToFileURL } from 'node:url'
|
|
import path from 'node:path'
|
|
import React from 'react'
|
|
import { renderToStaticMarkup } from 'react-dom/server'
|
|
|
|
await build({ configFile: false, logLevel: 'silent', build: { outDir: '_local/theme-verification-test', emptyOutDir: false, lib: { entry: 'src/theme/verification-state.tsx', formats: ['es'], fileName: 'module' }, rolldownOptions: { external: id => !id.startsWith('.') && !path.isAbsolute(id) } } })
|
|
const { waitForThemeState, VerificationStyles } = await import(pathToFileURL(path.resolve('_local/theme-verification-test/module.js')).href)
|
|
|
|
test('Theme verification waits for the actual state, including asynchronous updates', async () => {
|
|
let ready = false, probes = 0
|
|
queueMicrotask(() => { ready = true })
|
|
await waitForThemeState(() => { probes++; return ready }, 'asynchronous Theme')
|
|
assert.ok(ready && probes >= 2)
|
|
})
|
|
|
|
test('Theme verification fails with a diagnostic when the state never becomes ready', async () => {
|
|
await assert.rejects(waitForThemeState(() => false, 'missing checked color'), /Theme state did not settle: missing checked color/)
|
|
})
|
|
|
|
test('Settled-target styles are limited to verification scope and define no Theme values', () => {
|
|
const css = renderToStaticMarkup(React.createElement(VerificationStyles)).replace(/<\/?style>/g, '')
|
|
assert.ok(css.split('{')[0].split(',').every(selector => selector.trim().startsWith('[data-hm-theme-verification]')))
|
|
assert.match(css, /transition-duration: 0s/)
|
|
assert.match(css, /transition-delay: 0s/)
|
|
assert.doesNotMatch(css, /background|color:|--hm-|:root/)
|
|
})
|