diff --git a/desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx b/desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx index 3eac907e7..8f3664e44 100644 --- a/desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx +++ b/desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx @@ -59,84 +59,74 @@ const json = { }, }; -describe('DataInspector', () => { - if (process.platform === 'win32') { - test('Skipping on Windows due to mocking not working', () => {}); - return; - } +test('changing collapsed property works', async () => { + const res = render(); + expect(await res.findByText(/is/)).toBeTruthy(); // from expandRoot + expect((await res.queryAllByText(/cool/)).length).toBe(0); - test('changing collapsed property works', async () => { - const res = render( - , - ); - expect(await res.findByText(/is/)).toBeTruthy(); // from expandRoot - expect((await res.queryAllByText(/cool/)).length).toBe(0); + res.rerender( + , + ); + await waitFor(() => res.findByText(/cool/)); - res.rerender( - , - ); - await waitFor(() => res.findByText(/cool/)); + res.rerender( + , + ); + expect((await res.queryAllByText(/cool/)).length).toBe(0); +}); - res.rerender( - , - ); - expect((await res.queryAllByText(/cool/)).length).toBe(0); +test('can manually collapse properties', async () => { + const res = render(); + + await res.findByText(/is/); // previewed as key, like: "data: {is, and}" + expect((await res.queryAllByText(/awesomely/)).length).toBe(0); + + // expand twice + fireEvent.click(await res.findByText(/data/)); + await res.findByText(/awesomely/); + expect((await res.queryAllByText(/cool/)).length).toBe(0); + + fireEvent.click(await res.findByText(/is/)); + await res.findByText(/cool/); + expect((await res.queryAllByText(/json/)).length).toBe(0); // this node is not shown + + // collapsing everything again + fireEvent.click(await res.findByText(/data/)); + await waitFor(() => { + expect(res.queryByText(/awesomely/)).toBeNull(); }); - test('can manually collapse properties', async () => { - const res = render( - , + // expand everything again, expanded paths will have been remembered + fireEvent.click(await res.findByText(/data/)); + await res.findByText(/is/); + await res.findByText(/awesomely/); + await waitFor(() => { + expect(res.queryByText(/json/)).toBeNull(); + }); +}); + +test('can filter for data', async () => { + const res = render( + , + ); + await res.findByText(/awesomely/); // everything is shown + + // act here is used to make sure the highlight changes have propagated + await act(async () => { + res.rerender( + , ); - - await res.findByText(/is/); // previewed as key, like: "data: {is, and}" - expect((await res.queryAllByText(/awesomely/)).length).toBe(0); - - // expand twice - fireEvent.click(await res.findByText(/data/)); - await res.findByText(/awesomely/); - expect((await res.queryAllByText(/cool/)).length).toBe(0); - - fireEvent.click(await res.findByText(/is/)); - await res.findByText(/cool/); - expect((await res.queryAllByText(/json/)).length).toBe(0); // this node is not shown - - // collapsing everything again - fireEvent.click(await res.findByText(/data/)); - await waitFor(() => { - expect(res.queryByText(/awesomely/)).toBeNull(); - }); - - // expand everything again, expanded paths will have been remembered - fireEvent.click(await res.findByText(/data/)); - await res.findByText(/is/); - await res.findByText(/awesomely/); - await waitFor(() => { - expect(res.queryByText(/json/)).toBeNull(); - }); + await sleep(200); }); - test('can filter for data', async () => { - const res = render( - , - ); - await res.findByText(/awesomely/); // everything is shown - - // act here is used to make sure the highlight changes have propagated - await act(async () => { - res.rerender( - , - ); - await sleep(200); - }); - - const element = await res.findByText(/son/); // N.B. search for 'son', as the text was split up - // snapshot to make sure the hilighiting did it's job - expect(element.parentElement).toMatchInlineSnapshot(` + const element = await res.findByText(/son/); // N.B. search for 'son', as the text was split up + // snapshot to make sure the hilighiting did it's job + expect(element.parentElement).toMatchInlineSnapshot(` "j { " `); - // hides the other part of the tree - await waitFor(() => { - expect(res.queryByText(/cool/)).toBeNull(); - }); - - // find by key - await act(async () => { - res.rerender( - , - ); - await sleep(200); - }); - - await res.findByText(/cool/); - // hides the other part of the tree - await waitFor(() => { - expect(res.queryByText(/json/)).toBeNull(); - }); - - await act(async () => { - res.rerender( - , - ); - await sleep(200); - }); - - // everything visible again - await res.findByText(/awesomely/); - await res.findByText(/json/); + // hides the other part of the tree + await waitFor(() => { + expect(res.queryByText(/cool/)).toBeNull(); }); + + // find by key + await act(async () => { + res.rerender( + , + ); + await sleep(200); + }); + + await res.findByText(/cool/); + // hides the other part of the tree + await waitFor(() => { + expect(res.queryByText(/json/)).toBeNull(); + }); + + await act(async () => { + res.rerender( + , + ); + await sleep(200); + }); + + // everything visible again + await res.findByText(/awesomely/); + await res.findByText(/json/); });