fix: evaluate range pairs, and answer a condition the runtime cannot decide with unknown

src/__tests__/compiler/condition-types.test.ts

@@ -0,0 +1,96 @@
+import type { CalcFor_Length, MediaFeatureValue } from "lightningcss";
+import type {
+  MediaCondition,
+  MediaFeatureComparison,
+  ReadonlyStyleFunction,
+  StyleFunction,
+} from "react-native-css/compiler";
+
+import type { RenderGuard } from "../../native/conditions/guards";
+import type { DeepReadonly } from "../../utilities/deep-readonly.types";
+
+type IsAssignable<Source, Target> = [Source] extends [Target] ? true : false;
+
+type IsNever<Value> = [Value] extends [never] ? true : false;
+
+// A readonly array or tuple is not assignable to a mutable one
+type IsWritable<Value> = IsAssignable<Value, unknown[]>;
+
+type HoldsWritable<Value> =
+  IsNever<Extract<Value, unknown[]>> extends true ? false : true;
+
+type ReadonlyValue<Type extends MediaFeatureValue["type"]> = Extract<
+  DeepReadonly<MediaFeatureValue>,
+  { type: Type }
+>["value"];
+
+type ReadonlySum = Extract<DeepReadonly<CalcFor_Length>, { type: "sum" }>;
+
+type Operand = Extract<
+  MediaCondition,
+  readonly [MediaFeatureComparison, ...unknown[]]
+>[2];
+
+type OperandArguments = Extract<
+  Operand,
+  readonly [unknown, unknown, unknown, ...unknown[]]
+>[2];
+
+test("DeepReadonly reaches every depth of a lightningcss value and keeps its primitives", () => {
+  const ratioWritable: IsWritable<ReadonlyValue<"ratio">> = false;
+  const ratioPair: IsAssignable<
+    ReadonlyValue<"ratio">,
+    readonly [number, number]
+  > = true;
+  const keywordString: IsAssignable<ReadonlyValue<"ident">, string> = true;
+  const sumWritable: IsWritable<ReadonlySum["value"]> = false;
+  const nestedSumWritable: IsWritable<
+    Extract<ReadonlySum["value"][0], { type: "sum" }>["value"]
+  > = false;
+  const passedAsWritten: IsAssignable<
+    MediaFeatureValue,
+    DeepReadonly<MediaFeatureValue>
+  > = true;
+
+  expect([
+    ratioWritable,
+    ratioPair,
+    keywordString,
+    sumWritable,
+    nestedSumWritable,
+    passedAsWritten,
+  ]).toStrictEqual([false, true, true, false, false, true]);
+});
+
+test("a compiled condition is readonly at every depth", () => {
+  const conditionWritable: HoldsWritable<MediaCondition> = false;
+  const conjunctionWritable: IsWritable<
+    Extract<MediaCondition, readonly ["&", unknown]>[1]
+  > = false;
+  const disjunctionWritable: IsWritable<
+    Extract<MediaCondition, readonly ["|", unknown]>[1]
+  > = false;
+  const operandWritable: HoldsWritable<Operand> = false;
+  const argumentsWritable: HoldsWritable<OperandArguments> = false;
+  const nestedArgumentsWritable: HoldsWritable<
+    Extract<OperandArguments, readonly unknown[]>[number]
+  > = false;
+  const compiledFunction: IsAssignable<StyleFunction, ReadonlyStyleFunction> =
+    true;
+
+  expect([
+    conditionWritable,
+    conjunctionWritable,
+    disjunctionWritable,
+    operandWritable,
+    argumentsWritable,
+    nestedArgumentsWritable,
+    compiledFunction,
+  ]).toStrictEqual([false, false, false, false, false, false, true]);
+});
+
+test("a render guard is a readonly tuple", () => {
+  const guardWritable: HoldsWritable<RenderGuard> = false;
+
+  expect(guardWritable).toBe(false);
+});

src/__tests__/native/compare.test.ts

