Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix format of a downloaded json file #1306

Merged
merged 2 commits into from
Apr 10, 2023
Merged

Fix format of a downloaded json file #1306

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
04334d7
## Which problem is this PR solving?
Katarzyna-B Mar 27, 2023
bb302fc
## Which problem is this PR solving?
Katarzyna-B Mar 30, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 18 additions & 2 deletions packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
import React from 'react';
import { shallow } from 'enzyme';

import { UnconnectedSearchResults as SearchResults } from '.';
import { createBlob, UnconnectedSearchResults as SearchResults } from '.';
import * as markers from './index.markers';
import * as track from './index.track';
import AltViewOptions from './AltViewOptions';
Expand All @@ -26,6 +26,7 @@ import { getUrl } from '../url';
import LoadingIndicator from '../../common/LoadingIndicator';
import SearchResultsDDG from '../../DeepDependencies/traces';
import DownloadResults from './DownloadResults';
import readJsonFile from '../../../utils/readJsonFile';

describe('<SearchResults>', () => {
const searchParam = 'view';
Expand Down Expand Up @@ -173,17 +174,32 @@ describe('<SearchResults>', () => {
});

it('when click on DownloadResults then call download function', () => {
const originalBlob = global.Blob;
global.Blob = function (text, options) {
return { text, options };
};
URL.createObjectURL = jest.fn();
URL.revokeObjectURL = jest.fn();
const file = new Blob([JSON.stringify(rawTraces)], { type: 'application/json' });
const content = [`{"data":${JSON.stringify(props.rawTraces)}}`];
const file = new Blob(content, { type: 'application/json' });
const view = 'traces';
wrapper.setProps({ location: { search: `${otherSearch}&${searchParam}=${view}` } });

const download = wrapper.find(DownloadResults).prop('onDownloadResultsClicked');
download();
expect(URL.createObjectURL).toBeCalledTimes(1);
expect(URL.createObjectURL).toBeCalledWith(file);
expect(file.text).toBe(content);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So this tests that the downloaded content is in this specific format, not that the specific format is what the rest of the UI expects. Besides this simple assert, I would prefer to call into the functionality that's normally invoked when Upload is executed, i.e. something that parses the uploaded results and transforms them into search results. Then we can assert that the search results are what we expect given this rawTraces input. This way the test will ensure that the download format is always what is expected by the upload, right now it does not really do that.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I got your point.
I need to check/learn how I can do it in the best way.
I'm not sure if I have enough time to write such kind of the integration test before my vacation.
In the worst case I will try to do it in the middle of the April.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

to clarify, I don't mean some elaborate integration test, simply calling an "upload" function that must exist somewhere in the code already, to validate the results / format.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I pushed my changes, where I refactor a little bit the code and I used now readJsonFile in a test. This method is used by the upload too.
If it is something still missing I can do it first in two weeks.
Have a great day.
Katarzyna

expect(URL.revokeObjectURL).toBeCalledTimes(1);
global.Blob = originalBlob;
});

it('when create a download file then it can be read back', async () => {
const content = `{"data":${JSON.stringify(props.rawTraces)}}`;
const file = new File([createBlob(props.rawTraces)], 'test.json');
const contentFile = await readJsonFile({ file });

return expect(JSON.stringify(contentFile)).toBe(content);
});
});
});
Expand Down
6 changes: 5 additions & 1 deletion packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ export class UnconnectedSearchResults extends React.PureComponent<SearchResultsP
};

onDownloadResultsClicked = () => {
const file = new Blob([JSON.stringify(this.props.rawTraces)], { type: 'application/json' });
const file = createBlob(this.props.rawTraces);
const element = document.createElement('a');
element.href = URL.createObjectURL(file);
element.download = `traces-${Date.now()}.json`;
Expand Down Expand Up @@ -238,5 +238,9 @@ export class UnconnectedSearchResults extends React.PureComponent<SearchResultsP
);
}
}
// export for tests
export function createBlob(rawTraces: TraceData[]) {
return new Blob([`{"data":${JSON.stringify(rawTraces)}}`], { type: 'application/json' });
}

export default withRouter(UnconnectedSearchResults);