@jesscss/core 2.0.0-alpha.4 → 2.0.0-alpha.6

package/src/tree/__tests__/declaration.test.ts

@@ -0,0 +1,253 @@
+import { atrule, coll, decl, rules, ruleset, el, color, any, expr, num, ref, amp, sel } from '../index.js';
+import { Context } from '../../context.js';
+import { AssignmentType } from '../declaration.js';
+import { isVisibleInContext } from '../node-base.js';
+
+let context: Context;
+describe('Declaration', () => {
+  beforeEach(() => {
+    context = new Context();
+  });
+  it('should serialize to CSS', () => {
+    let rule = decl({ name: 'color', value: color('#eee') });
+    expect(`${rule}`).toBe('color: #eee');
+  });
+
+  it('preEval normalizes assignment options without overwriting canonical options', async () => {
+    const rule = decl(
+      { name: 'color', value: any('red') },
+      { assign: AssignmentType.Add }
+    );
+    const preEvald = await rule.preEval(context);
+
+    expect(preEvald.toTrimmedString({ context })).toContain('color:');
+    expect(preEvald.toTrimmedString({ context })).not.toContain('+:');
+    expect(rule.toTrimmedString()).toContain('+:');
+    expect(rule.options?.assign).toBe(AssignmentType.Add);
+    expect(rule.options?.normalizedFromAssign).toBeUndefined();
+  });
+
+  it('omits the trailing semicolon when the canonical value is a collection', () => {
+    const rule = decl({
+      name: 'color',
+      value: coll([
+        decl({ name: 'nested', value: any('red') })
+      ])
+    });
+
+    expect(rule.requiredSemi).toBe(false);
+    expect(rules([rule]).toString()).not.toContain('};');
+  });
+
+  it('root rules serialization omits the trailing semicolon when a cloned declaration replaces the value with a collection', () => {
+    const rule = decl({ name: 'color', value: any('red') });
+    const clonedRule = rule.clone();
+    const patchedValue = coll([
+      decl({ name: 'nested', value: any('blue') })
+    ]);
+
+    clonedRule.adopt(patchedValue, context);
+    (clonedRule as unknown as { value: ReturnType<typeof coll> }).value = patchedValue;
+
+    expect(clonedRule.toTrimmedString({ context })).toContain('{');
+    expect(rules([clonedRule]).toString({ context })).not.toContain('};');
+    expect(rule.toTrimmedString()).toBe('color: red');
+  });
+
+  it('root rules serialization adds the trailing semicolon when a cloned declaration replaces a collection value with a scalar', () => {
+    const rule = decl({
+      name: 'color',
+      value: coll([
+        decl({ name: 'nested', value: any('red') })
+      ])
+    });
+    const clonedRule = rule.clone();
+    const patchedValue = any('blue');
+
+    clonedRule.adopt(patchedValue, context);
+    (clonedRule as unknown as { value: ReturnType<typeof any> }).value = patchedValue;
+
+    expect(clonedRule.toTrimmedString({ context })).toBe('color: blue');
+    expect(rules([clonedRule]).toString({ context })).toContain('blue;');
+    expect(rule.toTrimmedString()).toContain('{');
+  });
+
+  it('serialize-helper omits the trailing semicolon for a cloned collection value inside a ruleset', () => {
+    const rule = decl({ name: 'color', value: any('red') });
+    const node = rules([
+      ruleset({
+        selector: el('.x'),
+        rules: rules([rule])
+      })
+    ]);
+    const clonedNode = node.clone(true);
+    const clonedRule = (clonedNode.at(0, context) as ReturnType<typeof ruleset>).get('rules').at(0, context) as ReturnType<typeof decl>;
+    const patchedValue = coll([
+      decl({ name: 'nested', value: any('blue') })
+    ]);
+
+    clonedRule.adopt(patchedValue, context);
+    (clonedRule as unknown as { value: ReturnType<typeof coll> }).value = patchedValue;
+
+    expect(clonedNode.toString({ context })).toBeString(`
+      .x {
+        color: {
+            nested: blue;
+          }
+      }
+    `);
+  });
+
+  it('serialize-helper adds the trailing semicolon for a cloned scalar value inside a ruleset', () => {
+    const rule = decl({
+      name: 'color',
+      value: coll([
+        decl({ name: 'nested', value: any('red') })
+      ])
+    });
+    const node = rules([
+      ruleset({
+        selector: el('.x'),
+        rules: rules([rule])
+      })
+    ]);
+    const clonedNode = node.clone(true);
+    const clonedRule = (clonedNode.at(0, context) as ReturnType<typeof ruleset>).get('rules').at(0, context) as ReturnType<typeof decl>;
+    const patchedValue = any('blue');
+
+    clonedRule.adopt(patchedValue, context);
+    (clonedRule as unknown as { value: ReturnType<typeof any> }).value = patchedValue;
+
+    expect(clonedNode.toString({ context })).toBeString(`
+      .x {
+        color: blue;
+      }
+    `);
+  });
+
+  it('serialize-helper de-dupes declarations by a cloned property name', () => {
+    const first = decl({ name: 'color', value: any('red') });
+    const second = decl({ name: 'background', value: any('red') });
+    const node = rules([
+      ruleset({
+        selector: el('.x'),
+        rules: rules([first, second])
+      })
+    ]);
+    const clonedNode = node.clone(true);
+    const clonedFirst = (clonedNode.at(0, context) as ReturnType<typeof ruleset>).get('rules').at(0, context) as ReturnType<typeof decl>;
+    const patchedName = any('background', { role: 'property' });
+
+    clonedFirst.adopt(patchedName, context);
+    (clonedFirst as unknown as { name: ReturnType<typeof any> }).name = patchedName;
+
+    expect(clonedNode.toString({ context })).toBeString(`
+      .x {
+        background: red;
+      }
+    `);
+  });
+
+  it('clears stale same-render-key edges when a render-owned declaration updates a direct field', () => {
+    const rule = decl({
+      name: any('item-1', { role: 'property' }),
+      value: expr(any('stale'))
+    });
+    const nextValue = num(4);
+    const renderKey = 1;
+
+    rule.adopt(nextValue, context);
+    (rule as typeof rule & { renderKey: number }).renderKey = renderKey;
+    (rule as typeof rule & { valueEdge: Map<number, ReturnType<typeof expr>> }).valueEdge = new Map([[renderKey, expr(any('stale-edge'))]]);
+    rule.setCurrentValue(nextValue, { ...context, renderKey });
+
+    expect(rule.get('value', { ...context, renderKey }).toTrimmedString()).toBe('4');
+    expect((rule as typeof rule & { valueEdge?: Map<number, ReturnType<typeof expr>> }).valueEdge).toBeUndefined();
+  });
+
+  it('preserves merged property declarations for later property lookups in nested output', async () => {
+    const node = rules([
+      ruleset({
+        selector: el('a'),
+        rules: rules([
+          decl({ name: 'background-color', value: any('red') }, { assign: AssignmentType.Add }),
+          decl({ name: 'background-color', value: any('foo') }, { assign: AssignmentType.Add }),
+          ruleset({
+            selector: sel([amp(), el('b')]),
+            rules: rules([
+              decl({
+                name: 'background',
+                value: ref({ key: 'background-color' }, { type: 'property' })
+              })
+            ])
+          })
+        ])
+      })
+    ]);
+
+    const evald = await node.eval(new Context({ collapseNesting: true }));
+
+    expect(evald.toString({ context: new Context({ collapseNesting: true }) })).toBeString(`
+      a {
+        background-color: red, foo;
+      }
+      ab {
+        background: red, foo;
+      }
+    `);
+  });
+
+  it('preserves merge-sequence declarations inside nested @starting-style blocks', async () => {
+    const node = rules([
+      ruleset({
+        selector: el('.x'),
+        rules: rules([
+          atrule({
+            name: any('@starting-style', { role: 'atkeyword' }),
+            rules: rules([
+              decl({ name: 'padding', value: any('10px') }, { assign: AssignmentType.MergeSequence }),
+              decl({ name: 'padding', value: any('8px') }, { assign: AssignmentType.MergeSequence }),
+              decl({ name: 'padding', value: any('6px') }, { assign: AssignmentType.MergeSequence }),
+              decl({ name: 'padding', value: any('4px') }, { assign: AssignmentType.MergeSequence })
+            ])
+          })
+        ])
+      })
+    ]);
+
+    const evalContext = new Context();
+    const evald = await node.eval(evalContext);
+    const outerRuleset = evald.at(0, evalContext) as ReturnType<typeof ruleset>;
+    const outerRules = outerRuleset.enterRules(evalContext)!;
+    const startingStyle = outerRules.at(0, evalContext) as ReturnType<typeof atrule>;
+    const startingStyleRules = startingStyle.enterRules(evalContext)!;
+    const startingStyleContext = {
+      ...evalContext,
+      renderKey: startingStyleRules.renderKey,
+      rulesContext: startingStyleRules
+    } as Context;
+    const startingStyleChildren = startingStyleRules.getRegistryChildren(startingStyleContext);
+
+    expect(startingStyleChildren).toHaveLength(4);
+    expect(startingStyleChildren[0]!.toTrimmedString({ context: startingStyleContext })).toBe('padding: 10px 8px 6px 4px');
+    expect(isVisibleInContext(startingStyleChildren[0]!, startingStyleContext)).toBe(true);
+    expect(startingStyleChildren.slice(1).every(child => !isVisibleInContext(child!, startingStyleContext))).toBe(true);
+    expect(startingStyleChildren.every(child => child.options?.normalizedFromAssign === AssignmentType.MergeSequence)).toBe(true);
+
+    expect(evald.toString({ context: new Context() })).toBeString(`
+      .x {
+        @starting-style {
+          padding: 10px 8px 6px 4px;
+        }
+      }
+    `);
+  });
+
+  // it('should serialize to a module', () => {
+  //   let rule = decl({ name: expr([any('color')]), value: spaced([any('#eee')]) })
+  //   rule.toModule(context, out)
+  //   expect(out.toString()).toBe(
+  //     '$J.decl({\n  name: $J.expr([$J.any("color")]),\n  value: $J.spaced([$J.any("#eee")])\n})'
+  //   )
+  // })
+});

