diff --git a/global-jest-setup.js b/global-jest-setup.js new file mode 100644 index 0000000..6e1fbf4 --- /dev/null +++ b/global-jest-setup.js @@ -0,0 +1,3 @@ +module.exports = async () => { + process.env.TZ = 'UTC'; +}; diff --git a/package.json b/package.json index 39f4c8b..3e91e70 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,8 @@ "modulePathIgnorePatterns": [ "/example/node_modules", "/lib/" - ] + ], + "globalSetup": "/global-jest-setup.js" }, "husky": { "hooks": { diff --git a/src/components/NetworkLogger.spec.tsx b/src/components/NetworkLogger.spec.tsx index 8c25d02..03e34c4 100644 --- a/src/components/NetworkLogger.spec.tsx +++ b/src/components/NetworkLogger.spec.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { render, fireEvent, act } from '@testing-library/react-native'; + +import { act, fireEvent, render, within } from '@testing-library/react-native'; import NetworkLogger, { NetworkLoggerProps } from './NetworkLogger'; import logger from '../loggerSingleton'; import NetworkRequestInfo from '../NetworkRequestInfo'; @@ -96,3 +97,59 @@ describe('options', () => { spyOnLoggerClearRequests.mockRestore(); }); }); + +describe('regular vs compact row', () => { + it.each([true, false])('should render the row compact: %p', (compact) => { + const requests = [] as NetworkRequestInfo[]; + const spyOnLoggerSetCallback = jest.spyOn(logger, 'setCallback'); + const emitCallback = jest.fn(); + spyOnLoggerSetCallback.mockImplementation((callback) => { + return emitCallback.mockImplementation((id: number) => { + if (id !== 1) { + const request = new NetworkRequestInfo( + `${id}`, + 'XMLHttpRequest', + 'GET', + `http://example.com/${id}` + ); + requests.unshift(request); + return callback(requests); + } + const request = new NetworkRequestInfo( + '1', + 'XMLHttpRequest', + 'POST', + 'http://example.com/1' + ); + request.startTime = new Date('2000-01-01T12:34:00.000Z').getTime(); + request.endTime = new Date('2000-01-01T12:34:56.789Z').getTime(); + request.status = 200; + requests.unshift(request); + return callback(requests); + }); + }); + + const { getByText } = render(); + + act(() => { + emitCallback(1); + }); + + const method = getByText(/^post$/i); + expect(method).toBeTruthy(); + expect(!!within(method.parent!.parent!).queryByText(/^12:34:00$/i)).toBe( + compact + ); + + const status = getByText(/^200$/i); + expect(status).toBeTruthy(); + expect( + within(status.parent!.parent!).queryByText(/^56789ms$/i) + ).toBeTruthy(); + expect(within(status.parent!.parent!).queryByText(/^12:34:00$/i)).not.toBe( + compact + ); + + spyOnLoggerSetCallback.mockRestore(); + }); +}); diff --git a/src/components/NetworkLogger.tsx b/src/components/NetworkLogger.tsx index 388aba9..297fe71 100644 --- a/src/components/NetworkLogger.tsx +++ b/src/components/NetworkLogger.tsx @@ -13,6 +13,7 @@ import Unmounted from './Unmounted'; interface Props { theme?: ThemeName | DeepPartial; sort?: 'asc' | 'desc'; + compact?: boolean; maxRows?: number; } @@ -26,6 +27,7 @@ const sortRequests = (requests: NetworkRequestInfo[], sort: 'asc' | 'desc') => { const NetworkLogger: React.FC = ({ theme = 'light', sort = 'desc', + compact = false, maxRows, }) => { const [requests, setRequests] = useState(logger.getRequests()); @@ -132,6 +134,7 @@ const NetworkLogger: React.FC = ({ )} = ({ options }) => { {options.map(({ text, onPress }) => (