dsh-offwork 1.0.1 → 1.1.0

package/tests/hydration.test.mjs

@@ -0,0 +1,211 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { calculate } from '../clock.js';
+import {
+  defaultHydration,
+  validateHydration,
+  hydrationContext,
+  reconcileHydration,
+  hydrationView,
+  transitionHydration,
+  HYDRATION_LEASE_MS,
+} from '../hydration.js';
+
+const settings = {
+  payMode: 'monthly',
+  monthlySalary: 12000,
+  dailySalary: 600,
+  workdaysPerMonth: 20,
+  start: '09:00',
+  end: '18:00',
+  breakStart: '12:00',
+  breakEnd: '13:00',
+  weekdays: [1, 2, 3, 4, 5],
+  timezone: 'Asia/Shanghai',
+};
+const time = (text) => Date.parse(text.includes('T') ? text : `2026-11-04T${text}:00+08:00`);
+const context = (text, patch = {}) => {
+  const config = { ...settings, ...patch };
+  return hydrationContext(config, calculate(config, time(text)));
+};
+const act = (state, at, action, patch = {}, owner = 'tab-a') =>
+  transitionHydration(state, context(at, patch), action, time(at), owner);
+const enable = (at = '09:00', interval = 60, patch = {}) =>
+  act(defaultHydration(), at, { type: 'preferences', enabled: true, interval }, patch);
+const view = (state, at, patch = {}) =>
+  hydrationView(reconcileHydration(state, context(at, patch)), context(at, patch), time(at));
+const claim = (state, at, patch = {}, owner = 'tab-a') =>
+  act(state, at, { type: 'claim' }, patch, owner);
+
+test('off by default; enabling mid-shift starts a full interval, not catch-up', () => {
+  assert.equal(view(defaultHydration(), '11:45').phase, 'off');
+  const state = enable('10:15');
+  assert.equal(view(state, '10:15').remaining, 3600000);
+  assert.equal(view(state, '11:14').phase, 'countdown');
+  assert.equal(view(state, '11:15').phase, 'due');
+});
+
+for (const interval of [5, 15, 17, 30, 45, 60, 90, 120, 240]) {
+  test(`saving ${interval} minutes applies that interval instead of the 60-minute default`, () => {
+    const initial = enable('09:00');
+    const saved = act(initial, '09:10', { type: 'preferences', enabled: true, interval });
+    assert.equal(saved.interval, interval);
+    const elapsed = context('09:10').elapsed;
+    // Saving an unchanged 60-minute interval keeps the existing cycle.
+    const anchor = interval === 60 ? 0 : elapsed;
+    assert.equal(saved.shift.due, anchor + interval * 60000);
+    const reopened = validateHydration(JSON.parse(JSON.stringify(saved)));
+    assert.equal(reopened.interval, interval);
+    const deadline =
+      time('09:00') + saved.shift.due + (saved.shift.due >= 3 * 3600000 ? 3600000 : 0);
+    const before = hydrationContext(settings, calculate(settings, deadline - 1));
+    const atDue = hydrationContext(settings, calculate(settings, deadline));
+    assert.equal(hydrationView(reopened, before).phase, 'countdown');
+    assert.equal(hydrationView(reopened, atDue).phase, 'due');
+  });
+}
+
+test('break freezes working-time countdown; snooze crosses break', () => {
+  const state = enable('11:10');
+  assert.equal(view(state, '12:00').phase, 'break');
+  assert.equal(view(state, '12:50').remaining, 600000);
+  assert.equal(view(state, '13:10').phase, 'due');
+  let snoozed = claim(enable('10:58'), '11:58');
+  snoozed = act(snoozed, '11:58', { type: 'snooze', eventId: view(snoozed, '11:58').eventId });
+  assert.equal(view(snoozed, '12:30').remaining, 480000);
+  assert.equal(view(snoozed, '13:07').phase, 'countdown');
+  assert.equal(view(snoozed, '13:08').phase, 'due');
+  assert.equal(snoozed.shift.count, 0);
+});
+
+test('completion is idempotent and schedules from actual click, not old due time', () => {
+  let state = claim(enable(), '10:03');
+  const eventId = view(state, '10:03').eventId;
+  state = act(state, '10:03', { type: 'drink', eventId });
+  state = act(state, '10:03', { type: 'drink', eventId });
+  assert.equal(state.shift.count, 1);
+  assert.equal(view(state, '11:02').phase, 'countdown');
+  assert.equal(view(state, '11:03').phase, 'due');
+});
+
+test('hours of missed ticks yield a single stable event; shift end discards it', () => {
+  const state = enable();
+  assert.equal(view(state, '10:00').eventId, view(state, '17:30').eventId);
+  assert.equal(view(state, '17:30').phase, 'due');
+  assert.equal(view(state, '18:00').phase, 'waiting');
+  assert.equal(view(state, '2026-11-07T11:00:00+08:00').phase, 'waiting');
+});
+
+test('pause persists through overnight midnight and resets at a new shift', () => {
+  const night = { start: '22:00', end: '06:00', breakStart: '02:00', breakEnd: '03:00' };
+  let state = enable('2026-11-06T22:00:00+08:00', 60, night);
+  state = act(state, '2026-11-06T23:00:00+08:00', { type: 'pause' }, night);
+  assert.equal(view(state, '2026-11-07T01:00:00+08:00', night).phase, 'paused');
+  assert.equal(view(state, '2026-11-07T22:00:00+08:00', night).phase, 'waiting');
+  const next = reconcileHydration(state, context('2026-11-09T22:00:00+08:00', night));
+  assert.equal(hydrationView(next, context('2026-11-09T22:00:00+08:00', night)).phase, 'countdown');
+  assert.equal(next.shift.paused, false);
+});
+
+test('resume and interval changes restart; count reset does not alter timer', () => {
+  let state = claim(enable(), '10:00');
+  state = act(state, '10:00', { type: 'drink', eventId: view(state, '10:00').eventId });
+  const due = state.shift.due;
+  state = act(state, '10:10', { type: 'clear-count' });
+  assert.equal(state.shift.count, 0);
+  assert.equal(state.shift.due, due);
+  state = act(state, '10:10', { type: 'pause' });
+  state = act(state, '10:40', { type: 'resume' });
+  assert.equal(view(state, '10:40').remaining, 3600000);
+  state = act(state, '10:50', { type: 'preferences', enabled: true, interval: 5 });
+  assert.equal(view(state, '10:50').remaining, 300000);
+  assert.equal(view(state, '10:55').phase, 'due');
+});
+
+test('schedule changes retain same-shift count and pause; pay changes do not reschedule', () => {
+  let state = claim(enable(), '10:00');
+  state = act(state, '10:00', { type: 'drink', eventId: view(state, '10:00').eventId });
+  const oldDue = state.shift.due;
+  assert.equal(
+    reconcileHydration(state, context('10:30', { monthlySalary: 15000 })).shift.due,
+    oldDue,
+  );
+  state = act(state, '10:30', { type: 'pause' });
+  const shifted = reconcileHydration(state, context('10:45', { end: '19:00' }));
+  assert.equal(shifted.shift.count, 1);
+  assert.equal(shifted.shift.paused, true);
+  assert.equal(shifted.shift.due - context('10:45', { end: '19:00' }).elapsed, 3600000);
+});
+
+test('only the current lease owner can process a live event; expired lease is transferred', () => {
+  let state = claim(enable(), '10:00');
+  const eventId = view(state, '10:00').eventId;
+  state = claim(state, '10:00', {}, 'tab-b');
+  assert.equal(state.shift.claim.owner, 'tab-a');
+  assert.equal(act(state, '10:00', { type: 'drink', eventId }, {}, 'tab-b').shift.count, 0);
+  const at = time('10:00') + HYDRATION_LEASE_MS + 1;
+  const ctx = hydrationContext(settings, calculate(settings, at));
+  state = transitionHydration(state, ctx, { type: 'claim' }, at, 'tab-b');
+  assert.equal(state.shift.claim.owner, 'tab-b');
+  assert.equal(
+    transitionHydration(state, ctx, { type: 'drink', eventId }, at, 'tab-a').shift.count,
+    0,
+  );
+  assert.equal(
+    transitionHydration(state, ctx, { type: 'drink', eventId }, at, 'tab-b').shift.count,
+    1,
+  );
+});
+
+test('release, disabled settings and break boundaries remove a displayed lease', () => {
+  let state = claim(enable(), '10:00');
+  assert.equal(act(state, '10:00', { type: 'release' }).shift.claim, null);
+  assert.equal(
+    act(state, '10:00', { type: 'preferences', enabled: false, interval: 60 }).shift.claim,
+    null,
+  );
+  state = claim(enable('11:00'), '11:59');
+  assert.equal(reconcileHydration(state, context('12:00')).shift.claim, null);
+  assert.deepEqual(act(state, '12:00', { type: 'reset' }), defaultHydration());
+});
+
+test('at exact shift end there is no reminder; first opening tomorrow starts fresh', () => {
+  const state = enable('17:00');
+  assert.equal(view(state, '17:00').phase, 'finished');
+  assert.notEqual(view(state, '18:00').phase, 'due');
+  assert.equal(view(state, '2026-11-05T10:25:00+08:00').remaining, 3600000);
+});
+
+test('DST forward and backward transitions count actual paid elapsed time', () => {
+  const patch = {
+    timezone: 'America/New_York',
+    start: '22:00',
+    end: '06:00',
+    breakStart: '00:00',
+    breakEnd: '00:00',
+    weekdays: [6],
+  };
+  const spring = enable('2026-03-08T06:30:00Z', 60, patch);
+  assert.equal(view(spring, '2026-03-08T07:00:00Z', patch).remaining, 1800000);
+  assert.equal(view(spring, '2026-03-08T07:30:00Z', patch).phase, 'due');
+  const fall = enable('2026-11-01T05:30:00Z', 60, patch);
+  assert.equal(view(fall, '2026-11-01T06:30:00Z', patch).phase, 'due');
+});
+
+test('malformed data, unknown schemas and invalid preferences fail closed', () => {
+  for (const data of [
+    null,
+    {},
+    [],
+    { ...defaultHydration(), schema: 99 },
+    ,
+    { ...defaultHydration(), interval: 0 },
+    { ...defaultHydration(), shift: {} },
+  ]) {
+    assert.throws(() => validateHydration(data));
+  }
+  for (const interval of [0, 4, 241, 5.5, NaN]) assert.throws(() => enable('09:00', interval));
+  const state = enable();
+  assert.deepEqual(validateHydration(state), state);
+  assert.equal(hydrationView(state, null).phase, 'waiting');
+});

