Fix DataInspector Component diff some problems. (#397)
Summary:
1. In `diffMetadataExtractor` function, when the `data` or `diff` is `null`, it diff view does not display correctly.
```jsx
<Panel floating={false} heading={'Test'}>
<ManagedDataInspector
diff={{
auth: null
}}
data={{
auth: {
user: {
name: 'JianyingLi'
}
}
}}
expandRoot={true}
/>
</Panel>
```
Before:

After:

2. Status `added`(green) and `removed`(red) should be the opposite
```jsx
<ManagedDataInspector
diff={{
user: {
name: 'Leo'
}
}}
data={{
user: {
name: 'JianyingLi'
}
}}
expandRoot={true}
/>
```
Before:

After:

Pull Request resolved: https://github.com/facebook/flipper/pull/397
Reviewed By: danielbuechele
Differential Revision: D14505757
Pulled By: passy
fbshipit-source-id: 35ca1bf8721468fdde13f3a9ede75cb72a59caea
This commit is contained in:
committed by
Facebook Github Bot
parent
04cebe6e29
commit
2564bce5a0
@@ -62,6 +62,7 @@ function decodeBody(container: Request | Response): string {
|
||||
if (!container.data) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const b64Decoded = atob(container.data);
|
||||
const body =
|
||||
getHeaderValue(container.headers, 'Content-Encoding') === 'gzip'
|
||||
|
||||
@@ -217,6 +217,7 @@ function getRootContextMenu(data: Object): Array<Electron$MenuItemOptions> {
|
||||
|
||||
function isPureObject(obj: Object) {
|
||||
return (
|
||||
obj !== null &&
|
||||
Object.prototype.toString.call(obj) !== '[object Date]' &&
|
||||
typeof obj === 'object'
|
||||
);
|
||||
@@ -234,10 +235,10 @@ const diffMetadataExtractor: DiffMetadataExtractor = (
|
||||
const val = data[key];
|
||||
const diffVal = diff[key];
|
||||
if (!data.hasOwnProperty(key)) {
|
||||
return [{data: diffVal, status: 'added'}];
|
||||
return [{data: diffVal, status: 'removed'}];
|
||||
}
|
||||
if (!diff.hasOwnProperty(key)) {
|
||||
return [{data: val, status: 'removed'}];
|
||||
return [{data: val, status: 'added'}];
|
||||
}
|
||||
|
||||
if (isPureObject(diffVal) && isPureObject(val)) {
|
||||
@@ -248,7 +249,7 @@ const diffMetadataExtractor: DiffMetadataExtractor = (
|
||||
// Check if there's a difference between the original value and
|
||||
// the value from the diff prop
|
||||
// The property name still exists, but the values may be different.
|
||||
return [{data: diffVal, status: 'added'}, {data: val, status: 'removed'}];
|
||||
return [{data: val, status: 'added'}, {data: diffVal, status: 'removed'}];
|
||||
}
|
||||
|
||||
return Object.prototype.hasOwnProperty.call(data, key) ? [{data: val}] : [];
|
||||
|
||||
Reference in New Issue
Block a user