diff --git a/.config/jest.config.cjs b/.config/jest.config.cjs index f4e425f..a0f28bc 100644 --- a/.config/jest.config.cjs +++ b/.config/jest.config.cjs @@ -3,6 +3,8 @@ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ const jestExpo = require("jest-expo/jest-preset"); +process.env.REACT_NATIVE_CSS_TEST_DEBUG = true; + module.exports = { ...jestExpo, testPathIgnorePatterns: ["dist/"], diff --git a/src/jest/index.ts b/src/jest/index.ts index 3e6678c..9d34544 100644 --- a/src/jest/index.ts +++ b/src/jest/index.ts @@ -1,5 +1,7 @@ import { Appearance, Dimensions } from "react-native"; +import util from "node:util"; + import { compile, type CompilerOptions } from "../compiler"; import { StyleCollection } from "../runtime/native/injection"; import { colorScheme, dimensions, rem } from "../runtime/native/reactivity"; @@ -23,16 +25,23 @@ beforeEach(() => { colorScheme.set(null); }); +const debugDefault = Boolean( + process.env.REACT_NATIVE_CSS_TEST_DEBUG && + process.env.NODE_OPTIONS?.includes("--inspect"), +); + export function registerCSS( css: string, { - debugCompiled = process.env.NODE_OPTIONS?.includes("--inspect"), + debug = debugDefault, ...options - }: CompilerOptions & { debugCompiled?: boolean } = {}, + }: CompilerOptions & { debug?: boolean } = {}, ) { const compiled = compile(css, options); - if (debugCompiled) { - console.log(`Compiled styles:\n\n${JSON.stringify({ compiled }, null, 2)}`); + if (debug) { + console.log( + `Compiled:\n---\n${util.inspect(compiled, { depth: null, colors: true, compact: false })}`, + ); } StyleCollection.inject(compiled);