Files
ComfyAssets-ComfyUI_PromptM…/tests/js/workspace-images-state.test.js
Vito e9996996e2 feat(views): saved views and Favorites on Images and Library (#268)
* feat(views): saved-views store and API

Add a saved_views table (page images|library, trimmed 1-100 character
name, whitelisted JSON state of at most 4 KB, position, timestamps)
installed through the same validated-savepoint migration as image
favorites. It is optional in old backups and required in a migrated
restore stage; restore rejects a tampered definition, extra indexes and
any row that would fail write validation.

Routes under /prompt_manager/saved-views: GET lists views by position,
POST {page,name,state} returns 201 {success, view}, PATCH /{id} {name}
renames and DELETE /{id} removes, both 404 for an unknown id. The state
must hold exactly the page's toolbar and Refine-this-view keys (Images:
q, category, sort, source, folder, media, tags; Library: q, category,
sort, tags) with their types and sort/media values; anything else is a
400.

Refs #249

* feat(views): Save view, the SAVED VIEWS sidebar and opening a view

The shared toolbar gains the concept's Save view between sort and Filters
on Images and the Prompt library. It opens the concept's simpleInput
("Save this view", "View name", default "Search: <q>" or "My workspace
view", Cancel / Save); an empty name is "Saved view". A save posts the
page's full whitelisted state (toolbar value plus Refine filters) and
toasts "Saved view added to the sidebar.".

The shell adds the concept's SAVED VIEWS label and nav#saved-nav, loaded
with the shell and re-read after every save. Rows use the concept's
links() markup (search icon, name, no count) and link #/saved/<id>.
Opening one mounts its page with the saved state through the page's own
filters, so the toolbar and "Filters · N" (D44) show it; the h1,
breadcrumb and title are the view's name. A removed Source or Folder is
dropped to its default after discovery, so no listing read is rejected;
an unknown id re-reads the list once, then opens Images; a failed list
read offers Retry.

D16 is retired: images-concept and library-concept no longer map Save
view out. New deviations: D49 (no PROPOSED badge) and D50 (no Needs
review row); shell-concept maps Favorites out until Task 3 and compares
a saved row against the concept's. Browser fixtures now wipe
saved_views.

* feat(views): Edit rename/delete and the Favorites saved view

- Favorites is the first SAVED VIEWS row (star icon, name, real count).
  The count is the Favorites listing's own limit=1 total, follows the
  nav-count rules and is re-read after every confirmed star or unstar.
- #/favorites opens Images filtered to favorites. The workspace listing
  takes favorites=1: each selected root's favorites are read through the
  image_favorites primary key and matched against the cached scan with the
  toggle's case folding; a failed read is an error, never an unfiltered
  page. The cursor scope includes the flag.
- Saved Images state gains a required favorites boolean, so Save view on
  Favorites reopens the favorites.
- An open saved view's heading leads with Edit: "Edit saved view" with
  View name, Delete... (danger), Cancel and Save. Delete... confirms in the
  same dialog (never window.confirm). Toasts "Saved view renamed." and
  "Saved view deleted."; a delete returns to the view's plain page.
- shell-concept no longer maps Favorites out (Needs review stays, D50).
  Recorded as D51 in TESTING.md.

* fix(views): open stale saved views safely and finish the review fixes

Startup and restore now check only the saved_views structure (table,
columns, types, sizes, a JSON object state) and never the value rules,
so a row saved under older rules no longer stops the database from
opening. Reads normalize each view: missing keys take their defaults,
unknown keys are dropped, invalid values default and the name is made
displayable. POST and PATCH still validate strictly.

Only request validation (SavedViewInvalid) maps to 400; database and
internal errors are a logged generic 500. A saved view no longer
replaces the plain Images or Library return state, a toolbar change
while sources load keeps a saved Source and Folder, a state over 4 KB
is refused in the browser with its own toast, the delete confirmation
skips its failure toast after the page is gone, the Edit dialog reuses
the shared field helper, and quick star toggles coalesce into one
Favorites count read.

* test(views): cover leaving a pending saved view and add its coverage floor

A saved view left while the list or a rename is still pending leaves
the next page alone; the shell drops two unreachable heading guards.
workspace/saved-views.mjs gets its frontend coverage baseline entry;
no existing floor changes.

* fix(views): a corrupt saved-view state no longer blocks startup

At startup a saved_views row whose state is not a JSON object is
logged as a warning by id only and left in place. The listing and
rename skip it, so its #/saved/<id> link behaves like a missing view.
Restore stays strict and still rejects a backup holding such a row.
2026-10-21 09:10:18 -07:00

355 lines
25 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
const test = require('node:test');
const assert = require('node:assert/strict');
const source = import('../../web/js/workspace/images-state.mjs');
const image = (path, root_index = 0) => ({path, root_index, id:'same-hash'});
const page = (images, total = images.length, next_cursor = null) => ({images, total, next_cursor, has_more:next_cursor !== null});
const deferred = () => { let resolve, reject; const promise = new Promise((a,b) => {resolve=a;reject=b;}); return {promise,resolve,reject}; };
test('stream serializes allowed filters, appends distinct rooted paths, and emits immutable snapshots', async () => {
const { createImageStream, imageKey } = await source;
const calls = [], states = [];
const pages = [page([image('a'),image('a',1)],3,'next'), page([image('a',1),image('b')],3)];
const stream = createImageStream({api:{get:async (url, options) => { calls.push([url, options]);return pages.shift(); }},onChange:s => states.push(s),batchSize:2});
assert.equal(await stream.reset({q:'a & b',root:0,media:'image',sort:'oldest',subfolder:'nested/one',ignored:'unsafe'}), 2);
const query = new URL(calls[0][0],'http://local').searchParams;
assert.equal(query.get('q'),'a & b'); assert.equal(query.get('root'),'0');
assert.equal(query.get('subfolder'),'nested/one'); assert.equal(query.get('mode'),'workspace');
assert.equal(query.get('limit'),'2'); assert.equal(query.has('cursor'),false); assert.equal(query.has('ignored'),false);
assert.ok(calls[0][1].signal instanceof AbortSignal);
assert.equal(imageKey(image('a',0)),'0:a'); assert.notEqual(imageKey(image('a',0)), imageKey(image('a',1)));
const first = stream.state;
assert.ok(Object.isFrozen(first)); assert.ok(Object.isFrozen(first.items)); assert.ok(Object.isFrozen(first.items[0]));
const more = stream.loadMore();
assert.strictEqual(stream.state.items,first.items);
assert.equal(await more,1);
assert.equal(new URL(calls[1][0],'http://local').searchParams.get('cursor'),'next');
assert.deepEqual(stream.state.items.map(imageKey),['0:a','1:a','0:b']);
assert.equal(stream.state.loaded,3); assert.equal(stream.state.total,3); assert.equal(stream.state.hasMore,false);
assert.equal(await stream.loadMore(),0); assert.equal(calls.length,2);
assert.equal(first.items.length,2); assert.equal(states.at(-1),stream.state);
});
test('reset aborts pending requests and ignores stale success and failure', async () => {
const { createImageStream } = await source;
const requests=[]; const states=[];
const stream=createImageStream({api:{get:(url,{signal})=>{const d=deferred();requests.push({...d,url,signal});return d.promise;}},onChange:s=>states.push(s)});
const old=stream.reset({q:'old'}); const fresh=stream.reset({q:'fresh'});
assert.equal(requests[0].signal.aborted,true);
requests[1].resolve(page([image('fresh')]));await fresh;
requests[0].resolve(page([image('old')])); assert.equal(await old,0);
assert.equal(stream.state.items[0].path,'fresh');
const failing=stream.reset({q:'failure'}); const newest=stream.reset();
requests[2].reject(new Error('stale'));requests[3].resolve(page([]));
await Promise.all([failing,newest]);assert.equal(stream.state.error,null);
assert.equal(stream.state.loading,false);
});
test('deferred reset cancels stale source work without fetching until discovery succeeds', async () => {
const {createImageStream}=await source;const requests=[];
const stream=createImageStream({api:{get:(url,{signal})=>{const d=deferred();requests.push({...d,url,signal});return d.promise;}}});
const old=stream.reset({root:1,subfolder:'old'});
const deferredReset=stream.reset({root:'all',q:'png',media:'image',sort:'name'},{load:false});
assert.equal(requests[0].signal.aborted,true);assert.equal(requests.length,1);
assert.equal(await deferredReset,0);
assert.equal(stream.state.items.length,0);assert.equal(stream.state.cursor,null);assert.equal(stream.state.loading,false);
requests[0].resolve(page([image('old',1)],2,'stale'));assert.equal(await old,0);assert.equal(stream.state.items.length,0);
const fresh=stream.loadMore();assert.equal(requests.length,2);
const query=new URL(requests[1].url,'http://local').searchParams;
assert.equal(query.has('root'),false);assert.equal(query.has('subfolder'),false);assert.equal(query.get('q'),'png');assert.equal(query.get('media'),'image');assert.equal(query.get('sort'),'name');
requests[1].resolve(page([image('fresh',0)]));assert.equal(await fresh,1);assert.equal(stream.state.items[0].path,'fresh');
stream.dispose();assert.equal(await stream.reset({}, {load:false}),0);assert.equal(requests.length,2);
});
test('concurrent loads do not duplicate requests, and failures retain data and cursor for retry', async () => {
const {createImageStream}=await source; const pending=deferred(); const calls=[];
const responses=[page([image('a')],2,'next'),pending.promise,page([image('b')],2)];
const stream=createImageStream({api:{get:async url=>{calls.push(url);return responses.shift();}}});
await stream.reset();const more=stream.loadMore();assert.equal(await stream.loadMore(),0);assert.equal(calls.length,2);
pending.reject(new Error('offline'));assert.equal(await more,0);
assert.equal(stream.state.items.length,1);assert.equal(stream.state.cursor,'next');assert.equal(stream.state.error.message,'offline');
assert.equal(stream.state.hasMore,true);assert.equal(await stream.loadMore(),1);assert.equal(stream.state.error,null);
assert.equal(calls[1],calls[2]);
});
test('malformed pages fail atomically and allow retry without corrupting the stream', async () => {
const {createImageStream}=await source;
for(const invalid of [null,{},page('bad'),page([{}]),page([image('')]),page([image('x',-1)]),page([], -1),{...page([]),has_more:'yes'},page([],2,''),{...page([],2,'next'),has_more:false}]) {
const replies=[page([image('existing')],2,'next'),invalid,page([image('fixed')],2)];
const stream=createImageStream({api:{get:async()=>replies.shift()}});await stream.reset();
await stream.loadMore();assert.match(stream.state.error.message,/image|page|cursor/i);
assert.equal(stream.state.items[0].path,'existing'); assert.equal(stream.state.cursor,'next');
await stream.loadMore();assert.equal(stream.state.items.length,2);assert.equal(stream.state.error,null);
}
});
test('duplicate pages can advance cursors, but repeated cursors fail instead of looping', async () => {
const {createImageStream}=await source;
const replies=[page([image('a')],2,'one'),page([image('a')],2,'two'),page([image('b')],2,'two')];
const stream=createImageStream({api:{get:async()=>replies.shift()}});await stream.reset();
assert.equal(await stream.loadMore(),0);assert.equal(stream.state.cursor,'two');assert.equal(stream.state.hasMore,true);
await stream.loadMore();assert.match(stream.state.error.message,/cursor/i);assert.equal(stream.state.items.length,1);
});
test('dispose aborts the active request and suppresses notifications and further requests', async () => {
const {createImageStream}=await source;const d=deferred();let signal,count=0,notifications=0;
const stream=createImageStream({api:{get:(url,opts)=>{signal=opts.signal;count++;return d.promise;}},onChange:()=>notifications++});
const request=stream.reset();stream.dispose();stream.dispose();assert.equal(signal.aborted,true);
const before=notifications;d.reject(Object.assign(new Error('aborted'),{name:'AbortError'}));await request;
assert.equal(notifications,before);assert.equal(await stream.reset(),0);assert.equal(await stream.loadMore(),0);assert.equal(count,1);
});
test('stream validates constructor and filter input before requesting', async () => {
const {createImageStream}=await source;
assert.throws(()=>createImageStream({api:{}}),/api/i);
for(const batchSize of [0,-1,1.5,Infinity,201]) assert.throws(()=>createImageStream({api:{get(){}},batchSize}),/batch/i);
const stream=createImageStream({api:{get:async()=>page([])}});
for(const filters of [{root:-1},{root:'oops'},{media:'executable'},{sort:'random'},{q:{}},{subfolder:[]}]) await assert.rejects(stream.reset(filters),/filter/i);
await stream.reset({root:'all',media:'all',sort:'newest'});assert.equal(stream.state.hasMore,false);
});
test('the metadata stream retains earlier images beyond one rendered window and deduplicates within a batch', async () => {
const {createImageStream}=await source;
let request=0;
const stream=createImageStream({api:{get:async()=>{
const start=request++*40;
return page(Array.from({length:40},(_,index)=>image(`image-${start+index}`)),320,start+40<320?String(start+40):null);
}}});
await stream.reset();
while(stream.state.hasMore) await stream.loadMore();
assert.equal(stream.state.loaded,320);assert.equal(stream.state.items[0].path,'image-0');
assert.equal(stream.state.items.at(-1).path,'image-319');
const duplicate=createImageStream({api:{get:async()=>page([image('a'),image('a')],1)}});
assert.equal(await duplicate.reset(),1);assert.equal(duplicate.state.items.length,1);
});
test('all-source defaults are omitted and descending name sort remains supported', async () => {
const {createImageStream}=await source;let query;
const stream=createImageStream({api:{get:async url=>{query=new URL(url,'http://local').searchParams;return page([]);}}});
await stream.reset({root:'all',media:'all',sort:'name-desc'});
assert.equal(query.has('root'),false);assert.equal(query.has('media'),false);
assert.equal(query.get('sort'),'name-desc');assert.equal(query.get('limit'),'40');
assert.equal(query.has('favorites'),false);
});
test('the Favorites page asks the listing for favorites only (#249 D51)', async () => {
const {createImageStream}=await source;let query;
const stream=createImageStream({api:{get:async url=>{query=new URL(url,'http://local').searchParams;return page([]);}}});
await stream.reset({favorites:true,q:'fog'});
assert.equal(query.get('favorites'),'1');assert.equal(query.get('q'),'fog');
await stream.reset({favorites:false});
assert.equal(query.has('favorites'),false);
for(const favorites of ['1',1,'true'])await assert.rejects(stream.reset({favorites}),/Invalid favorites filter/);
});
test('restored browsing state resumes its cursor and filters without an initial request', async () => {
const {createImageStream}=await source;
const calls=[];
const cachedItems=[image('existing')];
const cache={filters:{q:'saved search',root:1,sort:'oldest',media:'image',subfolder:'nested'},state:{items:cachedItems,total:3,cursor:'saved-cursor',hasMore:true,loaded:1,loading:true,error:new Error('old error')}};
const stream=createImageStream({api:{get:async url=>{calls.push(url);return page([image('existing'),image('new')],3,'next');}},restore:cache});
assert.equal(calls.length,0);assert.equal(stream.state.items.length,1);
assert.equal(stream.state.loading,false);assert.equal(stream.state.error,null);
assert.ok(Object.isFrozen(stream.state));assert.ok(Object.isFrozen(stream.state.items));assert.ok(Object.isFrozen(stream.state.items[0]));
cachedItems[0].path='external mutation';cachedItems.push(image('external'));
assert.equal(stream.state.items[0].path,'existing');assert.equal(stream.state.items.length,1);
assert.equal(await stream.loadMore(),1);
const query=new URL(calls[0],'http://local').searchParams;
for(const [key,value] of Object.entries({q:'saved search',root:'1',sort:'oldest',media:'image',subfolder:'nested',cursor:'saved-cursor'})) assert.equal(query.get(key),value);
assert.deepEqual(stream.state.items.map(item=>item.path),['existing','new']);
await stream.reset({q:'new search'});
assert.equal(new URL(calls[1],'http://local').searchParams.has('cursor'),false);
assert.equal(new URL(calls[1],'http://local').searchParams.get('q'),'new search');
stream.dispose();assert.equal(await stream.loadMore(),0);
});
test('restoring frozen state reuses immutable metadata and respects a completed collection', async () => {
const {createImageStream}=await source;
const first=createImageStream({api:{get:async()=>page([image('saved')])}});
await first.reset();let requests=0;
const restored=createImageStream({api:{get:async()=>{requests++;return page([]);}},restore:{filters:{},state:first.state}});
assert.strictEqual(restored.state.items,first.state.items);assert.equal(restored.state.loaded,1);
assert.equal(await restored.loadMore(),0);assert.equal(requests,0);
});
test('restored interrupted initial loading can restart from the first request',async()=>{
const {createImageStream}=await source;let called=0;
const stream=createImageStream({api:{get:async url=>{called++;assert.equal(new URL(url,'http://local').searchParams.has('cursor'),false);return page([]);}},
restore:{filters:{},state:{items:[],total:0,cursor:null,hasMore:true,loading:true}}});
assert.equal(called,0);assert.equal(await stream.loadMore(),0);assert.equal(called,1);assert.equal(stream.state.hasMore,false);
});
test('malformed restored state is rejected before making requests',async()=>{
const {createImageStream}=await source;
const base={items:[image('a')],total:2,cursor:'saved',hasMore:true};
const invalid=[null,{}, {filters:{},state:null},
...[{items:'bad'},{items:[{}]},{items:[image('a'),image('a')]},{total:-1},{cursor:''},{cursor:null},{hasMore:'yes'},{hasMore:false}].map(change=>({filters:{},state:{...base,...change}})),
{filters:{root:-1},state:base}, {filters:null,state:base}];
for(const restore of invalid) assert.throws(()=>createImageStream({api:{get(){assert.fail('unexpected request');}},restore}),TypeError);
});
test('custom collection pages reuse image-stream cancellation, cursors and identity checks',async()=>{
const {createImageStream}=await source;const calls=[];
const stream=createImageStream({fetchPage:async({parameters,signal})=>{calls.push({parameters,signal});return calls.length===1?page([image('linked.png')],2,'next'):page([image('other.png')],2);},batchSize:1});
assert.equal(await stream.reset(),1);assert.equal(calls[0].parameters.get('limit'),'1');assert.ok(calls[0].signal instanceof AbortSignal);
assert.equal(await stream.loadMore(),1);assert.equal(calls[1].parameters.get('cursor'),'next');assert.equal(stream.state.loaded,2);stream.dispose();
assert.throws(()=>createImageStream({api:{get:async()=>{}},fetchPage:'invalid'}),/page/i);
});
test('stream sends category, tags and the rating sort and validates them', async () => {
const {createImageStream}=await source;const calls=[];
const stream=createImageStream({api:{get:async url=>{calls.push(new URL(url,'http://local').searchParams);return page([]);}}});
await stream.reset({q:'cat',category:'Animals',tags:['cats','studio'],sort:'rating'});
assert.equal(calls[0].get('category'),'Animals');assert.equal(calls[0].get('tags'),'cats,studio');assert.equal(calls[0].get('sort'),'rating');
await stream.reset({category:'',tags:[]});
assert.equal(calls[1].has('category'),false);assert.equal(calls[1].has('tags'),false);
for(const filters of [{category:3},{tags:'cats'},{tags:[1]},{tags:['a,b']},{tags:['']}]) await assert.rejects(stream.reset(filters),/filter/i);
});
test('positive count comes from the first page, survives plain cursor pages and hides when unknown', async () => {
const {createImageStream}=await source;
const replies=[{...page([image('a')],3,'one'),positive_count:2},page([image('b')],3,'two'),{...page([image('c')],3),positive_count:null}];
const stream=createImageStream({api:{get:async()=>replies.shift()}});
assert.equal(stream.state.positiveCount,null);
await stream.reset();assert.equal(stream.state.positiveCount,2);
await stream.loadMore();assert.equal(stream.state.positiveCount,2);
await stream.loadMore();assert.equal(stream.state.positiveCount,2);
const failed=createImageStream({api:{get:async()=>({...page([image('a')]),positive_count:null})}});
await failed.reset();assert.equal(failed.state.positiveCount,null);
const absent=createImageStream({api:{get:async()=>page([image('a')])}});
await absent.reset();assert.equal(absent.state.positiveCount,null);
for(const positive_count of [-1,'2',1.5]) {
const invalid=createImageStream({api:{get:async()=>({...page([image('a')]),positive_count})}});
await invalid.reset();assert.match(invalid.state.error.message,/page/i);
}
const restored=createImageStream({api:{get(){assert.fail('unexpected request');}},restore:{filters:{},state:{...stream.state}}});
assert.equal(restored.state.positiveCount,2);
assert.throws(()=>createImageStream({api:{get(){}},restore:{filters:{},state:{...stream.state,positiveCount:-3}}}),TypeError);
});
test('the count line reads N of M images and K positive prompts only when known', async () => {
const {countLine}=await source;
assert.equal(countLine({loaded:40,total:102,positiveCount:2}),'40 of 102 images · 2 positive prompts');
assert.equal(countLine({loaded:1,total:1,positiveCount:1}),'1 of 1 image · 1 positive prompt');
assert.equal(countLine({loaded:2,total:2,positiveCount:null}),'2 of 2 images');
assert.equal(countLine({loaded:1200,total:3400,positiveCount:0}),'1,200 of 3,400 images · 0 positive prompts');
});
test('the caption date names the newest result day under Newest first only', async () => {
const {captionDate}=await source;
const now=new Date(2026,9,17,15,0);
const at=(...parts)=>({modified_time:new Date(...parts).getTime()/1000});
assert.equal(captionDate([at(2026,9,17,9),at(2026,9,10)],'newest',now),'Today · October 17');
assert.equal(captionDate([at(2026,9,16,23),at(2026,9,10)],'newest',now),'Yesterday · October 16');
// D17 ruling: only under Newest first; Oldest first hides the date too.
assert.equal(captionDate([at(2026,9,10),at(2026,9,16,23)],'oldest',now),'');
assert.equal(captionDate([at(2026,9,13)],'newest',now),'Tuesday · October 13');
assert.equal(captionDate([at(2025,2,3)],'newest',now),'Monday · March 3, 2025');
for(const sort of ['name','name-desc','rating']) assert.equal(captionDate([at(2026,9,17)],sort,now),'');
assert.equal(captionDate([],'newest',now),'');
assert.equal(captionDate([{modified_time:'bad'}],'newest',now),'');
});
test('the scope chip summarizes source and folder', async () => {
const {scopeLabel}=await source;
const roots=[{index:0,label:'output'},{index:1,label:'input'}];
assert.equal(scopeLabel({root:'all',subfolder:''},roots),'All output folders');
assert.equal(scopeLabel({root:'1',subfolder:'shared'},roots),'input · shared');
assert.equal(scopeLabel({root:'0',subfolder:''},roots),'output · All output folders');
assert.equal(scopeLabel({root:'all',subfolder:'bulk'},roots),'All sources · bulk');
assert.equal(scopeLabel({root:'7',subfolder:''},roots),'Source 7 · All output folders');
});
test('the Filters count names each active Refine filter once (D44)', async () => {
const {activeRefinements}=await source;
assert.equal(activeRefinements({root:'all',subfolder:'',media:'all',tags:[]}),0);
assert.equal(activeRefinements({root:'',subfolder:'',media:'all',tags:[]}),0);
assert.equal(activeRefinements({root:'1',subfolder:'',media:'all',tags:[]}),1);
assert.equal(activeRefinements({root:'all',subfolder:'bulk',media:'video',tags:['a','b']}),3);
assert.equal(activeRefinements({root:'0',subfolder:'bulk',media:'image',tags:['a']}),4);
});
test('the card title is the confirmed linked title, else the filename (D10)', async () => {
const {cardTitle}=await source;
const linked=(status,title)=>({filename:'alpine_00001.png',linked:{status,positive_id:1,title,title_source:'title',category:null,rating:null}});
assert.equal(cardTitle(linked('linked','Alpine observatory')),'Alpine observatory');
for (const status of ['ambiguous','unlinked','unavailable','none']) assert.equal(cardTitle(linked(status,'Alpine observatory')),'alpine_00001.png');
assert.equal(cardTitle(linked('linked',null)),'alpine_00001.png');
assert.equal(cardTitle(linked('linked','')),'alpine_00001.png');
assert.equal(cardTitle({filename:'plain.png'}),'plain.png');
assert.equal(cardTitle({filename:'plain.png',linked:null}),'plain.png');
});
test('the card subtitle is W × H · EXT · Seed N with unknown parts omitted (D11)', async () => {
const {cardSubtitle, mediaRatio}=await source;
assert.equal(cardSubtitle({filename:'a.png',width:1536,height:1152,seed:'42001'}),'1536 × 1152 · PNG · Seed 42001');
// The seed is the listing's decimal string: never a Number, so 2^53 + 1 survives.
assert.equal(cardSubtitle({filename:'a.png',width:8,height:8,seed:'9007199254740993'}),'8 × 8 · PNG · Seed 9007199254740993');
assert.equal(cardSubtitle({filename:'clip.webm',width:null,height:null,seed:null}),'WEBM');
assert.equal(cardSubtitle({filename:'clip.mp4',media_type:'video',width:640,height:360}),'640 × 360 · MP4');
assert.equal(cardSubtitle({filename:'noext',width:0,height:10,seed:''}),'');
assert.equal(cardSubtitle({filename:'.hidden',width:10,height:Infinity,seed:42}),'');
assert.equal(cardSubtitle({filename:'trailing.',seed:'7'}),'Seed 7');
assert.equal(mediaRatio({width:1536,height:1152}),'1536/1152');
for (const image of [{}, {width:0,height:5}, {width:5,height:NaN}, {width:Infinity,height:5}]) assert.equal(mediaRatio(image),'4/3');
});
test('updating one item replaces it immutably and later pages append after it', async () => {
const { createImageStream, imageKey } = await source;
const pages = [page([{...image('a'), favorite:false}, {...image('b'), favorite:true}], 3, 'next'), page([image('c')], 3)];
const states = [];
const hints = [];
const stream = createImageStream({api:{get:async () => pages.shift()}, onChange:(s, hint) => { states.push(s); hints.push(hint); }, batchSize:2});
await stream.reset({});
const before = stream.state, notified = states.length;
// Page loads carry no hint; a patch says so, so the page can repaint one card instead of laying out the collection.
assert.ok(hints.every(hint => hint === undefined));
assert.equal(stream.updateItem('0:a', {favorite:true}), true);
const after = stream.state;
assert.equal(states.length, notified + 1); assert.equal(states.at(-1), after);
assert.deepEqual(hints.at(-1), {patch:'0:a'});
assert.notEqual(after.items, before.items); assert.ok(Object.isFrozen(after.items)); assert.ok(Object.isFrozen(after.items[0]));
assert.equal(after.items[0].favorite, true); assert.equal(before.items[0].favorite, false);
assert.equal(after.items[1], before.items[1]);
assert.equal(after.loaded, before.loaded); assert.equal(after.cursor, before.cursor); assert.equal(after.total, before.total);
// Identity fields cannot be patched, and an unknown key changes nothing.
assert.throws(() => stream.updateItem('0:a', {path:'z'}), TypeError);
assert.throws(() => stream.updateItem('0:a', {root_index:1}), TypeError);
assert.equal(stream.updateItem('0:missing', {favorite:true}), false);
assert.equal(stream.state, after); assert.equal(states.length, notified + 1);
await stream.loadMore();
assert.deepEqual(stream.state.items.map(imageKey), ['0:a', '0:b', '0:c']);
assert.equal(stream.state.items[0].favorite, true);
stream.dispose();
assert.equal(stream.updateItem('0:b', {favorite:false}), false);
assert.equal(stream.state.items[1].favorite, true);
});
test('withItem patches a saved browsing state without touching the other items', async () => {
const { withItem } = await source;
const items = Object.freeze([Object.freeze({...image('a'), favorite:false}), Object.freeze({...image('b'), favorite:false})]);
const state = Object.freeze({items, total:2, cursor:null, hasMore:false, loading:false, error:null, loaded:2, positiveCount:null});
const next = withItem(state, '0:b', {favorite:true});
assert.ok(Object.isFrozen(next)); assert.equal(next.items[1].favorite, true); assert.equal(next.items[0], items[0]);
assert.equal(state.items[1].favorite, false);
assert.equal(withItem(state, '1:b', {favorite:true}), state);
});
test('toggleSelection returns a new frozen set and leaves the given one untouched', async () => {
const { toggleSelection } = await source;
const empty = Object.freeze(new Set());
const one = toggleSelection(empty, '0:a', true);
assert.ok(Object.isFrozen(one)); assert.deepEqual([...one], ['0:a']); assert.equal(empty.size, 0);
const two = toggleSelection(one, '1:a', true);
assert.deepEqual([...two], ['0:a', '1:a']); assert.deepEqual([...one], ['0:a']);
assert.equal(toggleSelection(two, '0:a', true), two, 'an already selected key keeps the same set');
assert.equal(toggleSelection(one, '9:z', false), one, 'an unselected key keeps the same set');
assert.deepEqual([...toggleSelection(two, '0:a', false)], ['1:a']);
});
test('selectionLabel counts the selected images as the concept bar does', async () => {
const { selectionLabel } = await source;
assert.equal(selectionLabel(1), '1 selected');
assert.equal(selectionLabel(2), '2 selected');
assert.equal(selectionLabel(1234), '1,234 selected');
});