package/tests/pet-character.test.mjs

@@ -0,0 +1,56 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { petLayout, petModel, petArtwork } from '../pet-view.js';
+import { normalizeView } from '../ui-utils.js';
+
+test('existing preferences gain the long dress without losing privacy, position or motion choices', () => {
+  const old = {
+    masked: true,
+    companion: false,
+    companionMotion: false,
+    petSize: 148,
+    petPosition: { x: 300, y: 400 },
+    opacity: 0.7,
+  };
+  const next = normalizeView(old);
+  assert.equal(next.petModel, 'whale-dress');
+  for (const k of Object.keys(old)) assert.deepEqual(next[k], old[k]);
+  for (const id of ['whale-dress', 'whale-ornate', 'xiaoxie-original'])
+    assert.equal(normalizeView({ ...next, petModel: id }).petModel, id);
+  for (const id of ['unknown', '__proto__', 'toString']) {
+    assert.equal(normalizeView({ petModel: id }).petModel, 'whale-dress');
+    assert.equal(petModel(id).id, 'whale-dress');
+  }
+});
+test('portrait layout fits the complete figure and badge in narrow, short and offset viewports', () => {
+  for (const id of ['whale-dress', 'whale-ornate'])
+    for (const size of [80, 132, 180])
+      for (const viewport of [
+        { width: 1440, height: 1000 },
+        { width: 320, height: 568 },
+        { width: 640, height: 320 },
+        { width: 240, height: 180, left: 50, top: 200 },
+      ]) {
+        const p = petLayout({ x: 9999, y: 9999 }, viewport, size, 420, id),
+          m = petModel(id);
+        assert.ok(p.x >= (viewport.left ?? 0) && p.y >= (viewport.top ?? 0));
+        assert.ok(p.x + p.petWidth <= (viewport.left ?? 0) + viewport.width);
+        assert.ok(p.y + p.petHeight <= (viewport.top ?? 0) + viewport.height);
+        assert.ok(p.artworkSize * m.widthScale <= p.petWidth);
+        assert.ok(p.artworkSize * m.heightScale + 26 <= p.petHeight);
+      }
+});
+test('portrait uses an inert image with proportional dimensions; missing resource retains the SVG fallback', () => {
+  const h = (type, props, ...children) => ({ type, props, children }),
+    presentation = { pose: 'drink', animate: true };
+  const im = petArtwork(h, presentation, 132, 'event-1', 'whale-dress', {
+    'whale-dress': 'data:image/webp;base64,test',
+  });
+  assert.equal(im.type, 'img');
+  assert.equal(im.props.draggable, false);
+  assert.equal(im.props['aria-hidden'], true);
+  assert.equal(im.props.width / im.props.height, 640 / 1024);
+  assert.equal(im.props['data-animate'], true);
+  assert.equal(petArtwork(h, presentation, 132, '', 'whale-dress', {}).type, 'svg');
+  assert.equal(petArtwork(h, presentation, 132, '', 'xiaoxie-original', {}).type, 'svg');
+});

