Fix saved object share link (#66771)

This commit is contained in:
Joe Reuter 2020-05-19 18:20:51 +02:00 committed by GitHub
parent 1b89dddde5
commit c579b67181
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 175 additions and 20 deletions

View file

@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`render 1`] = `
exports[`share url panel content render 1`] = `
<I18nProvider>
<EuiForm
className="kbnShareContextMenu__finalPanel"
@ -167,7 +167,7 @@ exports[`render 1`] = `
</I18nProvider>
`;
exports[`should enable saved object export option when objectId is provided 1`] = `
exports[`share url panel content should enable saved object export option when objectId is provided 1`] = `
<I18nProvider>
<EuiForm
className="kbnShareContextMenu__finalPanel"
@ -323,7 +323,7 @@ exports[`should enable saved object export option when objectId is provided 1`]
</I18nProvider>
`;
exports[`should hide short url section when allowShortUrl is false 1`] = `
exports[`share url panel content should hide short url section when allowShortUrl is false 1`] = `
<I18nProvider>
<EuiForm
className="kbnShareContextMenu__finalPanel"

View file

@ -17,12 +17,16 @@
* under the License.
*/
jest.mock('../lib/url_shortener', () => ({}));
import { EuiCopy, EuiRadioGroup, EuiSwitch, EuiSwitchEvent } from '@elastic/eui';
jest.mock('../lib/url_shortener', () => ({ shortenUrl: jest.fn() }));
import React from 'react';
import { shallow } from 'enzyme';
import { UrlPanelContent } from './url_panel_content';
import { ExportUrlAsType, UrlPanelContent } from './url_panel_content';
import { act } from 'react-dom/test-utils';
import { shortenUrl } from '../lib/url_shortener';
const defaultProps = {
allowShortUrl: true,
@ -31,19 +35,170 @@ const defaultProps = {
post: () => Promise.resolve({} as any),
};
test('render', () => {
const component = shallow(<UrlPanelContent {...defaultProps} />);
expect(component).toMatchSnapshot();
});
describe('share url panel content', () => {
test('render', () => {
const component = shallow(<UrlPanelContent {...defaultProps} />);
expect(component).toMatchSnapshot();
});
test('should enable saved object export option when objectId is provided', () => {
const component = shallow(<UrlPanelContent {...defaultProps} objectId="id1" />);
expect(component).toMatchSnapshot();
});
test('should enable saved object export option when objectId is provided', () => {
const component = shallow(<UrlPanelContent {...defaultProps} objectId="id1" />);
expect(component).toMatchSnapshot();
});
test('should hide short url section when allowShortUrl is false', () => {
const component = shallow(
<UrlPanelContent {...defaultProps} allowShortUrl={false} objectId="id1" />
);
expect(component).toMatchSnapshot();
test('should hide short url section when allowShortUrl is false', () => {
const component = shallow(
<UrlPanelContent {...defaultProps} allowShortUrl={false} objectId="id1" />
);
expect(component).toMatchSnapshot();
});
test('should remove _a query parameter in saved object mode', () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/?_g=()&_a=()"
allowShortUrl={false}
objectId="id1"
/>
);
act(() => {
component.find(EuiRadioGroup).prop('onChange')!(ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT);
});
expect(component.find(EuiCopy).prop('textToCopy')).toEqual(
'http://localhost:5601/app/myapp#/?_g=()'
);
});
describe('short url', () => {
test('should generate short url and put it in copy button', async () => {
const shortenUrlMock = shortenUrl as jest.Mock;
shortenUrlMock.mockReset();
shortenUrlMock.mockResolvedValue('http://localhost/short/url');
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/?_g=()&_a=()"
objectId="id1"
/>
);
await act(async () => {
component.find(EuiSwitch).prop('onChange')!(({
target: { checked: true },
} as unknown) as EuiSwitchEvent);
});
expect(shortenUrlMock).toHaveBeenCalledWith(
'http://localhost:5601/app/myapp#/?_g=()&_a=()',
expect.anything()
);
expect(component.find(EuiCopy).prop('textToCopy')).toContain('http://localhost/short/url');
});
test('should hide short url for saved object mode', async () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/"
objectId="id1"
/>
);
act(() => {
component.find(EuiRadioGroup).prop('onChange')!(ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT);
});
expect(component.exists(EuiSwitch)).toEqual(false);
});
});
describe('embedded', () => {
const asIframe = (url: string) => `<iframe src="${url}" height="600" width="800"></iframe>`;
test('should add embedded flag to target code in snapshot mode', () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/"
isEmbedded
allowShortUrl={false}
objectId="id1"
/>
);
expect(component.find(EuiCopy).prop('textToCopy')).toEqual(
asIframe('http://localhost:5601/app/myapp#/?embed=true')
);
});
test('should add embedded flag to target code in snapshot mode with existing query parameters', () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/?_g=()&_a=()"
isEmbedded
allowShortUrl={false}
objectId="id1"
/>
);
expect(component.find(EuiCopy).prop('textToCopy')).toEqual(
asIframe('http://localhost:5601/app/myapp#/?embed=true&_g=()&_a=()')
);
});
test('should remove _a query parameter and add embedded flag in saved object mode', () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
shareableUrl="http://localhost:5601/app/myapp#/?_g=()&_a=()"
isEmbedded
allowShortUrl={false}
objectId="id1"
/>
);
act(() => {
component.find(EuiRadioGroup).prop('onChange')!(ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT);
});
expect(component.find(EuiCopy).prop('textToCopy')).toEqual(
asIframe('http://localhost:5601/app/myapp#/?embed=true&_g=()')
);
});
test('should generate short url with embed flag and put it in copy button', async () => {
const shortenUrlMock = shortenUrl as jest.Mock;
shortenUrlMock.mockReset();
shortenUrlMock.mockResolvedValue('http://localhost/short/url');
const component = shallow(
<UrlPanelContent
{...defaultProps}
isEmbedded
shareableUrl="http://localhost:5601/app/myapp#/?_g=()&_a=()"
objectId="id1"
/>
);
await act(async () => {
component.find(EuiSwitch).prop('onChange')!(({
target: { checked: true },
} as unknown) as EuiSwitchEvent);
});
expect(shortenUrlMock).toHaveBeenCalledWith(
'http://localhost:5601/app/myapp#/?embed=true&_g=()&_a=()',
expect.anything()
);
expect(component.find(EuiCopy).prop('textToCopy')).toContain('http://localhost/short/url');
});
test('should hide short url for saved object mode', async () => {
const component = shallow(
<UrlPanelContent
{...defaultProps}
isEmbedded
shareableUrl="http://localhost:5601/app/myapp#/"
objectId="id1"
/>
);
act(() => {
component.find(EuiRadioGroup).prop('onChange')!(ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT);
});
expect(component.exists(EuiSwitch)).toEqual(false);
});
});
});

View file

@ -52,7 +52,7 @@ interface Props {
post: HttpStart['post'];
}
enum ExportUrlAsType {
export enum ExportUrlAsType {
EXPORT_URL_AS_SAVED_OBJECT = 'savedObject',
EXPORT_URL_AS_SNAPSHOT = 'snapshot',
}
@ -181,7 +181,7 @@ export class UrlPanelContent extends Component<Props, State> {
}),
});
if (this.props.isEmbedded) {
formattedUrl = this.makeUrlEmbeddable(url);
formattedUrl = this.makeUrlEmbeddable(formattedUrl);
}
return formattedUrl;