Skip to content

Commit 89e14ae

Browse files
authored
fix: requests not being updated when maxRequests is reached (#88)
* maxRequests * test * dispose to fix test * lint
1 parent 14d24be commit 89e14ae

File tree

4 files changed

+87
-26
lines changed

4 files changed

+87
-26
lines changed

example/src/App.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ export default function App() {
4949

5050
startNetworkLogging({
5151
ignoredHosts: ['192.168.1.28', '127.0.0.1'],
52-
maxRequests: 500,
52+
maxRequests: 20,
5353
ignoredUrls: ['https://httpstat.us/other'],
5454
ignoredPatterns: [/^POST http:\/\/(192|10)/],
5555
});

src/Logger.ts

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -13,25 +13,25 @@ type XHR = {
1313

1414
export default class Logger {
1515
private requests: NetworkRequestInfo[] = [];
16-
private xhrIdMap: { [key: number]: number } = {};
16+
private xhrIdMap: Map<number, () => number> = new Map();
1717
private maxRequests: number = 500;
1818
private ignoredHosts: Set<string> | undefined;
1919
private ignoredUrls: Set<string> | undefined;
2020
private ignoredPatterns: RegExp[] | undefined;
2121
public enabled = false;
2222
public paused = false;
2323

24-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
25-
callback = (requests: any[]) => {};
24+
callback = (_: any[]) => null;
2625

2726
setCallback = (callback: any) => {
2827
this.callback = callback;
2928
};
3029

3130
private getRequest = (xhrIndex?: number) => {
3231
if (xhrIndex === undefined) return undefined;
33-
const requestIndex = this.requests.length - this.xhrIdMap[xhrIndex] - 1;
34-
return this.requests[requestIndex];
32+
if (!this.xhrIdMap.has(xhrIndex)) return undefined;
33+
const index = this.xhrIdMap.get(xhrIndex)!();
34+
return this.requests[index];
3535
};
3636

3737
private updateRequest = (
@@ -44,10 +44,6 @@ export default class Logger {
4444
};
4545

4646
private openCallback = (method: RequestMethod, url: string, xhr: XHR) => {
47-
xhr._index = nextXHRId++;
48-
const xhrIndex = this.requests.length;
49-
this.xhrIdMap[xhr._index] = xhrIndex;
50-
5147
if (this.paused) {
5248
return;
5349
}
@@ -71,8 +67,13 @@ export default class Logger {
7167
}
7268
}
7369

70+
xhr._index = nextXHRId++;
71+
this.xhrIdMap.set(xhr._index, () => {
72+
return this.requests.findIndex((r) => r.id === `${xhr._index}`);
73+
});
74+
7475
const newRequest = new NetworkRequestInfo(
75-
`${nextXHRId}`,
76+
`${xhr._index}`,
7677
'XMLHttpRequest',
7778
method,
7879
url
@@ -206,4 +207,13 @@ export default class Logger {
206207
this.requests = [];
207208
this.callback(this.requests);
208209
};
210+
211+
// dispose in tests
212+
private dispose = () => {
213+
this.enabled = false;
214+
nextXHRId = 0;
215+
this.requests = [];
216+
this.callback(this.requests);
217+
this.xhrIdMap.clear();
218+
};
209219
}

src/__tests__/Logger.spec.ts

Lines changed: 65 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ beforeEach(() => {
2525

2626
describe('enableXHRInterception', () => {
2727
it('should do nothing if interceptor has already been enabled', () => {
28-
(warn as jest.Mock).mockImplementationOnce(() => {});
28+
(warn as jest.Mock).mockImplementationOnce(() => null);
2929
const logger = new Logger();
3030

3131
(XHRInterceptor.isInterceptorEnabled as jest.Mock).mockReturnValueOnce(
@@ -195,25 +195,33 @@ describe('getRequest', () => {
195195

196196
it('should return request that matches index', () => {
197197
const logger = new Logger();
198-
const requests = [{ id: 1 }, { id: 2 }, { id: 3 }];
198+
const requests = [{ id: `3` }, { id: `2` }, { id: `1` }];
199199
// @ts-expect-error
200200
logger.requests = requests;
201201
// @ts-expect-error
202-
logger.xhrIdMap = { 0: 0, 1: 1, 2: 2 };
202+
logger.xhrIdMap = new Map([
203+
[1, () => requests.findIndex((r) => r.id === `${1}`)],
204+
[2, () => requests.findIndex((r) => r.id === `${2}`)],
205+
[3, () => requests.findIndex((r) => r.id === `${3}`)],
206+
]);
203207
// @ts-expect-error
204-
const result = logger.getRequest(0);
208+
const result = logger.getRequest(1);
205209
expect(result).toBe(requests[2]);
206210
});
207211

208212
it('should return request that matches index if at start', () => {
209213
const logger = new Logger();
210-
const requests = [{ id: 1 }, { id: 2 }, { id: 3 }];
214+
const requests = [{ id: `3` }, { id: `2` }, { id: `1` }];
211215
// @ts-expect-error
212216
logger.requests = requests;
213217
// @ts-expect-error
214-
logger.xhrIdMap = { 0: 0, 1: 1, 2: 2 };
218+
logger.xhrIdMap = new Map([
219+
[1, () => requests.findIndex((r) => r.id === `${1}`)],
220+
[2, () => requests.findIndex((r) => r.id === `${2}`)],
221+
[3, () => requests.findIndex((r) => r.id === `${3}`)],
222+
]);
215223
// @ts-expect-error
216-
const result = logger.getRequest(2);
224+
const result = logger.getRequest(3);
217225
expect(result).toBe(requests[0]);
218226
});
219227
});
@@ -233,6 +241,9 @@ describe('openCallback', () => {
233241
logger.openCallback('POST', url2, xhr);
234242
expect(logger.getRequests()[0].url).toEqual(url2);
235243
expect(logger.getRequests()[1].url).toEqual(url1);
244+
245+
// @ts-expect-error
246+
logger.dispose();
236247
});
237248

238249
it('should ignore requests that have ignored hosts', () => {
@@ -249,22 +260,27 @@ describe('openCallback', () => {
249260
logger.openCallback('POST', url2, xhr);
250261
expect(logger.getRequests()[0].url).toEqual(url1);
251262
expect(logger.getRequests()).toHaveLength(1);
263+
264+
// @ts-expect-error
265+
logger.dispose();
252266
});
253267

254268
it('should ignore requests that have ignored urls', () => {
255269
const logger = new Logger();
256270
logger.enableXHRInterception({ ignoredUrls: ['http://ignored.com/test'] });
257271

258-
const xhr = {};
259272
const url1 = 'http://ignored.com/1';
260273
const url2 = 'http://ignored.com/test';
261274

262275
// @ts-expect-error
263-
logger.openCallback('POST', url1, xhr);
276+
logger.openCallback('POST', url1, { _index: 0 });
264277
// @ts-expect-error
265-
logger.openCallback('POST', url2, xhr);
278+
logger.openCallback('POST', url2, { _index: 1 });
266279
expect(logger.getRequests()[0].url).toEqual(url1);
267280
expect(logger.getRequests()).toHaveLength(1);
281+
282+
// @ts-expect-error
283+
logger.dispose();
268284
});
269285

270286
it('should ignore requests that match pattern', () => {
@@ -273,23 +289,57 @@ describe('openCallback', () => {
273289
ignoredPatterns: [/^HEAD /, /^POST http:\/\/ignored/],
274290
});
275291

276-
const xhr = {};
277292
const url1 = 'http://allowed.com/1';
278293
const url2 = 'http://ignored.com/test';
279294

280295
// @ts-expect-error
281-
logger.openCallback('POST', url1, xhr);
296+
logger.openCallback('POST', url1, { _index: 0 });
282297
// @ts-expect-error
283-
logger.openCallback('POST', url2, xhr);
298+
logger.openCallback('POST', url2, { _index: 1 });
284299
// @ts-expect-error
285-
logger.openCallback('HEAD', url2, xhr);
300+
logger.openCallback('HEAD', url2, { _index: 2 });
286301
// @ts-expect-error
287-
logger.openCallback('PUT', url2, xhr);
302+
logger.openCallback('PUT', url2, { _index: 3 });
288303
// Requests should be in reverse order
289304
expect(logger.getRequests()[1].url).toEqual(url1);
290305
expect(logger.getRequests()[1].method).toEqual('POST');
291306
expect(logger.getRequests()[0].url).toEqual(url2);
292307
expect(logger.getRequests()[0].method).toEqual('PUT');
293308
expect(logger.getRequests()).toHaveLength(2);
309+
310+
// @ts-expect-error
311+
logger.dispose();
312+
});
313+
314+
it('should retrieve requests when it is restricted by maxRequests', () => {
315+
const logger = new Logger();
316+
logger.enableXHRInterception({
317+
maxRequests: 2,
318+
});
319+
320+
const url = 'http://example.com/1';
321+
322+
// @ts-expect-error
323+
logger.openCallback('POST', url, { _index: 0 });
324+
// @ts-expect-error
325+
logger.openCallback('GET', url, { _index: 1 });
326+
// @ts-expect-error
327+
logger.openCallback('HEAD', url, { _index: 2 });
328+
// @ts-expect-error
329+
logger.openCallback('PUT', url, { _index: 3 });
330+
331+
// Requests should be in reverse order
332+
expect(logger.getRequests()[0].method).toEqual('PUT');
333+
expect(logger.getRequests()[1].method).toEqual('HEAD');
334+
expect(logger.getRequests()).toHaveLength(2);
335+
336+
// @ts-expect-error
337+
expect(logger.getRequest(0)?.method).toBeUndefined();
338+
const first = logger.getRequests()[0];
339+
// @ts-expect-error
340+
expect(logger.getRequest(3)?.method).toBe(first?.method);
341+
342+
// @ts-expect-error
343+
logger.dispose();
294344
});
295345
});

src/components/ResultItem.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ const ResultItem: React.FC<Props> = ({ style, request, onPress }) => {
4747
const pad = (num: number) => `0${num}`.slice(-2);
4848

4949
const getTime = (time: number) => {
50+
if (time === 0) return ''; // invalid time
5051
const date = new Date(time);
5152
const hours = pad(date.getHours());
5253
const minutes = pad(date.getMinutes());

0 commit comments

Comments
 (0)