package/tests/pet-interactions.test.mjs

@@ -0,0 +1,88 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { initialPetUI, petUIReducer, appearanceValues } from '../pet-interactions.js';
+const go = (s, screen, extra = {}) => petUIReducer(s, { type: 'navigate', screen, ...extra });
+
+test('one screen is active and editor navigation retains a predictable parent', () => {
+  let s = go(initialPetUI, 'home');
+  s = go(s, 'income');
+  s = go(s, 'water');
+  assert.equal(s.screen, 'water');
+  assert.equal(s.back, 'income');
+  s = go(s, 'appearance');
+  assert.equal(s.back, 'income');
+  s = go(s, s.back);
+  assert.equal(s.screen, 'income');
+  s = go(s, null);
+  assert.equal(s.screen, null);
+  assert.equal(go(initialPetUI, 'appearance').back, null);
+});
+test('dirty navigation preserves the editor until save or explicit discard', () => {
+  const editing = go(go(initialPetUI, 'home'), 'water');
+  const blocked = go(editing, 'appearance', { dirty: true });
+  assert.equal(blocked.screen, 'water');
+  assert.deepEqual(blocked.pending, { screen: 'appearance' });
+  assert.equal(petUIReducer(blocked, { type: 'stay' }).screen, 'water');
+  const discarded = go(blocked, blocked.pending.screen, { discard: true });
+  assert.equal(discarded.screen, 'appearance');
+  assert.equal(discarded.pending, null);
+  const close = go(editing, null, { dirty: true });
+  assert.deepEqual(close.pending, { screen: null });
+  assert.equal(close.screen, 'water');
+  assert.equal(go(close, null, { discard: true }).screen, null);
+});
+test('context menu does not navigate or destroy the pending editor state', () => {
+  const original = go(go(initialPetUI, 'home'), 'schedule');
+  const menu = petUIReducer(original, { type: 'menu', position: { x: 20, y: 30 } });
+  assert.equal(menu.screen, 'schedule');
+  assert.equal(menu.back, 'home');
+  assert.deepEqual(petUIReducer(menu, { type: 'dismiss-menu' }), original);
+  assert.equal(go(menu, 'appearance', { dirty: true }).menu, null);
+  assert.deepEqual(original, go(go(initialPetUI, 'home'), 'schedule'));
+});
+test('reopening the current page preserves drafts and unsupported navigation is ignored', () => {
+  const s = go(go(initialPetUI, 'home'), 'water');
+  assert.deepEqual(go(s, 'water', { dirty: true }), s);
+  assert.equal(go(s, 'unknown'), s);
+});
+test('menu cards are independent roots while reminder settings return only to water', () => {
+  const water = go(initialPetUI, 'home', { root: true });
+  const settings = go(water, 'water');
+  assert.equal(settings.back, 'home');
+  const clock = go(settings, 'income', { root: true, discard: true });
+  assert.equal(clock.back, null);
+  const appearance = go(clock, 'appearance', { root: true });
+  assert.equal(appearance.back, null);
+  assert.equal(go(appearance, appearance.back).screen, null);
+  assert.equal(go(initialPetUI, 'earnings', { root: true }).screen, 'earnings');
+});
+test('dirty navigation retains the root destination for explicit save or discard', () => {
+  const settings = go(go(initialPetUI, 'home'), 'water');
+  const pending = go(settings, 'appearance', { root: true, dirty: true });
+  assert.deepEqual(pending.pending, { screen: 'appearance', root: true });
+  const next = go(pending, pending.pending.screen, { root: pending.pending.root, discard: true });
+  assert.equal(next.back, null);
+  assert.equal(next.screen, 'appearance');
+});
+
+test('appearance snapshots omit position and salary preferences', () => {
+  assert.deepEqual(
+    appearanceValues({
+      companion: true,
+      companionMotion: false,
+      petSize: 132,
+      petModel: 'whale-ornate',
+      opacity: 0.8,
+      position: { x: 1, y: 2 },
+      petPosition: { x: 3, y: 4 },
+      masked: false,
+    }),
+    {
+      companion: true,
+      companionMotion: false,
+      petSize: 132,
+      petModel: 'whale-ornate',
+      opacity: 0.8,
+    },
+  );
+});