@@ -0,0 +1,167 @@
+import { act } from "@testing-library/react-native";
+import type {
+  MediaFeatureComparison,
+  MediaFeatureOperand,
+} from "react-native-css/compiler";
+
+import {
+  compareMediaFeature,
+  evaluateCondition,
+  isTruthyFeatureValue,
+  testMediaFeatureInterval,
+  type FeatureReader,
+  type MeasuredFeatureValue,
+  type MediaFeatureName,
+  type MediaInterval,
+} from "../../native/conditions/compare";
+import { UNKNOWN, type Truth } from "../../native/conditions/kleene";
+import { dimensions, type Getter } from "../../native/reactivity";
+
+const get: Getter = (observable) => observable.get();
+
+beforeEach(() => {
+  act(() => {
+    dimensions.set({ ...dimensions.get(), width: 600, height: 400 });
+  });
+});
+
+test.each([
+  [">", [false, false, true]],
+  [">=", [false, true, true]],
+  ["<", [true, false, false]],
+  ["<=", [true, true, false]],
+  ["=", [false, true, false]],
+] as const)("%s compares 39, 40 and 41 against 40", (operator, expected) => {
+  expect(
+    [39, 40, 41].map((value) => compareMediaFeature(operator, value, 40, get)),
+  ).toStrictEqual(expected);
+});
+
+const operands: readonly (readonly [
+  label: string,
+  operator: MediaFeatureComparison,
+  left: MediaFeatureOperand | undefined,
+  right: MediaFeatureOperand,
+  truth: Truth,
+])[] = [
+  ["an unmeasured feature", ">", undefined, 400, UNKNOWN],
+  ["an unresolved operand", ">", 400, null, UNKNOWN],
+  ["an operand only an element resolves", ">", 400, [{}, "em", 10, 1], UNKNOWN],
+  ["a viewport width on a 600px window", ">", 400, [{}, "vw", 50, 1], true],
+  ["a viewport height on a 400px window", "=", 200, [{}, "vh", 50, 1], true],
+  ["a viewport length on either side", "<", [{}, "vh", 50, 1], 201, true],
+  ["a keyword ordered against a number", ">", "landscape", 400, UNKNOWN],
+  ["an equal keyword", "=", "landscape", "landscape", true],
+  ["a different keyword", "=", "portrait", "landscape", false],
+];
+
+test.each(operands)("%s", (_label, operator, left, right, truth) => {
+  expect(compareMediaFeature(operator, left, right, get)).toBe(truth);
+});
+
+const intervals: readonly (readonly [
+  label: string,
+  condition: MediaInterval,
+  value: MeasuredFeatureValue,
+  truth: Truth,
+])[] = [
+  ["inside", ["[]", "width", 400, "<", 800, "<"], 600, true],
+  ["below", ["[]", "width", 400, "<", 800, "<"], 300, false],
+  ["above", ["[]", "width", 400, "<", 800, "<"], 900, false],
+  ["on an open bound", ["[]", "width", 400, "<", 800, "<"], 400, false],
+  ["on a closed bound", ["[]", "width", 400, "<=", 800, "<"], 400, true],
+  ["written descending", ["[]", "width", 800, ">", 400, ">"], 600, true],
+  ["unmeasured", ["[]", "width", 400, "<", 800, "<"], undefined, UNKNOWN],
+  [
+    "with an unresolved bound",
+    ["[]", "width", null, "<", 800, "<"],
+    600,
+    UNKNOWN,
+  ],
+  ["false on one bound", ["[]", "width", 700, "<", null, "<"], 600, false],
+  [
+    "between viewport lengths",
+    ["[]", "width", [{}, "vw", 50, 1], "<", [{}, "vw", 150, 1], "<"],
+    600,
+    true,
+  ],
+];
+
+test.each(intervals)("an interval %s", (_label, condition, value, truth) => {
+  expect(testMediaFeatureInterval(condition, value, get)).toBe(truth);
+});
+
+test.each([
+  [400, true],
+  [0, false],
+  [Number.NaN, false],
+  ["hover", true],
+  ["none", false],
+  ["no-preference", false],
+  [undefined, UNKNOWN],
+] as const)("%p in a boolean context is %p", (value, truth) => {
+  expect(isTruthyFeatureValue(value)).toBe(truth);
+});
+
+const recordingReader = (
+  values: Readonly<Partial<Record<MediaFeatureName, MeasuredFeatureValue>>>,
+  read: MediaFeatureName[],
+): FeatureReader<undefined> => ({
+  read: (name) => {
+    read.push(name);
+    return values[name];
+  },
+  compare: (condition) => {
+    read.push(condition[1]);
+    return condition[0] === "[]"
+      ? testMediaFeatureInterval(condition, values[condition[1]], get)
+      : compareMediaFeature(
+          condition[0],
+          values[condition[1]],
+          condition[2],
+          get,
+        );
+  },
+});
+
+test("an empty conjunction is true and an empty disjunction false", () => {
+  const reader = recordingReader({}, []);
+
+  expect(evaluateCondition(["&", []], reader, undefined)).toBe(true);
+  expect(evaluateCondition(["|", []], reader, undefined)).toBe(false);
+});
+
+test("a decided term stops the evaluation, and an unknown one does not", () => {
+  const read: MediaFeatureName[] = [];
+  const reader = recordingReader({ width: 400, height: 300 }, read);
+
+  expect(
+    evaluateCondition(
+      [
+        "&",
+        [
+          ["=", "scan", "progressive"],
+          [">", "width", 500],
+          [">", "height", 100],
+        ],
+      ],
+      reader,
+      undefined,
+    ),
+  ).toBe(false);
+  expect(
+    evaluateCondition(
+      [
+        "|",
+        [
+          ["=", "scan", "progressive"],
+          [">", "width", 300],
+          [">", "height", 100],
+        ],
+      ],
+      reader,
+      undefined,
+    ),
+  ).toBe(true);
+  expect(read).toStrictEqual(["scan", "width", "scan", "width"]);
+});