package/src/tree/__tests__/dependency-graph.test.ts

@@ -0,0 +1,177 @@
+import { describe, expect, it } from 'vitest';
+import {
+  Context,
+  any,
+  call,
+  decl,
+  el,
+  list,
+  mixin,
+  num,
+  op,
+  ref,
+  rules,
+  ruleset,
+  getDependency,
+  vardecl
+} from '../../index.js';
+import { isNode } from '../util/is-node.js';
+import { N } from '../node-type.js';
+import type { Declaration } from '../declaration.js';
+import type { Node } from '../node.js';
+import type { Rules } from '../rules.js';
+import type { Ruleset } from '../ruleset.js';
+
+function getFirstRuleset(root: Rules): Ruleset {
+  const rulesetNode = root.value.find(node => isNode(node, N.Ruleset));
+  expect(rulesetNode).toBeDefined();
+  return rulesetNode as Ruleset;
+}
+
+function collectDeclarations(node: Node): Declaration[] {
+  if (isNode(node, N.Declaration)) {
+    return [node as Declaration];
+  }
+  if (isNode(node, N.Rules)) {
+    return node.value.flatMap(child => collectDeclarations(child));
+  }
+  return [];
+}
+
+function getDeclarations(node: Ruleset): Declaration[] {
+  return collectDeclarations(node.get('rules'));
+}
+
+describe('dependency graph propagation', () => {
+  // Tests 2-5 access declaration.value after eval, which returns undefined
+  // for evaluated references on this branch. Unskip once API builders are
+  // updated for the .data refactor.
+
+  it('keeps static literal declarations static', async () => {
+    const root = rules([
+      ruleset({
+        selector: el('.test'),
+        rules: rules([
+          decl({ name: 'color', value: any('red') })
+        ])
+      })
+    ]);
+    const ctx = new Context();
+    ctx.root = root;
+    const evald = await root.eval(ctx);
+    const declaration = getDeclarations(getFirstRuleset(evald))[0]!;
+
+    expect(getDependency(declaration.get('value'), ctx)).toBeNull();
+  });
+
+  it.skip('tracks direct top-level variable references', async () => {
+    const base = vardecl({ name: 'base', value: any('red') });
+    const root = rules([
+      base,
+      ruleset({
+        selector: el('.test'),
+        rules: rules([
+          decl({ name: 'color', value: ref({ key: 'base' }, { type: 'variable' }) })
+        ])
+      })
+    ]);
+    const ctx = new Context();
+    ctx.root = root;
+    const evald = await root.eval(ctx);
+    const declaration = getDeclarations(getFirstRuleset(evald))[0]!;
+    const dependency = getDependency(declaration.get('value'), ctx);
+
+    expect(dependency).not.toBeNull();
+    expect(dependency?.dependsOn?.size).toBe(1);
+    expect([...dependency!.dependsOn!].map(dep => dep.get('name').valueOf())).toEqual(['base']);
+  });
+
+  it.skip('propagates dependencies through operations', async () => {
+    const base = vardecl({ name: 'base', value: any('10px') });
+    const root = rules([
+      base,
+      ruleset({
+        selector: el('.test'),
+        rules: rules([
+          decl({
+            name: 'width',
+            value: op([
+              ref({ key: 'base' }, { type: 'variable' }),
+              '+',
+              num(2)
+            ])
+          })
+        ])
+      })
+    ]);
+    const ctx = new Context();
+    ctx.root = root;
+    const evald = await root.eval(ctx);
+    const declaration = getDeclarations(getFirstRuleset(evald))[0]!;
+    const dependency = getDependency(declaration.get('value'), ctx);
+
+    expect(dependency).not.toBeNull();
+    expect([...dependency!.dependsOn!].map(dep => dep.get('name').valueOf())).toEqual(['base']);
+  });
+
+  it.skip('treats mixin params with static inputs as static', async () => {
+    const passthrough = mixin({
+      name: any('.passthrough'),
+      params: list([any('value', { role: 'property' })]),
+      rules: rules([
+        decl({ name: 'color', value: ref({ key: 'value' }, { type: 'variable' }) })
+      ])
+    });
+    const root = rules([
+      passthrough,
+      ruleset({
+        selector: el('.test'),
+        rules: rules([
+          call({
+            name: ref({ key: '.passthrough' }, { type: 'mixin' }),
+            args: list([any('red')])
+          })
+        ])
+      })
+    ]);
+    const ctx = new Context();
+    ctx.root = root;
+    const evald = await root.eval(ctx);
+    const declaration = getDeclarations(getFirstRuleset(evald))[0]!;
+
+    expect(getDependency(declaration.get('value'), ctx)).toBeNull();
+  });
+
+  it.skip('tracks top-level vars through mixin parameter binding', async () => {
+    const base = vardecl({ name: 'base', value: any('red') });
+    const passthrough = mixin({
+      name: any('.passthrough'),
+      params: list([any('value', { role: 'property' })]),
+      rules: rules([
+        decl({ name: 'color', value: ref({ key: 'value' }, { type: 'variable' }) })
+      ])
+    });
+    const root = rules([
+      base,
+      passthrough,
+      ruleset({
+        selector: el('.test'),
+        rules: rules([
+          call({
+            name: ref({ key: '.passthrough' }, { type: 'mixin' }),
+            args: list([ref({ key: 'base' }, { type: 'variable' })])
+          })
+        ])
+      })
+    ]);
+    const ctx = new Context();
+    ctx.root = root;
+    const evald = await root.eval(ctx);
+    const declaration = getDeclarations(getFirstRuleset(evald))[0]!;
+    const dependency = getDependency(declaration.get('value'), ctx);
+
+    expect(dependency).not.toBeNull();
+    expect(dependency?.dependsOn?.size).toBe(1);
+    expect([...dependency!.dependsOn!].map(dep => dep.get('name').valueOf())).toEqual(['base']);
+  });
+});