package/tests/pet-surfaces.test.mjs

@@ -0,0 +1,128 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { petViewport, petSurfaceWidth, placePetSurface } from '../pet-surfaces.js';
+import { petLayout } from '../pet-view.js';
+import { clampPosition } from '../ui-utils.js';
+const overlap = (a, b) =>
+  Math.max(0, Math.min(a.left + a.width, b.x + b.width) - Math.max(a.left, b.x)) *
+  Math.max(0, Math.min(a.top + a.height, b.y + b.height) - Math.max(a.top, b.y));
+
+test('visual viewport bounds include keyboard and zoom offsets, with a desktop fallback', () => {
+  assert.deepEqual(petViewport({ innerWidth: 1440, innerHeight: 900 }), {
+    width: 1440,
+    height: 900,
+    left: 0,
+    top: 0,
+  });
+  assert.deepEqual(
+    petViewport({
+      innerWidth: 800,
+      innerHeight: 900,
+      visualViewport: { width: 390, height: 310, offsetLeft: 20, offsetTop: 240 },
+    }),
+    { width: 390, height: 310, left: 20, top: 240 },
+  );
+});
+test('card widths match content needs and shrink to the available viewport', () => {
+  const wide = { width: 1440, height: 900 };
+  assert.ok(petSurfaceWidth('schedule', wide) > petSurfaceWidth('income', wide));
+  assert.ok(petSurfaceWidth('menu', wide) < petSurfaceWidth('home', wide));
+  for (const name of ['home', 'income', 'earnings', 'water', 'appearance', 'schedule'])
+    assert.equal(petSurfaceWidth(name, { width: 320, height: 568 }), 296);
+});
+test('measured surfaces stay inside every viewport and preserve natural height when there is room', () => {
+  for (const viewport of [
+    { width: 1440, height: 900 },
+    { width: 768, height: 1024 },
+    { width: 320, height: 568 },
+    { width: 640, height: 320 },
+    { width: 240, height: 140 },
+    { width: 390, height: 280, left: 80, top: 220 },
+  ])
+    for (const position of [null, { x: 0, y: 0 }, { x: 9999, y: 9999 }])
+      for (const size of [80, 180])
+        for (const height of [42, 230, 480, 1500])
+          for (const kind of ['card', 'menu']) {
+            const p = petLayout(position, viewport, size);
+            const anchor = { x: p.x, y: p.y, width: p.petWidth, height: p.petHeight };
+            const r = placePetSurface(anchor, viewport, {
+              width: petSurfaceWidth(kind === 'menu' ? 'menu' : 'schedule', viewport),
+              height,
+              kind,
+              point: { x: p.x, y: p.y },
+            });
+            assert.ok(r.left >= (viewport.left ?? 0) && r.top >= (viewport.top ?? 0));
+            assert.ok(r.left + r.width <= (viewport.left ?? 0) + viewport.width + 0.01);
+            assert.ok(r.top + r.height <= (viewport.top ?? 0) + viewport.height + 0.01);
+            assert.ok(r.height <= height);
+          }
+  const r = placePetSurface(
+    { x: 1100, y: 500, width: 160, height: 176 },
+    { width: 1440, height: 900 },
+    { width: 320, height: 230 },
+  );
+  assert.equal(r.height, 230);
+});
+test('cards and menus avoid the character whenever a clear side is available', () => {
+  const viewport = { width: 1440, height: 900 };
+  for (const anchor of [
+    { x: 1100, y: 650, width: 160, height: 176 },
+    { x: 12, y: 12, width: 160, height: 176 },
+  ])
+    for (const kind of ['card', 'menu']) {
+      const r = placePetSurface(anchor, viewport, {
+        width: 360,
+        height: 500,
+        kind,
+        point: { x: anchor.x + 80, y: anchor.y + 80 },
+      });
+      assert.equal(overlap(r, anchor), 0);
+    }
+});
+test('content changes keep the header in place until bounds require movement', () => {
+  const anchor = { x: 1100, y: 600, width: 160, height: 176 },
+    viewport = { width: 1440, height: 1000 };
+  const first = placePetSurface(anchor, viewport, { width: 336, height: 200 });
+  const larger = placePetSurface(anchor, viewport, { width: 336, height: 240, previous: first });
+  assert.equal(larger.top, first.top);
+  assert.equal(larger.left, first.left);
+  assert.equal(larger.height, 240);
+  const tall = placePetSurface(anchor, viewport, { width: 336, height: 1400, previous: larger });
+  assert.ok(tall.top + tall.height <= 988);
+});
+test('menus open near a clicked card rather than jumping back to the pet', () => {
+  const r = placePetSurface(
+    { x: 1100, y: 700, width: 148, height: 176 },
+    { width: 1440, height: 1000 },
+    { width: 224, height: 240, kind: 'menu', point: { x: 300, y: 100 } },
+  );
+  assert.equal(r.left, 308);
+  assert.equal(r.top, 108);
+});
+
+test('water notices avoid the open card as well as the pet', () => {
+  const viewport = { width: 320, height: 568 };
+  const anchor = { x: 140, y: 414, width: 148, height: 118 };
+  const card = { left: 12, top: 12, width: 296, height: 390 };
+  const notice = placePetSurface(anchor, viewport, {
+    width: 116,
+    height: 34,
+    kind: 'menu',
+    obstacles: [card],
+  });
+  assert.equal(overlap(notice, anchor), 0);
+  assert.equal(
+    overlap(notice, { x: card.left, y: card.top, width: card.width, height: card.height }),
+    0,
+  );
+});
+
+test('pet drag clamping and surface placement use the same offset coordinate space', () => {
+  const viewport = { width: 390, height: 310, left: 80, top: 240 };
+  const position = clampPosition({ x: -50, y: 9999 }, viewport, { width: 148, height: 176 });
+  assert.equal(position.x, 92);
+  assert.equal(position.y, 362);
+  const pet = petLayout(position, viewport, 132);
+  assert.equal(pet.x, 92);
+  assert.equal(pet.y, 362);
+});

