zero-query 0.9.6 → 0.9.8

package/src/component.js

@@ -502,11 +502,14 @@ class Component {
     this._bindRefs();
     this._bindModels();
 
-    // Restore focus if the morph replaced the focused element
+    // Restore focus if the morph replaced the focused element.
+    // Always restore selectionRange — even when the element is still
+    // the activeElement — because _bindModels or morph attribute syncing
+    // can alter the value and move the cursor.
     if (_focusInfo) {
       const el = this._el.querySelector(_focusInfo.selector);
-      if (el && el !== document.activeElement) {
-        el.focus();
+      if (el) {
+        if (el !== document.activeElement) el.focus();
         try {
           if (_focusInfo.start !== null && _focusInfo.start !== undefined) {
             el.setSelectionRange(_focusInfo.start, _focusInfo.end, _focusInfo.dir);

package/src/diff.js

@@ -89,6 +89,11 @@ export function morphElement(oldEl, newHTML) {
   return clone;
 }
 
+// Aliases for the concat build — core.js imports these as _morph / _morphElement,
+// but the build strips `import … as` lines, so the aliases must exist at runtime.
+const _morph = morph;
+const _morphElement = morphElement;
+
 /**
  * Reconcile children of `oldParent` to match `newParent`.
  *
@@ -434,6 +439,13 @@ function _morphAttributes(oldEl, newEl) {
 
 /**
  * Sync input element value, checked, disabled states.
+ *
+ * Only updates the value when the new HTML explicitly carries a `value`
+ * attribute.  Templates that use z-model manage values through reactive
+ * state + _bindModels — the morph engine should not interfere by wiping
+ * a live input's content to '' just because the template has no `value`
+ * attr.  This prevents the wipe-then-restore cycle that resets cursor
+ * position on every keystroke.
  */
 function _syncInputValue(oldEl, newEl) {
   const type = (oldEl.type || '').toLowerCase();
@@ -441,8 +453,9 @@ function _syncInputValue(oldEl, newEl) {
   if (type === 'checkbox' || type === 'radio') {
     if (oldEl.checked !== newEl.checked) oldEl.checked = newEl.checked;
   } else {
-    if (oldEl.value !== (newEl.getAttribute('value') || '')) {
-      oldEl.value = newEl.getAttribute('value') || '';
+    const newVal = newEl.getAttribute('value');
+    if (newVal !== null && oldEl.value !== newVal) {
+      oldEl.value = newVal;
     }
   }
 

package/src/http.js

@@ -165,6 +165,7 @@ export const http = {
   put:     (url, data, opts)    => request('PUT', url, data, opts),
   patch:   (url, data, opts)    => request('PATCH', url, data, opts),
   delete:  (url, data, opts)    => request('DELETE', url, data, opts),
+  head:    (url, opts)          => request('HEAD', url, undefined, opts),
 
   /**
    * Configure defaults
@@ -175,20 +176,56 @@ export const http = {
     if (opts.timeout !== undefined) _config.timeout = opts.timeout;
   },
 
+  /**
+   * Read-only snapshot of current configuration
+   */
+  getConfig() {
+    return {
+      baseURL: _config.baseURL,
+      headers: { ..._config.headers },
+      timeout: _config.timeout,
+    };
+  },
+
   /**
    * Add request interceptor
    * @param {Function} fn — (fetchOpts, url) → void | false | { url, options }
+   * @returns {Function} unsubscribe function
    */
   onRequest(fn) {
     _interceptors.request.push(fn);
+    return () => {
+      const idx = _interceptors.request.indexOf(fn);
+      if (idx !== -1) _interceptors.request.splice(idx, 1);
+    };
   },
 
   /**
    * Add response interceptor
    * @param {Function} fn — (result) → void
+   * @returns {Function} unsubscribe function
    */
   onResponse(fn) {
     _interceptors.response.push(fn);
+    return () => {
+      const idx = _interceptors.response.indexOf(fn);
+      if (idx !== -1) _interceptors.response.splice(idx, 1);
+    };
+  },
+
+  /**
+   * Clear interceptors — all, or just 'request' / 'response'
+   */
+  clearInterceptors(type) {
+    if (!type || type === 'request') _interceptors.request.length = 0;
+    if (!type || type === 'response') _interceptors.response.length = 0;
+  },
+
+  /**
+   * Run multiple requests in parallel
+   */
+  all(requests) {
+    return Promise.all(requests);
   },
 
   /**

package/tests/cli.test.js

@@ -454,3 +454,307 @@ describe('CLI — flag/option extra', () => {
     expect(flag('watch', 'w')).toBe(true);
   });
 });
+
+
+// ===========================================================================
+// createProject — scaffold command
+// ===========================================================================
+
+describe('CLI — createProject', () => {
+  const fs = require('fs');
+  const path = require('path');
+  const os = require('os');
+
+  let createProject;
+
+  beforeEach(async () => {
+    vi.resetModules();
+    const mod = await import('../cli/commands/create.js');
+    createProject = mod.default || mod;
+  });
+
+  function tmpDir() {
+    const dir = path.join(os.tmpdir(), 'zq-create-' + Date.now() + '-' + Math.random().toString(36).slice(2, 8));
+    fs.mkdirSync(dir, { recursive: true });
+    return dir;
+  }
+
+  function cleanup(dir) {
+    if (fs.existsSync(dir)) fs.rmSync(dir, { recursive: true, force: true });
+  }
+
+  // -- scaffold variant directories exist --
+
+  it('default scaffold directory exists', () => {
+    const dir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default');
+    expect(fs.existsSync(dir)).toBe(true);
+  });
+
+  it('minimal scaffold directory exists', () => {
+    const dir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal');
+    expect(fs.existsSync(dir)).toBe(true);
+  });
+
+  // -- default scaffold contains expected files --
+
+  it('default scaffold has index.html', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default', 'index.html');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  it('default scaffold has app/app.js', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default', 'app', 'app.js');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  it('default scaffold has app/routes.js', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default', 'app', 'routes.js');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  it('default scaffold has app/store.js', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default', 'app', 'store.js');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  // -- minimal scaffold contains expected files --
+
+  it('minimal scaffold has index.html', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal', 'index.html');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  it('minimal scaffold has app/app.js', () => {
+    const f = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal', 'app', 'app.js');
+    expect(fs.existsSync(f)).toBe(true);
+  });
+
+  it('minimal scaffold has 4 components', () => {
+    const dir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal', 'app', 'components');
+    const files = fs.readdirSync(dir).sort();
+    expect(files).toEqual(['about.js', 'counter.js', 'home.js', 'not-found.js']);
+  });
+
+  // -- minimal scaffold is a subset of default --
+
+  it('minimal scaffold has fewer files than default', () => {
+    function countFiles(dir) {
+      let count = 0;
+      for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        if (entry.isDirectory()) count += countFiles(path.join(dir, entry.name));
+        else count++;
+      }
+      return count;
+    }
+    const defDir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default');
+    const minDir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal');
+    expect(countFiles(minDir)).toBeLessThan(countFiles(defDir));
+  });
+
+  // -- {{NAME}} replacement --
+
+  it('scaffold templates contain {{NAME}} placeholder', () => {
+    const html = fs.readFileSync(
+      path.resolve(__dirname, '..', 'cli', 'scaffold', 'default', 'index.html'), 'utf-8'
+    );
+    expect(html).toContain('{{NAME}}');
+  });
+
+  it('minimal scaffold templates contain {{NAME}} placeholder', () => {
+    const html = fs.readFileSync(
+      path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal', 'index.html'), 'utf-8'
+    );
+    expect(html).toContain('{{NAME}}');
+  });
+
+  // -- walkDir functionality (tested via module internals) --
+
+  it('scaffolds default project into a target directory', () => {
+    const target = tmpDir();
+    const projDir = path.join(target, 'test-app');
+
+    // Simulate: process.argv for default (no --minimal)
+    process.argv = ['node', 'zquery', 'create', 'test-app'];
+    vi.resetModules();
+
+    // We can't easily call createProject because it uses process.exit.
+    // Instead, test the walkDir + copy logic directly.
+    const scaffoldDir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'default');
+
+    function walkDir(dir, prefix = '') {
+      const entries = [];
+      for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        const rel = prefix ? `${prefix}/${entry.name}` : entry.name;
+        if (entry.isDirectory()) entries.push(...walkDir(path.join(dir, entry.name), rel));
+        else entries.push(rel);
+      }
+      return entries;
+    }
+
+    const files = walkDir(scaffoldDir);
+    expect(files.length).toBeGreaterThan(5);
+    expect(files).toContain('index.html');
+    expect(files).toContain('global.css');
+    expect(files).toContain('app/app.js');
+    expect(files).toContain('app/routes.js');
+    expect(files).toContain('app/store.js');
+
+    cleanup(target);
+  });
+
+  it('walkDir lists minimal scaffold files correctly', () => {
+    const scaffoldDir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal');
+
+    function walkDir(dir, prefix = '') {
+      const entries = [];
+      for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        const rel = prefix ? `${prefix}/${entry.name}` : entry.name;
+        if (entry.isDirectory()) entries.push(...walkDir(path.join(dir, entry.name), rel));
+        else entries.push(rel);
+      }
+      return entries;
+    }
+
+    const files = walkDir(scaffoldDir);
+    expect(files).toContain('index.html');
+    expect(files).toContain('global.css');
+    expect(files).toContain('app/app.js');
+    expect(files).toContain('app/routes.js');
+    expect(files).toContain('app/store.js');
+    expect(files).toContain('app/components/home.js');
+    expect(files).toContain('app/components/counter.js');
+    expect(files).toContain('app/components/about.js');
+    expect(files).toContain('app/components/not-found.js');
+    expect(files).toContain('assets/.gitkeep');
+  });
+
+  // -- {{NAME}} replacement in copied files --
+
+  it('replaces {{NAME}} in copied scaffold files', () => {
+    const target = tmpDir();
+    const scaffoldDir = path.resolve(__dirname, '..', 'cli', 'scaffold', 'minimal');
+    const projectName = 'my-cool-app';
+
+    function walkDir(dir, prefix = '') {
+      const entries = [];
+      for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        const rel = prefix ? `${prefix}/${entry.name}` : entry.name;
+        if (entry.isDirectory()) entries.push(...walkDir(path.join(dir, entry.name), rel));
+        else entries.push(rel);
+      }
+      return entries;
+    }
+
+    const files = walkDir(scaffoldDir);
+
+    for (const rel of files) {
+      let content = fs.readFileSync(path.join(scaffoldDir, rel), 'utf-8');
+      content = content.replace(/\{\{NAME\}\}/g, projectName);
+      const dest = path.join(target, rel);
+      fs.mkdirSync(path.dirname(dest), { recursive: true });
+      fs.writeFileSync(dest, content, 'utf-8');
+    }
+
+    const html = fs.readFileSync(path.join(target, 'index.html'), 'utf-8');
+    expect(html).toContain(projectName);
+    expect(html).not.toContain('{{NAME}}');
+
+    const appJs = fs.readFileSync(path.join(target, 'app', 'app.js'), 'utf-8');
+    expect(appJs).toContain(projectName);
+    expect(appJs).not.toContain('{{NAME}}');
+
+    cleanup(target);
+  });
+
+  // -- conflict detection --
+
+  it('conflicts array detects existing files', () => {
+    const target = tmpDir();
+    fs.writeFileSync(path.join(target, 'index.html'), 'existing');
+    fs.mkdirSync(path.join(target, 'app'), { recursive: true });
+
+    const conflicts = ['index.html', 'global.css', 'app', 'assets'].filter(f =>
+      fs.existsSync(path.join(target, f))
+    );
+
+    expect(conflicts).toContain('index.html');
+    expect(conflicts).toContain('app');
+    expect(conflicts).not.toContain('global.css');
+    expect(conflicts).not.toContain('assets');
+
+    cleanup(target);
+  });
+
+  it('no conflicts in empty directory', () => {
+    const target = tmpDir();
+
+    const conflicts = ['index.html', 'global.css', 'app', 'assets'].filter(f =>
+      fs.existsSync(path.join(target, f))
+    );
+
+    expect(conflicts).toHaveLength(0);
+
+    cleanup(target);
+  });
+
+  // -- flag parsing for --minimal --
+
+  it('--minimal flag resolves to minimal variant', async () => {
+    process.argv = ['node', 'zquery', 'create', '--minimal', 'my-app'];
+    vi.resetModules();
+    const { flag } = await import('../cli/args.js');
+    expect(flag('minimal', 'm')).toBe(true);
+  });
+
+  it('-m short flag resolves to minimal variant', async () => {
+    process.argv = ['node', 'zquery', 'create', '-m', 'my-app'];
+    vi.resetModules();
+    const { flag } = await import('../cli/args.js');
+    expect(flag('minimal', 'm')).toBe(true);
+  });
+
+  it('no flag defaults to default variant', async () => {
+    process.argv = ['node', 'zquery', 'create', 'my-app'];
+    vi.resetModules();
+    const { flag } = await import('../cli/args.js');
+    expect(flag('minimal', 'm')).toBe(false);
+  });
+
+  // -- dirArg parsing skips flags --
+
+  it('dirArg parsing skips flag args', () => {
+    const args = ['create', '--minimal', 'my-app'];
+    const dirArg = args.slice(1).find(a => !a.startsWith('-'));
+    expect(dirArg).toBe('my-app');
+  });
+
+  it('dirArg parsing returns first positional', () => {
+    const args = ['create', 'my-app'];
+    const dirArg = args.slice(1).find(a => !a.startsWith('-'));
+    expect(dirArg).toBe('my-app');
+  });
+
+  it('dirArg is undefined when no positional given', () => {
+    const args = ['create', '--minimal'];
+    const dirArg = args.slice(1).find(a => !a.startsWith('-'));
+    expect(dirArg).toBeUndefined();
+  });
+
+  it('dirArg with flag after dir name', () => {
+    const args = ['create', 'my-app', '--minimal'];
+    const dirArg = args.slice(1).find(a => !a.startsWith('-'));
+    expect(dirArg).toBe('my-app');
+  });
+
+  // -- help text mentions --minimal --
+
+  it('help text includes --minimal flag', async () => {
+    vi.resetModules();
+    const spy = vi.spyOn(console, 'log').mockImplementation(() => {});
+    const showHelp = (await import('../cli/help.js')).default;
+    showHelp();
+    const text = spy.mock.calls.map(c => c.join(' ')).join('\n');
+    expect(text).toContain('--minimal');
+    spy.mockRestore();
+  });
+});

package/tests/http.test.js

@@ -446,3 +446,203 @@ describe('http — AbortController integration', () => {
     expect(fetchSpy).toHaveBeenCalled();
   });
 });
+
+
+// ===========================================================================
+// HEAD requests
+// ===========================================================================
+
+describe('http.head', () => {
+  it('sends a HEAD request', async () => {
+    mockFetch({});
+    const result = await http.head('https://api.test.com/resource');
+    expect(fetchSpy.mock.calls[0][1].method).toBe('HEAD');
+    expect(result.ok).toBe(true);
+    expect(result.status).toBe(200);
+  });
+
+  it('does not send a body', async () => {
+    mockFetch({});
+    await http.head('https://api.test.com/resource');
+    const opts = fetchSpy.mock.calls[0][1];
+    expect(opts.body).toBeUndefined();
+  });
+
+  it('accepts per-request options', async () => {
+    mockFetch({});
+    await http.head('https://api.test.com/resource', {
+      headers: { 'X-Check': 'exists' },
+    });
+    const opts = fetchSpy.mock.calls[0][1];
+    expect(opts.headers['X-Check']).toBe('exists');
+  });
+
+  it('returns response headers', async () => {
+    mockFetch({});
+    const result = await http.head('https://api.test.com/resource');
+    expect(result.headers).toBeDefined();
+    expect(typeof result.headers).toBe('object');
+  });
+});
+
+
+// ===========================================================================
+// Interceptor unsubscribe
+// ===========================================================================
+
+describe('http — interceptor unsubscribe', () => {
+  it('onRequest returns an unsubscribe function', async () => {
+    http.clearInterceptors();
+    const spy = vi.fn();
+    const unsub = http.onRequest(spy);
+    expect(typeof unsub).toBe('function');
+
+    mockFetch({});
+    await http.get('https://api.test.com/a');
+    expect(spy).toHaveBeenCalledTimes(1);
+
+    unsub();
+    await http.get('https://api.test.com/b');
+    expect(spy).toHaveBeenCalledTimes(1); // not called again
+  });
+
+  it('onResponse returns an unsubscribe function', async () => {
+    http.clearInterceptors();
+    const spy = vi.fn();
+    const unsub = http.onResponse(spy);
+    expect(typeof unsub).toBe('function');
+
+    mockFetch({});
+    await http.get('https://api.test.com/a');
+    expect(spy).toHaveBeenCalledTimes(1);
+
+    unsub();
+    await http.get('https://api.test.com/b');
+    expect(spy).toHaveBeenCalledTimes(1);
+  });
+
+  it('double-unsubscribe is safe', async () => {
+    http.clearInterceptors();
+    const spy = vi.fn();
+    const unsub = http.onRequest(spy);
+    unsub();
+    unsub(); // should not throw
+    mockFetch({});
+    await http.get('https://api.test.com/data');
+    expect(spy).not.toHaveBeenCalled();
+  });
+});
+
+
+// ===========================================================================
+// clearInterceptors
+// ===========================================================================
+
+describe('http.clearInterceptors', () => {
+  it('clears all interceptors when called with no args', async () => {
+    http.clearInterceptors();
+    const reqSpy = vi.fn();
+    const resSpy = vi.fn();
+    http.onRequest(reqSpy);
+    http.onResponse(resSpy);
+
+    http.clearInterceptors();
+    mockFetch({});
+    await http.get('https://api.test.com/data');
+    expect(reqSpy).not.toHaveBeenCalled();
+    expect(resSpy).not.toHaveBeenCalled();
+  });
+
+  it('clears only request interceptors with "request"', async () => {
+    http.clearInterceptors();
+    const reqSpy = vi.fn();
+    const resSpy = vi.fn();
+    http.onRequest(reqSpy);
+    http.onResponse(resSpy);
+
+    http.clearInterceptors('request');
+    mockFetch({});
+    await http.get('https://api.test.com/data');
+    expect(reqSpy).not.toHaveBeenCalled();
+    expect(resSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('clears only response interceptors with "response"', async () => {
+    http.clearInterceptors();
+    const reqSpy = vi.fn();
+    const resSpy = vi.fn();
+    http.onRequest(reqSpy);
+    http.onResponse(resSpy);
+
+    http.clearInterceptors('response');
+    mockFetch({});
+    await http.get('https://api.test.com/data');
+    expect(reqSpy).toHaveBeenCalledTimes(1);
+    expect(resSpy).not.toHaveBeenCalled();
+  });
+});
+
+
+// ===========================================================================
+// http.all — parallel requests
+// ===========================================================================
+
+describe('http.all', () => {
+  it('resolves all parallel requests', async () => {
+    mockFetch({ ok: true });
+    const results = await http.all([
+      http.get('https://api.test.com/a'),
+      http.get('https://api.test.com/b'),
+      http.get('https://api.test.com/c'),
+    ]);
+    expect(results).toHaveLength(3);
+    expect(results.every(r => r.ok)).toBe(true);
+  });
+
+  it('rejects if any request fails', async () => {
+    http.clearInterceptors();
+    mockFetch({ error: 'fail' }, false, 500);
+    await expect(
+      http.all([
+        http.get('https://api.test.com/a'),
+        http.get('https://api.test.com/b'),
+      ])
+    ).rejects.toThrow();
+  });
+
+  it('handles empty array', async () => {
+    const results = await http.all([]);
+    expect(results).toEqual([]);
+  });
+});
+
+
+// ===========================================================================
+// http.getConfig
+// ===========================================================================
+
+describe('http.getConfig', () => {
+  it('returns current config', () => {
+    http.configure({ baseURL: 'https://myapi.com', timeout: 5000 });
+    const config = http.getConfig();
+    expect(config.baseURL).toBe('https://myapi.com');
+    expect(config.timeout).toBe(5000);
+    expect(config.headers).toBeDefined();
+  });
+
+  it('returns a copy (not the internal reference)', () => {
+    const config = http.getConfig();
+    config.baseURL = 'https://mutated.com';
+    config.headers['X-Evil'] = 'injected';
+    const fresh = http.getConfig();
+    expect(fresh.baseURL).not.toBe('https://mutated.com');
+    expect(fresh.headers['X-Evil']).toBeUndefined();
+  });
+
+  it('reflects updates after configure', () => {
+    http.configure({ baseURL: '' });
+    expect(http.getConfig().baseURL).toBe('');
+    http.configure({ baseURL: 'https://updated.com' });
+    expect(http.getConfig().baseURL).toBe('https://updated.com');
+  });
+});

package/types/http.d.ts

@@ -61,15 +61,26 @@ export interface HttpClient {
   patch<T = any>(url: string, data?: any, opts?: HttpRequestOptions): Promise<HttpResponse<T>>;
   /** DELETE request. */
   delete<T = any>(url: string, data?: any, opts?: HttpRequestOptions): Promise<HttpResponse<T>>;
+  /** HEAD request — no body, useful for checking resource existence or headers. */
+  head<T = any>(url: string, opts?: HttpRequestOptions): Promise<HttpResponse<T>>;
 
   /** Update default configuration for all subsequent requests. */
   configure(options: HttpConfigureOptions): void;
 
-  /** Add a request interceptor (called before every request). */
-  onRequest(fn: HttpRequestInterceptor): void;
+  /** Read-only snapshot of the current configuration. Returns a shallow copy. */
+  getConfig(): { baseURL: string; headers: Record<string, string>; timeout: number };
 
-  /** Add a response interceptor (called after every response, before error check). */
-  onResponse(fn: HttpResponseInterceptor): void;
+  /** Add a request interceptor (called before every request). Returns an unsubscribe function. */
+  onRequest(fn: HttpRequestInterceptor): () => void;
+
+  /** Add a response interceptor (called after every response, before error check). Returns an unsubscribe function. */
+  onResponse(fn: HttpResponseInterceptor): () => void;
+
+  /** Clear interceptors. No args = all; `'request'` or `'response'` for one type. */
+  clearInterceptors(type?: 'request' | 'response'): void;
+
+  /** Run multiple request promises in parallel via `Promise.all`. */
+  all<T extends readonly Promise<HttpResponse<any>>[]>(requests: T): Promise<{ -readonly [K in keyof T]: Awaited<T[K]> }>;
 
   /** Create a new `AbortController` for manual request cancellation. */
   createAbort(): AbortController;