mirror of
https://github.com/sky-systems/sky_phone.git
synced 2026-08-31 18:28:55 +00:00
Leon.Schmidt
acb71375ec
Override status-bar foregrounds for apps with intentionally fixed light or dark canvases so indicators stay readable in either system mode. Increase LocalPages light-theme accent contrast after the full app audit.
69 lines
2.5 KiB
TypeScript
69 lines
2.5 KiB
TypeScript
import { readFileSync } from 'node:fs'
|
|
|
|
import { describe, expect, it } from 'vitest'
|
|
|
|
const appSource = readFileSync(new URL('../App.vue', import.meta.url), 'utf8')
|
|
const kitchenSinkSource = readFileSync(
|
|
new URL('../views/development/SkyUiKitchenSinkView.vue', import.meta.url),
|
|
'utf8',
|
|
)
|
|
const indicatorsSource = readFileSync(
|
|
new URL('./PhoneStatusIndicators.vue', import.meta.url),
|
|
'utf8',
|
|
)
|
|
const styles = readFileSync(
|
|
new URL('../assets/main.css', import.meta.url),
|
|
'utf8',
|
|
)
|
|
|
|
describe('phone status bar theme contract', () => {
|
|
it('treats the Sky UI development catalog as app content', () => {
|
|
expect(appSource).toContain(
|
|
"'phone-screen--app': isAppRoute || isDevelopmentRoute",
|
|
)
|
|
})
|
|
|
|
it('keeps the Kitchen Sink toggle and phone shell on one theme source', () => {
|
|
expect(kitchenSinkSource).toMatch(
|
|
/const dark = computed\(\{[\s\S]*?get: \(\) => phone\.isDarkMode,[\s\S]*?phone\.setPreference\('appearanceMode', value \? 'dark' : 'light'\)/,
|
|
)
|
|
})
|
|
|
|
it('uses black in light app content and white in dark content', () => {
|
|
expect(styles).toMatch(/\.phone-status-bar\s*\{[^}]*color:\s*#fff;/s)
|
|
expect(styles).toMatch(
|
|
/\.phone-screen--app \.phone-app--light \.phone-status-bar\s*\{\s*color:\s*#000;/,
|
|
)
|
|
})
|
|
|
|
it('keeps status indicators legible on apps with fixed canvases', () => {
|
|
expect(appSource).toContain("'phone-app--status-light'")
|
|
expect(appSource).toContain("'phone-app--status-dark'")
|
|
expect(styles).toMatch(
|
|
/\.phone-screen--app \.phone-app--status-light \.phone-status-bar\s*\{[^}]*color:\s*#fff;/s,
|
|
)
|
|
expect(styles).toMatch(
|
|
/\.phone-screen--app \.phone-app--status-dark \.phone-status-bar\s*\{[^}]*color:\s*#111;/s,
|
|
)
|
|
})
|
|
|
|
it('keeps every status indicator bound to the inherited foreground', () => {
|
|
expect(indicatorsSource).toMatch(/<Plane[\s\S]*?fill="currentColor"/)
|
|
expect(indicatorsSource).toMatch(
|
|
/\.phone-status-indicators__signal\s*\{[^}]*fill:\s*currentColor;/s,
|
|
)
|
|
expect(indicatorsSource).toMatch(
|
|
/\.phone-status-indicators__wifi\s*\{[^}]*stroke:\s*currentColor;/s,
|
|
)
|
|
expect(indicatorsSource).toMatch(
|
|
/\.phone-status-indicators__wifi circle\s*\{[^}]*fill:\s*currentColor;/s,
|
|
)
|
|
expect(indicatorsSource).toMatch(
|
|
/\.phone-status-indicators__battery\s*\{[^}]*fill:\s*currentColor;/s,
|
|
)
|
|
expect(indicatorsSource).toMatch(
|
|
/\.phone-status-indicators__battery rect:first-child\s*\{[^}]*stroke:\s*currentColor;/s,
|
|
)
|
|
})
|
|
})
|