package/tests/pet-view.test.mjs

@@ -0,0 +1,48 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { petLayout } from '../pet-view.js';
+import { normalizeView } from '../ui-utils.js';
+
+test('pet and popover stay on screen at edges, across sizes and narrow viewports', () => {
+  for (const viewport of [
+    { width: 1440, height: 900 },
+    { width: 390, height: 844 },
+    { width: 320, height: 568 },
+    { width: 280, height: 360 },
+    { width: 320, height: 160 },
+    { width: 800, height: 120 },
+  ]) {
+    for (const size of [80, 132, 180])
+      for (const position of [null, { x: -500, y: -500 }, { x: 9999, y: 9999 }, { x: 120, y: 80 }])
+        for (const height of [120, 420, 900]) {
+          const r = petLayout(position, viewport, size, height);
+          assert.ok(r.x >= 0 && r.x + r.petWidth <= viewport.width);
+          assert.ok(r.y >= 0 && r.y + r.petHeight <= viewport.height);
+          assert.ok(r.panel.left >= 0 && r.panel.left + r.panel.width <= viewport.width);
+          assert.ok(
+            r.panel.top >= 0 &&
+              r.panel.top + Math.min(height, r.panel.maxHeight) <= viewport.height,
+          );
+        }
+  }
+});
+
+test('popover flips to the available side and stacks on a phone', () => {
+  assert.equal(petLayout(null, { width: 1440, height: 900 }).panel.side, 'left');
+  assert.equal(petLayout({ x: 12, y: 200 }, { width: 1440, height: 900 }).panel.side, 'right');
+  assert.equal(petLayout(null, { width: 320, height: 568 }).panel.side, 'above');
+  assert.equal(petLayout({ x: 12, y: 12 }, { width: 320, height: 568 }).panel.side, 'below');
+});
+
+test('pet preferences retain the original clock position and bound invalid size input', () => {
+  const old = { position: { x: 40, y: 50 }, masked: true, companion: true, opacity: 0.6 };
+  const next = normalizeView(old);
+  assert.deepEqual(next.position, old.position);
+  assert.equal(next.petPosition, null);
+  assert.equal(next.petSize, 132);
+  const saved = normalizeView({ ...next, petPosition: { x: 200, y: 300 }, petSize: 148 });
+  assert.deepEqual(normalizeView(JSON.parse(JSON.stringify(saved))), saved);
+  assert.equal(normalizeView({ petSize: 9000 }).petSize, 180);
+  assert.equal(normalizeView({ petSize: NaN }).petSize, 132);
+  assert.equal(normalizeView({ petPosition: { x: 'bad', y: 4 } }).petPosition, null);
+});

