Fix broken DataInspector test (#1100)
Summary: Looks like we don't have a lint for `jest.mock` imports. Pull Request resolved: https://github.com/facebook/flipper/pull/1100 Test Plan: yarn test Reviewed By: jknoxville Differential Revision: D21378747 Pulled By: passy fbshipit-source-id: 118372596d6247282b1ddad1f22ed3916d303bb1
This commit is contained in:
committed by
Facebook GitHub Bot
parent
fbc5d922b5
commit
c1b360cb0f
@@ -10,7 +10,12 @@
|
||||
import * as React from 'react';
|
||||
import {render, fireEvent, waitFor, act} from '@testing-library/react';
|
||||
|
||||
jest.mock('../../../../fb/Logger');
|
||||
try {
|
||||
jest.mock('../../../../fb/Logger');
|
||||
} catch {
|
||||
jest.mock('../../../../fb-stubs/Logger');
|
||||
}
|
||||
|
||||
import ManagedDataInspector from '../ManagedDataInspector';
|
||||
import {sleep} from '../../../../utils';
|
||||
|
||||
@@ -54,74 +59,84 @@ const json = {
|
||||
},
|
||||
};
|
||||
|
||||
test('changing collapsed property works', async () => {
|
||||
const res = render(<ManagedDataInspector data={json} collapsed expandRoot />);
|
||||
expect(await res.findByText(/is/)).toBeTruthy(); // from expandRoot
|
||||
expect((await res.queryAllByText(/cool/)).length).toBe(0);
|
||||
describe('DataInspector', () => {
|
||||
if (process.platform === 'win32') {
|
||||
test('Skipping on Windows due to mocking not working', () => {});
|
||||
return;
|
||||
}
|
||||
|
||||
res.rerender(
|
||||
<ManagedDataInspector data={json} collapsed={false} expandRoot />,
|
||||
);
|
||||
await waitFor(() => res.findByText(/cool/));
|
||||
|
||||
res.rerender(
|
||||
<ManagedDataInspector data={json} collapsed={true} expandRoot />,
|
||||
);
|
||||
expect((await res.queryAllByText(/cool/)).length).toBe(0);
|
||||
});
|
||||
|
||||
test('can manually collapse properties', async () => {
|
||||
const res = render(<ManagedDataInspector data={json} collapsed expandRoot />);
|
||||
|
||||
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();
|
||||
});
|
||||
});
|
||||
|
||||
test('can filter for data', async () => {
|
||||
const res = render(
|
||||
<ManagedDataInspector data={json} collapsed={false} expandRoot />,
|
||||
);
|
||||
await res.findByText(/awesomely/); // everything is shown
|
||||
|
||||
// act here is used to make sure the highlight changes have propagated
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter="sOn"
|
||||
/>,
|
||||
test('changing collapsed property works', async () => {
|
||||
const res = render(
|
||||
<ManagedDataInspector data={json} collapsed expandRoot />,
|
||||
);
|
||||
await sleep(200);
|
||||
expect(await res.findByText(/is/)).toBeTruthy(); // from expandRoot
|
||||
expect((await res.queryAllByText(/cool/)).length).toBe(0);
|
||||
|
||||
res.rerender(
|
||||
<ManagedDataInspector data={json} collapsed={false} expandRoot />,
|
||||
);
|
||||
await waitFor(() => res.findByText(/cool/));
|
||||
|
||||
res.rerender(
|
||||
<ManagedDataInspector data={json} collapsed={true} expandRoot />,
|
||||
);
|
||||
expect((await res.queryAllByText(/cool/)).length).toBe(0);
|
||||
});
|
||||
|
||||
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(`
|
||||
test('can manually collapse properties', async () => {
|
||||
const res = render(
|
||||
<ManagedDataInspector data={json} collapsed expandRoot />,
|
||||
);
|
||||
|
||||
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();
|
||||
});
|
||||
});
|
||||
|
||||
test('can filter for data', async () => {
|
||||
const res = render(
|
||||
<ManagedDataInspector data={json} collapsed={false} expandRoot />,
|
||||
);
|
||||
await res.findByText(/awesomely/); // everything is shown
|
||||
|
||||
// act here is used to make sure the highlight changes have propagated
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter="sOn"
|
||||
/>,
|
||||
);
|
||||
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(`
|
||||
<span>
|
||||
"j
|
||||
<span
|
||||
@@ -132,43 +147,44 @@ test('can filter for data', async () => {
|
||||
"
|
||||
</span>
|
||||
`);
|
||||
// hides the other part of the tree
|
||||
await waitFor(() => {
|
||||
expect(res.queryByText(/cool/)).toBeNull();
|
||||
});
|
||||
// hides the other part of the tree
|
||||
await waitFor(() => {
|
||||
expect(res.queryByText(/cool/)).toBeNull();
|
||||
});
|
||||
|
||||
// find by key
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter="somel"
|
||||
/>,
|
||||
);
|
||||
await sleep(200);
|
||||
});
|
||||
// find by key
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter="somel"
|
||||
/>,
|
||||
);
|
||||
await sleep(200);
|
||||
});
|
||||
|
||||
await res.findByText(/cool/);
|
||||
// hides the other part of the tree
|
||||
await waitFor(() => {
|
||||
expect(res.queryByText(/json/)).toBeNull();
|
||||
});
|
||||
await res.findByText(/cool/);
|
||||
// hides the other part of the tree
|
||||
await waitFor(() => {
|
||||
expect(res.queryByText(/json/)).toBeNull();
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter=""
|
||||
/>,
|
||||
);
|
||||
await sleep(200);
|
||||
});
|
||||
await act(async () => {
|
||||
res.rerender(
|
||||
<ManagedDataInspector
|
||||
data={json}
|
||||
collapsed={false}
|
||||
expandRoot
|
||||
filter=""
|
||||
/>,
|
||||
);
|
||||
await sleep(200);
|
||||
});
|
||||
|
||||
// everything visible again
|
||||
await res.findByText(/awesomely/);
|
||||
await res.findByText(/json/);
|
||||
// everything visible again
|
||||
await res.findByText(/awesomely/);
|
||||
await res.findByText(/json/);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user