package/src/tree/__tests__/detached-rulesets.test.ts

@@ -0,0 +1,213 @@
+import { describe, it, expect, beforeEach, beforeAll, afterAll } from 'vitest';
+import {
+  rules,
+  decl,
+  vardecl,
+  any,
+  ref,
+  Rules,
+  Node
+} from '../index.js';
+import { Context } from '../../context.js';
+import type { FindOptions } from '../util/registry-utils.js';
+
+function getVar(context: Context, n: Rules, key: string, opts: FindOptions = {}) {
+  context.rulesContext = n;
+  opts.searchParents = true;
+  return n.find('declaration', key, 'VarDeclaration', opts);
+}
+
+describe('Detached Rulesets - Variable Lookups', () => {
+  let context: Context;
+
+  beforeAll(() => {
+    Node.prototype.fullRender = true;
+  });
+  afterAll(() => {
+    Node.prototype.fullRender = false;
+  });
+
+  beforeEach(() => {
+    context = new Context();
+    context.id = 'testing';
+  });
+
+  describe('Basic parent lookup (sanity check)', () => {
+    it('should find variable in parent scope', async () => {
+      const inherited = rules([]);
+      const node = rules([
+        vardecl({ name: 'foo', value: any('bar') }),
+        inherited
+      ]);
+
+      await node.eval(context);
+
+      const found = getVar(context, inherited, 'foo');
+
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$foo: bar');
+    });
+  });
+
+  describe('Private variables', () => {
+    it('should NOT find private variables when searching from within the Rules', async () => {
+      // Create nested Rules structure:
+      // rootRules {
+      //   @private-var: public-value;
+      //   privateRules {
+      //     @private-var: private-value;  // private visibility
+      //   }
+      // }
+      const privateRules = rules([
+        vardecl({ name: 'private-var', value: any('private-value') })
+      ], {
+        rulesVisibility: {
+          VarDeclaration: 'private'
+        }
+      });
+
+      const node = rules([
+        vardecl({ name: 'private-var', value: any('public-value') }),
+        privateRules
+      ]);
+
+      await node.eval(context);
+
+      // When searching from within the private Rules (same scope), private does NOT block.
+      // Private only blocks external access (outside looking in via child searches).
+      const found = getVar(context, privateRules, 'private-var');
+
+      // Should find the private one — same-scope lookups are not blocked by private visibility
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$private-var: private-value');
+    });
+
+    it('should NOT find private variables when searching from outside the Rules', async () => {
+      // Create nested Rules structure:
+      // rootRules {
+      //   privateRules {
+      //     @private-var: private-value;  // private visibility
+      //   }
+      // }
+      const privateRules = rules([
+        vardecl({ name: 'private-var', value: any('private-value') })
+      ], {
+        rulesVisibility: {
+          VarDeclaration: 'private'
+        }
+      });
+
+      const node = rules([
+        privateRules
+      ]);
+
+      await node.eval(context);
+
+      // When searching from outside (parent), should NOT find the private variable
+      const found = getVar(context, node, 'private-var');
+
+      // Should NOT find the private variable from child
+      expect(found).toBeUndefined();
+    });
+  });
+
+  describe('Optional vs Private visibility', () => {
+    it('should treat optional variables as optional (continue searching)', async () => {
+      const optionalRules = rules([
+        vardecl({ name: 'var', value: any('optional-value') })
+      ], {
+        rulesVisibility: {
+          VarDeclaration: 'optional'
+        }
+      });
+
+      const node = rules([
+        vardecl({ name: 'var', value: any('public-value') }),
+        optionalRules
+      ]);
+
+      await node.eval(context);
+
+      const found = getVar(context, optionalRules, 'var');
+
+      // Should find the public one (optional ones are only returned if no public ones exist)
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$var: public-value');
+    });
+
+    it('should find private variables from same scope (private only blocks outside-in)', async () => {
+      const privateRules = rules([
+        vardecl({ name: 'var', value: any('private-value') })
+      ], {
+        rulesVisibility: {
+          VarDeclaration: 'private'
+        }
+      });
+
+      const node = rules([
+        vardecl({ name: 'var', value: any('public-value') }),
+        privateRules
+      ]);
+
+      await node.eval(context);
+
+      const found = getVar(context, privateRules, 'var');
+
+      // Same-scope lookup: private does NOT block. Should find the private one.
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$var: private-value');
+    });
+
+    it('should return optional variable when no public variable exists', async () => {
+      const optionalRules = rules([
+        vardecl({ name: 'var', value: any('optional-value') })
+      ], {
+        rulesVisibility: {
+          VarDeclaration: 'optional'
+        }
+      });
+
+      const node = rules([
+        optionalRules
+      ]);
+
+      await node.eval(context);
+
+      const found = getVar(context, optionalRules, 'var');
+
+      // Should return the optional one since no public one exists
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$var: optional-value');
+    });
+  });
+
+  describe('Variable lookup parent chain traversal', () => {
+    it('should traverse parent chain correctly', async () => {
+      // Root: @a: root-value;
+      // Middle: @a: middle-value;
+      // Inner: (lookup @a)
+      const innerRules = rules([
+        // Just a reference to test lookup
+        decl({ name: 'test', value: ref('a', { type: 'variable' }) })
+      ]);
+
+      const middleRules = rules([
+        vardecl({ name: 'a', value: any('middle-value') }),
+        innerRules
+      ]);
+
+      const node = rules([
+        vardecl({ name: 'a', value: any('root-value') }),
+        middleRules
+      ]);
+
+      await node.eval(context);
+
+      const found = getVar(context, innerRules, 'a');
+
+      // Should find the middle one (closest in parent chain)
+      expect(found).toBeDefined();
+      expect(`${found}`).toBe('$a: middle-value');
+    });
+  });
+});