From 8f22cf9e81a0b65c218765b386a842bfc6664a50 Mon Sep 17 00:00:00 2001 From: Michel Weststrate Date: Thu, 30 Apr 2020 06:30:04 -0700 Subject: [PATCH] Add unit tests Summary: Added unit tests to DataInspector prevent regressions in upcoming refactor Found a bug where changes in `collapsed` aren't propagated. Fixed as well. Reviewed By: jknoxville Differential Revision: D21301858 fbshipit-source-id: 764bddeff30f9d4dbfc85d990635f67c20cfacb1 --- .../data-inspector/DataInspector.tsx | 4 +- .../__tests__/DataInspector.node.tsx | 65 +++++++++++++++++++ 2 files changed, 68 insertions(+), 1 deletion(-) create mode 100644 desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx diff --git a/desktop/app/src/ui/components/data-inspector/DataInspector.tsx b/desktop/app/src/ui/components/data-inspector/DataInspector.tsx index cf642cccb..8417f316f 100644 --- a/desktop/app/src/ui/components/data-inspector/DataInspector.tsx +++ b/desktop/app/src/ui/components/data-inspector/DataInspector.tsx @@ -358,7 +358,9 @@ export default class DataInspector extends Component { !deepEqual(nextProps.path, props.path) || nextProps.onExpanded !== props.onExpanded || nextProps.onDelete !== props.onDelete || - nextProps.setValue !== props.setValue + nextProps.setValue !== props.setValue || + nextProps.collapsed !== props.collapsed || + nextProps.expandRoot !== props.expandRoot ); } 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 new file mode 100644 index 000000000..495922d0b --- /dev/null +++ b/desktop/app/src/ui/components/data-inspector/__tests__/DataInspector.node.tsx @@ -0,0 +1,65 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + */ + +import * as React from 'react'; +import {render, fireEvent} from '@testing-library/react'; + +jest.mock('../../../../fb/Logger'); +import ManagedDataInspector from '../ManagedDataInspector'; + +const json = { + data: { + is: { + awesomely: 'cool', + }, + and: { + also: 'json', + }, + }, +}; + +test('changing collapsed property works', async () => { + const res = render(); + expect((await res.queryAllByText(/is/)).length).toBe(1); // from expandRoot + expect((await res.queryAllByText(/cool/)).length).toBe(0); + + res.rerender( + , + ); + expect((await res.queryAllByText(/cool/)).length).toBe(1); + + res.rerender( + , + ); + expect((await res.queryAllByText(/cool/)).length).toBe(0); +}); + +test('can manually collapse properties', async () => { + const res = render(); + expect((await res.queryAllByText(/awesomely/)).length).toBe(0); + expect((await res.queryAllByText(/is/)).length).toBe(1); // previewed as key, like: "data: {is, and}" + + // expand twice + fireEvent.click(await res.findByText(/data/)); + expect((await res.queryAllByText(/awesomely/)).length).toBe(1); + expect((await res.queryAllByText(/cool/)).length).toBe(0); + fireEvent.click(await res.findByText(/is/)); + expect((await res.queryAllByText(/cool/)).length).toBe(1); + expect((await res.queryAllByText(/json/)).length).toBe(0); // this node is not shown + + // collapsing everything again + fireEvent.click(await res.findByText(/data/)); + expect((await res.queryAllByText(/awesomely/)).length).toBe(0); + + // expand everything again, expanded paths will have been remembered + fireEvent.click(await res.findByText(/data/)); + expect((await res.queryAllByText(/is/)).length).toBe(1); + expect((await res.queryAllByText(/awesomely/)).length).toBe(1); + expect((await res.queryAllByText(/json/)).length).toBe(0); +});