pt
/
superset
mirror of https://github.com/apache/superset.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix: dataTablesPane cell render undefine when the dot in metric label (#15817) 

* fix: dataTablesPane cell render undefine when the dot in metric label

* fix UT
This commit is contained in:
Yongjie Zhao 2021-07-22 15:09:27 +01:00 committed by GitHub
parent fdb40350bb
commit b9d3338153
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 128 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
superset-frontend/src/explore/components/DataTableControl/index.tsx
View File

@ -122,7 +122,7 @@ export const useTableColumns = (
? Object.keys(data[0]).map(
key =>
({
accessor: key,
accessor: row => row[key],
Header: key,
Cell: ({ value }) => {
if (value === true) {

145
superset-frontend/src/explore/components/DataTableControl/useTableColumns.test.ts
View File

@ -16,38 +16,121 @@
* specific language governing permissions and limitations
* under the License.
*/
import { renderHook } from '@testing-library/react-hooks';
import { BOOL_FALSE_DISPLAY, BOOL_TRUE_DISPLAY } from 'src/constants';
import { useTableColumns } from '.';
// eslint-disable-next-line @typescript-eslint/no-explicit-any
type JsonObject = { [member: string]: any };
const asciiChars = [];
for (let i = 32; i < 127; i += 1) {
asciiChars.push(String.fromCharCode(i));
}
const asciiKey = asciiChars.join('');
const unicodeKey = '你好. 吃了吗?';
const data = [
{ col01: 'some', col02: 'data' },
{ col01: 'any', col02: 'data' },
{ col01: 'some', col02: 'thing' },
{ col01: 'any', col02: 'things', col03: 'secret' },
{ col01: true, col02: false, [asciiKey]: asciiKey, [unicodeKey]: unicodeKey },
{ col01: true, col02: false, [asciiKey]: asciiKey, [unicodeKey]: unicodeKey },
{ col01: true, col02: false, [asciiKey]: asciiKey, [unicodeKey]: unicodeKey },
{
col01: true,
col02: false,
col03: 'secret',
[asciiKey]: asciiKey,
[unicodeKey]: unicodeKey,
},
];
test('useTableColumns with no options', () => {
const hook = renderHook(() => useTableColumns(data));
expect(hook.result.current).toEqual([
{ Cell: expect.any(Function), Header: 'col01', accessor: 'col01' },
{ Cell: expect.any(Function), Header: 'col02', accessor: 'col02' },
{
Cell: expect.any(Function),
Header: 'col01',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
},
]);
hook.result.current.forEach((col: JsonObject) => {
expect(col.accessor(data[0])).toBe(data[0][col.Header]);
});
hook.result.current.forEach((col: JsonObject) => {
data.forEach(row => {
expect(col.Cell({ value: row.col01 })).toBe(BOOL_TRUE_DISPLAY);
expect(col.Cell({ value: row.col02 })).toBe(BOOL_FALSE_DISPLAY);
expect(col.Cell({ value: row[asciiKey] })).toBe(asciiKey);
expect(col.Cell({ value: row[unicodeKey] })).toBe(unicodeKey);
});
});
});
test('use only the first record columns', () => {
const hook = renderHook(() => useTableColumns(data));
const newData = [data[3], data[0]];
const hook = renderHook(() => useTableColumns(newData));
expect(hook.result.current).toEqual([
{ Cell: expect.any(Function), Header: 'col01', accessor: 'col01' },
{ Cell: expect.any(Function), Header: 'col02', accessor: 'col02' },
{
Cell: expect.any(Function),
Header: 'col01',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: 'col03',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
},
]);
const hook2 = renderHook(() => useTableColumns([data[3], data[0]]));
expect(hook2.result.current).toEqual([
{ Cell: expect.any(Function), Header: 'col01', accessor: 'col01' },
{ Cell: expect.any(Function), Header: 'col02', accessor: 'col02' },
{ Cell: expect.any(Function), Header: 'col03', accessor: 'col03' },
]);
hook.result.current.forEach((col: JsonObject) => {
expect(col.accessor(newData[0])).toBe(newData[0][col.Header]);
});
hook.result.current.forEach((col: JsonObject) => {
expect(col.Cell({ value: newData[0].col01 })).toBe(BOOL_TRUE_DISPLAY);
expect(col.Cell({ value: newData[0].col02 })).toBe(BOOL_FALSE_DISPLAY);
expect(col.Cell({ value: newData[0].col03 })).toBe('secret');
expect(col.Cell({ value: newData[0][asciiKey] })).toBe(asciiKey);
expect(col.Cell({ value: newData[0][unicodeKey] })).toBe(unicodeKey);
});
hook.result.current.forEach((col: JsonObject) => {
expect(col.Cell({ value: newData[1].col01 })).toBe(BOOL_TRUE_DISPLAY);
expect(col.Cell({ value: newData[1].col02 })).toBe(BOOL_FALSE_DISPLAY);
expect(col.Cell({ value: newData[1].col03 })).toBe('undefined');
expect(col.Cell({ value: newData[1][asciiKey] })).toBe(asciiKey);
expect(col.Cell({ value: newData[1][unicodeKey] })).toBe(unicodeKey);
});
});
test('useTableColumns with options', () => {
@ -56,9 +139,35 @@ test('useTableColumns with options', () => {
{
Cell: expect.any(Function),
Header: 'col01',
accessor: 'col01',
accessor: expect.any(Function),
id: 'ID',
},
{ Cell: expect.any(Function), Header: 'col02', accessor: 'col02' },
{
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
},
]);
hook.result.current.forEach((col: JsonObject) => {
expect(col.accessor(data[0])).toBe(data[0][col.Header]);
});
hook.result.current.forEach((col: JsonObject) => {
data.forEach(row => {
expect(col.Cell({ value: row.col01 })).toBe(BOOL_TRUE_DISPLAY);
expect(col.Cell({ value: row.col02 })).toBe(BOOL_FALSE_DISPLAY);
expect(col.Cell({ value: row[asciiKey] })).toBe(asciiKey);
expect(col.Cell({ value: row[unicodeKey] })).toBe(unicodeKey);
});
});
});