@webqit/fetch-plus 0.1.2 → 0.1.4

package/src/RequestPlus.js

@@ -1,4 +1,4 @@
-import { messageParserMixin, _meta, _wq } from './core.js';
+import { messageParserMixin, _meta, _wq } from './messageParserMixin.js';
 import { HeadersPlus } from './HeadersPlus.js';
 
 export class RequestPlus extends messageParserMixin(Request) {
@@ -25,8 +25,8 @@ export class RequestPlus extends messageParserMixin(Request) {
             $type = $$type;
         }
 
-        const instance = new this.constructor(url, init);
-        
+        const instance = new this(url, init);
+
         if (memoize) {
             const cache = _meta(instance, 'cache');
             const typeMap = { json: 'json', FormData: 'formData', text: 'text', ArrayBuffer: 'arrayBuffer', Blob: 'blob', Bytes: 'bytes' };
@@ -48,7 +48,7 @@ export class RequestPlus extends messageParserMixin(Request) {
                         : request[prop])
             }
         ), {});
-        if (!['GET', 'HEAD'].includes(init.method?.toUpperCase() || request.method)) {
+        if (!['GET', 'HEAD'].includes(requestInit.method.toUpperCase())) {
             if ('body' in init) {
                 requestInit.body = init.body
                 if (!('headers' in init)) {
@@ -58,11 +58,13 @@ export class RequestPlus extends messageParserMixin(Request) {
             } else {
                 requestInit.body = await request.clone().arrayBuffer();
             }
+        } else {
+            requestInit.body = null;
         }
         if (requestInit.mode === 'navigate') {
             requestInit.mode = 'cors';
         }
-        return { url: request.url, ...requestInit };
+        return { url: init.url || request.url, ...requestInit };
     }
 
     clone() {
@@ -71,8 +73,8 @@ export class RequestPlus extends messageParserMixin(Request) {
 
         const requestMeta = _meta(this);
         _wq(clone).set('meta', new Map(requestMeta));
-        if (requestMeta.has('cache')) {
-            requestMeta.set('cache', new Map(requestMeta.get('cache')));
+        if (_meta(clone).has('cache')) {
+            _meta(clone).set('cache', new Map(requestMeta.get('cache')));
         }
 
         return clone;

package/src/ResponsePlus.js

@@ -1,4 +1,4 @@
-import { messageParserMixin, _meta, _wq } from './core.js';
+import { messageParserMixin, _meta, _wq } from './messageParserMixin.js';
 import { HeadersPlus } from './HeadersPlus.js';
 
 export class ResponsePlus extends messageParserMixin(Response) {
@@ -18,14 +18,14 @@ export class ResponsePlus extends messageParserMixin(Response) {
     static from(body, { memoize = false, ...init } = {}) {
         if (body instanceof Response) return body;
 
-        let $type, $body = body;
-        if (body || body === 0) {
+        let $type;
+        if (typeof body !== 'undefined') {
             let headers;
             ({ body, headers, $type } = super.from({ body, headers: init.headers }));
             init = { ...init, headers };
         }
 
-        const instance = new this.constructor(body, init);
+        const instance = new this(body, init);
 
         if (memoize) {
             const cache = _meta(instance, 'cache');
@@ -47,8 +47,8 @@ export class ResponsePlus extends messageParserMixin(Response) {
 
         const responseMeta = _meta(this);
         _wq(clone).set('meta', new Map(responseMeta));
-        if (responseMeta.has('cache')) {
-            responseMeta.set('cache', new Map(responseMeta.get('cache')));
+        if (_meta(clone).has('cache')) {
+            _meta(clone).set('cache', new Map(responseMeta.get('cache')));
         }
 
         return clone;

package/src/index.js

@@ -4,5 +4,4 @@ export { ResponsePlus } from './ResponsePlus.js';
 export { HeadersPlus } from './HeadersPlus.js';
 export { FormDataPlus } from './FormDataPlus.js';
 export { LiveResponse } from './LiveResponse.js';
-export { URLSearchParamsPlus } from './URLSearchParamsPlus.js';
 export { default as Observer } from '@webqit/observer';

package/src/messageParserMixin.js

@@ -0,0 +1,217 @@
+import { _isString, _isObject, _isTypeObject, _isNumber, _isBoolean, _isPlainObject, _isPlainArray } from '@webqit/util/js/index.js';
+import { _wq as $wq } from '@webqit/util/js/index.js';
+import { FormDataPlus } from './FormDataPlus.js';
+
+export const _wq = (target, ...args) => $wq(target, 'fetch+', ...args);
+export const _meta = (target, ...args) => $wq(target, 'fetch+', 'meta', ...args);
+
+export function messageParserMixin(superClass) {
+    return class extends superClass {
+
+        static from(httpMessageInit) {
+            const headers = (httpMessageInit.headers instanceof Headers)
+
+                ? [...httpMessageInit.headers.entries()].reduce((_headers, [name, value]) => {
+                    const key = name.toLowerCase();
+                    _headers[key] = _headers[key] ? [].concat(_headers[key], value) : value;
+                    return _headers;
+                }, {})
+
+                : Object.keys(httpMessageInit.headers || {}).reduce((_headers, name) => {
+                    _headers[name.toLowerCase()] = httpMessageInit.headers[name];
+                    return _headers;
+                }, {});
+
+            // Process body
+            let body = httpMessageInit.body;
+            let type = dataType(body);
+
+            // Binary bodies
+            if (['Blob', 'File'].includes(type)) {
+
+                headers['content-type'] ??= body.type;
+                headers['content-length'] ??= body.size;
+
+            } else if (['Uint8Array', 'Uint16Array', 'Uint32Array', 'ArrayBuffer'].includes(type)) {
+                headers['content-length'] ??= body.byteLength;
+            }
+
+            // JSON objects
+            else if (type === 'json' && _isTypeObject(body)) {
+                const { result: _body, isDirectlySerializable } = FormDataPlus.json(body, { encodeLiterals: true, meta: true });
+                if (isDirectlySerializable) {
+
+                    body = JSON.stringify(body, (k, v) => v instanceof Error ? { ...v, message: v.message } : v);
+                    headers['content-type'] = 'application/json';
+                    headers['content-length'] = (new Blob([body])).size;
+
+                } else {
+                    body = _body;
+                    type = 'FormData';
+                }
+            }
+
+            // Strings
+            else if (['text', 'json'].includes(type) && !headers['content-length']) {
+                headers['content-length'] = (new Blob([body])).size;
+            }
+
+            if (!['FormData'].includes(type)
+                && !['function'].includes(typeof body)
+                && !headers['content-type']) {
+                headers['content-type'] = 'application/octet-stream';
+            }
+
+            // Return canonical init object with type info
+            return { body, headers: new Headers(headers), $type: type };
+        }
+
+        async formData() {
+            const fd = await super.formData();
+            FormDataPlus.upgradeInPlace(fd);
+            return fd;
+        }
+
+        async any({ to = null, memo = false } = {}) {
+            if (to && ![
+                'blob', 'text', 'json', 'arrayBuffer', 'bytes', 'formData'
+            ].includes(to)) throw new Error(`Invalid target type specified: ${to}`);
+
+            const cache = _meta(this, 'cache');
+            const readAs = async (type) => {
+                // 1. Direct parsing
+                if (!memo) return await this[type || 'bytes']();
+
+                const byValue = (x) => {
+                    if (x instanceof FormData) {
+                        const clone = new FormDataPlus;
+                        for (const [k, v] of x.entries()) clone.append(k, v);
+                        return clone;
+                    }
+                    if ((!type || type === 'json')
+                        && (_isPlainObject(x) || _isPlainArray(x))) {
+                        return structuredClone(x);
+                    }
+                    return x;
+                };
+
+                // 2. Direct original
+                if (!type && cache.has('original')) return byValue(cache.has('original'));
+
+                // Default type
+                type ??= 'bytes';
+
+                // 3. Direct cache matching
+                if (cache.has(type)) return byValue(cache.get(type));
+
+                // 4. Clone + parse
+                let result;
+                if (cache.has('memo')) {
+                    result = cache.get('memo').clone()[type]();
+                } else {
+                    cache.set('memo', this.clone());
+                    result = await this[type]();
+                }
+
+                cache.set(type, result);
+
+                return byValue(result);
+            };
+
+            const contentType = (this.headers.get('Content-Type') || '').split(';')[0].trim();
+            let result;
+            if ((!to || ['formData', 'json'].includes(to))
+                && ['multipart/form-data', 'application/x-www-form-urlencoded'].includes(contentType)) {
+                let fd = await readAs('formData');
+                FormDataPlus.upgradeInPlace(fd);
+
+                if (to === 'json') {
+                    fd = await fd.json({ decodeLiterals: true });
+                }
+
+                result = fd;
+            } else if ((!to || ['formData', 'json'].includes(to))
+                && contentType === 'application/json') {
+                let json = await readAs('json');
+
+                if (to === 'formData') {
+                    json = FormDataPlus.json(json, { encodeLiterals: true });
+                }
+
+                result = json;
+            } else if (!to && (
+                contentType.startsWith('image/') ||
+                contentType.startsWith('video/') ||
+                contentType.startsWith('audio/') ||
+                (contentType.startsWith('application/')
+                    && !['xml', 'json', 'javascript', 'x-www-form-urlencoded'].some(t => contentType.includes(t)))
+            )) {
+                result = await readAs('blob');
+            } else if (!to && (
+                contentType.startsWith('text/') ||
+                (contentType.startsWith('application/')
+                    && ['xml', 'javascript'].some((t) => contentType.includes(t))
+                ))) {
+                result = await readAs('text');
+            } else {
+                if (['json', 'formData'].includes(to)) {
+                    throw new Error(`Cannot convert body of type ${contentType} to ${to}`);
+                }
+                result = await readAs(to);
+            }
+
+            return result;
+        }
+
+        forget() {
+            const cache = _meta(this, 'cache');
+            cache.clear();
+        }
+    };
+}
+
+// ------ Util
+
+export function dataType(value) {
+    if (value instanceof FormData) {
+        return 'FormData';
+    }
+    if (value === null || _isNumber(value) || _isBoolean(value)) {
+        return 'json';
+    }
+    if (_isString(value)) {
+        return 'text';
+    }
+
+    if (_isTypeObject(value)) {
+        const toStringTag = value[Symbol.toStringTag];
+        const type = [
+            'Uint8Array', 'Uint16Array', 'Uint32Array', 'ArrayBuffer', 'Blob', 'File', 'FormData', 'Stream', 'ReadableStream'
+        ].reduce((_toStringTag, type) => _toStringTag || (toStringTag === type ? type : null), null);
+
+        if (type) return type;
+
+        if (_isObject(value) || Array.isArray(value)) {
+            return 'json';
+        }
+
+        if ('toString' in value) return 'text';
+    }
+
+    return null;
+}
+
+export function isTypeReadable(obj) {
+    return (
+        obj !== null &&
+        typeof obj === 'object' &&
+        typeof obj.read === 'function' && // streams have .read()
+        typeof obj.pipe === 'function' && // streams have .pipe()
+        typeof obj.on === 'function'      // streams have event listeners
+    );
+}
+
+export function isTypeStream(obj) {
+    return obj instanceof ReadableStream
+        || isTypeReadable(obj);
+}

package/test/1.basic.test.js

@@ -0,0 +1,314 @@
+import { expect } from 'chai';
+import { HeadersPlus } from '../src/HeadersPlus.js';
+import { RequestPlus } from '../src/RequestPlus.js';
+import { ResponsePlus } from '../src/ResponsePlus.js';
+import { FormDataPlus } from '../src/FormDataPlus.js';
+import { fetchPlus } from '../src/fetchPlus.js';
+
+describe('Core API Tests', function () {
+
+    describe('HeadersPlus', function () {
+        it('should parse "Cookie" request headers', function () {
+            const headers = new HeadersPlus({
+                'Cookie': 'name=value; name2=value2'
+            });
+            const cookies = headers.get('Cookie', true);
+            expect(cookies).to.be.an('array').with.lengthOf(2);
+            expect(cookies[0]).to.deep.include({ name: 'name', value: 'value' });
+            expect(cookies[1]).to.deep.include({ name: 'name2', value: 'value2' });
+        });
+
+        it('should parse "Set-Cookie" response headers', function () {
+            // Note: Native Headers object often combines multiple Set-Cookie headers oddly or hides them,
+            // but HeadersPlus aims to handle them if possible or at least parse single strings.
+            // Let's test basic single parsing first as multiple Set-Cookie support varies by environment (Node vs Browser).
+            const headers = new HeadersPlus();
+            headers.append('Set-Cookie', 'session=123; Secure; Path=/');
+
+            // getSetCookie might be polyfilled or native
+            const cookies = headers.get('Set-Cookie', true);
+            expect(cookies).to.be.an('array');
+            expect(cookies[0]).to.deep.include({ name: 'session', value: '123' });
+            expect(cookies[0]).to.have.property('secure', true);
+            expect(cookies[0]).to.have.property('path', '/');
+        });
+
+        it('should parse "Range" headers', function () {
+            const headers = new HeadersPlus({
+                'Range': 'bytes=0-499, 500-999'
+            });
+            const ranges = headers.get('Range', true);
+            expect(ranges).to.have.lengthOf(2);
+            expect(ranges[0]).to.deep.equal([0, 499]);
+            expect(ranges[1]).to.deep.equal([500, 999]);
+        });
+
+        it('should parse "Accept" headers and match mime types', function () {
+            const headers = new HeadersPlus({
+                'Accept': 'text/html, application/xhtml+xml, application/xml;q=0.9, */*;q=0.8'
+            });
+            const accept = headers.get('Accept', true);
+
+            expect(accept).to.deep.equal([
+                ['text/html', 1],
+                ['application/xhtml+xml', 1],
+                ['application/xml', 0.9],
+                ['*/*', 0.8],
+            ]);
+            expect(accept.toString()).to.equal('text/html, application/xhtml+xml, application/xml;q=0.9, */*;q=0.8');
+            expect(accept.match('text/html')).to.equal(1);
+            expect(accept.match('application/xml')).to.equal(0.9);
+            expect(accept.match('image/png')).to.equal(0.8); // Matches */*
+        });
+    });
+
+    describe('HeadersPlus (Extended)', function () {
+        it('should parse multi-range headers', function () {
+            const headers = new HeadersPlus({
+                'Range': 'bytes=0-50, 60-100'
+            });
+            const ranges = headers.get('Range', true);
+            expect(ranges).to.have.lengthOf(2);
+            expect(ranges[0]).to.deep.equal([0, 50]);
+            expect(ranges[1]).to.deep.equal([60, 100]);
+        });
+
+        it('should validate and render ranges', function () {
+            const headers = new HeadersPlus({
+                'Range': 'bytes=0-500'
+            });
+            const range = headers.get('Range', true)[0];
+
+            // Validate against total length
+            expect(range.canResolveAgainst(0, 1000)).to.be.true;
+            expect(range.canResolveAgainst(500, 1000)).to.be.false; // Start > 0 is fine, but range covers 0-500? 
+            // wait, canResolveAgainst(currentStart, totalLength) checks if the range is valid for the current content?
+            // "range[0] < currentStart" is check.
+            // If currentStart is 500, range 0-499 is NOT valid
+
+            expect(range.canResolveAgainst(0, 400)).to.be.false; // range end > total
+
+            // Render
+            // range is [0, 499]
+            const rendered = range.resolveAgainst(1000);
+            expect(rendered).to.deep.equal([0, 499]);
+        });
+
+        it('should handle open-ended ranges', function () {
+            const headers = new HeadersPlus({ 'Range': 'bytes=500-' });
+            const range = headers.get('Range', true)[0];
+            // [500, null]
+
+            const rendered = range.resolveAgainst(1000);
+            expect(rendered).to.deep.equal([500, 999]);
+        });
+
+        it('should handle multiple Set-Cookie headers', function () {
+            const headers = new HeadersPlus();
+            headers.append('Set-Cookie', 'a=1; Path=/');
+            headers.append('Set-Cookie', 'b=2; Secure');
+
+            const cookies = headers.get('Set-Cookie', true);
+            expect(cookies).to.be.an('array').with.lengthOf(2);
+            expect(cookies[0]).to.deep.include({ name: 'a', value: '1' });
+            expect(cookies[1]).to.deep.include({ name: 'b', value: '2' });
+        });
+
+        it('should return 0 for matching unknown types in Accept header without wildcard', function () {
+            const headers = new HeadersPlus({
+                'Accept': 'text/html, application/json;q=0.9'
+            });
+            const accept = headers.get('Accept', true);
+
+            expect(accept.match('text/html')).to.equal(1);
+            expect(accept.match('image/png')).to.equal(0);
+        });
+    });
+
+    describe('RequestPlus & ResponsePlus', function () {
+        it('should support upgradeInPlace for Request', function () {
+            const req = new Request('http://example.com');
+            expect(req).to.not.be.instanceOf(RequestPlus);
+
+            RequestPlus.upgradeInPlace(req);
+            expect(req).to.be.instanceOf(RequestPlus);
+
+            expect(req.headers).to.be.instanceOf(Headers); // It is still headers
+            expect(req.headers).to.be.instanceOf(HeadersPlus); // It is now also headersPlus
+
+            req.headers.set('Range', 'bytes=0-100');
+            const range = req.headers.get('Range', true); // Should return array if upgraded
+            expect(range).to.be.an('array');
+        });
+
+        it('should support upgradeInPlace for Response', function () {
+            const res = new Response('body');
+            expect(res).to.not.be.instanceOf(ResponsePlus);
+
+            ResponsePlus.upgradeInPlace(res);
+            expect(res).to.be.instanceOf(ResponsePlus);
+
+            expect(res.headers).to.be.instanceOf(Headers); // It is still headers
+            expect(res.headers).to.be.instanceOf(HeadersPlus); // It is now also headersPlus
+
+            res.headers.set('Content-Range', 'bytes 0-100/1000');
+            const range = res.headers.get('Content-Range', true);
+            expect(range).to.deep.equal(['0-100', '1000']);
+        });
+
+        it('should create instances via .from()', function () {
+            const req = RequestPlus.from('http://example.com', { method: 'POST' });
+            expect(req).to.be.instanceOf(RequestPlus);
+            expect(req.method).to.equal('POST');
+
+            const res = ResponsePlus.from('content', { status: 201 });
+            expect(res).to.be.instanceOf(ResponsePlus);
+            expect(res.status).to.equal(201);
+        });
+
+        it('should provide extended body parsing (json)', async function () {
+            const data = { foo: 'bar' };
+            const res = new ResponsePlus(JSON.stringify(data), {
+                headers: { 'Content-Type': 'application/json' }
+            });
+
+            const json = await res.json();
+            expect(json).to.deep.equal(data);
+        });
+
+        it('should support .any() with memoization and conversions', async function () {
+            const data = { foo: 'bar', prefs: [1, 2], loves_it: true };
+
+            // 1. Auto-detect json
+            const res1 = new ResponsePlus(JSON.stringify(data), { headers: { 'Content-Type': 'application/json' } });
+            const json = await res1.any();
+            expect(json).to.deep.equal(data);
+
+            // 2. Memoization (should return same object on subsequent calls)
+            const res2 = new ResponsePlus(JSON.stringify(data), { headers: { 'Content-Type': 'application/json' } });
+            const j1 = await res2.any({ memo: true }); // Returns original, caches clone
+            const j2 = await res2.any({ memo: true }); // Returns cached clone
+            const j3 = await res2.any({ memo: true }); // Returns cached clone
+            expect(j2).to.deep.equal(j1);
+            expect(j3).to.deep.equal(j2); // Non-strict equality for cached hits
+
+            // 3. Conversion JSON -> FormData
+            // If we ask for formData from a JSON response
+            const res3 = new ResponsePlus(JSON.stringify(data), { headers: { 'Content-Type': 'application/json' } });
+            const fd = await res3.any({ to: 'formData' });
+            // It should convert
+            expect(await fd.json()).to.deep.equal(data);
+        });
+
+        it('should auto-generate headers in .from()', async function () {
+            // 1. JSON
+            const res1 = ResponsePlus.from({ a: 1 });
+            // console.log('res1 headers:', [...res1.headers.entries()]);
+            expect(res1.headers.get('Content-Type')).to.be.a('string').that.includes('application/json');
+            expect(res1.headers.get('Content-Length')).to.exist;
+
+            // 2. String
+            const res2 = ResponsePlus.from('hello');
+            expect(res2.headers.get('Content-Length')).to.equal('5');
+
+            // 3. Binary (Uint8Array)
+            const buffer = new TextEncoder().encode('hello');
+            const res3 = ResponsePlus.from(buffer);
+            expect(res3.headers.get('Content-Length')).to.equal('5');
+
+            // 4. Blob
+            const blob = new Blob(['hello'], { type: 'text/plain' });
+            const res4 = ResponsePlus.from(blob);
+            expect(res4.headers.get('Content-Type')).to.equal('text/plain');
+            expect(res4.headers.get('Content-Length')).to.equal('5');
+        });
+
+        it('should auto-generate headers for specialized inputs in .from()', async function () {
+            const url = 'http://url';
+
+            // FormData
+            const req1 = RequestPlus.from(url, { body: new FormData(), method: 'POST' });
+            // Auto Content-Type: `multipart/form-data`
+            expect(req1.headers.get('Content-Type')).to.be.a('string').that.includes('multipart/form-data');
+            expect(req1.headers.get('Content-Length')).to.not.exist;
+
+            // JSON object with complex data types
+            const body2 = {
+                name: 'John Doe',
+                avatars: {
+                    primary: new Blob(['imageBytes1'], { type: 'image/png' }),
+                    secondary: new Blob(['imageBytes2'], { type: 'image/png' }),
+                },
+                loves_it: true,
+            };
+            const req2 = RequestPlus.from(url, { body: body2, method: 'POST' });
+            // Auto Content-Type: `multipart/form-data`
+            expect(req2.headers.get('Content-Type')).to.be.a('string').that.includes('multipart/form-data');
+            expect(req2.headers.get('Content-Length')).to.not.exist;
+
+            // TypeArray
+            const req3 = RequestPlus.from(url, { body: new Uint8Array([0, 1, 2, 3, 4, 5, 6, 7, 8, 9]), method: 'POST' });
+            // Auto Content-Type: `application/octet-stream`
+            // Auto Content-Length: <number>
+            expect(req3.headers.get('Content-Type')).to.be.a('string').that.includes('application/octet-stream');
+            expect(req3.headers.get('Content-Length')).to.exist;
+
+            // Blob
+            const req4 = RequestPlus.from(url, { body: new Blob(['hello'], { type: 'text/plain' }), method: 'POST' });
+            // Auto Content-Type: `text/plain`
+            // Auto Content-Length: <number>
+            expect(req4.headers.get('Content-Type')).to.be.a('string').that.includes('text/plain');
+            expect(req4.headers.get('Content-Length')).to.exist;
+        });
+    });
+
+    describe('FormDataPlus', function () {
+        it('should convert FormData to JSON', async function () {
+            const fd = new FormDataPlus();
+            fd.append('name', 'Alice');
+            fd.append('age', '30');
+            fd.append('skills[0]', 'JS');
+            fd.append('skills[]', 'Testing');
+
+            const json = await fd.json();
+            expect(json).to.deep.equal({
+                name: 'Alice',
+                age: 30,
+                skills: ['JS', 'Testing']
+            });
+        });
+
+        // Nested structure if supported?
+        it('should support nested structures in FormData keys', async function () {
+            const fd = new FormDataPlus();
+            fd.append('user[name]', 'Bob');
+            fd.append('user[address][city]', 'New York');
+
+            const json = await fd.json();
+            expect(json).to.deep.equal({
+                user: {
+                    name: 'Bob',
+                    address: {
+                        city: 'New York'
+                    }
+                }
+            });
+        });
+    });
+
+    describe('fetchPlus', function () {
+        it('should return a ResponsePlus', async function () {
+            // Mock global fetch
+            const originalFetch = globalThis.fetch;
+            globalThis.fetch = async () => new Response('ok');
+
+            const res = await fetchPlus('http://mock.url');
+            // Check if it has extended capabilities, e.g. upgraded headers
+            res.headers.set('Range', 'bytes=0-10');
+            expect(res.headers.get('Range', true)).to.be.an('array');
+
+            globalThis.fetch = originalFetch;
+        });
+    });
+
+});