package/tests/ui.test.mjs

@@ -27,24 +27,44 @@ test('position stays visible when viewport shrinks', () => {
     y: 12,
   });
 });
-test('view defaults: compact, salary hidden, 82% glass', () => {
+test('view defaults: compact, salary hidden, 82% glass and companion enabled', () => {
   assert.deepEqual(normalizeView(null), {
+    petModel: 'whale-dress',
+    petSize: 132,
+    petPosition: null,
     mini: true,
     masked: true,
+    companion: true,
+    companionMotion: true,
     opacity: 0.82,
     position: null,
   });
   assert.deepEqual(
     normalizeView({ mini: false, masked: false, opacity: 0.5, position: { x: 1, y: 2 } }),
-    { mini: false, masked: false, opacity: 0.5, position: { x: 1, y: 2 } },
+    {
+      petSize: 132,
+      petModel: 'whale-dress',
+      petPosition: null,
+      mini: false,
+      masked: false,
+      companion: true,
+      companionMotion: true,
+      opacity: 0.5,
+      position: { x: 1, y: 2 },
+    },
   );
   assert.equal(normalizeView({ mini: 'yes' }).mini, true);
   assert.equal(normalizeView({ masked: 'false' }).masked, true);
 });
 test('malformed positions and opacity are repaired, not trusted', () => {
   assert.deepEqual(normalizeView({ mini: 'yes', masked: true, position: { x: 'oops', y: 2 } }), {
+    petModel: 'whale-dress',
+    petSize: 132,
+    petPosition: null,
     mini: true,
     masked: true,
+    companion: true,
+    companionMotion: true,
     opacity: 0.82,
     position: null,
   });

package/tools/build.mjs

@@ -1,7 +1,17 @@
 import { readFile, writeFile } from 'node:fs/promises';
 
 const root = new URL('../', import.meta.url);
-const moduleNames = ['client.source.js', 'clock.js', 'ui-utils.js'];
+const moduleNames = [
+  'client.source.js',
+  'clock.js',
+  'ui-utils.js',
+  'companion.js',
+  'pet-view.js',
+  'pet-interactions.js',
+  'pet-surfaces.js',
+  'hydration.js',
+  'hydration-store.js',
+];
 const [entry, ...modules] = await Promise.all(
   moduleNames.map((name) => readFile(new URL(name, root), 'utf8')),
 );
@@ -10,11 +20,31 @@ if (entry.split(marker).length !== 2) {
   throw new Error('Expected exactly one pure-module marker in client.source.js');
 }
 
-// Preserve the pure modules verbatim apart from exports so the browser runs
-// the same implementation that the Node.js tests import.
-const pure = modules.map((source) => source.replace(/^export /gm, '')).join('\n');
-const banner = '// Generated by tools/build.mjs; edit client.source.js, clock.js or ui-utils.js.\n';
-const result = banner + entry.replace(marker, pure);
+// Embed the tested modules, removing only their internal module wiring.
+// The browser and Node.js tests execute the same calculation and store code.
+const pure = modules
+  .map((source) =>
+    source.replace(/^import .* from '\.\/hydration\.js';\n/gm, '').replace(/^export /gm, ''),
+  )
+  .join('\n');
+const banner = '// Generated by tools/build.mjs; edit the source modules, not this file.\n';
+const spriteMarker = '/* PET_SPRITES */';
+if (entry.split(spriteMarker).length !== 2) throw new Error('Expected one sprite marker');
+const sprites = Object.fromEntries(
+  await Promise.all(
+    ['whale-dress', 'whale-ornate'].map(async (id) => {
+      const bytes = await readFile(new URL(`assets/characters/${id}.webp`, root));
+      if (bytes.toString('ascii', 8, 12) !== 'WEBP' || bytes.length > 200000)
+        throw new Error(`Invalid sprite: ${id}`);
+      return [id, 'data:image/webp;base64,' + bytes.toString('base64')];
+    }),
+  ),
+);
+const result =
+  banner +
+  entry
+    .replace(marker, pure)
+    .replace(spriteMarker, `const PET_SPRITES = ${JSON.stringify(sprites)};`);
 const output = new URL('client.js', root);
 
 if (process.argv.includes('--check')) {

package/tools/check-package.mjs

@@ -68,8 +68,17 @@ for (const path of [
   'package.json',
   'index.js',
   'client.js',
+  'companion.js',
+  'pet-view.js',
+  'pet-interactions.js',
+  'pet-surfaces.js',
+  'hydration.js',
+  'hydration-store.js',
   'cordis.patch.yml',
   'icon.svg',
+  'assets/characters/whale-dress.webp',
+  'assets/characters/whale-ornate.webp',
+  'assets/characters/NOTICE.md',
   'locale/zh.json',
   'locale/en.json',
   'README.md',